@hi-ui/table 4.3.1 → 4.3.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/CHANGELOG.md +40 -0
- package/lib/cjs/BaseTable.js +136 -189
- package/lib/cjs/ColGroupContent.js +5 -28
- package/lib/cjs/SettingDrawer.js +76 -127
- package/lib/cjs/Table.js +107 -171
- package/lib/cjs/TableAdvancedFilter.js +49 -85
- package/lib/cjs/TableBody.js +33 -69
- package/lib/cjs/TableCell.js +56 -102
- package/lib/cjs/TableColumnMenu.js +39 -77
- package/lib/cjs/TableEmbedRow.js +11 -38
- package/lib/cjs/TableHeader.js +8 -33
- package/lib/cjs/TableRow.js +48 -88
- package/lib/cjs/TableSettingMenu.js +48 -94
- package/lib/cjs/TbodyContent.js +28 -56
- package/lib/cjs/TheadContent.js +20 -49
- package/lib/cjs/_virtual/index.js +0 -3
- package/lib/cjs/_virtual/index2.js +0 -3
- package/lib/cjs/_virtual/react-is.development.js +0 -3
- package/lib/cjs/_virtual/react-is.production.min.js +0 -3
- package/lib/cjs/context.js +0 -9
- package/lib/cjs/hooks/use-async-switch.js +13 -51
- package/lib/cjs/hooks/use-check.js +47 -77
- package/lib/cjs/hooks/use-col-hidden.js +16 -28
- package/lib/cjs/hooks/use-col-set.js +5 -18
- package/lib/cjs/hooks/use-col-sorter.js +18 -32
- package/lib/cjs/hooks/use-col-width.js +21 -57
- package/lib/cjs/hooks/use-colgroup.js +63 -85
- package/lib/cjs/hooks/use-drag.js +10 -31
- package/lib/cjs/hooks/use-embed-expand.js +23 -68
- package/lib/cjs/hooks/use-expand.js +32 -64
- package/lib/cjs/hooks/use-pagination.js +19 -50
- package/lib/cjs/hooks/use-queue.js +2 -14
- package/lib/cjs/icons/index.js +4 -21
- package/lib/cjs/index.js +0 -4
- package/lib/cjs/node_modules/classnames/index.js +2 -11
- package/lib/cjs/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js +31 -227
- package/lib/cjs/node_modules/rc-resize-observer/es/index.js +10 -68
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/Children/toArray.js +1 -17
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/Dom/findDOMNode.js +1 -14
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/ref.js +1 -25
- package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/warning.js +1 -5
- package/lib/cjs/node_modules/rc-util/es/Dom/canUseDom.js +0 -2
- package/lib/cjs/node_modules/rc-util/es/Dom/findDOMNode.js +1 -14
- package/lib/cjs/node_modules/rc-util/es/hooks/useLayoutEffect.js +2 -9
- package/lib/cjs/node_modules/rc-util/es/raf.js +0 -11
- package/lib/cjs/node_modules/rc-virtual-list/es/Filler.js +6 -25
- package/lib/cjs/node_modules/rc-virtual-list/es/Item.js +3 -14
- package/lib/cjs/node_modules/rc-virtual-list/es/List.js +103 -194
- package/lib/cjs/node_modules/rc-virtual-list/es/ScrollBar.js +16 -96
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useChildren.js +2 -11
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useDiffItem.js +8 -34
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useFrameWheel.js +0 -10
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useHeights.js +6 -39
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js +0 -16
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useOriginScroll.js +4 -9
- package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useScrollTo.js +3 -28
- package/lib/cjs/node_modules/rc-virtual-list/es/index.js +0 -2
- package/lib/cjs/node_modules/rc-virtual-list/es/utils/CacheMap.js +2 -9
- package/lib/cjs/node_modules/rc-virtual-list/es/utils/algorithmUtil.js +0 -15
- package/lib/cjs/node_modules/rc-virtual-list/es/utils/isFirefox.js +0 -2
- package/lib/cjs/node_modules/react-is/cjs/react-is.development.js +3 -29
- package/lib/cjs/node_modules/react-is/cjs/react-is.production.min.js +19 -45
- package/lib/cjs/node_modules/react-is/index.js +0 -5
- package/lib/cjs/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +83 -248
- package/lib/cjs/packages/hooks/use-merge-refs/lib/esm/index.js +3 -14
- package/lib/cjs/packages/ui/scrollbar/lib/esm/Scrollbar.js +48 -86
- package/lib/cjs/packages/ui/scrollbar/lib/esm/styles/index.scss.js +1 -15
- package/lib/cjs/packages/ui/scrollbar/lib/esm/utils/index.js +0 -13
- package/lib/cjs/styles/index.scss.js +1 -4
- package/lib/cjs/use-table.js +268 -355
- package/lib/cjs/utils/index.js +11 -45
- package/lib/esm/BaseTable.js +117 -138
- package/lib/esm/ColGroupContent.js +3 -9
- package/lib/esm/SettingDrawer.js +64 -83
- package/lib/esm/Table.js +97 -124
- package/lib/esm/TableAdvancedFilter.js +37 -47
- package/lib/esm/TableBody.js +24 -34
- package/lib/esm/TableCell.js +48 -72
- package/lib/esm/TableColumnMenu.js +24 -38
- package/lib/esm/TableEmbedRow.js +8 -15
- package/lib/esm/TableHeader.js +5 -11
- package/lib/esm/TableRow.js +36 -51
- package/lib/esm/TableSettingMenu.js +33 -49
- package/lib/esm/TbodyContent.js +20 -27
- package/lib/esm/TheadContent.js +14 -21
- package/lib/esm/context.js +0 -4
- package/lib/esm/hooks/use-async-switch.js +9 -28
- package/lib/esm/hooks/use-check.js +42 -55
- package/lib/esm/hooks/use-col-hidden.js +16 -21
- package/lib/esm/hooks/use-col-set.js +5 -13
- package/lib/esm/hooks/use-col-sorter.js +18 -23
- package/lib/esm/hooks/use-col-width.js +14 -34
- package/lib/esm/hooks/use-colgroup.js +60 -66
- package/lib/esm/hooks/use-drag.js +9 -13
- package/lib/esm/hooks/use-embed-expand.js +20 -42
- package/lib/esm/hooks/use-expand.js +32 -56
- package/lib/esm/hooks/use-pagination.js +13 -25
- package/lib/esm/hooks/use-queue.js +2 -10
- package/lib/esm/node_modules/classnames/index.js +2 -9
- package/lib/esm/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js +31 -228
- package/lib/esm/node_modules/rc-resize-observer/es/index.js +3 -26
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/Children/toArray.js +0 -3
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/Dom/findDOMNode.js +1 -2
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/ref.js +0 -8
- package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/warning.js +0 -5
- package/lib/esm/node_modules/rc-util/es/Dom/canUseDom.js +0 -1
- package/lib/esm/node_modules/rc-util/es/Dom/findDOMNode.js +1 -2
- package/lib/esm/node_modules/rc-util/es/hooks/useLayoutEffect.js +1 -0
- package/lib/esm/node_modules/rc-util/es/raf.js +0 -10
- package/lib/esm/node_modules/rc-virtual-list/es/Filler.js +4 -15
- package/lib/esm/node_modules/rc-virtual-list/es/Item.js +1 -3
- package/lib/esm/node_modules/rc-virtual-list/es/List.js +101 -174
- package/lib/esm/node_modules/rc-virtual-list/es/ScrollBar.js +14 -86
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useChildren.js +0 -2
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useDiffItem.js +6 -25
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useFrameWheel.js +0 -6
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useHeights.js +4 -28
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js +0 -13
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useOriginScroll.js +4 -8
- package/lib/esm/node_modules/rc-virtual-list/es/hooks/useScrollTo.js +1 -19
- package/lib/esm/node_modules/rc-virtual-list/es/index.js +1 -1
- package/lib/esm/node_modules/rc-virtual-list/es/utils/CacheMap.js +2 -8
- package/lib/esm/node_modules/rc-virtual-list/es/utils/algorithmUtil.js +1 -12
- package/lib/esm/node_modules/rc-virtual-list/es/utils/isFirefox.js +0 -1
- package/lib/esm/node_modules/react-is/cjs/react-is.development.js +4 -27
- package/lib/esm/node_modules/react-is/cjs/react-is.production.min.js +20 -44
- package/lib/esm/node_modules/react-is/index.js +0 -1
- package/lib/esm/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +82 -248
- package/lib/esm/packages/hooks/use-merge-refs/lib/esm/index.js +3 -9
- package/lib/esm/packages/ui/scrollbar/lib/esm/Scrollbar.js +47 -64
- package/lib/esm/packages/ui/scrollbar/lib/esm/styles/index.scss.js +1 -3
- package/lib/esm/packages/ui/scrollbar/lib/esm/utils/index.js +0 -10
- package/lib/esm/styles/index.scss.js +1 -3
- package/lib/esm/use-table.js +261 -318
- package/lib/esm/utils/index.js +11 -41
- package/lib/types/BaseTable.d.ts +2 -2
- package/package.json +33 -33
|
@@ -7,46 +7,37 @@
|
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
9
|
*/
|
|
10
|
-
|
|
11
10
|
/*!
|
|
12
11
|
* perfect-scrollbar v1.5.3
|
|
13
12
|
* Copyright 2021 Hyunje Jun, MDBootstrap and Contributors
|
|
14
13
|
* Licensed under MIT
|
|
15
14
|
*/
|
|
15
|
+
|
|
16
16
|
function get(element) {
|
|
17
17
|
return getComputedStyle(element);
|
|
18
18
|
}
|
|
19
|
-
|
|
20
19
|
function set(element, obj) {
|
|
21
20
|
for (var key in obj) {
|
|
22
21
|
var val = obj[key];
|
|
23
|
-
|
|
24
22
|
if (typeof val === 'number') {
|
|
25
23
|
val = val + "px";
|
|
26
24
|
}
|
|
27
|
-
|
|
28
25
|
element.style[key] = val;
|
|
29
26
|
}
|
|
30
|
-
|
|
31
27
|
return element;
|
|
32
28
|
}
|
|
33
|
-
|
|
34
29
|
function div(className) {
|
|
35
30
|
var div = document.createElement('div');
|
|
36
31
|
div.className = className;
|
|
37
32
|
return div;
|
|
38
33
|
}
|
|
39
|
-
|
|
40
34
|
var elMatches = typeof Element !== 'undefined' && (Element.prototype.matches || Element.prototype.webkitMatchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector);
|
|
41
|
-
|
|
42
35
|
function matches(element, query) {
|
|
43
36
|
if (!elMatches) {
|
|
44
37
|
throw new Error('No element matching method supported');
|
|
45
38
|
}
|
|
46
|
-
|
|
47
39
|
return elMatches.call(element, query);
|
|
48
40
|
}
|
|
49
|
-
|
|
50
41
|
function remove(element) {
|
|
51
42
|
if (element.remove) {
|
|
52
43
|
element.remove();
|
|
@@ -56,13 +47,11 @@ function remove(element) {
|
|
|
56
47
|
}
|
|
57
48
|
}
|
|
58
49
|
}
|
|
59
|
-
|
|
60
50
|
function queryChildren(element, selector) {
|
|
61
51
|
return Array.prototype.filter.call(element.children, function (child) {
|
|
62
52
|
return matches(child, selector);
|
|
63
53
|
});
|
|
64
54
|
}
|
|
65
|
-
|
|
66
55
|
var cls = {
|
|
67
56
|
main: 'ps',
|
|
68
57
|
rtl: 'ps__rtl',
|
|
@@ -86,133 +75,108 @@ var cls = {
|
|
|
86
75
|
}
|
|
87
76
|
}
|
|
88
77
|
};
|
|
78
|
+
|
|
89
79
|
/*
|
|
90
80
|
* Helper methods
|
|
91
81
|
*/
|
|
92
|
-
|
|
93
82
|
var scrollingClassTimeout = {
|
|
94
83
|
x: null,
|
|
95
84
|
y: null
|
|
96
85
|
};
|
|
97
|
-
|
|
98
86
|
function addScrollingClass(i, x) {
|
|
99
87
|
var classList = i.element.classList;
|
|
100
88
|
var className = cls.state.scrolling(x);
|
|
101
|
-
|
|
102
89
|
if (classList.contains(className)) {
|
|
103
90
|
clearTimeout(scrollingClassTimeout[x]);
|
|
104
91
|
} else {
|
|
105
92
|
classList.add(className);
|
|
106
93
|
}
|
|
107
94
|
}
|
|
108
|
-
|
|
109
95
|
function removeScrollingClass(i, x) {
|
|
110
96
|
scrollingClassTimeout[x] = setTimeout(function () {
|
|
111
97
|
return i.isAlive && i.element.classList.remove(cls.state.scrolling(x));
|
|
112
98
|
}, i.settings.scrollingThreshold);
|
|
113
99
|
}
|
|
114
|
-
|
|
115
100
|
function setScrollingClassInstantly(i, x) {
|
|
116
101
|
addScrollingClass(i, x);
|
|
117
102
|
removeScrollingClass(i, x);
|
|
118
103
|
}
|
|
119
|
-
|
|
120
104
|
var EventElement = function EventElement(element) {
|
|
121
105
|
this.element = element;
|
|
122
106
|
this.handlers = {};
|
|
123
107
|
};
|
|
124
|
-
|
|
125
108
|
var prototypeAccessors = {
|
|
126
109
|
isEmpty: {
|
|
127
110
|
configurable: true
|
|
128
111
|
}
|
|
129
112
|
};
|
|
130
|
-
|
|
131
113
|
EventElement.prototype.bind = function bind(eventName, handler) {
|
|
132
114
|
if (typeof this.handlers[eventName] === 'undefined') {
|
|
133
115
|
this.handlers[eventName] = [];
|
|
134
116
|
}
|
|
135
|
-
|
|
136
117
|
this.handlers[eventName].push(handler);
|
|
137
118
|
this.element.addEventListener(eventName, handler, false);
|
|
138
119
|
};
|
|
139
|
-
|
|
140
120
|
EventElement.prototype.unbind = function unbind(eventName, target) {
|
|
141
121
|
var this$1$1 = this;
|
|
142
122
|
this.handlers[eventName] = this.handlers[eventName].filter(function (handler) {
|
|
143
123
|
if (target && handler !== target) {
|
|
144
124
|
return true;
|
|
145
125
|
}
|
|
146
|
-
|
|
147
126
|
this$1$1.element.removeEventListener(eventName, handler, false);
|
|
148
127
|
return false;
|
|
149
128
|
});
|
|
150
129
|
};
|
|
151
|
-
|
|
152
130
|
EventElement.prototype.unbindAll = function unbindAll() {
|
|
153
131
|
for (var name in this.handlers) {
|
|
154
132
|
this.unbind(name);
|
|
155
133
|
}
|
|
156
134
|
};
|
|
157
|
-
|
|
158
135
|
prototypeAccessors.isEmpty.get = function () {
|
|
159
136
|
var this$1$1 = this;
|
|
160
137
|
return Object.keys(this.handlers).every(function (key) {
|
|
161
138
|
return this$1$1.handlers[key].length === 0;
|
|
162
139
|
});
|
|
163
140
|
};
|
|
164
|
-
|
|
165
141
|
Object.defineProperties(EventElement.prototype, prototypeAccessors);
|
|
166
|
-
|
|
167
142
|
var EventManager = function EventManager() {
|
|
168
143
|
this.eventElements = [];
|
|
169
144
|
};
|
|
170
|
-
|
|
171
145
|
EventManager.prototype.eventElement = function eventElement(element) {
|
|
172
146
|
var ee = this.eventElements.filter(function (ee) {
|
|
173
147
|
return ee.element === element;
|
|
174
148
|
})[0];
|
|
175
|
-
|
|
176
149
|
if (!ee) {
|
|
177
150
|
ee = new EventElement(element);
|
|
178
151
|
this.eventElements.push(ee);
|
|
179
152
|
}
|
|
180
|
-
|
|
181
153
|
return ee;
|
|
182
154
|
};
|
|
183
|
-
|
|
184
155
|
EventManager.prototype.bind = function bind(element, eventName, handler) {
|
|
185
156
|
this.eventElement(element).bind(eventName, handler);
|
|
186
157
|
};
|
|
187
|
-
|
|
188
158
|
EventManager.prototype.unbind = function unbind(element, eventName, handler) {
|
|
189
159
|
var ee = this.eventElement(element);
|
|
190
160
|
ee.unbind(eventName, handler);
|
|
191
|
-
|
|
192
161
|
if (ee.isEmpty) {
|
|
193
162
|
// remove
|
|
194
163
|
this.eventElements.splice(this.eventElements.indexOf(ee), 1);
|
|
195
164
|
}
|
|
196
165
|
};
|
|
197
|
-
|
|
198
166
|
EventManager.prototype.unbindAll = function unbindAll() {
|
|
199
167
|
this.eventElements.forEach(function (e) {
|
|
200
168
|
return e.unbindAll();
|
|
201
169
|
});
|
|
202
170
|
this.eventElements = [];
|
|
203
171
|
};
|
|
204
|
-
|
|
205
172
|
EventManager.prototype.once = function once(element, eventName, handler) {
|
|
206
173
|
var ee = this.eventElement(element);
|
|
207
|
-
|
|
208
174
|
var onceHandler = function onceHandler(evt) {
|
|
209
175
|
ee.unbind(eventName, onceHandler);
|
|
210
176
|
handler(evt);
|
|
211
177
|
};
|
|
212
|
-
|
|
213
178
|
ee.bind(eventName, onceHandler);
|
|
214
179
|
};
|
|
215
|
-
|
|
216
180
|
function createEvent(name) {
|
|
217
181
|
if (typeof window.CustomEvent === 'function') {
|
|
218
182
|
return new CustomEvent(name);
|
|
@@ -222,12 +186,10 @@ function createEvent(name) {
|
|
|
222
186
|
return evt;
|
|
223
187
|
}
|
|
224
188
|
}
|
|
225
|
-
|
|
226
189
|
function processScrollDiff(i, axis, diff, useScrollingClass, forceFireReachEvent) {
|
|
227
190
|
if (useScrollingClass === void 0) useScrollingClass = true;
|
|
228
191
|
if (forceFireReachEvent === void 0) forceFireReachEvent = false;
|
|
229
192
|
var fields;
|
|
230
|
-
|
|
231
193
|
if (axis === 'top') {
|
|
232
194
|
fields = ['contentHeight', 'containerHeight', 'scrollTop', 'y', 'up', 'down'];
|
|
233
195
|
} else if (axis === 'left') {
|
|
@@ -235,10 +197,8 @@ function processScrollDiff(i, axis, diff, useScrollingClass, forceFireReachEvent
|
|
|
235
197
|
} else {
|
|
236
198
|
throw new Error('A proper axis should be provided');
|
|
237
199
|
}
|
|
238
|
-
|
|
239
200
|
processScrollDiff$1(i, diff, fields, useScrollingClass, forceFireReachEvent);
|
|
240
201
|
}
|
|
241
|
-
|
|
242
202
|
function processScrollDiff$1(i, diff, ref, useScrollingClass, forceFireReachEvent) {
|
|
243
203
|
var contentHeight = ref[0];
|
|
244
204
|
var containerHeight = ref[1];
|
|
@@ -248,58 +208,51 @@ function processScrollDiff$1(i, diff, ref, useScrollingClass, forceFireReachEven
|
|
|
248
208
|
var down = ref[5];
|
|
249
209
|
if (useScrollingClass === void 0) useScrollingClass = true;
|
|
250
210
|
if (forceFireReachEvent === void 0) forceFireReachEvent = false;
|
|
251
|
-
var element = i.element;
|
|
211
|
+
var element = i.element;
|
|
252
212
|
|
|
253
|
-
|
|
213
|
+
// reset reach
|
|
214
|
+
i.reach[y] = null;
|
|
254
215
|
|
|
216
|
+
// 1 for subpixel rounding
|
|
255
217
|
if (element[scrollTop] < 1) {
|
|
256
218
|
i.reach[y] = 'start';
|
|
257
|
-
}
|
|
258
|
-
|
|
219
|
+
}
|
|
259
220
|
|
|
221
|
+
// 1 for subpixel rounding
|
|
260
222
|
if (element[scrollTop] > i[contentHeight] - i[containerHeight] - 1) {
|
|
261
223
|
i.reach[y] = 'end';
|
|
262
224
|
}
|
|
263
|
-
|
|
264
225
|
if (diff) {
|
|
265
226
|
element.dispatchEvent(createEvent("ps-scroll-" + y));
|
|
266
|
-
|
|
267
227
|
if (diff < 0) {
|
|
268
228
|
element.dispatchEvent(createEvent("ps-scroll-" + up));
|
|
269
229
|
} else if (diff > 0) {
|
|
270
230
|
element.dispatchEvent(createEvent("ps-scroll-" + down));
|
|
271
231
|
}
|
|
272
|
-
|
|
273
232
|
if (useScrollingClass) {
|
|
274
233
|
setScrollingClassInstantly(i, y);
|
|
275
234
|
}
|
|
276
235
|
}
|
|
277
|
-
|
|
278
236
|
if (i.reach[y] && (diff || forceFireReachEvent)) {
|
|
279
237
|
element.dispatchEvent(createEvent("ps-" + y + "-reach-" + i.reach[y]));
|
|
280
238
|
}
|
|
281
239
|
}
|
|
282
|
-
|
|
283
240
|
function toInt(x) {
|
|
284
241
|
return parseInt(x, 10) || 0;
|
|
285
242
|
}
|
|
286
|
-
|
|
287
243
|
function isEditable(el) {
|
|
288
244
|
return matches(el, 'input,[contenteditable]') || matches(el, 'select,[contenteditable]') || matches(el, 'textarea,[contenteditable]') || matches(el, 'button,[contenteditable]');
|
|
289
245
|
}
|
|
290
|
-
|
|
291
246
|
function outerWidth(element) {
|
|
292
247
|
var styles = get(element);
|
|
293
248
|
return toInt(styles.width) + toInt(styles.paddingLeft) + toInt(styles.paddingRight) + toInt(styles.borderLeftWidth) + toInt(styles.borderRightWidth);
|
|
294
249
|
}
|
|
295
|
-
|
|
296
250
|
var env = {
|
|
297
251
|
isWebKit: typeof document !== 'undefined' && 'WebkitAppearance' in document.documentElement.style,
|
|
298
252
|
supportsTouch: typeof window !== 'undefined' && ('ontouchstart' in window || 'maxTouchPoints' in window.navigator && window.navigator.maxTouchPoints > 0 || window.DocumentTouch && document instanceof window.DocumentTouch),
|
|
299
253
|
supportsIePointer: typeof navigator !== 'undefined' && navigator.msMaxTouchPoints,
|
|
300
254
|
isChrome: typeof navigator !== 'undefined' && /Chrome/i.test(navigator && navigator.userAgent)
|
|
301
255
|
};
|
|
302
|
-
|
|
303
256
|
function updateGeometry(i) {
|
|
304
257
|
var element = i.element;
|
|
305
258
|
var roundedScrollTop = Math.floor(element.scrollTop);
|
|
@@ -308,7 +261,6 @@ function updateGeometry(i) {
|
|
|
308
261
|
i.containerHeight = Math.round(rect.height);
|
|
309
262
|
i.contentWidth = element.scrollWidth;
|
|
310
263
|
i.contentHeight = element.scrollHeight;
|
|
311
|
-
|
|
312
264
|
if (!element.contains(i.scrollbarXRail)) {
|
|
313
265
|
// clean up and append
|
|
314
266
|
queryChildren(element, cls.element.rail('x')).forEach(function (el) {
|
|
@@ -316,7 +268,6 @@ function updateGeometry(i) {
|
|
|
316
268
|
});
|
|
317
269
|
element.appendChild(i.scrollbarXRail);
|
|
318
270
|
}
|
|
319
|
-
|
|
320
271
|
if (!element.contains(i.scrollbarYRail)) {
|
|
321
272
|
// clean up and append
|
|
322
273
|
queryChildren(element, cls.element.rail('y')).forEach(function (el) {
|
|
@@ -324,7 +275,6 @@ function updateGeometry(i) {
|
|
|
324
275
|
});
|
|
325
276
|
element.appendChild(i.scrollbarYRail);
|
|
326
277
|
}
|
|
327
|
-
|
|
328
278
|
if (!i.settings.suppressScrollX && i.containerWidth + i.settings.scrollXMarginOffset < i.contentWidth) {
|
|
329
279
|
i.scrollbarXActive = true;
|
|
330
280
|
i.railXWidth = i.containerWidth - i.railXMarginWidth;
|
|
@@ -334,7 +284,6 @@ function updateGeometry(i) {
|
|
|
334
284
|
} else {
|
|
335
285
|
i.scrollbarXActive = false;
|
|
336
286
|
}
|
|
337
|
-
|
|
338
287
|
if (!i.settings.suppressScrollY && i.containerHeight + i.settings.scrollYMarginOffset < i.contentHeight) {
|
|
339
288
|
i.scrollbarYActive = true;
|
|
340
289
|
i.railYHeight = i.containerHeight - i.railYMarginHeight;
|
|
@@ -344,17 +293,13 @@ function updateGeometry(i) {
|
|
|
344
293
|
} else {
|
|
345
294
|
i.scrollbarYActive = false;
|
|
346
295
|
}
|
|
347
|
-
|
|
348
296
|
if (i.scrollbarXLeft >= i.railXWidth - i.scrollbarXWidth) {
|
|
349
297
|
i.scrollbarXLeft = i.railXWidth - i.scrollbarXWidth;
|
|
350
298
|
}
|
|
351
|
-
|
|
352
299
|
if (i.scrollbarYTop >= i.railYHeight - i.scrollbarYHeight) {
|
|
353
300
|
i.scrollbarYTop = i.railYHeight - i.scrollbarYHeight;
|
|
354
301
|
}
|
|
355
|
-
|
|
356
302
|
updateCss(element, i);
|
|
357
|
-
|
|
358
303
|
if (i.scrollbarXActive) {
|
|
359
304
|
element.classList.add(cls.state.active('x'));
|
|
360
305
|
} else {
|
|
@@ -363,7 +308,6 @@ function updateGeometry(i) {
|
|
|
363
308
|
i.scrollbarXLeft = 0;
|
|
364
309
|
element.scrollLeft = i.isRtl === true ? i.contentWidth : 0;
|
|
365
310
|
}
|
|
366
|
-
|
|
367
311
|
if (i.scrollbarYActive) {
|
|
368
312
|
element.classList.add(cls.state.active('y'));
|
|
369
313
|
} else {
|
|
@@ -373,43 +317,35 @@ function updateGeometry(i) {
|
|
|
373
317
|
element.scrollTop = 0;
|
|
374
318
|
}
|
|
375
319
|
}
|
|
376
|
-
|
|
377
320
|
function getThumbSize(i, thumbSize) {
|
|
378
321
|
if (i.settings.minScrollbarLength) {
|
|
379
322
|
thumbSize = Math.max(thumbSize, i.settings.minScrollbarLength);
|
|
380
323
|
}
|
|
381
|
-
|
|
382
324
|
if (i.settings.maxScrollbarLength) {
|
|
383
325
|
thumbSize = Math.min(thumbSize, i.settings.maxScrollbarLength);
|
|
384
326
|
}
|
|
385
|
-
|
|
386
327
|
return thumbSize;
|
|
387
328
|
}
|
|
388
|
-
|
|
389
329
|
function updateCss(element, i) {
|
|
390
330
|
var xRailOffset = {
|
|
391
331
|
width: i.railXWidth
|
|
392
332
|
};
|
|
393
333
|
var roundedScrollTop = Math.floor(element.scrollTop);
|
|
394
|
-
|
|
395
334
|
if (i.isRtl) {
|
|
396
335
|
xRailOffset.left = i.negativeScrollAdjustment + element.scrollLeft + i.containerWidth - i.contentWidth;
|
|
397
336
|
} else {
|
|
398
337
|
xRailOffset.left = element.scrollLeft;
|
|
399
338
|
}
|
|
400
|
-
|
|
401
339
|
if (i.isScrollbarXUsingBottom) {
|
|
402
340
|
xRailOffset.bottom = i.scrollbarXBottom - roundedScrollTop;
|
|
403
341
|
} else {
|
|
404
342
|
xRailOffset.top = i.scrollbarXTop + roundedScrollTop;
|
|
405
343
|
}
|
|
406
|
-
|
|
407
344
|
set(i.scrollbarXRail, xRailOffset);
|
|
408
345
|
var yRailOffset = {
|
|
409
346
|
top: roundedScrollTop,
|
|
410
347
|
height: i.railYHeight
|
|
411
348
|
};
|
|
412
|
-
|
|
413
349
|
if (i.isScrollbarYUsingRight) {
|
|
414
350
|
if (i.isRtl) {
|
|
415
351
|
yRailOffset.right = i.contentWidth - (i.negativeScrollAdjustment + element.scrollLeft) - i.scrollbarYRight - i.scrollbarYOuterWidth - 9;
|
|
@@ -423,7 +359,6 @@ function updateCss(element, i) {
|
|
|
423
359
|
yRailOffset.left = i.scrollbarYLeft + element.scrollLeft;
|
|
424
360
|
}
|
|
425
361
|
}
|
|
426
|
-
|
|
427
362
|
set(i.scrollbarYRail, yRailOffset);
|
|
428
363
|
set(i.scrollbarX, {
|
|
429
364
|
left: i.scrollbarXLeft,
|
|
@@ -434,7 +369,6 @@ function updateCss(element, i) {
|
|
|
434
369
|
height: i.scrollbarYHeight - i.railBorderYWidth
|
|
435
370
|
});
|
|
436
371
|
}
|
|
437
|
-
|
|
438
372
|
function clickRail(i) {
|
|
439
373
|
i.event.bind(i.scrollbarY, 'mousedown', function (e) {
|
|
440
374
|
return e.stopPropagation();
|
|
@@ -457,12 +391,10 @@ function clickRail(i) {
|
|
|
457
391
|
e.stopPropagation();
|
|
458
392
|
});
|
|
459
393
|
}
|
|
460
|
-
|
|
461
394
|
function dragThumb(i) {
|
|
462
395
|
bindMouseScrollHandler(i, ['containerWidth', 'contentWidth', 'pageX', 'railXWidth', 'scrollbarX', 'scrollbarXWidth', 'scrollLeft', 'x', 'scrollbarXRail']);
|
|
463
396
|
bindMouseScrollHandler(i, ['containerHeight', 'contentHeight', 'pageY', 'railYHeight', 'scrollbarY', 'scrollbarYHeight', 'scrollTop', 'y', 'scrollbarYRail']);
|
|
464
397
|
}
|
|
465
|
-
|
|
466
398
|
function bindMouseScrollHandler(i, ref) {
|
|
467
399
|
var containerHeight = ref[0];
|
|
468
400
|
var contentHeight = ref[1];
|
|
@@ -477,38 +409,30 @@ function bindMouseScrollHandler(i, ref) {
|
|
|
477
409
|
var startingScrollTop = null;
|
|
478
410
|
var startingMousePageY = null;
|
|
479
411
|
var scrollBy = null;
|
|
480
|
-
|
|
481
412
|
function mouseMoveHandler(e) {
|
|
482
413
|
if (e.touches && e.touches[0]) {
|
|
483
414
|
e[pageY] = e.touches[0].pageY;
|
|
484
415
|
}
|
|
485
|
-
|
|
486
416
|
element[scrollTop] = startingScrollTop + scrollBy * (e[pageY] - startingMousePageY);
|
|
487
417
|
addScrollingClass(i, y);
|
|
488
418
|
updateGeometry(i);
|
|
489
419
|
e.stopPropagation();
|
|
490
|
-
|
|
491
420
|
if (e.type.startsWith('touch') && e.changedTouches.length > 1) {
|
|
492
421
|
e.preventDefault();
|
|
493
422
|
}
|
|
494
423
|
}
|
|
495
|
-
|
|
496
424
|
function mouseUpHandler() {
|
|
497
425
|
removeScrollingClass(i, y);
|
|
498
426
|
i[scrollbarYRail].classList.remove(cls.state.clicking);
|
|
499
427
|
i.event.unbind(i.ownerDocument, 'mousemove', mouseMoveHandler);
|
|
500
428
|
}
|
|
501
|
-
|
|
502
429
|
function bindMoves(e, touchMode) {
|
|
503
430
|
startingScrollTop = element[scrollTop];
|
|
504
|
-
|
|
505
431
|
if (touchMode && e.touches) {
|
|
506
432
|
e[pageY] = e.touches[0].pageY;
|
|
507
433
|
}
|
|
508
|
-
|
|
509
434
|
startingMousePageY = e[pageY];
|
|
510
435
|
scrollBy = (i[contentHeight] - i[containerHeight]) / (i[railYHeight] - i[scrollbarYHeight]);
|
|
511
|
-
|
|
512
436
|
if (!touchMode) {
|
|
513
437
|
i.event.bind(i.ownerDocument, 'mousemove', mouseMoveHandler);
|
|
514
438
|
i.event.once(i.ownerDocument, 'mouseup', mouseUpHandler);
|
|
@@ -516,11 +440,9 @@ function bindMouseScrollHandler(i, ref) {
|
|
|
516
440
|
} else {
|
|
517
441
|
i.event.bind(i.ownerDocument, 'touchmove', mouseMoveHandler);
|
|
518
442
|
}
|
|
519
|
-
|
|
520
443
|
i[scrollbarYRail].classList.add(cls.state.clicking);
|
|
521
444
|
e.stopPropagation();
|
|
522
445
|
}
|
|
523
|
-
|
|
524
446
|
i.event.bind(i[scrollbarY], 'mousedown', function (e) {
|
|
525
447
|
bindMoves(e);
|
|
526
448
|
});
|
|
@@ -528,57 +450,43 @@ function bindMouseScrollHandler(i, ref) {
|
|
|
528
450
|
bindMoves(e, true);
|
|
529
451
|
});
|
|
530
452
|
}
|
|
531
|
-
|
|
532
453
|
function keyboard(i) {
|
|
533
454
|
var element = i.element;
|
|
534
|
-
|
|
535
455
|
var elementHovered = function elementHovered() {
|
|
536
456
|
return matches(element, ':hover');
|
|
537
457
|
};
|
|
538
|
-
|
|
539
458
|
var scrollbarFocused = function scrollbarFocused() {
|
|
540
459
|
return matches(i.scrollbarX, ':focus') || matches(i.scrollbarY, ':focus');
|
|
541
460
|
};
|
|
542
|
-
|
|
543
461
|
function shouldPreventDefault(deltaX, deltaY) {
|
|
544
462
|
var scrollTop = Math.floor(element.scrollTop);
|
|
545
|
-
|
|
546
463
|
if (deltaX === 0) {
|
|
547
464
|
if (!i.scrollbarYActive) {
|
|
548
465
|
return false;
|
|
549
466
|
}
|
|
550
|
-
|
|
551
467
|
if (scrollTop === 0 && deltaY > 0 || scrollTop >= i.contentHeight - i.containerHeight && deltaY < 0) {
|
|
552
468
|
return !i.settings.wheelPropagation;
|
|
553
469
|
}
|
|
554
470
|
}
|
|
555
|
-
|
|
556
471
|
var scrollLeft = element.scrollLeft;
|
|
557
|
-
|
|
558
472
|
if (deltaY === 0) {
|
|
559
473
|
if (!i.scrollbarXActive) {
|
|
560
474
|
return false;
|
|
561
475
|
}
|
|
562
|
-
|
|
563
476
|
if (scrollLeft === 0 && deltaX < 0 || scrollLeft >= i.contentWidth - i.containerWidth && deltaX > 0) {
|
|
564
477
|
return !i.settings.wheelPropagation;
|
|
565
478
|
}
|
|
566
479
|
}
|
|
567
|
-
|
|
568
480
|
return true;
|
|
569
481
|
}
|
|
570
|
-
|
|
571
482
|
i.event.bind(i.ownerDocument, 'keydown', function (e) {
|
|
572
483
|
if (e.isDefaultPrevented && e.isDefaultPrevented() || e.defaultPrevented) {
|
|
573
484
|
return;
|
|
574
485
|
}
|
|
575
|
-
|
|
576
486
|
if (!elementHovered() && !scrollbarFocused()) {
|
|
577
487
|
return;
|
|
578
488
|
}
|
|
579
|
-
|
|
580
489
|
var activeElement = document.activeElement ? document.activeElement : i.ownerDocument.activeElement;
|
|
581
|
-
|
|
582
490
|
if (activeElement) {
|
|
583
491
|
if (activeElement.tagName === 'IFRAME') {
|
|
584
492
|
activeElement = activeElement.contentDocument.activeElement;
|
|
@@ -588,15 +496,12 @@ function keyboard(i) {
|
|
|
588
496
|
activeElement = activeElement.shadowRoot.activeElement;
|
|
589
497
|
}
|
|
590
498
|
}
|
|
591
|
-
|
|
592
499
|
if (isEditable(activeElement)) {
|
|
593
500
|
return;
|
|
594
501
|
}
|
|
595
502
|
}
|
|
596
|
-
|
|
597
503
|
var deltaX = 0;
|
|
598
504
|
var deltaY = 0;
|
|
599
|
-
|
|
600
505
|
switch (e.which) {
|
|
601
506
|
case 37:
|
|
602
507
|
// left
|
|
@@ -607,9 +512,7 @@ function keyboard(i) {
|
|
|
607
512
|
} else {
|
|
608
513
|
deltaX = -30;
|
|
609
514
|
}
|
|
610
|
-
|
|
611
515
|
break;
|
|
612
|
-
|
|
613
516
|
case 38:
|
|
614
517
|
// up
|
|
615
518
|
if (e.metaKey) {
|
|
@@ -619,9 +522,7 @@ function keyboard(i) {
|
|
|
619
522
|
} else {
|
|
620
523
|
deltaY = 30;
|
|
621
524
|
}
|
|
622
|
-
|
|
623
525
|
break;
|
|
624
|
-
|
|
625
526
|
case 39:
|
|
626
527
|
// right
|
|
627
528
|
if (e.metaKey) {
|
|
@@ -631,9 +532,7 @@ function keyboard(i) {
|
|
|
631
532
|
} else {
|
|
632
533
|
deltaX = 30;
|
|
633
534
|
}
|
|
634
|
-
|
|
635
535
|
break;
|
|
636
|
-
|
|
637
536
|
case 40:
|
|
638
537
|
// down
|
|
639
538
|
if (e.metaKey) {
|
|
@@ -643,9 +542,7 @@ function keyboard(i) {
|
|
|
643
542
|
} else {
|
|
644
543
|
deltaY = -30;
|
|
645
544
|
}
|
|
646
|
-
|
|
647
545
|
break;
|
|
648
|
-
|
|
649
546
|
case 32:
|
|
650
547
|
// space bar
|
|
651
548
|
if (e.shiftKey) {
|
|
@@ -653,160 +550,127 @@ function keyboard(i) {
|
|
|
653
550
|
} else {
|
|
654
551
|
deltaY = -i.containerHeight;
|
|
655
552
|
}
|
|
656
|
-
|
|
657
553
|
break;
|
|
658
|
-
|
|
659
554
|
case 33:
|
|
660
555
|
// page up
|
|
661
556
|
deltaY = i.containerHeight;
|
|
662
557
|
break;
|
|
663
|
-
|
|
664
558
|
case 34:
|
|
665
559
|
// page down
|
|
666
560
|
deltaY = -i.containerHeight;
|
|
667
561
|
break;
|
|
668
|
-
|
|
669
562
|
case 36:
|
|
670
563
|
// home
|
|
671
564
|
deltaY = i.contentHeight;
|
|
672
565
|
break;
|
|
673
|
-
|
|
674
566
|
case 35:
|
|
675
567
|
// end
|
|
676
568
|
deltaY = -i.contentHeight;
|
|
677
569
|
break;
|
|
678
|
-
|
|
679
570
|
default:
|
|
680
571
|
return;
|
|
681
572
|
}
|
|
682
|
-
|
|
683
573
|
if (i.settings.suppressScrollX && deltaX !== 0) {
|
|
684
574
|
return;
|
|
685
575
|
}
|
|
686
|
-
|
|
687
576
|
if (i.settings.suppressScrollY && deltaY !== 0) {
|
|
688
577
|
return;
|
|
689
578
|
}
|
|
690
|
-
|
|
691
579
|
element.scrollTop -= deltaY;
|
|
692
580
|
element.scrollLeft += deltaX;
|
|
693
581
|
updateGeometry(i);
|
|
694
|
-
|
|
695
582
|
if (shouldPreventDefault(deltaX, deltaY)) {
|
|
696
583
|
e.preventDefault();
|
|
697
584
|
}
|
|
698
585
|
});
|
|
699
586
|
}
|
|
700
|
-
|
|
701
587
|
function wheel(i) {
|
|
702
588
|
var element = i.element;
|
|
703
|
-
|
|
704
589
|
function shouldPreventDefault(deltaX, deltaY) {
|
|
705
590
|
var roundedScrollTop = Math.floor(element.scrollTop);
|
|
706
591
|
var isTop = element.scrollTop === 0;
|
|
707
592
|
var isBottom = roundedScrollTop + element.offsetHeight === element.scrollHeight;
|
|
708
593
|
var isLeft = element.scrollLeft === 0;
|
|
709
594
|
var isRight = element.scrollLeft + element.offsetWidth === element.scrollWidth;
|
|
710
|
-
var hitsBound;
|
|
595
|
+
var hitsBound;
|
|
711
596
|
|
|
597
|
+
// pick axis with primary direction
|
|
712
598
|
if (Math.abs(deltaY) > Math.abs(deltaX)) {
|
|
713
599
|
hitsBound = isTop || isBottom;
|
|
714
600
|
} else {
|
|
715
601
|
hitsBound = isLeft || isRight;
|
|
716
602
|
}
|
|
717
|
-
|
|
718
603
|
return hitsBound ? !i.settings.wheelPropagation : true;
|
|
719
604
|
}
|
|
720
|
-
|
|
721
605
|
function getDeltaFromEvent(e) {
|
|
722
606
|
var deltaX = e.deltaX;
|
|
723
607
|
var deltaY = -1 * e.deltaY;
|
|
724
|
-
|
|
725
608
|
if (typeof deltaX === 'undefined' || typeof deltaY === 'undefined') {
|
|
726
609
|
// OS X Safari
|
|
727
610
|
deltaX = -1 * e.wheelDeltaX / 6;
|
|
728
611
|
deltaY = e.wheelDeltaY / 6;
|
|
729
612
|
}
|
|
730
|
-
|
|
731
613
|
if (e.deltaMode && e.deltaMode === 1) {
|
|
732
614
|
// Firefox in deltaMode 1: Line scrolling
|
|
733
615
|
deltaX *= 10;
|
|
734
616
|
deltaY *= 10;
|
|
735
617
|
}
|
|
736
|
-
|
|
737
|
-
if (deltaX !== deltaX && deltaY !== deltaY
|
|
738
|
-
/* NaN checks */
|
|
739
|
-
) {
|
|
618
|
+
if (deltaX !== deltaX && deltaY !== deltaY /* NaN checks */) {
|
|
740
619
|
// IE in some mouse drivers
|
|
741
620
|
deltaX = 0;
|
|
742
621
|
deltaY = e.wheelDelta;
|
|
743
622
|
}
|
|
744
|
-
|
|
745
623
|
if (e.shiftKey) {
|
|
746
624
|
// reverse axis with shift key
|
|
747
625
|
return [-deltaY, -deltaX];
|
|
748
626
|
}
|
|
749
|
-
|
|
750
627
|
return [deltaX, deltaY];
|
|
751
628
|
}
|
|
752
|
-
|
|
753
629
|
function shouldBeConsumedByChild(target, deltaX, deltaY) {
|
|
754
630
|
// FIXME: this is a workaround for <select> issue in FF and IE #571
|
|
755
631
|
if (!env.isWebKit && element.querySelector('select:focus')) {
|
|
756
632
|
return true;
|
|
757
633
|
}
|
|
758
|
-
|
|
759
634
|
if (!element.contains(target)) {
|
|
760
635
|
return false;
|
|
761
636
|
}
|
|
762
|
-
|
|
763
637
|
var cursor = target;
|
|
764
|
-
|
|
765
638
|
while (cursor && cursor !== element) {
|
|
766
639
|
if (cursor.classList.contains(cls.element.consuming)) {
|
|
767
640
|
return true;
|
|
768
641
|
}
|
|
642
|
+
var style = get(cursor);
|
|
769
643
|
|
|
770
|
-
|
|
771
|
-
|
|
644
|
+
// if deltaY && vertical scrollable
|
|
772
645
|
if (deltaY && style.overflowY.match(/(scroll|auto)/)) {
|
|
773
646
|
var maxScrollTop = cursor.scrollHeight - cursor.clientHeight;
|
|
774
|
-
|
|
775
647
|
if (maxScrollTop > 0) {
|
|
776
648
|
if (cursor.scrollTop > 0 && deltaY < 0 || cursor.scrollTop < maxScrollTop && deltaY > 0) {
|
|
777
649
|
return true;
|
|
778
650
|
}
|
|
779
651
|
}
|
|
780
|
-
}
|
|
781
|
-
|
|
782
|
-
|
|
652
|
+
}
|
|
653
|
+
// if deltaX && horizontal scrollable
|
|
783
654
|
if (deltaX && style.overflowX.match(/(scroll|auto)/)) {
|
|
784
655
|
var maxScrollLeft = cursor.scrollWidth - cursor.clientWidth;
|
|
785
|
-
|
|
786
656
|
if (maxScrollLeft > 0) {
|
|
787
657
|
if (cursor.scrollLeft > 0 && deltaX < 0 || cursor.scrollLeft < maxScrollLeft && deltaX > 0) {
|
|
788
658
|
return true;
|
|
789
659
|
}
|
|
790
660
|
}
|
|
791
661
|
}
|
|
792
|
-
|
|
793
662
|
cursor = cursor.parentNode;
|
|
794
663
|
}
|
|
795
|
-
|
|
796
664
|
return false;
|
|
797
665
|
}
|
|
798
|
-
|
|
799
666
|
function mousewheelHandler(e) {
|
|
800
667
|
var ref = getDeltaFromEvent(e);
|
|
801
668
|
var deltaX = ref[0];
|
|
802
669
|
var deltaY = ref[1];
|
|
803
|
-
|
|
804
670
|
if (shouldBeConsumedByChild(e.target, deltaX, deltaY)) {
|
|
805
671
|
return;
|
|
806
672
|
}
|
|
807
|
-
|
|
808
673
|
var shouldPrevent = false;
|
|
809
|
-
|
|
810
674
|
if (!i.settings.useBothWheelAxes) {
|
|
811
675
|
// deltaX will only be used for horizontal scrolling and deltaY will
|
|
812
676
|
// only be used for vertical scrolling - this is the default
|
|
@@ -820,7 +684,6 @@ function wheel(i) {
|
|
|
820
684
|
} else {
|
|
821
685
|
element.scrollTop += deltaX * i.settings.wheelSpeed;
|
|
822
686
|
}
|
|
823
|
-
|
|
824
687
|
shouldPrevent = true;
|
|
825
688
|
} else if (i.scrollbarXActive && !i.scrollbarYActive) {
|
|
826
689
|
// useBothWheelAxes and only horizontal bar is active, so use both
|
|
@@ -830,66 +693,56 @@ function wheel(i) {
|
|
|
830
693
|
} else {
|
|
831
694
|
element.scrollLeft -= deltaY * i.settings.wheelSpeed;
|
|
832
695
|
}
|
|
833
|
-
|
|
834
696
|
shouldPrevent = true;
|
|
835
697
|
}
|
|
836
|
-
|
|
837
698
|
updateGeometry(i);
|
|
838
699
|
shouldPrevent = shouldPrevent || shouldPreventDefault(deltaX, deltaY);
|
|
839
|
-
|
|
840
700
|
if (shouldPrevent && !e.ctrlKey) {
|
|
841
701
|
e.stopPropagation();
|
|
842
702
|
e.preventDefault();
|
|
843
703
|
}
|
|
844
704
|
}
|
|
845
|
-
|
|
846
705
|
if (typeof window.onwheel !== 'undefined') {
|
|
847
706
|
i.event.bind(element, 'wheel', mousewheelHandler);
|
|
848
707
|
} else if (typeof window.onmousewheel !== 'undefined') {
|
|
849
708
|
i.event.bind(element, 'mousewheel', mousewheelHandler);
|
|
850
709
|
}
|
|
851
710
|
}
|
|
852
|
-
|
|
853
711
|
function touch(i) {
|
|
854
712
|
if (!env.supportsTouch && !env.supportsIePointer) {
|
|
855
713
|
return;
|
|
856
714
|
}
|
|
857
|
-
|
|
858
715
|
var element = i.element;
|
|
859
|
-
|
|
860
716
|
function shouldPrevent(deltaX, deltaY) {
|
|
861
717
|
var scrollTop = Math.floor(element.scrollTop);
|
|
862
718
|
var scrollLeft = element.scrollLeft;
|
|
863
719
|
var magnitudeX = Math.abs(deltaX);
|
|
864
720
|
var magnitudeY = Math.abs(deltaY);
|
|
865
|
-
|
|
866
721
|
if (magnitudeY > magnitudeX) {
|
|
867
722
|
// user is perhaps trying to swipe up/down the page
|
|
723
|
+
|
|
868
724
|
if (deltaY < 0 && scrollTop === i.contentHeight - i.containerHeight || deltaY > 0 && scrollTop === 0) {
|
|
869
725
|
// set prevent for mobile Chrome refresh
|
|
870
726
|
return window.scrollY === 0 && deltaY > 0 && env.isChrome;
|
|
871
727
|
}
|
|
872
728
|
} else if (magnitudeX > magnitudeY) {
|
|
873
729
|
// user is perhaps trying to swipe left/right across the page
|
|
730
|
+
|
|
874
731
|
if (deltaX < 0 && scrollLeft === i.contentWidth - i.containerWidth || deltaX > 0 && scrollLeft === 0) {
|
|
875
732
|
return true;
|
|
876
733
|
}
|
|
877
734
|
}
|
|
878
|
-
|
|
879
735
|
return true;
|
|
880
736
|
}
|
|
881
|
-
|
|
882
737
|
function applyTouchMove(differenceX, differenceY) {
|
|
883
738
|
element.scrollTop -= differenceY;
|
|
884
739
|
element.scrollLeft -= differenceX;
|
|
885
740
|
updateGeometry(i);
|
|
886
741
|
}
|
|
887
|
-
|
|
888
742
|
var startOffset = {};
|
|
889
743
|
var startTime = 0;
|
|
890
744
|
var speed = {};
|
|
891
745
|
var easingLoop = null;
|
|
892
|
-
|
|
893
746
|
function getTouch(e) {
|
|
894
747
|
if (e.targetTouches) {
|
|
895
748
|
return e.targetTouches[0];
|
|
@@ -898,79 +751,63 @@ function touch(i) {
|
|
|
898
751
|
return e;
|
|
899
752
|
}
|
|
900
753
|
}
|
|
901
|
-
|
|
902
754
|
function shouldHandle(e) {
|
|
903
755
|
if (e.pointerType && e.pointerType === 'pen' && e.buttons === 0) {
|
|
904
756
|
return false;
|
|
905
757
|
}
|
|
906
|
-
|
|
907
758
|
if (e.targetTouches && e.targetTouches.length === 1) {
|
|
908
759
|
return true;
|
|
909
760
|
}
|
|
910
|
-
|
|
911
761
|
if (e.pointerType && e.pointerType !== 'mouse' && e.pointerType !== e.MSPOINTER_TYPE_MOUSE) {
|
|
912
762
|
return true;
|
|
913
763
|
}
|
|
914
|
-
|
|
915
764
|
return false;
|
|
916
765
|
}
|
|
917
|
-
|
|
918
766
|
function touchStart(e) {
|
|
919
767
|
if (!shouldHandle(e)) {
|
|
920
768
|
return;
|
|
921
769
|
}
|
|
922
|
-
|
|
923
770
|
var touch = getTouch(e);
|
|
924
771
|
startOffset.pageX = touch.pageX;
|
|
925
772
|
startOffset.pageY = touch.pageY;
|
|
926
773
|
startTime = new Date().getTime();
|
|
927
|
-
|
|
928
774
|
if (easingLoop !== null) {
|
|
929
775
|
clearInterval(easingLoop);
|
|
930
776
|
}
|
|
931
777
|
}
|
|
932
|
-
|
|
933
778
|
function shouldBeConsumedByChild(target, deltaX, deltaY) {
|
|
934
779
|
if (!element.contains(target)) {
|
|
935
780
|
return false;
|
|
936
781
|
}
|
|
937
|
-
|
|
938
782
|
var cursor = target;
|
|
939
|
-
|
|
940
783
|
while (cursor && cursor !== element) {
|
|
941
784
|
if (cursor.classList.contains(cls.element.consuming)) {
|
|
942
785
|
return true;
|
|
943
786
|
}
|
|
787
|
+
var style = get(cursor);
|
|
944
788
|
|
|
945
|
-
|
|
946
|
-
|
|
789
|
+
// if deltaY && vertical scrollable
|
|
947
790
|
if (deltaY && style.overflowY.match(/(scroll|auto)/)) {
|
|
948
791
|
var maxScrollTop = cursor.scrollHeight - cursor.clientHeight;
|
|
949
|
-
|
|
950
792
|
if (maxScrollTop > 0) {
|
|
951
793
|
if (cursor.scrollTop > 0 && deltaY < 0 || cursor.scrollTop < maxScrollTop && deltaY > 0) {
|
|
952
794
|
return true;
|
|
953
795
|
}
|
|
954
796
|
}
|
|
955
|
-
}
|
|
956
|
-
|
|
957
|
-
|
|
797
|
+
}
|
|
798
|
+
// if deltaX && horizontal scrollable
|
|
958
799
|
if (deltaX && style.overflowX.match(/(scroll|auto)/)) {
|
|
959
800
|
var maxScrollLeft = cursor.scrollWidth - cursor.clientWidth;
|
|
960
|
-
|
|
961
801
|
if (maxScrollLeft > 0) {
|
|
962
802
|
if (cursor.scrollLeft > 0 && deltaX < 0 || cursor.scrollLeft < maxScrollLeft && deltaX > 0) {
|
|
963
803
|
return true;
|
|
964
804
|
}
|
|
965
805
|
}
|
|
966
806
|
}
|
|
967
|
-
|
|
968
807
|
cursor = cursor.parentNode;
|
|
969
808
|
}
|
|
970
|
-
|
|
971
809
|
return false;
|
|
972
810
|
}
|
|
973
|
-
|
|
974
811
|
function touchMove(e) {
|
|
975
812
|
if (shouldHandle(e)) {
|
|
976
813
|
var touch = getTouch(e);
|
|
@@ -980,28 +817,23 @@ function touch(i) {
|
|
|
980
817
|
};
|
|
981
818
|
var differenceX = currentOffset.pageX - startOffset.pageX;
|
|
982
819
|
var differenceY = currentOffset.pageY - startOffset.pageY;
|
|
983
|
-
|
|
984
820
|
if (shouldBeConsumedByChild(e.target, differenceX, differenceY)) {
|
|
985
821
|
return;
|
|
986
822
|
}
|
|
987
|
-
|
|
988
823
|
applyTouchMove(differenceX, differenceY);
|
|
989
824
|
startOffset = currentOffset;
|
|
990
825
|
var currentTime = new Date().getTime();
|
|
991
826
|
var timeGap = currentTime - startTime;
|
|
992
|
-
|
|
993
827
|
if (timeGap > 0) {
|
|
994
828
|
speed.x = differenceX / timeGap;
|
|
995
829
|
speed.y = differenceY / timeGap;
|
|
996
830
|
startTime = currentTime;
|
|
997
831
|
}
|
|
998
|
-
|
|
999
832
|
if (shouldPrevent(differenceX, differenceY)) {
|
|
1000
833
|
e.preventDefault();
|
|
1001
834
|
}
|
|
1002
835
|
}
|
|
1003
836
|
}
|
|
1004
|
-
|
|
1005
837
|
function touchEnd() {
|
|
1006
838
|
if (i.settings.swipeEasing) {
|
|
1007
839
|
clearInterval(easingLoop);
|
|
@@ -1010,29 +842,24 @@ function touch(i) {
|
|
|
1010
842
|
clearInterval(easingLoop);
|
|
1011
843
|
return;
|
|
1012
844
|
}
|
|
1013
|
-
|
|
1014
845
|
if (!speed.x && !speed.y) {
|
|
1015
846
|
clearInterval(easingLoop);
|
|
1016
847
|
return;
|
|
1017
848
|
}
|
|
1018
|
-
|
|
1019
849
|
if (Math.abs(speed.x) < 0.01 && Math.abs(speed.y) < 0.01) {
|
|
1020
850
|
clearInterval(easingLoop);
|
|
1021
851
|
return;
|
|
1022
852
|
}
|
|
1023
|
-
|
|
1024
853
|
if (!i.element) {
|
|
1025
854
|
clearInterval(easingLoop);
|
|
1026
855
|
return;
|
|
1027
856
|
}
|
|
1028
|
-
|
|
1029
857
|
applyTouchMove(speed.x * 30, speed.y * 30);
|
|
1030
858
|
speed.x *= 0.8;
|
|
1031
859
|
speed.y *= 0.8;
|
|
1032
860
|
}, 10);
|
|
1033
861
|
}
|
|
1034
862
|
}
|
|
1035
|
-
|
|
1036
863
|
if (env.supportsTouch) {
|
|
1037
864
|
i.event.bind(element, 'touchstart', touchStart);
|
|
1038
865
|
i.event.bind(element, 'touchmove', touchMove);
|
|
@@ -1049,7 +876,6 @@ function touch(i) {
|
|
|
1049
876
|
}
|
|
1050
877
|
}
|
|
1051
878
|
}
|
|
1052
|
-
|
|
1053
879
|
var defaultSettings = function defaultSettings() {
|
|
1054
880
|
return {
|
|
1055
881
|
handlers: ['click-rail', 'drag-thumb', 'keyboard', 'wheel', 'touch'],
|
|
@@ -1066,7 +892,6 @@ var defaultSettings = function defaultSettings() {
|
|
|
1066
892
|
wheelSpeed: 1
|
|
1067
893
|
};
|
|
1068
894
|
};
|
|
1069
|
-
|
|
1070
895
|
var handlers = {
|
|
1071
896
|
'click-rail': clickRail,
|
|
1072
897
|
'drag-thumb': dragThumb,
|
|
@@ -1074,46 +899,35 @@ var handlers = {
|
|
|
1074
899
|
wheel: wheel,
|
|
1075
900
|
touch: touch
|
|
1076
901
|
};
|
|
1077
|
-
|
|
1078
902
|
var PerfectScrollbar = function PerfectScrollbar(element, userSettings) {
|
|
1079
903
|
var this$1$1 = this;
|
|
1080
904
|
if (userSettings === void 0) userSettings = {};
|
|
1081
|
-
|
|
1082
905
|
if (typeof element === 'string') {
|
|
1083
906
|
element = document.querySelector(element);
|
|
1084
907
|
}
|
|
1085
|
-
|
|
1086
908
|
if (!element || !element.nodeName) {
|
|
1087
909
|
throw new Error('no element is specified to initialize PerfectScrollbar');
|
|
1088
910
|
}
|
|
1089
|
-
|
|
1090
911
|
this.element = element;
|
|
1091
912
|
element.classList.add(cls.main);
|
|
1092
913
|
this.settings = defaultSettings();
|
|
1093
|
-
|
|
1094
914
|
for (var key in userSettings) {
|
|
1095
915
|
this.settings[key] = userSettings[key];
|
|
1096
916
|
}
|
|
1097
|
-
|
|
1098
917
|
this.containerWidth = null;
|
|
1099
918
|
this.containerHeight = null;
|
|
1100
919
|
this.contentWidth = null;
|
|
1101
920
|
this.contentHeight = null;
|
|
1102
|
-
|
|
1103
921
|
var focus = function focus() {
|
|
1104
922
|
return element.classList.add(cls.state.focus);
|
|
1105
923
|
};
|
|
1106
|
-
|
|
1107
924
|
var blur = function blur() {
|
|
1108
925
|
return element.classList.remove(cls.state.focus);
|
|
1109
926
|
};
|
|
1110
|
-
|
|
1111
927
|
this.isRtl = get(element).direction === 'rtl';
|
|
1112
|
-
|
|
1113
928
|
if (this.isRtl === true) {
|
|
1114
929
|
element.classList.add(cls.rtl);
|
|
1115
930
|
}
|
|
1116
|
-
|
|
1117
931
|
this.isNegativeScroll = function () {
|
|
1118
932
|
var originalScrollLeft = element.scrollLeft;
|
|
1119
933
|
var result = null;
|
|
@@ -1122,7 +936,6 @@ var PerfectScrollbar = function PerfectScrollbar(element, userSettings) {
|
|
|
1122
936
|
element.scrollLeft = originalScrollLeft;
|
|
1123
937
|
return result;
|
|
1124
938
|
}();
|
|
1125
|
-
|
|
1126
939
|
this.negativeScrollAdjustment = this.isNegativeScroll ? element.scrollWidth - element.clientWidth : 0;
|
|
1127
940
|
this.event = new EventManager();
|
|
1128
941
|
this.ownerDocument = element.ownerDocument || document;
|
|
@@ -1138,16 +951,14 @@ var PerfectScrollbar = function PerfectScrollbar(element, userSettings) {
|
|
|
1138
951
|
this.scrollbarXLeft = null;
|
|
1139
952
|
var railXStyle = get(this.scrollbarXRail);
|
|
1140
953
|
this.scrollbarXBottom = parseInt(railXStyle.bottom, 10);
|
|
1141
|
-
|
|
1142
954
|
if (isNaN(this.scrollbarXBottom)) {
|
|
1143
955
|
this.isScrollbarXUsingBottom = false;
|
|
1144
956
|
this.scrollbarXTop = toInt(railXStyle.top);
|
|
1145
957
|
} else {
|
|
1146
958
|
this.isScrollbarXUsingBottom = true;
|
|
1147
959
|
}
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
960
|
+
this.railBorderXWidth = toInt(railXStyle.borderLeftWidth) + toInt(railXStyle.borderRightWidth);
|
|
961
|
+
// Set rail to display:block to calculate margins
|
|
1151
962
|
set(this.scrollbarXRail, {
|
|
1152
963
|
display: 'block'
|
|
1153
964
|
});
|
|
@@ -1169,14 +980,12 @@ var PerfectScrollbar = function PerfectScrollbar(element, userSettings) {
|
|
|
1169
980
|
this.scrollbarYTop = null;
|
|
1170
981
|
var railYStyle = get(this.scrollbarYRail);
|
|
1171
982
|
this.scrollbarYRight = parseInt(railYStyle.right, 10);
|
|
1172
|
-
|
|
1173
983
|
if (isNaN(this.scrollbarYRight)) {
|
|
1174
984
|
this.isScrollbarYUsingRight = false;
|
|
1175
985
|
this.scrollbarYLeft = toInt(railYStyle.left);
|
|
1176
986
|
} else {
|
|
1177
987
|
this.isScrollbarYUsingRight = true;
|
|
1178
988
|
}
|
|
1179
|
-
|
|
1180
989
|
this.scrollbarYOuterWidth = this.isRtl ? outerWidth(this.scrollbarY) : null;
|
|
1181
990
|
this.railBorderYWidth = toInt(railYStyle.borderTopWidth) + toInt(railYStyle.borderBottomWidth);
|
|
1182
991
|
set(this.scrollbarYRail, {
|
|
@@ -1197,23 +1006,21 @@ var PerfectScrollbar = function PerfectScrollbar(element, userSettings) {
|
|
|
1197
1006
|
return handlers[handlerName](this$1$1);
|
|
1198
1007
|
});
|
|
1199
1008
|
this.lastScrollTop = Math.floor(element.scrollTop); // for onScroll only
|
|
1200
|
-
|
|
1201
1009
|
this.lastScrollLeft = element.scrollLeft; // for onScroll only
|
|
1202
|
-
|
|
1203
1010
|
this.event.bind(this.element, 'scroll', function (e) {
|
|
1204
1011
|
return this$1$1.onScroll(e);
|
|
1205
1012
|
});
|
|
1206
1013
|
updateGeometry(this);
|
|
1207
1014
|
};
|
|
1208
|
-
|
|
1209
1015
|
PerfectScrollbar.prototype.update = function update() {
|
|
1210
1016
|
if (!this.isAlive) {
|
|
1211
1017
|
return;
|
|
1212
|
-
}
|
|
1213
|
-
|
|
1018
|
+
}
|
|
1214
1019
|
|
|
1215
|
-
|
|
1020
|
+
// Recalcuate negative scrollLeft adjustment
|
|
1021
|
+
this.negativeScrollAdjustment = this.isNegativeScroll ? this.element.scrollWidth - this.element.clientWidth : 0;
|
|
1216
1022
|
|
|
1023
|
+
// Recalculate rail margins
|
|
1217
1024
|
set(this.scrollbarXRail, {
|
|
1218
1025
|
display: 'block'
|
|
1219
1026
|
});
|
|
@@ -1221,8 +1028,9 @@ PerfectScrollbar.prototype.update = function update() {
|
|
|
1221
1028
|
display: 'block'
|
|
1222
1029
|
});
|
|
1223
1030
|
this.railXMarginWidth = toInt(get(this.scrollbarXRail).marginLeft) + toInt(get(this.scrollbarXRail).marginRight);
|
|
1224
|
-
this.railYMarginHeight = toInt(get(this.scrollbarYRail).marginTop) + toInt(get(this.scrollbarYRail).marginBottom);
|
|
1031
|
+
this.railYMarginHeight = toInt(get(this.scrollbarYRail).marginTop) + toInt(get(this.scrollbarYRail).marginBottom);
|
|
1225
1032
|
|
|
1033
|
+
// Hide scrollbars not to affect scrollWidth and scrollHeight
|
|
1226
1034
|
set(this.scrollbarXRail, {
|
|
1227
1035
|
display: 'none'
|
|
1228
1036
|
});
|
|
@@ -1239,31 +1047,28 @@ PerfectScrollbar.prototype.update = function update() {
|
|
|
1239
1047
|
display: ''
|
|
1240
1048
|
});
|
|
1241
1049
|
};
|
|
1242
|
-
|
|
1243
1050
|
PerfectScrollbar.prototype.onScroll = function onScroll(e) {
|
|
1244
1051
|
if (!this.isAlive) {
|
|
1245
1052
|
return;
|
|
1246
1053
|
}
|
|
1247
|
-
|
|
1248
1054
|
updateGeometry(this);
|
|
1249
1055
|
processScrollDiff(this, 'top', this.element.scrollTop - this.lastScrollTop);
|
|
1250
1056
|
processScrollDiff(this, 'left', this.element.scrollLeft - this.lastScrollLeft);
|
|
1251
1057
|
this.lastScrollTop = Math.floor(this.element.scrollTop);
|
|
1252
1058
|
this.lastScrollLeft = this.element.scrollLeft;
|
|
1253
1059
|
};
|
|
1254
|
-
|
|
1255
1060
|
PerfectScrollbar.prototype.destroy = function destroy() {
|
|
1256
1061
|
if (!this.isAlive) {
|
|
1257
1062
|
return;
|
|
1258
1063
|
}
|
|
1259
|
-
|
|
1260
1064
|
this.event.unbindAll();
|
|
1261
1065
|
remove(this.scrollbarX);
|
|
1262
1066
|
remove(this.scrollbarY);
|
|
1263
1067
|
remove(this.scrollbarXRail);
|
|
1264
1068
|
remove(this.scrollbarYRail);
|
|
1265
|
-
this.removePsClasses();
|
|
1069
|
+
this.removePsClasses();
|
|
1266
1070
|
|
|
1071
|
+
// unset elements
|
|
1267
1072
|
this.element = null;
|
|
1268
1073
|
this.scrollbarX = null;
|
|
1269
1074
|
this.scrollbarY = null;
|
|
@@ -1271,11 +1076,9 @@ PerfectScrollbar.prototype.destroy = function destroy() {
|
|
|
1271
1076
|
this.scrollbarYRail = null;
|
|
1272
1077
|
this.isAlive = false;
|
|
1273
1078
|
};
|
|
1274
|
-
|
|
1275
1079
|
PerfectScrollbar.prototype.removePsClasses = function removePsClasses() {
|
|
1276
1080
|
this.element.className = this.element.className.split(' ').filter(function (name) {
|
|
1277
1081
|
return !name.match(/^ps([-_].+|)$/);
|
|
1278
1082
|
}).join(' ');
|
|
1279
1083
|
};
|
|
1280
|
-
|
|
1281
1084
|
export { PerfectScrollbar as default };
|