1 /* perfect-scrollbar v0.6.10
3 * Copyright (c) 2015 Hyunje Alex Jun and other contributors
4 * Licensed under the MIT License
6 * Source: https://github.com/noraesae/perfect-scrollbar
9 (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
12 var ps = require('../main')
13 , psInstances = require('../plugin/instances');
15 function mountJQuery(jQuery) {
16 jQuery.fn.perfectScrollbar = function (settingOrCommand) {
17 return this.each(function () {
18 if (typeof settingOrCommand === 'object' ||
19 typeof settingOrCommand === 'undefined') {
20 // If it's an object or none, initialize.
21 var settings = settingOrCommand;
23 if (!psInstances.get(this)) {
24 ps.initialize(this, settings);
27 // Unless, it may be a command.
28 var command = settingOrCommand;
30 if (command === 'update') {
32 } else if (command === 'destroy') {
42 if (typeof define === 'function' && define.amd) {
43 // AMD. Register as an anonymous module.
44 define(['jquery'], mountJQuery);
46 var jq = window.jQuery ? window.jQuery : window.$;
47 if (typeof jq !== 'undefined') {
52 module.exports = mountJQuery;
54 },{"../main":7,"../plugin/instances":18}],2:[function(require,module,exports){
57 function oldAdd(element, className) {
58 var classes = element.className.split(' ');
59 if (classes.indexOf(className) < 0) {
60 classes.push(className);
62 element.className = classes.join(' ');
65 function oldRemove(element, className) {
66 var classes = element.className.split(' ');
67 var idx = classes.indexOf(className);
69 classes.splice(idx, 1);
71 element.className = classes.join(' ');
74 exports.add = function (element, className) {
75 if (element.classList) {
76 element.classList.add(className);
78 oldAdd(element, className);
82 exports.remove = function (element, className) {
83 if (element.classList) {
84 element.classList.remove(className);
86 oldRemove(element, className);
90 exports.list = function (element) {
91 if (element.classList) {
92 return Array.prototype.slice.apply(element.classList);
94 return element.className.split(' ');
98 },{}],3:[function(require,module,exports){
103 DOM.e = function (tagName, className) {
104 var element = document.createElement(tagName);
105 element.className = className;
109 DOM.appendTo = function (child, parent) {
110 parent.appendChild(child);
114 function cssGet(element, styleName) {
115 return window.getComputedStyle(element)[styleName];
118 function cssSet(element, styleName, styleValue) {
119 if (typeof styleValue === 'number') {
120 styleValue = styleValue.toString() + 'px';
122 element.style[styleName] = styleValue;
126 function cssMultiSet(element, obj) {
127 for (var key in obj) {
129 if (typeof val === 'number') {
130 val = val.toString() + 'px';
132 element.style[key] = val;
137 DOM.css = function (element, styleNameOrObject, styleValue) {
138 if (typeof styleNameOrObject === 'object') {
139 // multiple set with object
140 return cssMultiSet(element, styleNameOrObject);
142 if (typeof styleValue === 'undefined') {
143 return cssGet(element, styleNameOrObject);
145 return cssSet(element, styleNameOrObject, styleValue);
150 DOM.matches = function (element, query) {
151 if (typeof element.matches !== 'undefined') {
152 return element.matches(query);
154 if (typeof element.matchesSelector !== 'undefined') {
155 return element.matchesSelector(query);
156 } else if (typeof element.webkitMatchesSelector !== 'undefined') {
157 return element.webkitMatchesSelector(query);
158 } else if (typeof element.mozMatchesSelector !== 'undefined') {
159 return element.mozMatchesSelector(query);
160 } else if (typeof element.msMatchesSelector !== 'undefined') {
161 return element.msMatchesSelector(query);
166 DOM.remove = function (element) {
167 if (typeof element.remove !== 'undefined') {
170 if (element.parentNode) {
171 element.parentNode.removeChild(element);
176 DOM.queryChildren = function (element, selector) {
177 return Array.prototype.filter.call(element.childNodes, function (child) {
178 return DOM.matches(child, selector);
182 module.exports = DOM;
184 },{}],4:[function(require,module,exports){
187 var EventElement = function (element) {
188 this.element = element;
192 EventElement.prototype.bind = function (eventName, handler) {
193 if (typeof this.events[eventName] === 'undefined') {
194 this.events[eventName] = [];
196 this.events[eventName].push(handler);
197 this.element.addEventListener(eventName, handler, false);
200 EventElement.prototype.unbind = function (eventName, handler) {
201 var isHandlerProvided = (typeof handler !== 'undefined');
202 this.events[eventName] = this.events[eventName].filter(function (hdlr) {
203 if (isHandlerProvided && hdlr !== handler) {
206 this.element.removeEventListener(eventName, hdlr, false);
211 EventElement.prototype.unbindAll = function () {
212 for (var name in this.events) {
217 var EventManager = function () {
218 this.eventElements = [];
221 EventManager.prototype.eventElement = function (element) {
222 var ee = this.eventElements.filter(function (eventElement) {
223 return eventElement.element === element;
225 if (typeof ee === 'undefined') {
226 ee = new EventElement(element);
227 this.eventElements.push(ee);
232 EventManager.prototype.bind = function (element, eventName, handler) {
233 this.eventElement(element).bind(eventName, handler);
236 EventManager.prototype.unbind = function (element, eventName, handler) {
237 this.eventElement(element).unbind(eventName, handler);
240 EventManager.prototype.unbindAll = function () {
241 for (var i = 0; i < this.eventElements.length; i++) {
242 this.eventElements[i].unbindAll();
246 EventManager.prototype.once = function (element, eventName, handler) {
247 var ee = this.eventElement(element);
248 var onceHandler = function (e) {
249 ee.unbind(eventName, onceHandler);
252 ee.bind(eventName, onceHandler);
255 module.exports = EventManager;
257 },{}],5:[function(require,module,exports){
260 module.exports = (function () {
262 return Math.floor((1 + Math.random()) * 0x10000)
267 return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
268 s4() + '-' + s4() + s4() + s4();
272 },{}],6:[function(require,module,exports){
275 var cls = require('./class')
276 , d = require('./dom');
278 exports.toInt = function (x) {
279 return parseInt(x, 10) || 0;
282 exports.clone = function (obj) {
285 } else if (typeof obj === 'object') {
287 for (var key in obj) {
288 result[key] = this.clone(obj[key]);
296 exports.extend = function (original, source) {
297 var result = this.clone(original);
298 for (var key in source) {
299 result[key] = this.clone(source[key]);
304 exports.isEditable = function (el) {
305 return d.matches(el, "input,[contenteditable]") ||
306 d.matches(el, "select,[contenteditable]") ||
307 d.matches(el, "textarea,[contenteditable]") ||
308 d.matches(el, "button,[contenteditable]");
311 exports.removePsClasses = function (element) {
312 var clsList = cls.list(element);
313 for (var i = 0; i < clsList.length; i++) {
314 var className = clsList[i];
315 if (className.indexOf('ps-') === 0) {
316 cls.remove(element, className);
321 exports.outerWidth = function (element) {
322 return this.toInt(d.css(element, 'width')) +
323 this.toInt(d.css(element, 'paddingLeft')) +
324 this.toInt(d.css(element, 'paddingRight')) +
325 this.toInt(d.css(element, 'borderLeftWidth')) +
326 this.toInt(d.css(element, 'borderRightWidth'));
329 exports.startScrolling = function (element, axis) {
330 cls.add(element, 'ps-in-scrolling');
331 if (typeof axis !== 'undefined') {
332 cls.add(element, 'ps-' + axis);
334 cls.add(element, 'ps-x');
335 cls.add(element, 'ps-y');
339 exports.stopScrolling = function (element, axis) {
340 cls.remove(element, 'ps-in-scrolling');
341 if (typeof axis !== 'undefined') {
342 cls.remove(element, 'ps-' + axis);
344 cls.remove(element, 'ps-x');
345 cls.remove(element, 'ps-y');
350 isWebKit: 'WebkitAppearance' in document.documentElement.style,
351 supportsTouch: (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch),
352 supportsIePointer: window.navigator.msMaxTouchPoints !== null
355 },{"./class":2,"./dom":3}],7:[function(require,module,exports){
358 var destroy = require('./plugin/destroy')
359 , initialize = require('./plugin/initialize')
360 , update = require('./plugin/update');
363 initialize: initialize,
368 },{"./plugin/destroy":9,"./plugin/initialize":17,"./plugin/update":21}],8:[function(require,module,exports){
372 maxScrollbarLength: null,
373 minScrollbarLength: null,
374 scrollXMarginOffset: 0,
375 scrollYMarginOffset: 0,
376 stopPropagationOnClick: true,
377 suppressScrollX: false,
378 suppressScrollY: false,
379 swipePropagation: true,
380 useBothWheelAxes: false,
382 useSelectionScroll: false,
383 wheelPropagation: false,
388 },{}],9:[function(require,module,exports){
391 var d = require('../lib/dom')
392 , h = require('../lib/helper')
393 , instances = require('./instances');
395 module.exports = function (element) {
396 var i = instances.get(element);
403 d.remove(i.scrollbarX);
404 d.remove(i.scrollbarY);
405 d.remove(i.scrollbarXRail);
406 d.remove(i.scrollbarYRail);
407 h.removePsClasses(element);
409 instances.remove(element);
412 },{"../lib/dom":3,"../lib/helper":6,"./instances":18}],10:[function(require,module,exports){
415 var h = require('../../lib/helper')
416 , instances = require('../instances')
417 , updateGeometry = require('../update-geometry')
418 , updateScroll = require('../update-scroll');
420 function bindClickRailHandler(element, i) {
421 function pageOffset(el) {
422 return el.getBoundingClientRect();
424 var stopPropagation = window.Event.prototype.stopPropagation.bind;
426 if (i.settings.stopPropagationOnClick) {
427 i.event.bind(i.scrollbarY, 'click', stopPropagation);
429 i.event.bind(i.scrollbarYRail, 'click', function (e) {
430 var halfOfScrollbarLength = h.toInt(i.scrollbarYHeight / 2);
431 var positionTop = i.railYRatio * (e.pageY - window.pageYOffset - pageOffset(i.scrollbarYRail).top - halfOfScrollbarLength);
432 var maxPositionTop = i.railYRatio * (i.railYHeight - i.scrollbarYHeight);
433 var positionRatio = positionTop / maxPositionTop;
435 if (positionRatio < 0) {
437 } else if (positionRatio > 1) {
441 updateScroll(element, 'top', (i.contentHeight - i.containerHeight) * positionRatio);
442 updateGeometry(element);
447 if (i.settings.stopPropagationOnClick) {
448 i.event.bind(i.scrollbarX, 'click', stopPropagation);
450 i.event.bind(i.scrollbarXRail, 'click', function (e) {
451 var halfOfScrollbarLength = h.toInt(i.scrollbarXWidth / 2);
452 var positionLeft = i.railXRatio * (e.pageX - window.pageXOffset - pageOffset(i.scrollbarXRail).left - halfOfScrollbarLength);
453 var maxPositionLeft = i.railXRatio * (i.railXWidth - i.scrollbarXWidth);
454 var positionRatio = positionLeft / maxPositionLeft;
456 if (positionRatio < 0) {
458 } else if (positionRatio > 1) {
462 updateScroll(element, 'left', ((i.contentWidth - i.containerWidth) * positionRatio) - i.negativeScrollAdjustment);
463 updateGeometry(element);
469 module.exports = function (element) {
470 var i = instances.get(element);
471 bindClickRailHandler(element, i);
474 },{"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],11:[function(require,module,exports){
477 var d = require('../../lib/dom')
478 , h = require('../../lib/helper')
479 , instances = require('../instances')
480 , updateGeometry = require('../update-geometry')
481 , updateScroll = require('../update-scroll');
483 function bindMouseScrollXHandler(element, i) {
484 var currentLeft = null;
485 var currentPageX = null;
487 function updateScrollLeft(deltaX) {
488 var newLeft = currentLeft + (deltaX * i.railXRatio);
489 var maxLeft = Math.max(0, i.scrollbarXRail.getBoundingClientRect().left) + (i.railXRatio * (i.railXWidth - i.scrollbarXWidth));
492 i.scrollbarXLeft = 0;
493 } else if (newLeft > maxLeft) {
494 i.scrollbarXLeft = maxLeft;
496 i.scrollbarXLeft = newLeft;
499 var scrollLeft = h.toInt(i.scrollbarXLeft * (i.contentWidth - i.containerWidth) / (i.containerWidth - (i.railXRatio * i.scrollbarXWidth))) - i.negativeScrollAdjustment;
500 updateScroll(element, 'left', scrollLeft);
503 var mouseMoveHandler = function (e) {
504 updateScrollLeft(e.pageX - currentPageX);
505 updateGeometry(element);
510 var mouseUpHandler = function () {
511 h.stopScrolling(element, 'x');
512 i.event.unbind(i.ownerDocument, 'mousemove', mouseMoveHandler);
515 i.event.bind(i.scrollbarX, 'mousedown', function (e) {
516 currentPageX = e.pageX;
517 currentLeft = h.toInt(d.css(i.scrollbarX, 'left')) * i.railXRatio;
518 h.startScrolling(element, 'x');
520 i.event.bind(i.ownerDocument, 'mousemove', mouseMoveHandler);
521 i.event.once(i.ownerDocument, 'mouseup', mouseUpHandler);
528 function bindMouseScrollYHandler(element, i) {
529 var currentTop = null;
530 var currentPageY = null;
532 function updateScrollTop(deltaY) {
533 var newTop = currentTop + (deltaY * i.railYRatio);
534 var maxTop = Math.max(0, i.scrollbarYRail.getBoundingClientRect().top) + (i.railYRatio * (i.railYHeight - i.scrollbarYHeight));
538 } else if (newTop > maxTop) {
539 i.scrollbarYTop = maxTop;
541 i.scrollbarYTop = newTop;
544 var scrollTop = h.toInt(i.scrollbarYTop * (i.contentHeight - i.containerHeight) / (i.containerHeight - (i.railYRatio * i.scrollbarYHeight)));
545 updateScroll(element, 'top', scrollTop);
548 var mouseMoveHandler = function (e) {
549 updateScrollTop(e.pageY - currentPageY);
550 updateGeometry(element);
555 var mouseUpHandler = function () {
556 h.stopScrolling(element, 'y');
557 i.event.unbind(i.ownerDocument, 'mousemove', mouseMoveHandler);
560 i.event.bind(i.scrollbarY, 'mousedown', function (e) {
561 currentPageY = e.pageY;
562 currentTop = h.toInt(d.css(i.scrollbarY, 'top')) * i.railYRatio;
563 h.startScrolling(element, 'y');
565 i.event.bind(i.ownerDocument, 'mousemove', mouseMoveHandler);
566 i.event.once(i.ownerDocument, 'mouseup', mouseUpHandler);
573 module.exports = function (element) {
574 var i = instances.get(element);
575 bindMouseScrollXHandler(element, i);
576 bindMouseScrollYHandler(element, i);
579 },{"../../lib/dom":3,"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],12:[function(require,module,exports){
582 var h = require('../../lib/helper')
583 , d = require('../../lib/dom')
584 , instances = require('../instances')
585 , updateGeometry = require('../update-geometry')
586 , updateScroll = require('../update-scroll');
588 function bindKeyboardHandler(element, i) {
590 i.event.bind(element, 'mouseenter', function () {
593 i.event.bind(element, 'mouseleave', function () {
597 var shouldPrevent = false;
598 function shouldPreventDefault(deltaX, deltaY) {
599 var scrollTop = element.scrollTop;
601 if (!i.scrollbarYActive) {
604 if ((scrollTop === 0 && deltaY > 0) || (scrollTop >= i.contentHeight - i.containerHeight && deltaY < 0)) {
605 return !i.settings.wheelPropagation;
609 var scrollLeft = element.scrollLeft;
611 if (!i.scrollbarXActive) {
614 if ((scrollLeft === 0 && deltaX < 0) || (scrollLeft >= i.contentWidth - i.containerWidth && deltaX > 0)) {
615 return !i.settings.wheelPropagation;
621 i.event.bind(i.ownerDocument, 'keydown', function (e) {
622 if (e.isDefaultPrevented && e.isDefaultPrevented()) {
626 var focused = d.matches(i.scrollbarX, ':focus') ||
627 d.matches(i.scrollbarY, ':focus');
629 if (!hovered && !focused) {
633 var activeElement = document.activeElement ? document.activeElement : i.ownerDocument.activeElement;
635 // go deeper if element is a webcomponent
636 while (activeElement.shadowRoot) {
637 activeElement = activeElement.shadowRoot.activeElement;
639 if (h.isEditable(activeElement)) {
663 case 32: // space bar
670 case 34: // page down
675 deltaY = -i.contentHeight;
677 deltaY = -i.containerHeight;
682 deltaY = element.scrollTop;
684 deltaY = i.containerHeight;
691 updateScroll(element, 'top', element.scrollTop - deltaY);
692 updateScroll(element, 'left', element.scrollLeft + deltaX);
693 updateGeometry(element);
695 shouldPrevent = shouldPreventDefault(deltaX, deltaY);
702 module.exports = function (element) {
703 var i = instances.get(element);
704 bindKeyboardHandler(element, i);
707 },{"../../lib/dom":3,"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],13:[function(require,module,exports){
710 var instances = require('../instances')
711 , updateGeometry = require('../update-geometry')
712 , updateScroll = require('../update-scroll');
714 function bindMouseWheelHandler(element, i) {
715 var shouldPrevent = false;
717 function shouldPreventDefault(deltaX, deltaY) {
718 var scrollTop = element.scrollTop;
720 if (!i.scrollbarYActive) {
723 if ((scrollTop === 0 && deltaY > 0) || (scrollTop >= i.contentHeight - i.containerHeight && deltaY < 0)) {
724 return !i.settings.wheelPropagation;
728 var scrollLeft = element.scrollLeft;
730 if (!i.scrollbarXActive) {
733 if ((scrollLeft === 0 && deltaX < 0) || (scrollLeft >= i.contentWidth - i.containerWidth && deltaX > 0)) {
734 return !i.settings.wheelPropagation;
740 function getDeltaFromEvent(e) {
741 var deltaX = e.deltaX;
742 var deltaY = -1 * e.deltaY;
744 if (typeof deltaX === "undefined" || typeof deltaY === "undefined") {
746 deltaX = -1 * e.wheelDeltaX / 6;
747 deltaY = e.wheelDeltaY / 6;
750 if (e.deltaMode && e.deltaMode === 1) {
751 // Firefox in deltaMode 1: Line scrolling
756 if (deltaX !== deltaX && deltaY !== deltaY/* NaN checks */) {
757 // IE in some mouse drivers
759 deltaY = e.wheelDelta;
762 return [deltaX, deltaY];
765 function shouldBeConsumedByTextarea(deltaX, deltaY) {
766 var hoveredTextarea = element.querySelector('textarea:hover');
767 if (hoveredTextarea) {
768 var maxScrollTop = hoveredTextarea.scrollHeight - hoveredTextarea.clientHeight;
769 if (maxScrollTop > 0) {
770 if (!(hoveredTextarea.scrollTop === 0 && deltaY > 0) &&
771 !(hoveredTextarea.scrollTop === maxScrollTop && deltaY < 0)) {
775 var maxScrollLeft = hoveredTextarea.scrollLeft - hoveredTextarea.clientWidth;
776 if (maxScrollLeft > 0) {
777 if (!(hoveredTextarea.scrollLeft === 0 && deltaX < 0) &&
778 !(hoveredTextarea.scrollLeft === maxScrollLeft && deltaX > 0)) {
786 function mousewheelHandler(e) {
787 var delta = getDeltaFromEvent(e);
789 var deltaX = delta[0];
790 var deltaY = delta[1];
792 if (shouldBeConsumedByTextarea(deltaX, deltaY)) {
796 shouldPrevent = false;
797 if (!i.settings.useBothWheelAxes) {
798 // deltaX will only be used for horizontal scrolling and deltaY will
799 // only be used for vertical scrolling - this is the default
800 updateScroll(element, 'top', element.scrollTop - (deltaY * i.settings.wheelSpeed));
801 updateScroll(element, 'left', element.scrollLeft + (deltaX * i.settings.wheelSpeed));
802 } else if (i.scrollbarYActive && !i.scrollbarXActive) {
803 // only vertical scrollbar is active and useBothWheelAxes option is
804 // active, so let's scroll vertical bar using both mouse wheel axes
806 updateScroll(element, 'top', element.scrollTop - (deltaY * i.settings.wheelSpeed));
808 updateScroll(element, 'top', element.scrollTop + (deltaX * i.settings.wheelSpeed));
810 shouldPrevent = true;
811 } else if (i.scrollbarXActive && !i.scrollbarYActive) {
812 // useBothWheelAxes and only horizontal bar is active, so use both
813 // wheel axes for horizontal bar
815 updateScroll(element, 'left', element.scrollLeft + (deltaX * i.settings.wheelSpeed));
817 updateScroll(element, 'left', element.scrollLeft - (deltaY * i.settings.wheelSpeed));
819 shouldPrevent = true;
822 updateGeometry(element);
824 shouldPrevent = (shouldPrevent || shouldPreventDefault(deltaX, deltaY));
831 if (typeof window.onwheel !== "undefined") {
832 i.event.bind(element, 'wheel', mousewheelHandler);
833 } else if (typeof window.onmousewheel !== "undefined") {
834 i.event.bind(element, 'mousewheel', mousewheelHandler);
838 module.exports = function (element) {
839 var i = instances.get(element);
840 bindMouseWheelHandler(element, i);
843 },{"../instances":18,"../update-geometry":19,"../update-scroll":20}],14:[function(require,module,exports){
846 var instances = require('../instances')
847 , updateGeometry = require('../update-geometry');
849 function bindNativeScrollHandler(element, i) {
850 i.event.bind(element, 'scroll', function () {
851 updateGeometry(element);
855 module.exports = function (element) {
856 var i = instances.get(element);
857 bindNativeScrollHandler(element, i);
860 },{"../instances":18,"../update-geometry":19}],15:[function(require,module,exports){
863 var h = require('../../lib/helper')
864 , instances = require('../instances')
865 , updateGeometry = require('../update-geometry')
866 , updateScroll = require('../update-scroll');
868 function bindSelectionHandler(element, i) {
869 function getRangeNode() {
870 var selection = window.getSelection ? window.getSelection() :
871 document.getSelection ? document.getSelection() : '';
872 if (selection.toString().length === 0) {
875 return selection.getRangeAt(0).commonAncestorContainer;
879 var scrollingLoop = null;
880 var scrollDiff = {top: 0, left: 0};
881 function startScrolling() {
882 if (!scrollingLoop) {
883 scrollingLoop = setInterval(function () {
884 if (!instances.get(element)) {
885 clearInterval(scrollingLoop);
889 updateScroll(element, 'top', element.scrollTop + scrollDiff.top);
890 updateScroll(element, 'left', element.scrollLeft + scrollDiff.left);
891 updateGeometry(element);
892 }, 50); // every .1 sec
895 function stopScrolling() {
897 clearInterval(scrollingLoop);
898 scrollingLoop = null;
900 h.stopScrolling(element);
903 var isSelected = false;
904 i.event.bind(i.ownerDocument, 'selectionchange', function () {
905 if (element.contains(getRangeNode())) {
912 i.event.bind(window, 'mouseup', function () {
919 i.event.bind(window, 'mousemove', function (e) {
921 var mousePosition = {x: e.pageX, y: e.pageY};
922 var containerGeometry = {
923 left: element.offsetLeft,
924 right: element.offsetLeft + element.offsetWidth,
925 top: element.offsetTop,
926 bottom: element.offsetTop + element.offsetHeight
929 if (mousePosition.x < containerGeometry.left + 3) {
930 scrollDiff.left = -5;
931 h.startScrolling(element, 'x');
932 } else if (mousePosition.x > containerGeometry.right - 3) {
934 h.startScrolling(element, 'x');
939 if (mousePosition.y < containerGeometry.top + 3) {
940 if (containerGeometry.top + 3 - mousePosition.y < 5) {
943 scrollDiff.top = -20;
945 h.startScrolling(element, 'y');
946 } else if (mousePosition.y > containerGeometry.bottom - 3) {
947 if (mousePosition.y - containerGeometry.bottom + 3 < 5) {
952 h.startScrolling(element, 'y');
957 if (scrollDiff.top === 0 && scrollDiff.left === 0) {
966 module.exports = function (element) {
967 var i = instances.get(element);
968 bindSelectionHandler(element, i);
971 },{"../../lib/helper":6,"../instances":18,"../update-geometry":19,"../update-scroll":20}],16:[function(require,module,exports){
974 var instances = require('../instances')
975 , updateGeometry = require('../update-geometry')
976 , updateScroll = require('../update-scroll');
978 function bindTouchHandler(element, i, supportsTouch, supportsIePointer) {
979 function shouldPreventDefault(deltaX, deltaY) {
980 var scrollTop = element.scrollTop;
981 var scrollLeft = element.scrollLeft;
982 var magnitudeX = Math.abs(deltaX);
983 var magnitudeY = Math.abs(deltaY);
985 if (magnitudeY > magnitudeX) {
986 // user is perhaps trying to swipe up/down the page
988 if (((deltaY < 0) && (scrollTop === i.contentHeight - i.containerHeight)) ||
989 ((deltaY > 0) && (scrollTop === 0))) {
990 return !i.settings.swipePropagation;
992 } else if (magnitudeX > magnitudeY) {
993 // user is perhaps trying to swipe left/right across the page
995 if (((deltaX < 0) && (scrollLeft === i.contentWidth - i.containerWidth)) ||
996 ((deltaX > 0) && (scrollLeft === 0))) {
997 return !i.settings.swipePropagation;
1004 function applyTouchMove(differenceX, differenceY) {
1005 updateScroll(element, 'top', element.scrollTop - differenceY);
1006 updateScroll(element, 'left', element.scrollLeft - differenceX);
1008 updateGeometry(element);
1011 var startOffset = {};
1014 var easingLoop = null;
1015 var inGlobalTouch = false;
1016 var inLocalTouch = false;
1018 function globalTouchStart() {
1019 inGlobalTouch = true;
1021 function globalTouchEnd() {
1022 inGlobalTouch = false;
1025 function getTouch(e) {
1026 if (e.targetTouches) {
1027 return e.targetTouches[0];
1033 function shouldHandle(e) {
1034 if (e.targetTouches && e.targetTouches.length === 1) {
1037 if (e.pointerType && e.pointerType !== 'mouse' && e.pointerType !== e.MSPOINTER_TYPE_MOUSE) {
1042 function touchStart(e) {
1043 if (shouldHandle(e)) {
1044 inLocalTouch = true;
1046 var touch = getTouch(e);
1048 startOffset.pageX = touch.pageX;
1049 startOffset.pageY = touch.pageY;
1051 startTime = (new Date()).getTime();
1053 if (easingLoop !== null) {
1054 clearInterval(easingLoop);
1057 e.stopPropagation();
1060 function touchMove(e) {
1061 if (!inGlobalTouch && inLocalTouch && shouldHandle(e)) {
1062 var touch = getTouch(e);
1064 var currentOffset = {pageX: touch.pageX, pageY: touch.pageY};
1066 var differenceX = currentOffset.pageX - startOffset.pageX;
1067 var differenceY = currentOffset.pageY - startOffset.pageY;
1069 applyTouchMove(differenceX, differenceY);
1070 startOffset = currentOffset;
1072 var currentTime = (new Date()).getTime();
1074 var timeGap = currentTime - startTime;
1076 speed.x = differenceX / timeGap;
1077 speed.y = differenceY / timeGap;
1078 startTime = currentTime;
1081 if (shouldPreventDefault(differenceX, differenceY)) {
1082 e.stopPropagation();
1087 function touchEnd() {
1088 if (!inGlobalTouch && inLocalTouch) {
1089 inLocalTouch = false;
1091 clearInterval(easingLoop);
1092 easingLoop = setInterval(function () {
1093 if (!instances.get(element)) {
1094 clearInterval(easingLoop);
1098 if (Math.abs(speed.x) < 0.01 && Math.abs(speed.y) < 0.01) {
1099 clearInterval(easingLoop);
1103 applyTouchMove(speed.x * 30, speed.y * 30);
1111 if (supportsTouch) {
1112 i.event.bind(window, 'touchstart', globalTouchStart);
1113 i.event.bind(window, 'touchend', globalTouchEnd);
1114 i.event.bind(element, 'touchstart', touchStart);
1115 i.event.bind(element, 'touchmove', touchMove);
1116 i.event.bind(element, 'touchend', touchEnd);
1119 if (supportsIePointer) {
1120 if (window.PointerEvent) {
1121 i.event.bind(window, 'pointerdown', globalTouchStart);
1122 i.event.bind(window, 'pointerup', globalTouchEnd);
1123 i.event.bind(element, 'pointerdown', touchStart);
1124 i.event.bind(element, 'pointermove', touchMove);
1125 i.event.bind(element, 'pointerup', touchEnd);
1126 } else if (window.MSPointerEvent) {
1127 i.event.bind(window, 'MSPointerDown', globalTouchStart);
1128 i.event.bind(window, 'MSPointerUp', globalTouchEnd);
1129 i.event.bind(element, 'MSPointerDown', touchStart);
1130 i.event.bind(element, 'MSPointerMove', touchMove);
1131 i.event.bind(element, 'MSPointerUp', touchEnd);
1136 module.exports = function (element, supportsTouch, supportsIePointer) {
1137 var i = instances.get(element);
1138 bindTouchHandler(element, i, supportsTouch, supportsIePointer);
1141 },{"../instances":18,"../update-geometry":19,"../update-scroll":20}],17:[function(require,module,exports){
1144 var cls = require('../lib/class')
1145 , h = require('../lib/helper')
1146 , instances = require('./instances')
1147 , updateGeometry = require('./update-geometry');
1150 var clickRailHandler = require('./handler/click-rail')
1151 , dragScrollbarHandler = require('./handler/drag-scrollbar')
1152 , keyboardHandler = require('./handler/keyboard')
1153 , mouseWheelHandler = require('./handler/mouse-wheel')
1154 , nativeScrollHandler = require('./handler/native-scroll')
1155 , selectionHandler = require('./handler/selection')
1156 , touchHandler = require('./handler/touch');
1158 module.exports = function (element, userSettings) {
1159 userSettings = typeof userSettings === 'object' ? userSettings : {};
1161 cls.add(element, 'ps-container');
1163 // Create a plugin instance.
1164 var i = instances.add(element);
1166 i.settings = h.extend(i.settings, userSettings);
1167 cls.add(element, 'ps-theme-' + i.settings.theme);
1169 clickRailHandler(element);
1170 dragScrollbarHandler(element);
1171 mouseWheelHandler(element);
1172 nativeScrollHandler(element);
1174 if (i.settings.useSelectionScroll) {
1175 selectionHandler(element);
1178 if (h.env.supportsTouch || h.env.supportsIePointer) {
1179 touchHandler(element, h.env.supportsTouch, h.env.supportsIePointer);
1181 if (i.settings.useKeyboard) {
1182 keyboardHandler(element);
1185 updateGeometry(element);
1188 },{"../lib/class":2,"../lib/helper":6,"./handler/click-rail":10,"./handler/drag-scrollbar":11,"./handler/keyboard":12,"./handler/mouse-wheel":13,"./handler/native-scroll":14,"./handler/selection":15,"./handler/touch":16,"./instances":18,"./update-geometry":19}],18:[function(require,module,exports){
1191 var cls = require('../lib/class')
1192 , d = require('../lib/dom')
1193 , defaultSettings = require('./default-setting')
1194 , EventManager = require('../lib/event-manager')
1195 , guid = require('../lib/guid')
1196 , h = require('../lib/helper');
1200 function Instance(element) {
1203 i.settings = h.clone(defaultSettings);
1204 i.containerWidth = null;
1205 i.containerHeight = null;
1206 i.contentWidth = null;
1207 i.contentHeight = null;
1209 i.isRtl = d.css(element, 'direction') === "rtl";
1210 i.isNegativeScroll = (function () {
1211 var originalScrollLeft = element.scrollLeft;
1213 element.scrollLeft = -1;
1214 result = element.scrollLeft < 0;
1215 element.scrollLeft = originalScrollLeft;
1218 i.negativeScrollAdjustment = i.isNegativeScroll ? element.scrollWidth - element.clientWidth : 0;
1219 i.event = new EventManager();
1220 i.ownerDocument = element.ownerDocument || document;
1223 cls.add(element, 'ps-focus');
1227 cls.remove(element, 'ps-focus');
1230 i.scrollbarXRail = d.appendTo(d.e('div', 'ps-scrollbar-x-rail'), element);
1231 i.scrollbarX = d.appendTo(d.e('div', 'ps-scrollbar-x'), i.scrollbarXRail);
1232 i.scrollbarX.setAttribute('tabindex', 0);
1233 i.event.bind(i.scrollbarX, 'focus', focus);
1234 i.event.bind(i.scrollbarX, 'blur', blur);
1235 i.scrollbarXActive = null;
1236 i.scrollbarXWidth = null;
1237 i.scrollbarXLeft = null;
1238 i.scrollbarXBottom = h.toInt(d.css(i.scrollbarXRail, 'bottom'));
1239 i.isScrollbarXUsingBottom = i.scrollbarXBottom === i.scrollbarXBottom; // !isNaN
1240 i.scrollbarXTop = i.isScrollbarXUsingBottom ? null : h.toInt(d.css(i.scrollbarXRail, 'top'));
1241 i.railBorderXWidth = h.toInt(d.css(i.scrollbarXRail, 'borderLeftWidth')) + h.toInt(d.css(i.scrollbarXRail, 'borderRightWidth'));
1242 // Set rail to display:block to calculate margins
1243 d.css(i.scrollbarXRail, 'display', 'block');
1244 i.railXMarginWidth = h.toInt(d.css(i.scrollbarXRail, 'marginLeft')) + h.toInt(d.css(i.scrollbarXRail, 'marginRight'));
1245 d.css(i.scrollbarXRail, 'display', '');
1246 i.railXWidth = null;
1247 i.railXRatio = null;
1249 i.scrollbarYRail = d.appendTo(d.e('div', 'ps-scrollbar-y-rail'), element);
1250 i.scrollbarY = d.appendTo(d.e('div', 'ps-scrollbar-y'), i.scrollbarYRail);
1251 i.scrollbarY.setAttribute('tabindex', 0);
1252 i.event.bind(i.scrollbarY, 'focus', focus);
1253 i.event.bind(i.scrollbarY, 'blur', blur);
1254 i.scrollbarYActive = null;
1255 i.scrollbarYHeight = null;
1256 i.scrollbarYTop = null;
1257 i.scrollbarYRight = h.toInt(d.css(i.scrollbarYRail, 'right'));
1258 i.isScrollbarYUsingRight = i.scrollbarYRight === i.scrollbarYRight; // !isNaN
1259 i.scrollbarYLeft = i.isScrollbarYUsingRight ? null : h.toInt(d.css(i.scrollbarYRail, 'left'));
1260 i.scrollbarYOuterWidth = i.isRtl ? h.outerWidth(i.scrollbarY) : null;
1261 i.railBorderYWidth = h.toInt(d.css(i.scrollbarYRail, 'borderTopWidth')) + h.toInt(d.css(i.scrollbarYRail, 'borderBottomWidth'));
1262 d.css(i.scrollbarYRail, 'display', 'block');
1263 i.railYMarginHeight = h.toInt(d.css(i.scrollbarYRail, 'marginTop')) + h.toInt(d.css(i.scrollbarYRail, 'marginBottom'));
1264 d.css(i.scrollbarYRail, 'display', '');
1265 i.railYHeight = null;
1266 i.railYRatio = null;
1269 function getId(element) {
1270 if (typeof element.dataset === 'undefined') {
1271 return element.getAttribute('data-ps-id');
1273 return element.dataset.psId;
1277 function setId(element, id) {
1278 if (typeof element.dataset === 'undefined') {
1279 element.setAttribute('data-ps-id', id);
1281 element.dataset.psId = id;
1285 function removeId(element) {
1286 if (typeof element.dataset === 'undefined') {
1287 element.removeAttribute('data-ps-id');
1289 delete element.dataset.psId;
1293 exports.add = function (element) {
1295 setId(element, newId);
1296 instances[newId] = new Instance(element);
1297 return instances[newId];
1300 exports.remove = function (element) {
1301 delete instances[getId(element)];
1305 exports.get = function (element) {
1306 return instances[getId(element)];
1309 },{"../lib/class":2,"../lib/dom":3,"../lib/event-manager":4,"../lib/guid":5,"../lib/helper":6,"./default-setting":8}],19:[function(require,module,exports){
1312 var cls = require('../lib/class')
1313 , d = require('../lib/dom')
1314 , h = require('../lib/helper')
1315 , instances = require('./instances')
1316 , updateScroll = require('./update-scroll');
1318 function getThumbSize(i, thumbSize) {
1319 if (i.settings.minScrollbarLength) {
1320 thumbSize = Math.max(thumbSize, i.settings.minScrollbarLength);
1322 if (i.settings.maxScrollbarLength) {
1323 thumbSize = Math.min(thumbSize, i.settings.maxScrollbarLength);
1328 function updateCss(element, i) {
1329 var xRailOffset = {width: i.railXWidth};
1331 xRailOffset.left = i.negativeScrollAdjustment + element.scrollLeft + i.containerWidth - i.contentWidth;
1333 xRailOffset.left = element.scrollLeft;
1335 if (i.isScrollbarXUsingBottom) {
1336 xRailOffset.bottom = i.scrollbarXBottom - element.scrollTop;
1338 xRailOffset.top = i.scrollbarXTop + element.scrollTop;
1340 d.css(i.scrollbarXRail, xRailOffset);
1342 var yRailOffset = {top: element.scrollTop, height: i.railYHeight};
1343 if (i.isScrollbarYUsingRight) {
1345 yRailOffset.right = i.contentWidth - (i.negativeScrollAdjustment + element.scrollLeft) - i.scrollbarYRight - i.scrollbarYOuterWidth;
1347 yRailOffset.right = i.scrollbarYRight - element.scrollLeft;
1351 yRailOffset.left = i.negativeScrollAdjustment + element.scrollLeft + i.containerWidth * 2 - i.contentWidth - i.scrollbarYLeft - i.scrollbarYOuterWidth;
1353 yRailOffset.left = i.scrollbarYLeft + element.scrollLeft;
1356 d.css(i.scrollbarYRail, yRailOffset);
1358 d.css(i.scrollbarX, {left: i.scrollbarXLeft, width: i.scrollbarXWidth - i.railBorderXWidth});
1359 d.css(i.scrollbarY, {top: i.scrollbarYTop, height: i.scrollbarYHeight - i.railBorderYWidth});
1362 module.exports = function (element) {
1363 var i = instances.get(element);
1365 i.containerWidth = element.clientWidth;
1366 i.containerHeight = element.clientHeight;
1367 i.contentWidth = element.scrollWidth;
1368 i.contentHeight = element.scrollHeight;
1371 if (!element.contains(i.scrollbarXRail)) {
1372 existingRails = d.queryChildren(element, '.ps-scrollbar-x-rail');
1373 if (existingRails.length > 0) {
1374 existingRails.forEach(function (rail) {
1378 d.appendTo(i.scrollbarXRail, element);
1380 if (!element.contains(i.scrollbarYRail)) {
1381 existingRails = d.queryChildren(element, '.ps-scrollbar-y-rail');
1382 if (existingRails.length > 0) {
1383 existingRails.forEach(function (rail) {
1387 d.appendTo(i.scrollbarYRail, element);
1390 if (!i.settings.suppressScrollX && i.containerWidth + i.settings.scrollXMarginOffset < i.contentWidth) {
1391 i.scrollbarXActive = true;
1392 i.railXWidth = i.containerWidth - i.railXMarginWidth;
1393 i.railXRatio = i.containerWidth / i.railXWidth;
1394 i.scrollbarXWidth = getThumbSize(i, h.toInt(i.railXWidth * i.containerWidth / i.contentWidth));
1395 i.scrollbarXLeft = h.toInt((i.negativeScrollAdjustment + element.scrollLeft) * (i.railXWidth - i.scrollbarXWidth) / (i.contentWidth - i.containerWidth));
1397 i.scrollbarXActive = false;
1400 if (!i.settings.suppressScrollY && i.containerHeight + i.settings.scrollYMarginOffset < i.contentHeight) {
1401 i.scrollbarYActive = true;
1402 i.railYHeight = i.containerHeight - i.railYMarginHeight;
1403 i.railYRatio = i.containerHeight / i.railYHeight;
1404 i.scrollbarYHeight = getThumbSize(i, h.toInt(i.railYHeight * i.containerHeight / i.contentHeight));
1405 i.scrollbarYTop = h.toInt(element.scrollTop * (i.railYHeight - i.scrollbarYHeight) / (i.contentHeight - i.containerHeight));
1407 i.scrollbarYActive = false;
1410 if (i.scrollbarXLeft >= i.railXWidth - i.scrollbarXWidth) {
1411 i.scrollbarXLeft = i.railXWidth - i.scrollbarXWidth;
1413 if (i.scrollbarYTop >= i.railYHeight - i.scrollbarYHeight) {
1414 i.scrollbarYTop = i.railYHeight - i.scrollbarYHeight;
1417 updateCss(element, i);
1419 if (i.scrollbarXActive) {
1420 cls.add(element, 'ps-active-x');
1422 cls.remove(element, 'ps-active-x');
1423 i.scrollbarXWidth = 0;
1424 i.scrollbarXLeft = 0;
1425 updateScroll(element, 'left', 0);
1427 if (i.scrollbarYActive) {
1428 cls.add(element, 'ps-active-y');
1430 cls.remove(element, 'ps-active-y');
1431 i.scrollbarYHeight = 0;
1432 i.scrollbarYTop = 0;
1433 updateScroll(element, 'top', 0);
1437 },{"../lib/class":2,"../lib/dom":3,"../lib/helper":6,"./instances":18,"./update-scroll":20}],20:[function(require,module,exports){
1440 var instances = require('./instances');
1442 var upEvent = document.createEvent('Event')
1443 , downEvent = document.createEvent('Event')
1444 , leftEvent = document.createEvent('Event')
1445 , rightEvent = document.createEvent('Event')
1446 , yEvent = document.createEvent('Event')
1447 , xEvent = document.createEvent('Event')
1448 , xStartEvent = document.createEvent('Event')
1449 , xEndEvent = document.createEvent('Event')
1450 , yStartEvent = document.createEvent('Event')
1451 , yEndEvent = document.createEvent('Event')
1455 upEvent.initEvent('ps-scroll-up', true, true);
1456 downEvent.initEvent('ps-scroll-down', true, true);
1457 leftEvent.initEvent('ps-scroll-left', true, true);
1458 rightEvent.initEvent('ps-scroll-right', true, true);
1459 yEvent.initEvent('ps-scroll-y', true, true);
1460 xEvent.initEvent('ps-scroll-x', true, true);
1461 xStartEvent.initEvent('ps-x-reach-start', true, true);
1462 xEndEvent.initEvent('ps-x-reach-end', true, true);
1463 yStartEvent.initEvent('ps-y-reach-start', true, true);
1464 yEndEvent.initEvent('ps-y-reach-end', true, true);
1466 module.exports = function (element, axis, value) {
1467 if (typeof element === 'undefined') {
1468 throw 'You must provide an element to the update-scroll function';
1471 if (typeof axis === 'undefined') {
1472 throw 'You must provide an axis to the update-scroll function';
1475 if (typeof value === 'undefined') {
1476 throw 'You must provide a value to the update-scroll function';
1479 if (axis === 'top' && value <= 0) {
1480 element.scrollTop = value = 0; // don't allow negative scroll
1481 element.dispatchEvent(yStartEvent);
1484 if (axis === 'left' && value <= 0) {
1485 element.scrollLeft = value = 0; // don't allow negative scroll
1486 element.dispatchEvent(xStartEvent);
1489 var i = instances.get(element);
1491 if (axis === 'top' && value >= i.contentHeight - i.containerHeight) {
1492 element.scrollTop = value = i.contentHeight - i.containerHeight; // don't allow scroll past container
1493 element.dispatchEvent(yEndEvent);
1496 if (axis === 'left' && value >= i.contentWidth - i.containerWidth) {
1497 element.scrollLeft = value = i.contentWidth - i.containerWidth; // don't allow scroll past container
1498 element.dispatchEvent(xEndEvent);
1502 lastTop = element.scrollTop;
1506 lastLeft = element.scrollLeft;
1509 if (axis === 'top' && value < lastTop) {
1510 element.dispatchEvent(upEvent);
1513 if (axis === 'top' && value > lastTop) {
1514 element.dispatchEvent(downEvent);
1517 if (axis === 'left' && value < lastLeft) {
1518 element.dispatchEvent(leftEvent);
1521 if (axis === 'left' && value > lastLeft) {
1522 element.dispatchEvent(rightEvent);
1525 if (axis === 'top') {
1526 element.scrollTop = lastTop = value;
1527 element.dispatchEvent(yEvent);
1530 if (axis === 'left') {
1531 element.scrollLeft = lastLeft = value;
1532 element.dispatchEvent(xEvent);
1537 },{"./instances":18}],21:[function(require,module,exports){
1540 var d = require('../lib/dom')
1541 , h = require('../lib/helper')
1542 , instances = require('./instances')
1543 , updateGeometry = require('./update-geometry')
1544 , updateScroll = require('./update-scroll');
1546 module.exports = function (element) {
1547 var i = instances.get(element);
1553 // Recalcuate negative scrollLeft adjustment
1554 i.negativeScrollAdjustment = i.isNegativeScroll ? element.scrollWidth - element.clientWidth : 0;
1556 // Recalculate rail margins
1557 d.css(i.scrollbarXRail, 'display', 'block');
1558 d.css(i.scrollbarYRail, 'display', 'block');
1559 i.railXMarginWidth = h.toInt(d.css(i.scrollbarXRail, 'marginLeft')) + h.toInt(d.css(i.scrollbarXRail, 'marginRight'));
1560 i.railYMarginHeight = h.toInt(d.css(i.scrollbarYRail, 'marginTop')) + h.toInt(d.css(i.scrollbarYRail, 'marginBottom'));
1562 // Hide scrollbars not to affect scrollWidth and scrollHeight
1563 d.css(i.scrollbarXRail, 'display', 'none');
1564 d.css(i.scrollbarYRail, 'display', 'none');
1566 updateGeometry(element);
1568 // Update top/left scroll to trigger events
1569 updateScroll(element, 'top', element.scrollTop);
1570 updateScroll(element, 'left', element.scrollLeft);
1572 d.css(i.scrollbarXRail, 'display', '');
1573 d.css(i.scrollbarYRail, 'display', '');
1576 },{"../lib/dom":3,"../lib/helper":6,"./instances":18,"./update-geometry":19,"./update-scroll":20}]},{},[1]);