@websy/websy-designs 1.7.0 → 1.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/websy-designs-es6.debug.js +91 -24
- package/dist/websy-designs-es6.js +108 -25
- package/dist/websy-designs-es6.min.js +1 -1
- package/dist/websy-designs.debug.js +91 -24
- package/dist/websy-designs.js +108 -25
- package/dist/websy-designs.min.css +1 -1
- package/dist/websy-designs.min.js +1 -1
- package/package.json +1 -1
|
@@ -2022,6 +2022,8 @@ class WebsyForm {
|
|
|
2022
2022
|
// }
|
|
2023
2023
|
el.addEventListener('change', this.handleChange.bind(this))
|
|
2024
2024
|
el.addEventListener('click', this.handleClick.bind(this))
|
|
2025
|
+
el.addEventListener('beforeinput', this.handleBeforeInput.bind(this))
|
|
2026
|
+
el.addEventListener('input', this.handleInput.bind(this))
|
|
2025
2027
|
el.addEventListener('focusout', this.handleFocusOut.bind(this))
|
|
2026
2028
|
el.addEventListener('keyup', this.handleKeyUp.bind(this))
|
|
2027
2029
|
el.addEventListener('keydown', this.handleKeyDown.bind(this))
|
|
@@ -2114,7 +2116,7 @@ class WebsyForm {
|
|
|
2114
2116
|
let index = event.target.getAttribute('data-index')
|
|
2115
2117
|
if (this.options.fields[index] && (this.options.fields[index].required || this.options.fields[index].validate)) {
|
|
2116
2118
|
this.validateField(this.options.fields[index], event.target.value)
|
|
2117
|
-
}
|
|
2119
|
+
}
|
|
2118
2120
|
}
|
|
2119
2121
|
}
|
|
2120
2122
|
handleClick (event) {
|
|
@@ -2136,20 +2138,72 @@ class WebsyForm {
|
|
|
2136
2138
|
}
|
|
2137
2139
|
}
|
|
2138
2140
|
handleKeyDown (event) {
|
|
2139
|
-
if (event.key === 'enter') {
|
|
2141
|
+
if (event.key === 'enter' && this.options.submitOnEnter === true) {
|
|
2140
2142
|
this.submitForm()
|
|
2141
2143
|
}
|
|
2144
|
+
// if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2145
|
+
// let isNumeric = !isNaN(event.key)
|
|
2146
|
+
// let validKey = false
|
|
2147
|
+
// if (!validKey) {
|
|
2148
|
+
// validKey = ['ArrowLeft', 'ArrowRight', 'Backspace', 'Delete', 'Tab'].indexOf(event.key) !== -1
|
|
2149
|
+
// }
|
|
2150
|
+
// if ((event.target.value.length === 5 && !validKey) || (!validKey && !isNumeric)) {
|
|
2151
|
+
// event.preventDefault()
|
|
2152
|
+
// return false
|
|
2153
|
+
// }
|
|
2154
|
+
// if (event.key === 'Backspace') {
|
|
2155
|
+
// if (event.target.value.indexOf('/') === event.target.selectionStart - 1) {
|
|
2156
|
+
// let chars = event.target.value.split('')
|
|
2157
|
+
// chars.pop()
|
|
2158
|
+
// event.target.value = chars.join('')
|
|
2159
|
+
// }
|
|
2160
|
+
// }
|
|
2161
|
+
// }
|
|
2162
|
+
// if (event.target.getAttribute('data-user-type') === 'cvv') {
|
|
2163
|
+
// let isNumeric = !isNaN(event.key)
|
|
2164
|
+
// let validKey = false
|
|
2165
|
+
// if (!validKey) {
|
|
2166
|
+
// validKey = ['ArrowLeft', 'ArrowRight', 'Backspace', 'Delete', 'Tab'].indexOf(event.key) !== -1
|
|
2167
|
+
// }
|
|
2168
|
+
// if ((event.target.value.length === 3 && !validKey) || (!validKey && !isNumeric)) {
|
|
2169
|
+
// event.preventDefault()
|
|
2170
|
+
// return false
|
|
2171
|
+
// }
|
|
2172
|
+
// }
|
|
2173
|
+
}
|
|
2174
|
+
handleKeyUp (event) {
|
|
2175
|
+
// if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2176
|
+
// let chars = event.target.value.split('')
|
|
2177
|
+
// let isNumeric = !isNaN(event.key)
|
|
2178
|
+
// if (event.key === 'Backspace') {
|
|
2179
|
+
// if (chars[chars.length - 1] === '/' && chars.length !== 3) {
|
|
2180
|
+
// chars.pop()
|
|
2181
|
+
// event.target.value = chars.join('')
|
|
2182
|
+
// return
|
|
2183
|
+
// }
|
|
2184
|
+
// }
|
|
2185
|
+
// if (event.target.selectionStart === 2) {
|
|
2186
|
+
// if (chars[2] && ['ArrowLeft', 'ArrowRight', 'Backspace', 'Delete'].indexOf(event.key) === -1) {
|
|
2187
|
+
// event.target.setSelectionRange(3, 3)
|
|
2188
|
+
// }
|
|
2189
|
+
// else if (isNumeric) {
|
|
2190
|
+
// event.target.value += '/'
|
|
2191
|
+
// }
|
|
2192
|
+
// }
|
|
2193
|
+
// }
|
|
2194
|
+
}
|
|
2195
|
+
handleBeforeInput (event) {
|
|
2142
2196
|
if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2143
|
-
let isNumeric = !isNaN(event.
|
|
2197
|
+
let isNumeric = !isNaN(+event.data)
|
|
2144
2198
|
let validKey = false
|
|
2145
2199
|
if (!validKey) {
|
|
2146
|
-
validKey = ['
|
|
2200
|
+
validKey = ['deleteContentBackward', 'deleteContentForward'].indexOf(event.inputType) !== -1
|
|
2147
2201
|
}
|
|
2148
2202
|
if ((event.target.value.length === 5 && !validKey) || (!validKey && !isNumeric)) {
|
|
2149
2203
|
event.preventDefault()
|
|
2150
2204
|
return false
|
|
2151
2205
|
}
|
|
2152
|
-
if (event.
|
|
2206
|
+
if (event.inputType === 'deleteContentBackward') {
|
|
2153
2207
|
if (event.target.value.indexOf('/') === event.target.selectionStart - 1) {
|
|
2154
2208
|
let chars = event.target.value.split('')
|
|
2155
2209
|
chars.pop()
|
|
@@ -2158,10 +2212,10 @@ class WebsyForm {
|
|
|
2158
2212
|
}
|
|
2159
2213
|
}
|
|
2160
2214
|
if (event.target.getAttribute('data-user-type') === 'cvv') {
|
|
2161
|
-
let isNumeric = !isNaN(event.
|
|
2215
|
+
let isNumeric = !isNaN(+event.data)
|
|
2162
2216
|
let validKey = false
|
|
2163
2217
|
if (!validKey) {
|
|
2164
|
-
validKey = ['
|
|
2218
|
+
validKey = ['deleteContentBackward', 'deleteContentForward'].indexOf(event.inputType) !== -1
|
|
2165
2219
|
}
|
|
2166
2220
|
if ((event.target.value.length === 3 && !validKey) || (!validKey && !isNumeric)) {
|
|
2167
2221
|
event.preventDefault()
|
|
@@ -2169,10 +2223,10 @@ class WebsyForm {
|
|
|
2169
2223
|
}
|
|
2170
2224
|
}
|
|
2171
2225
|
}
|
|
2172
|
-
|
|
2226
|
+
handleInput (event) {
|
|
2173
2227
|
if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2174
2228
|
let chars = event.target.value.split('')
|
|
2175
|
-
let isNumeric = !isNaN(event.
|
|
2229
|
+
let isNumeric = !isNaN(+event.data)
|
|
2176
2230
|
if (event.key === 'Backspace') {
|
|
2177
2231
|
if (chars[chars.length - 1] === '/' && chars.length !== 3) {
|
|
2178
2232
|
chars.pop()
|
|
@@ -2181,7 +2235,7 @@ class WebsyForm {
|
|
|
2181
2235
|
}
|
|
2182
2236
|
}
|
|
2183
2237
|
if (event.target.selectionStart === 2) {
|
|
2184
|
-
if (chars[2] && ['
|
|
2238
|
+
if (chars[2] && ['deleteContentBackward', 'deleteContentForward'].indexOf(event.inputType) === -1) {
|
|
2185
2239
|
event.target.setSelectionRange(3, 3)
|
|
2186
2240
|
}
|
|
2187
2241
|
else if (isNumeric) {
|
|
@@ -2235,7 +2289,7 @@ class WebsyForm {
|
|
|
2235
2289
|
if (f.component) {
|
|
2236
2290
|
componentsToProcess.push(f)
|
|
2237
2291
|
html += `
|
|
2238
|
-
${i > 0 ? '-->' : ''}<div id='${this.elementId}_${f.field}_inputContainer' class='websy-input-container ${f.classes
|
|
2292
|
+
${i > 0 ? '-->' : ''}<div id='${this.elementId}_${f.field}_inputContainer' class='websy-input-container ${f.classes ? f.classes.join(' ') : ''}'>
|
|
2239
2293
|
${f.label ? `<label for="${f.field}">${f.label}</label>` : ''}${f.required === true ? '<span class="websy-form-required-value">*</span>' : ''}
|
|
2240
2294
|
<div id='${this.elementId}_input_${f.field}_component' class='form-component'></div>
|
|
2241
2295
|
<span id='${this.elementId}_${f.field}_error' class='websy-form-validation-error'></span>
|
|
@@ -2244,7 +2298,7 @@ class WebsyForm {
|
|
|
2244
2298
|
}
|
|
2245
2299
|
else if (f.type === 'longtext') {
|
|
2246
2300
|
html += `
|
|
2247
|
-
${i > 0 ? '-->' : ''}<div id='${this.elementId}_${f.field}_inputContainer' class='websy-input-container ${f.classes
|
|
2301
|
+
${i > 0 ? '-->' : ''}<div id='${this.elementId}_${f.field}_inputContainer' class='websy-input-container ${f.classes ? f.classes.join(' ') : ''}'>
|
|
2248
2302
|
${f.label ? `<label for="${f.field}">${f.label}</label>` : ''}${f.required === true ? '<span class="websy-form-required-value">*</span>' : ''}
|
|
2249
2303
|
<textarea
|
|
2250
2304
|
id="${this.elementId}_input_${f.field}"
|
|
@@ -2262,7 +2316,7 @@ class WebsyForm {
|
|
|
2262
2316
|
}
|
|
2263
2317
|
else {
|
|
2264
2318
|
html += `
|
|
2265
|
-
${i > 0 ? '-->' : ''}<div id='${this.elementId}_${f.field}_inputContainer' class='websy-input-container ${f.classes
|
|
2319
|
+
${i > 0 ? '-->' : ''}<div id='${this.elementId}_${f.field}_inputContainer' class='websy-input-container ${f.classes ? f.classes.join(' ') : ''}'>
|
|
2266
2320
|
${f.label ? `<label for="${f.field}">${f.label}</label>` : ''}${f.required === true ? '<span class="websy-form-required-value">*</span>' : ''}
|
|
2267
2321
|
<input
|
|
2268
2322
|
id="${this.elementId}_input_${f.field}"
|
|
@@ -2290,11 +2344,11 @@ class WebsyForm {
|
|
|
2290
2344
|
`
|
|
2291
2345
|
}
|
|
2292
2346
|
html += `
|
|
2293
|
-
--><button class="websy-btn submit ${this.options.submit.classes
|
|
2347
|
+
--><button class="websy-btn submit ${this.options.submit.classes ? this.options.submit.classes.join(' ') : ''}">${this.options.submit.text || 'Save'}</button>${this.options.cancel ? '<!--' : ''}
|
|
2294
2348
|
`
|
|
2295
2349
|
if (this.options.cancel) {
|
|
2296
2350
|
html += `
|
|
2297
|
-
--><button class="websy-btn cancel ${this.options.cancel.classes
|
|
2351
|
+
--><button class="websy-btn cancel ${this.options.cancel.classes ? this.options.cancel.classes.join(' ') : ''}">${this.options.cancel.text || 'Cancel'}</button>
|
|
2298
2352
|
`
|
|
2299
2353
|
}
|
|
2300
2354
|
html += `
|
|
@@ -7291,6 +7345,9 @@ this.render()
|
|
|
7291
7345
|
/* global d3 options WebsyUtils */
|
|
7292
7346
|
if (typeof options !== 'undefined') {
|
|
7293
7347
|
this.options = Object.assign({}, this.options, options)
|
|
7348
|
+
if (this.options.legendOptions) {
|
|
7349
|
+
this.legend.setOptions(this.options.legendOptions)
|
|
7350
|
+
}
|
|
7294
7351
|
}
|
|
7295
7352
|
if (!this.options.data) {
|
|
7296
7353
|
// tell the user no data has been provided
|
|
@@ -7352,12 +7409,19 @@ else {
|
|
|
7352
7409
|
}
|
|
7353
7410
|
if (this.options.legendPosition === 'top' || this.options.legendPosition === 'bottom') {
|
|
7354
7411
|
this.legendArea.style('width', '100%')
|
|
7412
|
+
if (this.legend.options.maxSize) {
|
|
7413
|
+
this.legendArea.style('height', `${this.legend.options.maxSize}px`)
|
|
7414
|
+
}
|
|
7355
7415
|
this.legend.options.align = 'center'
|
|
7356
7416
|
}
|
|
7357
7417
|
if (this.options.legendPosition === 'left' || this.options.legendPosition === 'right') {
|
|
7418
|
+
let longestLegendValue = legendData.reduce((a, b) => a.length > (b.value || '').length ? a : b.value, '')
|
|
7358
7419
|
this.legend.options.align = 'left'
|
|
7359
7420
|
this.legendArea.style('height', '100%')
|
|
7360
|
-
this.legendArea.style('width', this.legend.testWidth(
|
|
7421
|
+
this.legendArea.style('width', this.legend.testWidth(longestLegendValue) + 'px')
|
|
7422
|
+
if (this.legend.options.maxSize) {
|
|
7423
|
+
this.legendArea.style('width', `${this.legend.options.maxSize}px`)
|
|
7424
|
+
}
|
|
7361
7425
|
}
|
|
7362
7426
|
this.legend.data = legendData
|
|
7363
7427
|
let legendSize = this.legend.getSize()
|
|
@@ -7546,7 +7610,7 @@ else {
|
|
|
7546
7610
|
this.brushBandPadding = this.totalBandPadding / this.options.data.left.data.length
|
|
7547
7611
|
}
|
|
7548
7612
|
plotable = this.plotHeight - this.totalBandPadding
|
|
7549
|
-
noOfPoints = this.options.grouping === 'grouped' ? this.options.data.left.totalValueCount : this.options.data.left.data.length
|
|
7613
|
+
noOfPoints = this.options.grouping === 'grouped' && this.options.allowUnevenBands === true ? this.options.data.left.totalValueCount : this.options.data.left.data.length
|
|
7550
7614
|
noOfGroups = this.options.data.left.data.length
|
|
7551
7615
|
}
|
|
7552
7616
|
else {
|
|
@@ -7563,7 +7627,7 @@ else {
|
|
|
7563
7627
|
this.brushBandPadding = this.totalBandPadding / this.options.data.bottom.data.length
|
|
7564
7628
|
}
|
|
7565
7629
|
plotable = this.plotWidth - this.totalBandPadding
|
|
7566
|
-
noOfPoints = this.options.grouping === 'grouped' ? this.options.data.bottom.totalValueCount : this.options.data.bottom.data.length
|
|
7630
|
+
noOfPoints = this.options.grouping === 'grouped' && this.options.allowUnevenBands === true ? this.options.data.bottom.totalValueCount : this.options.data.bottom.data.length
|
|
7567
7631
|
noOfGroups = this.options.data.bottom.data.length
|
|
7568
7632
|
}
|
|
7569
7633
|
if (plotable / noOfPoints > this.options.maxBandWidth) {
|
|
@@ -7717,7 +7781,7 @@ else {
|
|
|
7717
7781
|
let pos = i * proposedBandWidth
|
|
7718
7782
|
this[`custom${customRangeSide}DetailRange`].push(start + adjustment + pos)
|
|
7719
7783
|
}
|
|
7720
|
-
acc += (this.options.grouping !== 'stacked' ? (d.valueCount || 1) : 1)
|
|
7784
|
+
acc += (this.options.grouping !== 'stacked' && this.options.allowUnevenBands === true ? (d.valueCount || 1) : 1)
|
|
7721
7785
|
let end = (this.widthForCalc / noOfPoints) * acc
|
|
7722
7786
|
// this.customBottomBrushRange.push((end + adjustment) * (this.plotWidth / this.widthForCalc))
|
|
7723
7787
|
return end + adjustment
|
|
@@ -7725,7 +7789,7 @@ else {
|
|
|
7725
7789
|
acc = 0
|
|
7726
7790
|
this[`custom${customRangeSide}BrushRange`] = [0, ...this.options.data[customRangeSideLC].data.map((d, index, arr) => {
|
|
7727
7791
|
let adjustment = (this.brushBandPadding * index) + this.brushBandPadding
|
|
7728
|
-
acc += (this.options.grouping !== 'stacked' ? (d.valueCount || 1) : 1)
|
|
7792
|
+
acc += (this.options.grouping !== 'stacked' && this.options.allowUnevenBands === true ? (d.valueCount || 1) : 1)
|
|
7729
7793
|
return ((this.options.orientation === 'vertical' ? this.plotWidth : this.plotHeight) / noOfPoints) * acc
|
|
7730
7794
|
})]
|
|
7731
7795
|
}
|
|
@@ -8704,8 +8768,8 @@ symbols.exit()
|
|
|
8704
8768
|
symbols
|
|
8705
8769
|
.attr('d', d => drawSymbol(d.y.size || series.symbolSize)(d))
|
|
8706
8770
|
.transition(this.transition)
|
|
8707
|
-
.attr('fill', series.fillSymbols ? series.color : 'white')
|
|
8708
|
-
.attr('stroke', series.color)
|
|
8771
|
+
.attr('fill', d => series.fillSymbols ? d.y.color || series.color : 'white')
|
|
8772
|
+
.attr('stroke', d => d.y.color || series.color)
|
|
8709
8773
|
.attr('transform', d => {
|
|
8710
8774
|
// let adjustment = (this.options.data[xAxis].scale === 'Time' || this.options.data[xAxis].scale === 'Linear') ? 0 : this.options.data[xAxis].bandWidth / 2
|
|
8711
8775
|
// if (this.options.orientation === 'horizontal') {
|
|
@@ -8733,8 +8797,8 @@ symbols.enter()
|
|
|
8733
8797
|
.append('path')
|
|
8734
8798
|
.attr('d', d => drawSymbol(d.y.size || series.symbolSize)(d))
|
|
8735
8799
|
// .transition(this.transition)
|
|
8736
|
-
.attr('fill', series.fillSymbols ? series.color : 'white')
|
|
8737
|
-
.attr('stroke', series.color)
|
|
8800
|
+
.attr('fill', d => series.fillSymbols ? d.y.color || series.color : 'white')
|
|
8801
|
+
.attr('stroke', d => d.y.color || series.color)
|
|
8738
8802
|
.attr('class', d => { return `symbol symbol_${series.key}` })
|
|
8739
8803
|
.attr('transform', d => {
|
|
8740
8804
|
let xIndex = this[xAxis + 'Axis'].domain().indexOf(d.x.value)
|
|
@@ -8975,6 +9039,9 @@ class WebsyLegend {
|
|
|
8975
9039
|
el.innerHTML = html
|
|
8976
9040
|
}
|
|
8977
9041
|
}
|
|
9042
|
+
setOptions (options) {
|
|
9043
|
+
this.options = Object.assign({}, this.options, options)
|
|
9044
|
+
}
|
|
8978
9045
|
testWidth (v) {
|
|
8979
9046
|
let html = this.getLegendItemHTML({value: v})
|
|
8980
9047
|
const el = document.createElement('div')
|
|
@@ -2276,6 +2276,8 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2276
2276
|
// }
|
|
2277
2277
|
el.addEventListener('change', this.handleChange.bind(this));
|
|
2278
2278
|
el.addEventListener('click', this.handleClick.bind(this));
|
|
2279
|
+
el.addEventListener('beforeinput', this.handleBeforeInput.bind(this));
|
|
2280
|
+
el.addEventListener('input', this.handleInput.bind(this));
|
|
2279
2281
|
el.addEventListener('focusout', this.handleFocusOut.bind(this));
|
|
2280
2282
|
el.addEventListener('keyup', this.handleKeyUp.bind(this));
|
|
2281
2283
|
el.addEventListener('keydown', this.handleKeyDown.bind(this));
|
|
@@ -2388,16 +2390,70 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2388
2390
|
}, {
|
|
2389
2391
|
key: "handleKeyDown",
|
|
2390
2392
|
value: function handleKeyDown(event) {
|
|
2391
|
-
if (event.key === 'enter') {
|
|
2393
|
+
if (event.key === 'enter' && this.options.submitOnEnter === true) {
|
|
2392
2394
|
this.submitForm();
|
|
2393
|
-
}
|
|
2395
|
+
} // if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2396
|
+
// let isNumeric = !isNaN(event.key)
|
|
2397
|
+
// let validKey = false
|
|
2398
|
+
// if (!validKey) {
|
|
2399
|
+
// validKey = ['ArrowLeft', 'ArrowRight', 'Backspace', 'Delete', 'Tab'].indexOf(event.key) !== -1
|
|
2400
|
+
// }
|
|
2401
|
+
// if ((event.target.value.length === 5 && !validKey) || (!validKey && !isNumeric)) {
|
|
2402
|
+
// event.preventDefault()
|
|
2403
|
+
// return false
|
|
2404
|
+
// }
|
|
2405
|
+
// if (event.key === 'Backspace') {
|
|
2406
|
+
// if (event.target.value.indexOf('/') === event.target.selectionStart - 1) {
|
|
2407
|
+
// let chars = event.target.value.split('')
|
|
2408
|
+
// chars.pop()
|
|
2409
|
+
// event.target.value = chars.join('')
|
|
2410
|
+
// }
|
|
2411
|
+
// }
|
|
2412
|
+
// }
|
|
2413
|
+
// if (event.target.getAttribute('data-user-type') === 'cvv') {
|
|
2414
|
+
// let isNumeric = !isNaN(event.key)
|
|
2415
|
+
// let validKey = false
|
|
2416
|
+
// if (!validKey) {
|
|
2417
|
+
// validKey = ['ArrowLeft', 'ArrowRight', 'Backspace', 'Delete', 'Tab'].indexOf(event.key) !== -1
|
|
2418
|
+
// }
|
|
2419
|
+
// if ((event.target.value.length === 3 && !validKey) || (!validKey && !isNumeric)) {
|
|
2420
|
+
// event.preventDefault()
|
|
2421
|
+
// return false
|
|
2422
|
+
// }
|
|
2423
|
+
// }
|
|
2394
2424
|
|
|
2425
|
+
}
|
|
2426
|
+
}, {
|
|
2427
|
+
key: "handleKeyUp",
|
|
2428
|
+
value: function handleKeyUp(event) {// if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2429
|
+
// let chars = event.target.value.split('')
|
|
2430
|
+
// let isNumeric = !isNaN(event.key)
|
|
2431
|
+
// if (event.key === 'Backspace') {
|
|
2432
|
+
// if (chars[chars.length - 1] === '/' && chars.length !== 3) {
|
|
2433
|
+
// chars.pop()
|
|
2434
|
+
// event.target.value = chars.join('')
|
|
2435
|
+
// return
|
|
2436
|
+
// }
|
|
2437
|
+
// }
|
|
2438
|
+
// if (event.target.selectionStart === 2) {
|
|
2439
|
+
// if (chars[2] && ['ArrowLeft', 'ArrowRight', 'Backspace', 'Delete'].indexOf(event.key) === -1) {
|
|
2440
|
+
// event.target.setSelectionRange(3, 3)
|
|
2441
|
+
// }
|
|
2442
|
+
// else if (isNumeric) {
|
|
2443
|
+
// event.target.value += '/'
|
|
2444
|
+
// }
|
|
2445
|
+
// }
|
|
2446
|
+
// }
|
|
2447
|
+
}
|
|
2448
|
+
}, {
|
|
2449
|
+
key: "handleBeforeInput",
|
|
2450
|
+
value: function handleBeforeInput(event) {
|
|
2395
2451
|
if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2396
|
-
var isNumeric = !isNaN(event.
|
|
2452
|
+
var isNumeric = !isNaN(+event.data);
|
|
2397
2453
|
var validKey = false;
|
|
2398
2454
|
|
|
2399
2455
|
if (!validKey) {
|
|
2400
|
-
validKey = ['
|
|
2456
|
+
validKey = ['deleteContentBackward', 'deleteContentForward'].indexOf(event.inputType) !== -1;
|
|
2401
2457
|
}
|
|
2402
2458
|
|
|
2403
2459
|
if (event.target.value.length === 5 && !validKey || !validKey && !isNumeric) {
|
|
@@ -2405,7 +2461,7 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2405
2461
|
return false;
|
|
2406
2462
|
}
|
|
2407
2463
|
|
|
2408
|
-
if (event.
|
|
2464
|
+
if (event.inputType === 'deleteContentBackward') {
|
|
2409
2465
|
if (event.target.value.indexOf('/') === event.target.selectionStart - 1) {
|
|
2410
2466
|
var chars = event.target.value.split('');
|
|
2411
2467
|
chars.pop();
|
|
@@ -2415,12 +2471,12 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2415
2471
|
}
|
|
2416
2472
|
|
|
2417
2473
|
if (event.target.getAttribute('data-user-type') === 'cvv') {
|
|
2418
|
-
var _isNumeric = !isNaN(event.
|
|
2474
|
+
var _isNumeric = !isNaN(+event.data);
|
|
2419
2475
|
|
|
2420
2476
|
var _validKey = false;
|
|
2421
2477
|
|
|
2422
2478
|
if (!_validKey) {
|
|
2423
|
-
_validKey = ['
|
|
2479
|
+
_validKey = ['deleteContentBackward', 'deleteContentForward'].indexOf(event.inputType) !== -1;
|
|
2424
2480
|
}
|
|
2425
2481
|
|
|
2426
2482
|
if (event.target.value.length === 3 && !_validKey || !_validKey && !_isNumeric) {
|
|
@@ -2430,11 +2486,11 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2430
2486
|
}
|
|
2431
2487
|
}
|
|
2432
2488
|
}, {
|
|
2433
|
-
key: "
|
|
2434
|
-
value: function
|
|
2489
|
+
key: "handleInput",
|
|
2490
|
+
value: function handleInput(event) {
|
|
2435
2491
|
if (event.target.getAttribute('data-user-type') === 'expiry') {
|
|
2436
2492
|
var chars = event.target.value.split('');
|
|
2437
|
-
var isNumeric = !isNaN(event.
|
|
2493
|
+
var isNumeric = !isNaN(+event.data);
|
|
2438
2494
|
|
|
2439
2495
|
if (event.key === 'Backspace') {
|
|
2440
2496
|
if (chars[chars.length - 1] === '/' && chars.length !== 3) {
|
|
@@ -2445,7 +2501,7 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2445
2501
|
}
|
|
2446
2502
|
|
|
2447
2503
|
if (event.target.selectionStart === 2) {
|
|
2448
|
-
if (chars[2] && ['
|
|
2504
|
+
if (chars[2] && ['deleteContentBackward', 'deleteContentForward'].indexOf(event.inputType) === -1) {
|
|
2449
2505
|
event.target.setSelectionRange(3, 3);
|
|
2450
2506
|
} else if (isNumeric) {
|
|
2451
2507
|
event.target.value += '/';
|
|
@@ -2508,11 +2564,11 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2508
2564
|
|
|
2509
2565
|
if (f.component) {
|
|
2510
2566
|
componentsToProcess.push(f);
|
|
2511
|
-
html += "\n ".concat(i > 0 ? '-->' : '', "<div id='").concat(_this16.elementId, "_").concat(f.field, "_inputContainer' class='websy-input-container ").concat(f.classes
|
|
2567
|
+
html += "\n ".concat(i > 0 ? '-->' : '', "<div id='").concat(_this16.elementId, "_").concat(f.field, "_inputContainer' class='websy-input-container ").concat(f.classes ? f.classes.join(' ') : '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '').concat(f.required === true ? '<span class="websy-form-required-value">*</span>' : '', "\n <div id='").concat(_this16.elementId, "_input_").concat(f.field, "_component' class='form-component'></div>\n <span id='").concat(_this16.elementId, "_").concat(f.field, "_error' class='websy-form-validation-error'></span>\n </div><!--\n ");
|
|
2512
2568
|
} else if (f.type === 'longtext') {
|
|
2513
|
-
html += "\n ".concat(i > 0 ? '-->' : '', "<div id='").concat(_this16.elementId, "_").concat(f.field, "_inputContainer' class='websy-input-container ").concat(f.classes
|
|
2569
|
+
html += "\n ".concat(i > 0 ? '-->' : '', "<div id='").concat(_this16.elementId, "_").concat(f.field, "_inputContainer' class='websy-input-container ").concat(f.classes ? f.classes.join(' ') : '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '').concat(f.required === true ? '<span class="websy-form-required-value">*</span>' : '', "\n <textarea\n id=\"").concat(_this16.elementId, "_input_").concat(f.field, "\"\n ").concat(f.required === true ? 'required' : '', " \n placeholder=\"").concat(f.placeholder || '', "\"\n data-user-type=\"").concat(f.type, "\"\n data-index=\"").concat(i, "\"\n name=\"").concat(f.field, "\" \n ").concat((f.attributes || []).join(' '), "\n class=\"websy-input websy-textarea\"\n ></textarea>\n <span id='").concat(_this16.elementId, "_").concat(f.field, "_error' class='websy-form-validation-error'></span>\n </div><!--\n ");
|
|
2514
2570
|
} else {
|
|
2515
|
-
html += "\n ".concat(i > 0 ? '-->' : '', "<div id='").concat(_this16.elementId, "_").concat(f.field, "_inputContainer' class='websy-input-container ").concat(f.classes
|
|
2571
|
+
html += "\n ".concat(i > 0 ? '-->' : '', "<div id='").concat(_this16.elementId, "_").concat(f.field, "_inputContainer' class='websy-input-container ").concat(f.classes ? f.classes.join(' ') : '', "'>\n ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '').concat(f.required === true ? '<span class="websy-form-required-value">*</span>' : '', "\n <input \n id=\"").concat(_this16.elementId, "_input_").concat(f.field, "\"\n ").concat(f.required === true ? 'required' : '', " \n type=\"").concat((f.type === 'expiry' ? 'text' : f.type === 'cvv' ? 'number' : f.type) || 'text', "\" \n data-user-type=\"").concat(f.type, "\"\n data-index=\"").concat(i, "\"\n class=\"websy-input\" \n ").concat((f.attributes || []).join(' '), "\n name=\"").concat(f.field, "\" \n placeholder=\"").concat(f.placeholder || '', "\"\n value=\"").concat(f.value || '', "\"\n valueAsDate=\"").concat(f.type === 'date' ? f.value : '', "\"\n oninvalidx=\"this.setCustomValidity('").concat(f.invalidMessage || 'Please fill in this field.', "')\"\n />\n <span id='").concat(_this16.elementId, "_").concat(f.field, "_error' class='websy-form-validation-error'></span>\n </div><!--\n ");
|
|
2516
2572
|
}
|
|
2517
2573
|
});
|
|
2518
2574
|
|
|
@@ -2520,10 +2576,10 @@ var WebsyForm = /*#__PURE__*/function () {
|
|
|
2520
2576
|
html += "\n --><div id='".concat(this.elementId, "_recaptcha' data-sitekey='").concat(ENVIRONMENT.RECAPTCHA_KEY, "' class='websy-form-recaptcha'></div>\n <div id='").concat(this.elementId, "_recaptchaError' class='websy-alert websy-alert-error websy-hidden'>Invalid recaptcha response</div><!--\n ");
|
|
2521
2577
|
}
|
|
2522
2578
|
|
|
2523
|
-
html += "\n --><button class=\"websy-btn submit ".concat(this.options.submit.classes
|
|
2579
|
+
html += "\n --><button class=\"websy-btn submit ".concat(this.options.submit.classes ? this.options.submit.classes.join(' ') : '', "\">").concat(this.options.submit.text || 'Save', "</button>").concat(this.options.cancel ? '<!--' : '', "\n ");
|
|
2524
2580
|
|
|
2525
2581
|
if (this.options.cancel) {
|
|
2526
|
-
html += "\n --><button class=\"websy-btn cancel ".concat(this.options.cancel.classes
|
|
2582
|
+
html += "\n --><button class=\"websy-btn cancel ".concat(this.options.cancel.classes ? this.options.cancel.classes.join(' ') : '', "\">").concat(this.options.cancel.text || 'Cancel', "</button>\n ");
|
|
2527
2583
|
}
|
|
2528
2584
|
|
|
2529
2585
|
html += " \n </form>\n <div id=\"".concat(this.elementId, "_validationFail\" class=\"websy-validation-failure\"></div>\n ");
|
|
@@ -8040,6 +8096,10 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
8040
8096
|
/* global d3 options WebsyUtils */
|
|
8041
8097
|
if (typeof options !== 'undefined') {
|
|
8042
8098
|
this.options = _extends({}, this.options, options);
|
|
8099
|
+
|
|
8100
|
+
if (this.options.legendOptions) {
|
|
8101
|
+
this.legend.setOptions(this.options.legendOptions);
|
|
8102
|
+
}
|
|
8043
8103
|
}
|
|
8044
8104
|
|
|
8045
8105
|
if (!this.options.data) {// tell the user no data has been provided
|
|
@@ -8117,15 +8177,25 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
8117
8177
|
|
|
8118
8178
|
if (this.options.legendPosition === 'top' || this.options.legendPosition === 'bottom') {
|
|
8119
8179
|
this.legendArea.style('width', '100%');
|
|
8180
|
+
|
|
8181
|
+
if (this.legend.options.maxSize) {
|
|
8182
|
+
this.legendArea.style('height', "".concat(this.legend.options.maxSize, "px"));
|
|
8183
|
+
}
|
|
8184
|
+
|
|
8120
8185
|
this.legend.options.align = 'center';
|
|
8121
8186
|
}
|
|
8122
8187
|
|
|
8123
8188
|
if (this.options.legendPosition === 'left' || this.options.legendPosition === 'right') {
|
|
8189
|
+
var longestLegendValue = legendData.reduce(function (a, b) {
|
|
8190
|
+
return a.length > (b.value || '').length ? a : b.value;
|
|
8191
|
+
}, '');
|
|
8124
8192
|
this.legend.options.align = 'left';
|
|
8125
8193
|
this.legendArea.style('height', '100%');
|
|
8126
|
-
this.legendArea.style('width', this.legend.testWidth(
|
|
8127
|
-
|
|
8128
|
-
|
|
8194
|
+
this.legendArea.style('width', this.legend.testWidth(longestLegendValue) + 'px');
|
|
8195
|
+
|
|
8196
|
+
if (this.legend.options.maxSize) {
|
|
8197
|
+
this.legendArea.style('width', "".concat(this.legend.options.maxSize, "px"));
|
|
8198
|
+
}
|
|
8129
8199
|
}
|
|
8130
8200
|
|
|
8131
8201
|
this.legend.data = legendData;
|
|
@@ -8346,7 +8416,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
8346
8416
|
}
|
|
8347
8417
|
|
|
8348
8418
|
plotable = this.plotHeight - this.totalBandPadding;
|
|
8349
|
-
noOfPoints = this.options.grouping === 'grouped' ? this.options.data.left.totalValueCount : this.options.data.left.data.length;
|
|
8419
|
+
noOfPoints = this.options.grouping === 'grouped' && this.options.allowUnevenBands === true ? this.options.data.left.totalValueCount : this.options.data.left.data.length;
|
|
8350
8420
|
noOfGroups = this.options.data.left.data.length;
|
|
8351
8421
|
} else {
|
|
8352
8422
|
this.options.data.bottom.totalValueCount = this.options.data.bottom.data.reduce(function (a, b) {
|
|
@@ -8365,7 +8435,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
8365
8435
|
}
|
|
8366
8436
|
|
|
8367
8437
|
plotable = this.plotWidth - this.totalBandPadding;
|
|
8368
|
-
noOfPoints = this.options.grouping === 'grouped' ? this.options.data.bottom.totalValueCount : this.options.data.bottom.data.length;
|
|
8438
|
+
noOfPoints = this.options.grouping === 'grouped' && this.options.allowUnevenBands === true ? this.options.data.bottom.totalValueCount : this.options.data.bottom.data.length;
|
|
8369
8439
|
noOfGroups = this.options.data.bottom.data.length;
|
|
8370
8440
|
}
|
|
8371
8441
|
|
|
@@ -8496,7 +8566,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
8496
8566
|
_this46["custom".concat(customRangeSide, "DetailRange")].push(start + adjustment + pos);
|
|
8497
8567
|
}
|
|
8498
8568
|
|
|
8499
|
-
acc += _this46.options.grouping !== 'stacked' ? d.valueCount || 1 : 1;
|
|
8569
|
+
acc += _this46.options.grouping !== 'stacked' && _this46.options.allowUnevenBands === true ? d.valueCount || 1 : 1;
|
|
8500
8570
|
var end = _this46.widthForCalc / noOfPoints * acc; // this.customBottomBrushRange.push((end + adjustment) * (this.plotWidth / this.widthForCalc))
|
|
8501
8571
|
|
|
8502
8572
|
return end + adjustment;
|
|
@@ -8504,7 +8574,7 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
8504
8574
|
acc = 0;
|
|
8505
8575
|
this["custom".concat(customRangeSide, "BrushRange")] = [0].concat(_toConsumableArray(this.options.data[customRangeSideLC].data.map(function (d, index, arr) {
|
|
8506
8576
|
var adjustment = _this46.brushBandPadding * index + _this46.brushBandPadding;
|
|
8507
|
-
acc += _this46.options.grouping !== 'stacked' ? d.valueCount || 1 : 1;
|
|
8577
|
+
acc += _this46.options.grouping !== 'stacked' && _this46.options.allowUnevenBands === true ? d.valueCount || 1 : 1;
|
|
8508
8578
|
return (_this46.options.orientation === 'vertical' ? _this46.plotWidth : _this46.plotHeight) / noOfPoints * acc;
|
|
8509
8579
|
})));
|
|
8510
8580
|
} // }
|
|
@@ -9428,7 +9498,11 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
9428
9498
|
|
|
9429
9499
|
symbols.attr('d', function (d) {
|
|
9430
9500
|
return drawSymbol(d.y.size || series.symbolSize)(d);
|
|
9431
|
-
}).transition(this.transition).attr('fill',
|
|
9501
|
+
}).transition(this.transition).attr('fill', function (d) {
|
|
9502
|
+
return series.fillSymbols ? d.y.color || series.color : 'white';
|
|
9503
|
+
}).attr('stroke', function (d) {
|
|
9504
|
+
return d.y.color || series.color;
|
|
9505
|
+
}).attr('transform', function (d) {
|
|
9432
9506
|
// let adjustment = (this.options.data[xAxis].scale === 'Time' || this.options.data[xAxis].scale === 'Linear') ? 0 : this.options.data[xAxis].bandWidth / 2
|
|
9433
9507
|
// if (this.options.orientation === 'horizontal') {
|
|
9434
9508
|
// return `translate(${this[`${yAxis}Axis`](isNaN(d.y.value) ? 0 : d.y.value)}, ${this[`${xAxis}Axis`](this.parseX(d.x.value)) + adjustment})`
|
|
@@ -9457,7 +9531,11 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
9457
9531
|
symbols.enter().append('path').attr('d', function (d) {
|
|
9458
9532
|
return drawSymbol(d.y.size || series.symbolSize)(d);
|
|
9459
9533
|
}) // .transition(this.transition)
|
|
9460
|
-
.attr('fill',
|
|
9534
|
+
.attr('fill', function (d) {
|
|
9535
|
+
return series.fillSymbols ? d.y.color || series.color : 'white';
|
|
9536
|
+
}).attr('stroke', function (d) {
|
|
9537
|
+
return d.y.color || series.color;
|
|
9538
|
+
}).attr('class', function (d) {
|
|
9461
9539
|
return "symbol symbol_".concat(series.key);
|
|
9462
9540
|
}).attr('transform', function (d) {
|
|
9463
9541
|
var xIndex = _this52[xAxis + 'Axis'].domain().indexOf(d.x.value);
|
|
@@ -9715,6 +9793,11 @@ var WebsyLegend = /*#__PURE__*/function () {
|
|
|
9715
9793
|
el.innerHTML = html;
|
|
9716
9794
|
}
|
|
9717
9795
|
}
|
|
9796
|
+
}, {
|
|
9797
|
+
key: "setOptions",
|
|
9798
|
+
value: function setOptions(options) {
|
|
9799
|
+
this.options = _extends({}, this.options, options);
|
|
9800
|
+
}
|
|
9718
9801
|
}, {
|
|
9719
9802
|
key: "testWidth",
|
|
9720
9803
|
value: function testWidth(v) {
|