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