@websy/websy-designs 1.7.19 → 1.7.20
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 +138 -67
- package/dist/websy-designs-es6.js +141 -63
- package/dist/websy-designs-es6.min.js +1 -1
- package/dist/websy-designs.debug.js +569 -67
- package/dist/websy-designs.js +607 -63
- package/dist/websy-designs.min.css +1 -1
- package/dist/websy-designs.min.js +1 -1
- package/package.json +1 -1
|
@@ -1471,8 +1471,8 @@ class WebsyDragDrop {
|
|
|
1471
1471
|
el.innerHTML = html
|
|
1472
1472
|
this.options.items.forEach((item, i) => {
|
|
1473
1473
|
if (item.component) {
|
|
1474
|
-
if (item.isQlikPlugin && WebsyDesigns.
|
|
1475
|
-
item.instance = new WebsyDesigns.
|
|
1474
|
+
if (item.isQlikPlugin && WebsyDesigns.QlikPlugins[item.component]) {
|
|
1475
|
+
item.instance = new WebsyDesigns.QlikPlugins[item.component](`${item.id}_component`, item.options)
|
|
1476
1476
|
}
|
|
1477
1477
|
else if (WebsyDesigns[item.component]) {
|
|
1478
1478
|
item.instance = new WebsyDesigns[item.component](`${item.id}_component`, item.options)
|
|
@@ -4650,11 +4650,21 @@ class Switch {
|
|
|
4650
4650
|
}
|
|
4651
4651
|
disable () {
|
|
4652
4652
|
this.options.enabled = false
|
|
4653
|
-
this.
|
|
4653
|
+
let method = this.options.enabled === true ? 'add' : 'remove'
|
|
4654
|
+
const el = document.getElementById(`${this.elementId}_switch`)
|
|
4655
|
+
el.classList[method]('enabled')
|
|
4656
|
+
if (this.options.onToggle) {
|
|
4657
|
+
this.options.onToggle(this.options.enabled)
|
|
4658
|
+
}
|
|
4654
4659
|
}
|
|
4655
4660
|
enable () {
|
|
4656
4661
|
this.options.enabled = true
|
|
4657
|
-
this.
|
|
4662
|
+
let method = this.options.enabled === true ? 'add' : 'remove'
|
|
4663
|
+
const el = document.getElementById(`${this.elementId}_switch`)
|
|
4664
|
+
el.classList[method]('enabled')
|
|
4665
|
+
if (this.options.onToggle) {
|
|
4666
|
+
this.options.onToggle(this.options.enabled)
|
|
4667
|
+
}
|
|
4658
4668
|
}
|
|
4659
4669
|
handleClick (event) {
|
|
4660
4670
|
this.options.enabled = !this.options.enabled
|
|
@@ -6041,7 +6051,7 @@ class WebsyTable3 {
|
|
|
6041
6051
|
const el = document.getElementById(this.elementId)
|
|
6042
6052
|
if (el) {
|
|
6043
6053
|
let html = `
|
|
6044
|
-
<div id='${this.elementId}_tableContainer' class='websy-vis-table-3 ${this.options.paging === 'pages' ? 'with-paging' : ''} ${this.options.virtualScroll === true ? 'with-virtual-scroll' : ''}'>
|
|
6054
|
+
<div id='${this.elementId}_tableContainer' class='websy-vis-table-3 ${this.options.paging === 'pages' ? 'with-paging' : ''} ${this.options.virtualScroll === true ? 'with-virtual-scroll' : ''} ${this.isTouchDevice === true && this.options.virtualScroll === true ? 'touch-device' : ''}'>
|
|
6045
6055
|
<!--<div class="download-button">
|
|
6046
6056
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M16 11h5l-9 10-9-10h5v-11h8v11zm1 11h-10v2h10v-2z"/></svg>
|
|
6047
6057
|
</div>-->
|
|
@@ -6561,11 +6571,11 @@ class WebsyTable3 {
|
|
|
6561
6571
|
}
|
|
6562
6572
|
}
|
|
6563
6573
|
}
|
|
6564
|
-
handleMouseDown (event) {
|
|
6565
|
-
if (this.isTouchDevice
|
|
6574
|
+
handleMouseDown (event) {
|
|
6575
|
+
if (this.isTouchDevice) {
|
|
6566
6576
|
return
|
|
6567
6577
|
}
|
|
6568
|
-
if (event.target.classList.contains('websy-scroll-handle-y')) {
|
|
6578
|
+
if (event.target.classList.contains('websy-scroll-handle-y')) {
|
|
6569
6579
|
// set up the scroll start values
|
|
6570
6580
|
this.scrollDragging = true
|
|
6571
6581
|
this.scrollDirection = 'y'
|
|
@@ -6576,6 +6586,9 @@ class WebsyTable3 {
|
|
|
6576
6586
|
// console.log(scrollHandleEl.offsetTop)
|
|
6577
6587
|
}
|
|
6578
6588
|
else if (event.target.classList.contains('websy-scroll-handle-x')) {
|
|
6589
|
+
if (this.isTouchDevice) {
|
|
6590
|
+
event.preventDefault()
|
|
6591
|
+
}
|
|
6579
6592
|
this.scrollDragging = true
|
|
6580
6593
|
this.scrollDirection = 'x'
|
|
6581
6594
|
const scrollHandleEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
@@ -6583,9 +6596,12 @@ class WebsyTable3 {
|
|
|
6583
6596
|
this.mouseXStart = event.pageX
|
|
6584
6597
|
}
|
|
6585
6598
|
}
|
|
6586
|
-
handleMouseMove (event) {
|
|
6599
|
+
handleMouseMove (event) {
|
|
6587
6600
|
// event.preventDefault()
|
|
6588
6601
|
if (this.scrollDragging === true) {
|
|
6602
|
+
if (this.isTouchDevice) {
|
|
6603
|
+
event.preventDefault()
|
|
6604
|
+
}
|
|
6589
6605
|
if (this.scrollDirection === 'y') {
|
|
6590
6606
|
const diff = event.pageY - this.mouseYStart
|
|
6591
6607
|
this.scrollY(diff)
|
|
@@ -6645,12 +6661,18 @@ class WebsyTable3 {
|
|
|
6645
6661
|
}
|
|
6646
6662
|
handleTouchEnd (event) {
|
|
6647
6663
|
// console.log('touch end fired')
|
|
6664
|
+
this.scrollDragging = false
|
|
6665
|
+
this.cellDragging = false
|
|
6666
|
+
this.handleYStart = null
|
|
6667
|
+
this.mouseYStart = null
|
|
6668
|
+
this.handleXStart = null
|
|
6669
|
+
this.mouseXStart = null
|
|
6648
6670
|
if (typeof event.targetTouches !== 'undefined') {
|
|
6649
6671
|
this.isTouchScrolling = false
|
|
6650
|
-
this.touchEndTime = (new Date()).getTime()
|
|
6651
|
-
this.isPerpetual = true
|
|
6672
|
+
// this.touchEndTime = (new Date()).getTime()
|
|
6673
|
+
// this.isPerpetual = true
|
|
6652
6674
|
// this.perpetualScroll()
|
|
6653
|
-
this.touchStartTime = null
|
|
6675
|
+
// this.touchStartTime = null
|
|
6654
6676
|
// const touchScrollEl = document.getElementById(`${this.elementId}_touchScroller`)
|
|
6655
6677
|
// touchScrollEl.classList.add('hidden')
|
|
6656
6678
|
}
|
|
@@ -6661,47 +6683,68 @@ class WebsyTable3 {
|
|
|
6661
6683
|
event.preventDefault()
|
|
6662
6684
|
event.stopPropagation()
|
|
6663
6685
|
if (typeof event.targetTouches !== 'undefined' && event.targetTouches.length > 0) {
|
|
6664
|
-
|
|
6665
|
-
|
|
6666
|
-
|
|
6667
|
-
|
|
6668
|
-
|
|
6669
|
-
|
|
6670
|
-
|
|
6671
|
-
|
|
6672
|
-
|
|
6673
|
-
|
|
6674
|
-
|
|
6675
|
-
//
|
|
6676
|
-
//
|
|
6677
|
-
// }
|
|
6678
|
-
//
|
|
6679
|
-
//
|
|
6680
|
-
//
|
|
6681
|
-
//
|
|
6682
|
-
//
|
|
6683
|
-
//
|
|
6684
|
-
//
|
|
6685
|
-
//
|
|
6686
|
-
//
|
|
6687
|
-
//
|
|
6688
|
-
//
|
|
6689
|
-
this.
|
|
6690
|
-
|
|
6691
|
-
//
|
|
6692
|
-
//
|
|
6693
|
-
//
|
|
6694
|
-
|
|
6695
|
-
|
|
6696
|
-
|
|
6697
|
-
|
|
6698
|
-
|
|
6699
|
-
|
|
6700
|
-
|
|
6701
|
-
|
|
6702
|
-
|
|
6703
|
-
|
|
6704
|
-
|
|
6686
|
+
event.deltaX = this.touchXStart - event.targetTouches[0].pageX
|
|
6687
|
+
event.deltaY = this.touchYStart - event.targetTouches[0].pageY
|
|
6688
|
+
if (Math.abs(event.deltaY) > 50) {
|
|
6689
|
+
event.deltaX = 0
|
|
6690
|
+
this.handleScrollWheel(event)
|
|
6691
|
+
}
|
|
6692
|
+
else if (Math.abs(event.deltaX) > 50) {
|
|
6693
|
+
event.deltaY = 0
|
|
6694
|
+
this.handleScrollWheel(event)
|
|
6695
|
+
}
|
|
6696
|
+
// let deltaX = (this.mouseXStart - event.targetTouches[0].pageX)
|
|
6697
|
+
// let deltaY = (this.mouseYStart - event.targetTouches[0].pageY)
|
|
6698
|
+
// const hScrollContainerEl = document.getElementById(`${this.elementId}_hScrollContainer`)
|
|
6699
|
+
// const vScrollContainerEl = document.getElementById(`${this.elementId}_vScrollContainer`)
|
|
6700
|
+
// const hScrollHandleEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
6701
|
+
// const vScrollHandleEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
6702
|
+
// let translatedDeltaX = deltaX * (hScrollHandleEl.getBoundingClientRect().width / vScrollContainerEl.getBoundingClientRect().width)
|
|
6703
|
+
// let translatedDeltaY = deltaY * (vScrollHandleEl.getBoundingClientRect().height / vScrollContainerEl.getBoundingClientRect().height)
|
|
6704
|
+
// // need to adjust the delta so that it scrolls at a reasonable speed/distance
|
|
6705
|
+
// const scrollHandleXEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
6706
|
+
// const scrollHandleYEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
6707
|
+
// // if (Math.abs(deltaY) > this.sizes.cellHeight) {
|
|
6708
|
+
// // this.isTouchScrolling = true
|
|
6709
|
+
// // }
|
|
6710
|
+
// // else {
|
|
6711
|
+
// // this.isTouchScrolling = false
|
|
6712
|
+
// // }
|
|
6713
|
+
// // console.log('delta', this.mouseYStart, event.targetTouches[0].pageY, deltaY)
|
|
6714
|
+
// // deltaX = deltaX * (scrollHandleXEl.offsetWidth / this.sizes.scrollableWidth)
|
|
6715
|
+
// // deltaY = deltaY * (scrollHandleYEl.offsetHeight / this.sizes.bodyHeight)
|
|
6716
|
+
// // console.log('delta', deltaY)
|
|
6717
|
+
// // NW
|
|
6718
|
+
// // else if (Math.abs(deltaX) > 50) {
|
|
6719
|
+
// // this.isTouchScrolling = false
|
|
6720
|
+
// // }
|
|
6721
|
+
// this.currentClientY = event.targetTouches[0].pageY
|
|
6722
|
+
// this.currentTouchtime = (new Date()).getTime()
|
|
6723
|
+
// // end
|
|
6724
|
+
// // delta = Math.min(10, delta)
|
|
6725
|
+
// // delta = Math.max(-10, delta)
|
|
6726
|
+
// if (this.isTouchScrolling === true) {
|
|
6727
|
+
// // this.$scope.scrollTop += (delta / (this.$scope.layout.qHyperCube.qSize.qcy / this.$scope.rowsToLoad / (this.$scope.totalSpaceAvailable / 250)))
|
|
6728
|
+
// if (Math.abs(deltaX) > Math.abs(deltaY) && deltaX > 20) {
|
|
6729
|
+
// // this.scrollX(Math.max(-5, Math.min(5, translatedDeltaX)))
|
|
6730
|
+
// this.scrollX(translatedDeltaX)
|
|
6731
|
+
// }
|
|
6732
|
+
// else if (deltaY > 20) {
|
|
6733
|
+
// // this.scrollY(Math.max(-5, Math.min(5, translatedDeltaY)))
|
|
6734
|
+
// this.scrollY(translatedDeltaY)
|
|
6735
|
+
// }
|
|
6736
|
+
// }
|
|
6737
|
+
}
|
|
6738
|
+
}
|
|
6739
|
+
if (this.scrollDragging === true) {
|
|
6740
|
+
event.preventDefault()
|
|
6741
|
+
if (this.scrollDirection === 'y') {
|
|
6742
|
+
const diff = event.targetTouches[0].pageY - this.mouseYStart
|
|
6743
|
+
this.scrollY(diff)
|
|
6744
|
+
}
|
|
6745
|
+
else if (this.scrollDirection === 'x') {
|
|
6746
|
+
const diff = event.targetTouches[0].pageX - this.mouseXStart
|
|
6747
|
+
this.scrollX(diff)
|
|
6705
6748
|
}
|
|
6706
6749
|
}
|
|
6707
6750
|
}
|
|
@@ -6713,19 +6756,42 @@ class WebsyTable3 {
|
|
|
6713
6756
|
return
|
|
6714
6757
|
}
|
|
6715
6758
|
// console.log(event.target.classList)
|
|
6716
|
-
if (
|
|
6717
|
-
this.
|
|
6718
|
-
|
|
6719
|
-
|
|
6759
|
+
if (event.target.classList.contains('websy-table-touch-scroller')) {
|
|
6760
|
+
if (this.options.virtualScroll === true) {
|
|
6761
|
+
// this.touchStartTime = (new Date()).getTime()
|
|
6762
|
+
this.isTouchScrolling = true
|
|
6763
|
+
// this.isPerpetual = false
|
|
6764
|
+
this.touchYStart = event.targetTouches[0].pageY
|
|
6765
|
+
this.touchXStart = event.targetTouches[0].pageX
|
|
6766
|
+
}
|
|
6767
|
+
}
|
|
6768
|
+
if (event.target.classList.contains('websy-scroll-handle-y')) {
|
|
6769
|
+
// set up the scroll start values
|
|
6770
|
+
this.scrollDragging = true
|
|
6771
|
+
this.scrollDirection = 'y'
|
|
6772
|
+
const scrollHandleEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
6773
|
+
this.handleYStart = scrollHandleEl.offsetTop
|
|
6720
6774
|
this.mouseYStart = event.targetTouches[0].pageY
|
|
6721
|
-
|
|
6722
|
-
//
|
|
6723
|
-
|
|
6724
|
-
|
|
6725
|
-
this.
|
|
6726
|
-
|
|
6727
|
-
|
|
6728
|
-
|
|
6775
|
+
// console.log('mouse down', this.handleYStart, this.mouseYStart)
|
|
6776
|
+
// console.log(scrollHandleEl.offsetTop)
|
|
6777
|
+
}
|
|
6778
|
+
else if (event.target.classList.contains('websy-scroll-handle-x')) {
|
|
6779
|
+
if (this.isTouchDevice) {
|
|
6780
|
+
event.preventDefault()
|
|
6781
|
+
}
|
|
6782
|
+
this.scrollDragging = true
|
|
6783
|
+
this.scrollDirection = 'x'
|
|
6784
|
+
const scrollHandleEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
6785
|
+
this.handleXStart = scrollHandleEl.offsetLeft
|
|
6786
|
+
this.mouseXStart = event.targetTouches[0].pageX
|
|
6787
|
+
}
|
|
6788
|
+
// // const touchScrollEl = document.getElementById(`${this.elementId}_touchScroller`)
|
|
6789
|
+
// // touchScrollEl.classList.remove('hidden')
|
|
6790
|
+
// const handleYEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
6791
|
+
// this.handleYStart = handleYEl.offsetTop
|
|
6792
|
+
// const handleXEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
6793
|
+
// this.handleXStart = handleXEl.offsetLeft
|
|
6794
|
+
// }
|
|
6729
6795
|
}
|
|
6730
6796
|
hideError () {
|
|
6731
6797
|
const el = document.getElementById(`${this.elementId}_tableContainer`)
|
|
@@ -6834,7 +6900,7 @@ class WebsyTable3 {
|
|
|
6834
6900
|
let hHandleEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
6835
6901
|
if (this.hScrollRequired === true) {
|
|
6836
6902
|
hScrollEl.style.left = `${this.sizes.table.width - this.sizes.scrollableWidth}px`
|
|
6837
|
-
hScrollEl.style.width = `${this.sizes.scrollableWidth - 20}px`
|
|
6903
|
+
hScrollEl.style.width = `${this.sizes.scrollableWidth - (this.isTouchDevice ? 30 : 20)}px`
|
|
6838
6904
|
hHandleEl.style.width = Math.max(this.options.minHandleSize, this.sizes.scrollableWidth * (this.sizes.scrollableWidth / this.sizes.totalNonPinnedWidth)) + 'px'
|
|
6839
6905
|
}
|
|
6840
6906
|
else {
|
|
@@ -8672,7 +8738,12 @@ if (!this.brushBarsInitialized[series.key]) {
|
|
|
8672
8738
|
}
|
|
8673
8739
|
removebar (key) {
|
|
8674
8740
|
/* global key d3 */
|
|
8675
|
-
|
|
8741
|
+
this.barLayer.selectAll(`.bar_${key}`)
|
|
8742
|
+
.transition(this.transition)
|
|
8743
|
+
.style('fill-opacity', 1e-6)
|
|
8744
|
+
.remove()
|
|
8745
|
+
// remove from the brush as well
|
|
8746
|
+
this.brushArea.selectAll(`.bar_${key}`)
|
|
8676
8747
|
.transition(this.transition)
|
|
8677
8748
|
.style('fill-opacity', 1e-6)
|
|
8678
8749
|
.remove()
|
|
@@ -1644,8 +1644,8 @@ var WebsyDragDrop = /*#__PURE__*/function () {
|
|
|
1644
1644
|
el.innerHTML = html;
|
|
1645
1645
|
this.options.items.forEach(function (item, i) {
|
|
1646
1646
|
if (item.component) {
|
|
1647
|
-
if (item.isQlikPlugin && WebsyDesigns.
|
|
1648
|
-
item.instance = new WebsyDesigns.
|
|
1647
|
+
if (item.isQlikPlugin && WebsyDesigns.QlikPlugins[item.component]) {
|
|
1648
|
+
item.instance = new WebsyDesigns.QlikPlugins[item.component]("".concat(item.id, "_component"), item.options);
|
|
1649
1649
|
} else if (WebsyDesigns[item.component]) {
|
|
1650
1650
|
item.instance = new WebsyDesigns[item.component]("".concat(item.id, "_component"), item.options);
|
|
1651
1651
|
} else {
|
|
@@ -5157,13 +5157,25 @@ var Switch = /*#__PURE__*/function () {
|
|
|
5157
5157
|
key: "disable",
|
|
5158
5158
|
value: function disable() {
|
|
5159
5159
|
this.options.enabled = false;
|
|
5160
|
-
this.
|
|
5160
|
+
var method = this.options.enabled === true ? 'add' : 'remove';
|
|
5161
|
+
var el = document.getElementById("".concat(this.elementId, "_switch"));
|
|
5162
|
+
el.classList[method]('enabled');
|
|
5163
|
+
|
|
5164
|
+
if (this.options.onToggle) {
|
|
5165
|
+
this.options.onToggle(this.options.enabled);
|
|
5166
|
+
}
|
|
5161
5167
|
}
|
|
5162
5168
|
}, {
|
|
5163
5169
|
key: "enable",
|
|
5164
5170
|
value: function enable() {
|
|
5165
5171
|
this.options.enabled = true;
|
|
5166
|
-
this.
|
|
5172
|
+
var method = this.options.enabled === true ? 'add' : 'remove';
|
|
5173
|
+
var el = document.getElementById("".concat(this.elementId, "_switch"));
|
|
5174
|
+
el.classList[method]('enabled');
|
|
5175
|
+
|
|
5176
|
+
if (this.options.onToggle) {
|
|
5177
|
+
this.options.onToggle(this.options.enabled);
|
|
5178
|
+
}
|
|
5167
5179
|
}
|
|
5168
5180
|
}, {
|
|
5169
5181
|
key: "handleClick",
|
|
@@ -6637,7 +6649,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
6637
6649
|
var el = document.getElementById(this.elementId);
|
|
6638
6650
|
|
|
6639
6651
|
if (el) {
|
|
6640
|
-
var html = "\n <div id='".concat(this.elementId, "_tableContainer' class='websy-vis-table-3 ").concat(this.options.paging === 'pages' ? 'with-paging' : '', " ").concat(this.options.virtualScroll === true ? 'with-virtual-scroll' : '', "'>\n <!--<div class=\"download-button\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M16 11h5l-9 10-9-10h5v-11h8v11zm1 11h-10v2h10v-2z\"/></svg>\n </div>-->\n <div id=\"").concat(this.elementId, "_tableInner\" class=\"websy-table-inner-container\">\n <table id=\"").concat(this.elementId, "_tableHeader\" class=\"websy-table-header\"></table>\n <table id=\"").concat(this.elementId, "_tableBody\" class=\"websy-table-body\"></table>\n <table id=\"").concat(this.elementId, "_tableFooter\" class=\"websy-table-footer\"></table>\n <div id=\"").concat(this.elementId, "_vScrollContainer\" class=\"websy-v-scroll-container\">\n <div id=\"").concat(this.elementId, "_vScrollHandle\" class=\"websy-scroll-handle websy-scroll-handle-y\"></div>\n </div>\n <div id=\"").concat(this.elementId, "_hScrollContainer\" class=\"websy-h-scroll-container\">\n <div id=\"").concat(this.elementId, "_hScrollHandle\" class=\"websy-scroll-handle websy-scroll-handle-x\"></div>\n </div>\n ");
|
|
6652
|
+
var html = "\n <div id='".concat(this.elementId, "_tableContainer' class='websy-vis-table-3 ").concat(this.options.paging === 'pages' ? 'with-paging' : '', " ").concat(this.options.virtualScroll === true ? 'with-virtual-scroll' : '', " ").concat(this.isTouchDevice === true && this.options.virtualScroll === true ? 'touch-device' : '', "'>\n <!--<div class=\"download-button\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M16 11h5l-9 10-9-10h5v-11h8v11zm1 11h-10v2h10v-2z\"/></svg>\n </div>-->\n <div id=\"").concat(this.elementId, "_tableInner\" class=\"websy-table-inner-container\">\n <table id=\"").concat(this.elementId, "_tableHeader\" class=\"websy-table-header\"></table>\n <table id=\"").concat(this.elementId, "_tableBody\" class=\"websy-table-body\"></table>\n <table id=\"").concat(this.elementId, "_tableFooter\" class=\"websy-table-footer\"></table>\n <div id=\"").concat(this.elementId, "_vScrollContainer\" class=\"websy-v-scroll-container\">\n <div id=\"").concat(this.elementId, "_vScrollHandle\" class=\"websy-scroll-handle websy-scroll-handle-y\"></div>\n </div>\n <div id=\"").concat(this.elementId, "_hScrollContainer\" class=\"websy-h-scroll-container\">\n <div id=\"").concat(this.elementId, "_hScrollHandle\" class=\"websy-scroll-handle websy-scroll-handle-x\"></div>\n </div>\n ");
|
|
6641
6653
|
|
|
6642
6654
|
if (this.isTouchDevice === true && this.options.virtualScroll === true) {
|
|
6643
6655
|
html += "\n <div id=\"".concat(this.elementId, "_touchScroller\" class=\"websy-table-touch-scroller\"></div>\n ");
|
|
@@ -7165,7 +7177,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7165
7177
|
}, {
|
|
7166
7178
|
key: "handleMouseDown",
|
|
7167
7179
|
value: function handleMouseDown(event) {
|
|
7168
|
-
if (this.isTouchDevice
|
|
7180
|
+
if (this.isTouchDevice) {
|
|
7169
7181
|
return;
|
|
7170
7182
|
}
|
|
7171
7183
|
|
|
@@ -7178,6 +7190,10 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7178
7190
|
this.mouseYStart = event.pageY; // console.log('mouse down', this.handleYStart, this.mouseYStart)
|
|
7179
7191
|
// console.log(scrollHandleEl.offsetTop)
|
|
7180
7192
|
} else if (event.target.classList.contains('websy-scroll-handle-x')) {
|
|
7193
|
+
if (this.isTouchDevice) {
|
|
7194
|
+
event.preventDefault();
|
|
7195
|
+
}
|
|
7196
|
+
|
|
7181
7197
|
this.scrollDragging = true;
|
|
7182
7198
|
this.scrollDirection = 'x';
|
|
7183
7199
|
|
|
@@ -7192,6 +7208,10 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7192
7208
|
value: function handleMouseMove(event) {
|
|
7193
7209
|
// event.preventDefault()
|
|
7194
7210
|
if (this.scrollDragging === true) {
|
|
7211
|
+
if (this.isTouchDevice) {
|
|
7212
|
+
event.preventDefault();
|
|
7213
|
+
}
|
|
7214
|
+
|
|
7195
7215
|
if (this.scrollDirection === 'y') {
|
|
7196
7216
|
var diff = event.pageY - this.mouseYStart;
|
|
7197
7217
|
this.scrollY(diff);
|
|
@@ -7263,12 +7283,19 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7263
7283
|
key: "handleTouchEnd",
|
|
7264
7284
|
value: function handleTouchEnd(event) {
|
|
7265
7285
|
// console.log('touch end fired')
|
|
7266
|
-
|
|
7267
|
-
|
|
7268
|
-
|
|
7269
|
-
|
|
7286
|
+
this.scrollDragging = false;
|
|
7287
|
+
this.cellDragging = false;
|
|
7288
|
+
this.handleYStart = null;
|
|
7289
|
+
this.mouseYStart = null;
|
|
7290
|
+
this.handleXStart = null;
|
|
7291
|
+
this.mouseXStart = null;
|
|
7270
7292
|
|
|
7271
|
-
|
|
7293
|
+
if (typeof event.targetTouches !== 'undefined') {
|
|
7294
|
+
this.isTouchScrolling = false; // this.touchEndTime = (new Date()).getTime()
|
|
7295
|
+
// this.isPerpetual = true
|
|
7296
|
+
// this.perpetualScroll()
|
|
7297
|
+
// this.touchStartTime = null
|
|
7298
|
+
// const touchScrollEl = document.getElementById(`${this.elementId}_touchScroller`)
|
|
7272
7299
|
// touchScrollEl.classList.add('hidden')
|
|
7273
7300
|
}
|
|
7274
7301
|
}
|
|
@@ -7281,46 +7308,70 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7281
7308
|
event.stopPropagation();
|
|
7282
7309
|
|
|
7283
7310
|
if (typeof event.targetTouches !== 'undefined' && event.targetTouches.length > 0) {
|
|
7284
|
-
|
|
7285
|
-
|
|
7286
|
-
|
|
7287
|
-
|
|
7288
|
-
|
|
7289
|
-
|
|
7290
|
-
|
|
7291
|
-
|
|
7292
|
-
|
|
7293
|
-
|
|
7294
|
-
|
|
7295
|
-
//
|
|
7296
|
-
// }
|
|
7297
|
-
//
|
|
7298
|
-
//
|
|
7299
|
-
//
|
|
7300
|
-
//
|
|
7301
|
-
//
|
|
7302
|
-
//
|
|
7303
|
-
//
|
|
7304
|
-
//
|
|
7305
|
-
//
|
|
7306
|
-
//
|
|
7307
|
-
//
|
|
7311
|
+
event.deltaX = this.touchXStart - event.targetTouches[0].pageX;
|
|
7312
|
+
event.deltaY = this.touchYStart - event.targetTouches[0].pageY;
|
|
7313
|
+
|
|
7314
|
+
if (Math.abs(event.deltaY) > 50) {
|
|
7315
|
+
event.deltaX = 0;
|
|
7316
|
+
this.handleScrollWheel(event);
|
|
7317
|
+
} else if (Math.abs(event.deltaX) > 50) {
|
|
7318
|
+
event.deltaY = 0;
|
|
7319
|
+
this.handleScrollWheel(event);
|
|
7320
|
+
} // let deltaX = (this.mouseXStart - event.targetTouches[0].pageX)
|
|
7321
|
+
// let deltaY = (this.mouseYStart - event.targetTouches[0].pageY)
|
|
7322
|
+
// const hScrollContainerEl = document.getElementById(`${this.elementId}_hScrollContainer`)
|
|
7323
|
+
// const vScrollContainerEl = document.getElementById(`${this.elementId}_vScrollContainer`)
|
|
7324
|
+
// const hScrollHandleEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
7325
|
+
// const vScrollHandleEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
7326
|
+
// let translatedDeltaX = deltaX * (hScrollHandleEl.getBoundingClientRect().width / vScrollContainerEl.getBoundingClientRect().width)
|
|
7327
|
+
// let translatedDeltaY = deltaY * (vScrollHandleEl.getBoundingClientRect().height / vScrollContainerEl.getBoundingClientRect().height)
|
|
7328
|
+
// // need to adjust the delta so that it scrolls at a reasonable speed/distance
|
|
7329
|
+
// const scrollHandleXEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
7330
|
+
// const scrollHandleYEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
7331
|
+
// // if (Math.abs(deltaY) > this.sizes.cellHeight) {
|
|
7332
|
+
// // this.isTouchScrolling = true
|
|
7333
|
+
// // }
|
|
7334
|
+
// // else {
|
|
7335
|
+
// // this.isTouchScrolling = false
|
|
7336
|
+
// // }
|
|
7337
|
+
// // console.log('delta', this.mouseYStart, event.targetTouches[0].pageY, deltaY)
|
|
7338
|
+
// // deltaX = deltaX * (scrollHandleXEl.offsetWidth / this.sizes.scrollableWidth)
|
|
7339
|
+
// // deltaY = deltaY * (scrollHandleYEl.offsetHeight / this.sizes.bodyHeight)
|
|
7340
|
+
// // console.log('delta', deltaY)
|
|
7341
|
+
// // NW
|
|
7342
|
+
// // else if (Math.abs(deltaX) > 50) {
|
|
7343
|
+
// // this.isTouchScrolling = false
|
|
7344
|
+
// // }
|
|
7345
|
+
// this.currentClientY = event.targetTouches[0].pageY
|
|
7346
|
+
// this.currentTouchtime = (new Date()).getTime()
|
|
7347
|
+
// // end
|
|
7348
|
+
// // delta = Math.min(10, delta)
|
|
7349
|
+
// // delta = Math.max(-10, delta)
|
|
7350
|
+
// if (this.isTouchScrolling === true) {
|
|
7351
|
+
// // this.$scope.scrollTop += (delta / (this.$scope.layout.qHyperCube.qSize.qcy / this.$scope.rowsToLoad / (this.$scope.totalSpaceAvailable / 250)))
|
|
7352
|
+
// if (Math.abs(deltaX) > Math.abs(deltaY) && deltaX > 20) {
|
|
7353
|
+
// // this.scrollX(Math.max(-5, Math.min(5, translatedDeltaX)))
|
|
7354
|
+
// this.scrollX(translatedDeltaX)
|
|
7355
|
+
// }
|
|
7356
|
+
// else if (deltaY > 20) {
|
|
7357
|
+
// // this.scrollY(Math.max(-5, Math.min(5, translatedDeltaY)))
|
|
7358
|
+
// this.scrollY(translatedDeltaY)
|
|
7359
|
+
// }
|
|
7360
|
+
// }
|
|
7308
7361
|
|
|
7309
|
-
|
|
7310
|
-
|
|
7311
|
-
|
|
7312
|
-
|
|
7313
|
-
|
|
7314
|
-
|
|
7315
|
-
|
|
7316
|
-
|
|
7317
|
-
|
|
7318
|
-
|
|
7319
|
-
|
|
7320
|
-
|
|
7321
|
-
|
|
7322
|
-
}
|
|
7323
|
-
}
|
|
7362
|
+
}
|
|
7363
|
+
}
|
|
7364
|
+
|
|
7365
|
+
if (this.scrollDragging === true) {
|
|
7366
|
+
event.preventDefault();
|
|
7367
|
+
|
|
7368
|
+
if (this.scrollDirection === 'y') {
|
|
7369
|
+
var diff = event.targetTouches[0].pageY - this.mouseYStart;
|
|
7370
|
+
this.scrollY(diff);
|
|
7371
|
+
} else if (this.scrollDirection === 'x') {
|
|
7372
|
+
var _diff2 = event.targetTouches[0].pageX - this.mouseXStart;
|
|
7373
|
+
|
|
7374
|
+
this.scrollX(_diff2);
|
|
7324
7375
|
}
|
|
7325
7376
|
}
|
|
7326
7377
|
}
|
|
@@ -7336,19 +7387,44 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7336
7387
|
} // console.log(event.target.classList)
|
|
7337
7388
|
|
|
7338
7389
|
|
|
7339
|
-
if (
|
|
7340
|
-
this.
|
|
7341
|
-
|
|
7342
|
-
|
|
7343
|
-
this.mouseYStart = event.targetTouches[0].pageY;
|
|
7344
|
-
this.mouseXStart = event.targetTouches[0].pageX; // const touchScrollEl = document.getElementById(`${this.elementId}_touchScroller`)
|
|
7345
|
-
// touchScrollEl.classList.remove('hidden')
|
|
7390
|
+
if (event.target.classList.contains('websy-table-touch-scroller')) {
|
|
7391
|
+
if (this.options.virtualScroll === true) {
|
|
7392
|
+
// this.touchStartTime = (new Date()).getTime()
|
|
7393
|
+
this.isTouchScrolling = true; // this.isPerpetual = false
|
|
7346
7394
|
|
|
7347
|
-
|
|
7348
|
-
|
|
7349
|
-
|
|
7350
|
-
this.handleXStart = handleXEl.offsetLeft;
|
|
7395
|
+
this.touchYStart = event.targetTouches[0].pageY;
|
|
7396
|
+
this.touchXStart = event.targetTouches[0].pageX;
|
|
7397
|
+
}
|
|
7351
7398
|
}
|
|
7399
|
+
|
|
7400
|
+
if (event.target.classList.contains('websy-scroll-handle-y')) {
|
|
7401
|
+
// set up the scroll start values
|
|
7402
|
+
this.scrollDragging = true;
|
|
7403
|
+
this.scrollDirection = 'y';
|
|
7404
|
+
var scrollHandleEl = document.getElementById("".concat(this.elementId, "_vScrollHandle"));
|
|
7405
|
+
this.handleYStart = scrollHandleEl.offsetTop;
|
|
7406
|
+
this.mouseYStart = event.targetTouches[0].pageY; // console.log('mouse down', this.handleYStart, this.mouseYStart)
|
|
7407
|
+
// console.log(scrollHandleEl.offsetTop)
|
|
7408
|
+
} else if (event.target.classList.contains('websy-scroll-handle-x')) {
|
|
7409
|
+
if (this.isTouchDevice) {
|
|
7410
|
+
event.preventDefault();
|
|
7411
|
+
}
|
|
7412
|
+
|
|
7413
|
+
this.scrollDragging = true;
|
|
7414
|
+
this.scrollDirection = 'x';
|
|
7415
|
+
|
|
7416
|
+
var _scrollHandleEl3 = document.getElementById("".concat(this.elementId, "_hScrollHandle"));
|
|
7417
|
+
|
|
7418
|
+
this.handleXStart = _scrollHandleEl3.offsetLeft;
|
|
7419
|
+
this.mouseXStart = event.targetTouches[0].pageX;
|
|
7420
|
+
} // // const touchScrollEl = document.getElementById(`${this.elementId}_touchScroller`)
|
|
7421
|
+
// // touchScrollEl.classList.remove('hidden')
|
|
7422
|
+
// const handleYEl = document.getElementById(`${this.elementId}_vScrollHandle`)
|
|
7423
|
+
// this.handleYStart = handleYEl.offsetTop
|
|
7424
|
+
// const handleXEl = document.getElementById(`${this.elementId}_hScrollHandle`)
|
|
7425
|
+
// this.handleXStart = handleXEl.offsetLeft
|
|
7426
|
+
// }
|
|
7427
|
+
|
|
7352
7428
|
}
|
|
7353
7429
|
}, {
|
|
7354
7430
|
key: "hideError",
|
|
@@ -7493,7 +7569,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
|
|
|
7493
7569
|
|
|
7494
7570
|
if (this.hScrollRequired === true) {
|
|
7495
7571
|
hScrollEl.style.left = "".concat(this.sizes.table.width - this.sizes.scrollableWidth, "px");
|
|
7496
|
-
hScrollEl.style.width = "".concat(this.sizes.scrollableWidth - 20, "px");
|
|
7572
|
+
hScrollEl.style.width = "".concat(this.sizes.scrollableWidth - (this.isTouchDevice ? 30 : 20), "px");
|
|
7497
7573
|
hHandleEl.style.width = Math.max(this.options.minHandleSize, this.sizes.scrollableWidth * (this.sizes.scrollableWidth / this.sizes.totalNonPinnedWidth)) + 'px';
|
|
7498
7574
|
} else {
|
|
7499
7575
|
hHandleEl.style.width = '0px';
|
|
@@ -9469,7 +9545,9 @@ var WebsyChart = /*#__PURE__*/function () {
|
|
|
9469
9545
|
key: "removebar",
|
|
9470
9546
|
value: function removebar(key) {
|
|
9471
9547
|
/* global key d3 */
|
|
9472
|
-
|
|
9548
|
+
this.barLayer.selectAll(".bar_".concat(key)).transition(this.transition).style('fill-opacity', 1e-6).remove(); // remove from the brush as well
|
|
9549
|
+
|
|
9550
|
+
this.brushArea.selectAll(".bar_".concat(key)).transition(this.transition).style('fill-opacity', 1e-6).remove();
|
|
9473
9551
|
}
|
|
9474
9552
|
}, {
|
|
9475
9553
|
key: "renderLabels",
|