Add frontend assets and plugin bundles
Add the legacy frontend themes, scripts, and plugin assets required by the main SPOTA interfaces.
This commit is contained in:
84
assets/plugins/perfect-scrollbar/src/jquery.mousewheel.js
Normal file
84
assets/plugins/perfect-scrollbar/src/jquery.mousewheel.js
Normal file
@@ -0,0 +1,84 @@
|
||||
/*! Copyright (c) 2011 Brandon Aaron (http://brandonaaron.net)
|
||||
* Licensed under the MIT License (LICENSE.txt).
|
||||
*
|
||||
* Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
|
||||
* Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
|
||||
* Thanks to: Seamus Leahy for adding deltaX and deltaY
|
||||
*
|
||||
* Version: 3.0.6
|
||||
*
|
||||
* Requires: 1.2.2+
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
|
||||
var types = ['DOMMouseScroll', 'mousewheel'];
|
||||
|
||||
if ($.event.fixHooks) {
|
||||
for ( var i=types.length; i; ) {
|
||||
$.event.fixHooks[ types[--i] ] = $.event.mouseHooks;
|
||||
}
|
||||
}
|
||||
|
||||
$.event.special.mousewheel = {
|
||||
setup: function() {
|
||||
if ( this.addEventListener ) {
|
||||
for ( var i=types.length; i; ) {
|
||||
this.addEventListener( types[--i], handler, false );
|
||||
}
|
||||
} else {
|
||||
this.onmousewheel = handler;
|
||||
}
|
||||
},
|
||||
|
||||
teardown: function() {
|
||||
if ( this.removeEventListener ) {
|
||||
for ( var i=types.length; i; ) {
|
||||
this.removeEventListener( types[--i], handler, false );
|
||||
}
|
||||
} else {
|
||||
this.onmousewheel = null;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
$.fn.extend({
|
||||
mousewheel: function(fn) {
|
||||
return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
|
||||
},
|
||||
|
||||
unmousewheel: function(fn) {
|
||||
return this.unbind("mousewheel", fn);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
function handler(event) {
|
||||
var orgEvent = event || window.event, args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true, deltaX = 0, deltaY = 0;
|
||||
event = $.event.fix(orgEvent);
|
||||
event.type = "mousewheel";
|
||||
|
||||
// Old school scrollwheel delta
|
||||
if ( orgEvent.wheelDelta ) { delta = orgEvent.wheelDelta/120; }
|
||||
if ( orgEvent.detail ) { delta = -orgEvent.detail/3; }
|
||||
|
||||
// New school multidimensional scroll (touchpads) deltas
|
||||
deltaY = delta;
|
||||
|
||||
// Gecko
|
||||
if ( orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
|
||||
deltaY = 0;
|
||||
deltaX = -1*delta;
|
||||
}
|
||||
|
||||
// Webkit
|
||||
if ( orgEvent.wheelDeltaY !== undefined ) { deltaY = orgEvent.wheelDeltaY/120; }
|
||||
if ( orgEvent.wheelDeltaX !== undefined ) { deltaX = -1*orgEvent.wheelDeltaX/120; }
|
||||
|
||||
// Add event and delta to the front of the arguments
|
||||
args.unshift(event, delta, deltaX, deltaY);
|
||||
|
||||
return ($.event.dispatch || $.event.handle).apply(this, args);
|
||||
}
|
||||
|
||||
})(jQuery);
|
||||
111
assets/plugins/perfect-scrollbar/src/perfect-scrollbar.css
Normal file
111
assets/plugins/perfect-scrollbar/src/perfect-scrollbar.css
Normal file
@@ -0,0 +1,111 @@
|
||||
.ps-container .ps-scrollbar-x-rail {
|
||||
position: absolute; /* please don't change 'position' */
|
||||
bottom: 3px; /* there must be 'bottom' for ps-scrollbar-x-rail */
|
||||
height: 8px;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity = 0);
|
||||
-o-transition: background-color .2s linear, opacity .2s linear;
|
||||
-webkit-transition: background-color.2s linear, opacity .2s linear;
|
||||
-moz-transition: background-color .2s linear, opacity .2s linear;
|
||||
transition: background-color .2s linear, opacity .2s linear;
|
||||
}
|
||||
|
||||
.ps-container:hover .ps-scrollbar-x-rail,
|
||||
.ps-container.hover .ps-scrollbar-x-rail {
|
||||
opacity: 0.6;
|
||||
filter: alpha(opacity = 60);
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-x-rail:hover,
|
||||
.ps-container .ps-scrollbar-x-rail.hover {
|
||||
background-color: #eee;
|
||||
opacity: 0.9;
|
||||
filter: alpha(opacity = 90);
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-x-rail.in-scrolling {
|
||||
opacity: 0.9;
|
||||
filter: alpha(opacity = 90);
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-y-rail {
|
||||
position: absolute; /* please don't change 'position' */
|
||||
right: 3px; /* there must be 'right' for ps-scrollbar-y-rail */
|
||||
width: 8px;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity = 0);
|
||||
-o-transition: background-color .2s linear, opacity .2s linear;
|
||||
-webkit-transition: background-color.2s linear, opacity .2s linear;
|
||||
-moz-transition: background-color .2s linear, opacity .2s linear;
|
||||
transition: background-color .2s linear, opacity .2s linear;
|
||||
}
|
||||
|
||||
.ps-container:hover .ps-scrollbar-y-rail,
|
||||
.ps-container.hover .ps-scrollbar-y-rail {
|
||||
opacity: 0.6;
|
||||
filter: alpha(opacity = 60);
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-y-rail:hover,
|
||||
.ps-container .ps-scrollbar-y-rail.hover {
|
||||
background-color: #eee;
|
||||
opacity: 0.9;
|
||||
filter: alpha(opacity = 90);
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-y-rail.in-scrolling {
|
||||
opacity: 0.9;
|
||||
filter: alpha(opacity = 90);
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-x {
|
||||
position: absolute; /* please don't change 'position' */
|
||||
bottom: 0; /* there must be 'bottom' for ps-scrollbar-x */
|
||||
height: 8px;
|
||||
background-color: #aaa;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
-o-transition: background-color .2s linear;
|
||||
-webkit-transition: background-color.2s linear;
|
||||
-moz-transition: background-color .2s linear;
|
||||
transition: background-color .2s linear;
|
||||
}
|
||||
|
||||
.ps-container.ie6 .ps-scrollbar-x {
|
||||
font-size: 0; /* fixed scrollbar height in xp sp3 ie6 */
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-x-rail:hover .ps-scrollbar-x,
|
||||
.ps-container .ps-scrollbar-x-rail.hover .ps-scrollbar-x {
|
||||
background-color: #999;
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-y {
|
||||
position: absolute; /* please don't change 'position' */
|
||||
right: 0; /* there must be 'right' for ps-scrollbar-y */
|
||||
width: 8px;
|
||||
background-color: #aaa;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
-o-transition: background-color .2s linear;
|
||||
-webkit-transition: background-color.2s linear;
|
||||
-moz-transition: background-color .2s linear;
|
||||
transition: background-color .2s linear;
|
||||
}
|
||||
|
||||
.ps-container.ie .ps-scrollbar-y {
|
||||
font-size: 0; /* fixed scrollbar height in xp sp3 ie6 */
|
||||
}
|
||||
|
||||
.ps-container .ps-scrollbar-y-rail:hover .ps-scrollbar-y,
|
||||
.ps-container .ps-scrollbar-y-rail.hover .ps-scrollbar-y {
|
||||
background-color: #999;
|
||||
}
|
||||
594
assets/plugins/perfect-scrollbar/src/perfect-scrollbar.js
Normal file
594
assets/plugins/perfect-scrollbar/src/perfect-scrollbar.js
Normal file
@@ -0,0 +1,594 @@
|
||||
/* Copyright (c) 2012 HyeonJe Jun (http://github.com/noraesae)
|
||||
* Licensed under the MIT License
|
||||
*/
|
||||
'use strict';
|
||||
(function (factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(['jquery'], factory);
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
}(function ($) {
|
||||
|
||||
// The default settings for the plugin
|
||||
var defaultSettings = {
|
||||
wheelSpeed: 10,
|
||||
wheelPropagation: false,
|
||||
minScrollbarLength: null,
|
||||
useBothWheelAxes: false,
|
||||
useKeyboard: true
|
||||
};
|
||||
|
||||
$.fn.perfectScrollbar = function (suppliedSettings, option) {
|
||||
|
||||
return this.each(function () {
|
||||
// Use the default settings
|
||||
var settings = $.extend(true, {}, defaultSettings),
|
||||
$this = $(this);
|
||||
|
||||
if (typeof suppliedSettings === "object") {
|
||||
// But over-ride any supplied
|
||||
$.extend(true, settings, suppliedSettings);
|
||||
} else {
|
||||
// If no settings were supplied, then the first param must be the option
|
||||
option = suppliedSettings;
|
||||
}
|
||||
|
||||
// Catch options
|
||||
|
||||
if (option === 'update') {
|
||||
if ($this.data('perfect-scrollbar-update')) {
|
||||
$this.data('perfect-scrollbar-update')();
|
||||
}
|
||||
return $this;
|
||||
}
|
||||
else if (option === 'destroy') {
|
||||
if ($this.data('perfect-scrollbar-destroy')) {
|
||||
$this.data('perfect-scrollbar-destroy')();
|
||||
}
|
||||
return $this;
|
||||
}
|
||||
|
||||
if ($this.data('perfect-scrollbar')) {
|
||||
// if there's already perfect-scrollbar
|
||||
return $this.data('perfect-scrollbar');
|
||||
}
|
||||
|
||||
|
||||
// Or generate new perfectScrollbar
|
||||
|
||||
// Set class to the container
|
||||
$this.addClass('ps-container');
|
||||
|
||||
var $scrollbarXRail = $("<div class='ps-scrollbar-x-rail'></div>").appendTo($this),
|
||||
$scrollbarYRail = $("<div class='ps-scrollbar-y-rail'></div>").appendTo($this),
|
||||
$scrollbarX = $("<div class='ps-scrollbar-x'></div>").appendTo($scrollbarXRail),
|
||||
$scrollbarY = $("<div class='ps-scrollbar-y'></div>").appendTo($scrollbarYRail),
|
||||
scrollbarXActive,
|
||||
scrollbarYActive,
|
||||
containerWidth,
|
||||
containerHeight,
|
||||
contentWidth,
|
||||
contentHeight,
|
||||
scrollbarXWidth,
|
||||
scrollbarXLeft,
|
||||
scrollbarXBottom = parseInt($scrollbarXRail.css('bottom'), 10),
|
||||
scrollbarYHeight,
|
||||
scrollbarYTop,
|
||||
scrollbarYRight = parseInt($scrollbarYRail.css('right'), 10);
|
||||
|
||||
var updateContentScrollTop = function () {
|
||||
var scrollTop = parseInt(scrollbarYTop * (contentHeight - containerHeight) / (containerHeight - scrollbarYHeight), 10);
|
||||
$this.scrollTop(scrollTop);
|
||||
$scrollbarXRail.css({bottom: scrollbarXBottom - scrollTop});
|
||||
};
|
||||
|
||||
var updateContentScrollLeft = function () {
|
||||
var scrollLeft = parseInt(scrollbarXLeft * (contentWidth - containerWidth) / (containerWidth - scrollbarXWidth), 10);
|
||||
$this.scrollLeft(scrollLeft);
|
||||
$scrollbarYRail.css({right: scrollbarYRight - scrollLeft});
|
||||
};
|
||||
|
||||
var getSettingsAdjustedThumbSize = function (thumbSize) {
|
||||
if (settings.minScrollbarLength) {
|
||||
thumbSize = Math.max(thumbSize, settings.minScrollbarLength);
|
||||
}
|
||||
return thumbSize;
|
||||
};
|
||||
|
||||
var updateScrollbarCss = function () {
|
||||
$scrollbarXRail.css({left: $this.scrollLeft(), bottom: scrollbarXBottom - $this.scrollTop(), width: containerWidth});
|
||||
$scrollbarYRail.css({top: $this.scrollTop(), right: scrollbarYRight - $this.scrollLeft(), height: containerHeight});
|
||||
$scrollbarX.css({left: scrollbarXLeft, width: scrollbarXWidth});
|
||||
$scrollbarY.css({top: scrollbarYTop, height: scrollbarYHeight});
|
||||
};
|
||||
|
||||
var updateBarSizeAndPosition = function () {
|
||||
containerWidth = $this.width();
|
||||
containerHeight = $this.height();
|
||||
contentWidth = $this.prop('scrollWidth');
|
||||
contentHeight = $this.prop('scrollHeight');
|
||||
|
||||
if (containerWidth < contentWidth) {
|
||||
scrollbarXActive = true;
|
||||
scrollbarXWidth = getSettingsAdjustedThumbSize(parseInt(containerWidth * containerWidth / contentWidth, 10));
|
||||
scrollbarXLeft = parseInt($this.scrollLeft() * (containerWidth - scrollbarXWidth) / (contentWidth - containerWidth), 10);
|
||||
}
|
||||
else {
|
||||
scrollbarXActive = false;
|
||||
scrollbarXWidth = 0;
|
||||
scrollbarXLeft = 0;
|
||||
$this.scrollLeft(0);
|
||||
}
|
||||
|
||||
if (containerHeight < contentHeight) {
|
||||
scrollbarYActive = true;
|
||||
scrollbarYHeight = getSettingsAdjustedThumbSize(parseInt(containerHeight * containerHeight / contentHeight, 10));
|
||||
scrollbarYTop = parseInt($this.scrollTop() * (containerHeight - scrollbarYHeight) / (contentHeight - containerHeight), 10);
|
||||
}
|
||||
else {
|
||||
scrollbarYActive = false;
|
||||
scrollbarYHeight = 0;
|
||||
scrollbarYTop = 0;
|
||||
$this.scrollTop(0);
|
||||
}
|
||||
|
||||
if (scrollbarYTop >= containerHeight - scrollbarYHeight) {
|
||||
scrollbarYTop = containerHeight - scrollbarYHeight;
|
||||
}
|
||||
if (scrollbarXLeft >= containerWidth - scrollbarXWidth) {
|
||||
scrollbarXLeft = containerWidth - scrollbarXWidth;
|
||||
}
|
||||
|
||||
updateScrollbarCss();
|
||||
};
|
||||
|
||||
var moveBarX = function (currentLeft, deltaX) {
|
||||
var newLeft = currentLeft + deltaX,
|
||||
maxLeft = containerWidth - scrollbarXWidth;
|
||||
|
||||
if (newLeft < 0) {
|
||||
scrollbarXLeft = 0;
|
||||
}
|
||||
else if (newLeft > maxLeft) {
|
||||
scrollbarXLeft = maxLeft;
|
||||
}
|
||||
else {
|
||||
scrollbarXLeft = newLeft;
|
||||
}
|
||||
$scrollbarXRail.css({left: $this.scrollLeft()});
|
||||
$scrollbarX.css({left: scrollbarXLeft});
|
||||
};
|
||||
|
||||
var moveBarY = function (currentTop, deltaY) {
|
||||
var newTop = currentTop + deltaY,
|
||||
maxTop = containerHeight - scrollbarYHeight;
|
||||
|
||||
if (newTop < 0) {
|
||||
scrollbarYTop = 0;
|
||||
}
|
||||
else if (newTop > maxTop) {
|
||||
scrollbarYTop = maxTop;
|
||||
}
|
||||
else {
|
||||
scrollbarYTop = newTop;
|
||||
}
|
||||
$scrollbarYRail.css({top: $this.scrollTop()});
|
||||
$scrollbarY.css({top: scrollbarYTop});
|
||||
};
|
||||
|
||||
var bindMouseScrollXHandler = function () {
|
||||
var currentLeft,
|
||||
currentPageX;
|
||||
|
||||
$scrollbarX.bind('mousedown.perfect-scrollbar', function (e) {
|
||||
currentPageX = e.pageX;
|
||||
currentLeft = $scrollbarX.position().left;
|
||||
$scrollbarXRail.addClass('in-scrolling');
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$(document).bind('mousemove.perfect-scrollbar', function (e) {
|
||||
if ($scrollbarXRail.hasClass('in-scrolling')) {
|
||||
updateContentScrollLeft();
|
||||
moveBarX(currentLeft, e.pageX - currentPageX);
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
$(document).bind('mouseup.perfect-scrollbar', function (e) {
|
||||
if ($scrollbarXRail.hasClass('in-scrolling')) {
|
||||
$scrollbarXRail.removeClass('in-scrolling');
|
||||
}
|
||||
});
|
||||
|
||||
currentLeft =
|
||||
currentPageX = null;
|
||||
};
|
||||
|
||||
var bindMouseScrollYHandler = function () {
|
||||
var currentTop,
|
||||
currentPageY;
|
||||
|
||||
$scrollbarY.bind('mousedown.perfect-scrollbar', function (e) {
|
||||
currentPageY = e.pageY;
|
||||
currentTop = $scrollbarY.position().top;
|
||||
$scrollbarYRail.addClass('in-scrolling');
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$(document).bind('mousemove.perfect-scrollbar', function (e) {
|
||||
if ($scrollbarYRail.hasClass('in-scrolling')) {
|
||||
updateContentScrollTop();
|
||||
moveBarY(currentTop, e.pageY - currentPageY);
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
$(document).bind('mouseup.perfect-scrollbar', function (e) {
|
||||
if ($scrollbarYRail.hasClass('in-scrolling')) {
|
||||
$scrollbarYRail.removeClass('in-scrolling');
|
||||
}
|
||||
});
|
||||
|
||||
currentTop =
|
||||
currentPageY = null;
|
||||
};
|
||||
|
||||
// bind handlers
|
||||
var bindMouseWheelHandler = function () {
|
||||
var shouldPreventDefault = function (deltaX, deltaY) {
|
||||
var scrollTop = $this.scrollTop();
|
||||
if (scrollTop === 0 && deltaY > 0 && deltaX === 0) {
|
||||
return !settings.wheelPropagation;
|
||||
}
|
||||
else if (scrollTop >= contentHeight - containerHeight && deltaY < 0 && deltaX === 0) {
|
||||
return !settings.wheelPropagation;
|
||||
}
|
||||
|
||||
var scrollLeft = $this.scrollLeft();
|
||||
if (scrollLeft === 0 && deltaX < 0 && deltaY === 0) {
|
||||
return !settings.wheelPropagation;
|
||||
}
|
||||
else if (scrollLeft >= contentWidth - containerWidth && deltaX > 0 && deltaY === 0) {
|
||||
return !settings.wheelPropagation;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
var shouldPrevent = false;
|
||||
$this.bind('mousewheel.perfect-scrollbar', function (e, delta, deltaX, deltaY) {
|
||||
if (!settings.useBothWheelAxes) {
|
||||
// deltaX will only be used for horizontal scrolling and deltaY will
|
||||
// only be used for vertical scrolling - this is the default
|
||||
$this.scrollTop($this.scrollTop() - (deltaY * settings.wheelSpeed));
|
||||
$this.scrollLeft($this.scrollLeft() + (deltaX * settings.wheelSpeed));
|
||||
} else if (scrollbarYActive && !scrollbarXActive) {
|
||||
// only vertical scrollbar is active and useBothWheelAxes option is
|
||||
// active, so let's scroll vertical bar using both mouse wheel axes
|
||||
if (deltaY) {
|
||||
$this.scrollTop($this.scrollTop() - (deltaY * settings.wheelSpeed));
|
||||
} else {
|
||||
$this.scrollTop($this.scrollTop() + (deltaX * settings.wheelSpeed));
|
||||
}
|
||||
} else if (scrollbarXActive && !scrollbarYActive) {
|
||||
// useBothWheelAxes and only horizontal bar is active, so use both
|
||||
// wheel axes for horizontal bar
|
||||
if (deltaX) {
|
||||
$this.scrollLeft($this.scrollLeft() + (deltaX * settings.wheelSpeed));
|
||||
} else {
|
||||
$this.scrollLeft($this.scrollLeft() - (deltaY * settings.wheelSpeed));
|
||||
}
|
||||
}
|
||||
|
||||
// update bar position
|
||||
updateBarSizeAndPosition();
|
||||
|
||||
shouldPrevent = shouldPreventDefault(deltaX, deltaY);
|
||||
if (shouldPrevent) {
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
// fix Firefox scroll problem
|
||||
$this.bind('MozMousePixelScroll.perfect-scrollbar', function (e) {
|
||||
if (shouldPrevent) {
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
var bindKeyboardHandler = function () {
|
||||
var shouldPreventDefault = function (deltaX, deltaY) {
|
||||
var scrollTop = $this.scrollTop();
|
||||
if (scrollTop === 0 && deltaY > 0 && deltaX === 0) {
|
||||
return false;
|
||||
}
|
||||
else if (scrollTop >= contentHeight - containerHeight && deltaY < 0 && deltaX === 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var scrollLeft = $this.scrollLeft();
|
||||
if (scrollLeft === 0 && deltaX < 0 && deltaY === 0) {
|
||||
return false;
|
||||
}
|
||||
else if (scrollLeft >= contentWidth - containerWidth && deltaX > 0 && deltaY === 0) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
var hovered = false;
|
||||
$this.bind('mouseenter.perfect-scrollbar', function (e) {
|
||||
hovered = true;
|
||||
});
|
||||
$this.bind('mouseleave.perfect-scrollbar', function (e) {
|
||||
hovered = false;
|
||||
});
|
||||
|
||||
var shouldPrevent = false;
|
||||
$(document).bind('keydown.perfect-scrollbar', function (e) {
|
||||
if (!hovered) {
|
||||
return;
|
||||
}
|
||||
|
||||
var deltaX = 0,
|
||||
deltaY = 0;
|
||||
|
||||
switch (e.which) {
|
||||
case 37: // left
|
||||
deltaX = -3;
|
||||
break;
|
||||
case 38: // up
|
||||
deltaY = 3;
|
||||
break;
|
||||
case 39: // right
|
||||
deltaX = 3;
|
||||
break;
|
||||
case 40: // down
|
||||
deltaY = -3;
|
||||
break;
|
||||
default:
|
||||
return;
|
||||
}
|
||||
|
||||
$this.scrollTop($this.scrollTop() - (deltaY * settings.wheelSpeed));
|
||||
$this.scrollLeft($this.scrollLeft() + (deltaX * settings.wheelSpeed));
|
||||
|
||||
// update bar position
|
||||
updateBarSizeAndPosition();
|
||||
|
||||
shouldPrevent = shouldPreventDefault(deltaX, deltaY);
|
||||
if (shouldPrevent) {
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
var bindRailClickHandler = function () {
|
||||
var stopPropagation = function (e) { e.stopPropagation(); };
|
||||
|
||||
$scrollbarY.bind('click.perfect-scrollbar', stopPropagation);
|
||||
$scrollbarYRail.bind('click.perfect-scrollbar', function (e) {
|
||||
var halfOfScrollbarLength = parseInt(scrollbarYHeight / 2, 10),
|
||||
positionTop = e.pageY - $scrollbarYRail.offset().top - halfOfScrollbarLength,
|
||||
maxPositionTop = containerHeight - scrollbarYHeight,
|
||||
positionRatio = positionTop / maxPositionTop;
|
||||
|
||||
if (positionRatio < 0) {
|
||||
positionRatio = 0;
|
||||
} else if (positionRatio > 1) {
|
||||
positionRatio = 1;
|
||||
}
|
||||
|
||||
$this.scrollTop((contentHeight - containerHeight) * positionRatio);
|
||||
|
||||
// update bar position
|
||||
updateBarSizeAndPosition();
|
||||
});
|
||||
|
||||
$scrollbarX.bind('click.perfect-scrollbar', stopPropagation);
|
||||
$scrollbarXRail.bind('click.perfect-scrollbar', function (e) {
|
||||
var halfOfScrollbarLength = parseInt(scrollbarXWidth / 2, 10),
|
||||
positionLeft = e.pageX - $scrollbarXRail.offset().left - halfOfScrollbarLength,
|
||||
maxPositionLeft = containerWidth - scrollbarXWidth,
|
||||
positionRatio = positionLeft / maxPositionLeft;
|
||||
|
||||
if (positionRatio < 0) {
|
||||
positionRatio = 0;
|
||||
} else if (positionRatio > 1) {
|
||||
positionRatio = 1;
|
||||
}
|
||||
|
||||
$this.scrollLeft((contentWidth - containerWidth) * positionRatio);
|
||||
|
||||
// update bar position
|
||||
updateBarSizeAndPosition();
|
||||
});
|
||||
};
|
||||
|
||||
// bind mobile touch handler
|
||||
var bindMobileTouchHandler = function () {
|
||||
var applyTouchMove = function (differenceX, differenceY) {
|
||||
$this.scrollTop($this.scrollTop() - differenceY);
|
||||
$this.scrollLeft($this.scrollLeft() - differenceX);
|
||||
|
||||
// update bar position
|
||||
updateBarSizeAndPosition();
|
||||
};
|
||||
|
||||
var startCoords = {},
|
||||
startTime = 0,
|
||||
speed = {},
|
||||
breakingProcess = null,
|
||||
inGlobalTouch = false;
|
||||
|
||||
$(window).bind("touchstart.perfect-scrollbar", function (e) {
|
||||
inGlobalTouch = true;
|
||||
});
|
||||
$(window).bind("touchend.perfect-scrollbar", function (e) {
|
||||
inGlobalTouch = false;
|
||||
});
|
||||
|
||||
$this.bind("touchstart.perfect-scrollbar", function (e) {
|
||||
var touch = e.originalEvent.targetTouches[0];
|
||||
|
||||
startCoords.pageX = touch.pageX;
|
||||
startCoords.pageY = touch.pageY;
|
||||
|
||||
startTime = (new Date()).getTime();
|
||||
|
||||
if (breakingProcess !== null) {
|
||||
clearInterval(breakingProcess);
|
||||
}
|
||||
|
||||
e.stopPropagation();
|
||||
});
|
||||
$this.bind("touchmove.perfect-scrollbar", function (e) {
|
||||
if (!inGlobalTouch && e.originalEvent.targetTouches.length === 1) {
|
||||
var touch = e.originalEvent.targetTouches[0];
|
||||
|
||||
var currentCoords = {};
|
||||
currentCoords.pageX = touch.pageX;
|
||||
currentCoords.pageY = touch.pageY;
|
||||
|
||||
var differenceX = currentCoords.pageX - startCoords.pageX,
|
||||
differenceY = currentCoords.pageY - startCoords.pageY;
|
||||
|
||||
applyTouchMove(differenceX, differenceY);
|
||||
startCoords = currentCoords;
|
||||
|
||||
var currentTime = (new Date()).getTime();
|
||||
speed.x = differenceX / (currentTime - startTime);
|
||||
speed.y = differenceY / (currentTime - startTime);
|
||||
startTime = currentTime;
|
||||
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
$this.bind("touchend.perfect-scrollbar", function (e) {
|
||||
clearInterval(breakingProcess);
|
||||
breakingProcess = setInterval(function () {
|
||||
if (Math.abs(speed.x) < 0.01 && Math.abs(speed.y) < 0.01) {
|
||||
clearInterval(breakingProcess);
|
||||
return;
|
||||
}
|
||||
|
||||
applyTouchMove(speed.x * 30, speed.y * 30);
|
||||
|
||||
speed.x *= 0.8;
|
||||
speed.y *= 0.8;
|
||||
}, 10);
|
||||
});
|
||||
};
|
||||
|
||||
var destroy = function () {
|
||||
$this.unbind('.perfect-scrollbar');
|
||||
$(window).unbind('.perfect-scrollbar');
|
||||
$(document).unbind('.perfect-scrollbar');
|
||||
$this.data('perfect-scrollbar', null);
|
||||
$this.data('perfect-scrollbar-update', null);
|
||||
$this.data('perfect-scrollbar-destroy', null);
|
||||
$scrollbarX.remove();
|
||||
$scrollbarY.remove();
|
||||
$scrollbarXRail.remove();
|
||||
$scrollbarYRail.remove();
|
||||
|
||||
// clean all variables
|
||||
$scrollbarX =
|
||||
$scrollbarY =
|
||||
containerWidth =
|
||||
containerHeight =
|
||||
contentWidth =
|
||||
contentHeight =
|
||||
scrollbarXWidth =
|
||||
scrollbarXLeft =
|
||||
scrollbarXBottom =
|
||||
scrollbarYHeight =
|
||||
scrollbarYTop =
|
||||
scrollbarYRight = null;
|
||||
};
|
||||
|
||||
var ieSupport = function (version) {
|
||||
$this.addClass('ie').addClass('ie' + version);
|
||||
|
||||
var bindHoverHandlers = function () {
|
||||
var mouseenter = function () {
|
||||
$(this).addClass('hover');
|
||||
};
|
||||
var mouseleave = function () {
|
||||
$(this).removeClass('hover');
|
||||
};
|
||||
$this.bind('mouseenter.perfect-scrollbar', mouseenter).bind('mouseleave.perfect-scrollbar', mouseleave);
|
||||
$scrollbarXRail.bind('mouseenter.perfect-scrollbar', mouseenter).bind('mouseleave.perfect-scrollbar', mouseleave);
|
||||
$scrollbarYRail.bind('mouseenter.perfect-scrollbar', mouseenter).bind('mouseleave.perfect-scrollbar', mouseleave);
|
||||
$scrollbarX.bind('mouseenter.perfect-scrollbar', mouseenter).bind('mouseleave.perfect-scrollbar', mouseleave);
|
||||
$scrollbarY.bind('mouseenter.perfect-scrollbar', mouseenter).bind('mouseleave.perfect-scrollbar', mouseleave);
|
||||
};
|
||||
|
||||
var fixIe6ScrollbarPosition = function () {
|
||||
updateScrollbarCss = function () {
|
||||
$scrollbarX.css({left: scrollbarXLeft + $this.scrollLeft(), bottom: scrollbarXBottom, width: scrollbarXWidth});
|
||||
$scrollbarY.css({top: scrollbarYTop + $this.scrollTop(), right: scrollbarYRight, height: scrollbarYHeight});
|
||||
$scrollbarX.hide().show();
|
||||
$scrollbarY.hide().show();
|
||||
};
|
||||
updateContentScrollTop = function () {
|
||||
var scrollTop = parseInt(scrollbarYTop * contentHeight / containerHeight, 10);
|
||||
$this.scrollTop(scrollTop);
|
||||
$scrollbarX.css({bottom: scrollbarXBottom});
|
||||
$scrollbarX.hide().show();
|
||||
};
|
||||
updateContentScrollLeft = function () {
|
||||
var scrollLeft = parseInt(scrollbarXLeft * contentWidth / containerWidth, 10);
|
||||
$this.scrollLeft(scrollLeft);
|
||||
$scrollbarY.hide().show();
|
||||
};
|
||||
};
|
||||
|
||||
if (version === 6) {
|
||||
bindHoverHandlers();
|
||||
fixIe6ScrollbarPosition();
|
||||
}
|
||||
};
|
||||
|
||||
var supportsTouch = (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch);
|
||||
|
||||
var initialize = function () {
|
||||
var ieMatch = navigator.userAgent.toLowerCase().match(/(msie) ([\w.]+)/);
|
||||
if (ieMatch && ieMatch[1] === 'msie') {
|
||||
// must be executed at first, because 'ieSupport' may addClass to the container
|
||||
ieSupport(parseInt(ieMatch[2], 10));
|
||||
}
|
||||
|
||||
updateBarSizeAndPosition();
|
||||
bindMouseScrollXHandler();
|
||||
bindMouseScrollYHandler();
|
||||
bindRailClickHandler();
|
||||
if (supportsTouch) {
|
||||
bindMobileTouchHandler();
|
||||
}
|
||||
if ($this.mousewheel) {
|
||||
bindMouseWheelHandler();
|
||||
}
|
||||
if (settings.useKeyboard) {
|
||||
bindKeyboardHandler();
|
||||
}
|
||||
$this.data('perfect-scrollbar', $this);
|
||||
$this.data('perfect-scrollbar-update', updateBarSizeAndPosition);
|
||||
$this.data('perfect-scrollbar-destroy', destroy);
|
||||
};
|
||||
|
||||
// initialize
|
||||
initialize();
|
||||
|
||||
return $this;
|
||||
});
|
||||
};
|
||||
}));
|
||||
Reference in New Issue
Block a user