120 lines
3.7 KiB
JavaScript
120 lines
3.7 KiB
JavaScript
/* Copyright (c) 2015 Hyunje Alex Jun and other contributors
|
|
* Licensed under the MIT License
|
|
*/
|
|
'use strict';
|
|
|
|
var h = require('../../lib/helper')
|
|
, instances = require('../instances')
|
|
, updateGeometry = require('../update-geometry');
|
|
|
|
function bindMouseWheelHandler(element, i) {
|
|
var shouldPrevent = false;
|
|
|
|
function shouldPreventDefault(deltaX, deltaY) {
|
|
var scrollTop = element.scrollTop;
|
|
if (deltaX === 0) {
|
|
if (!i.scrollbarYActive) {
|
|
return false;
|
|
}
|
|
if ((scrollTop === 0 && deltaY > 0) || (scrollTop >= i.contentHeight - i.containerHeight && deltaY < 0)) {
|
|
return !i.settings.wheelPropagation;
|
|
}
|
|
}
|
|
|
|
var scrollLeft = element.scrollLeft;
|
|
if (deltaY === 0) {
|
|
if (!i.scrollbarXActive) {
|
|
return false;
|
|
}
|
|
if ((scrollLeft === 0 && deltaX < 0) || (scrollLeft >= i.contentWidth - i.containerWidth && deltaX > 0)) {
|
|
return !i.settings.wheelPropagation;
|
|
}
|
|
}
|
|
return true;
|
|
}
|
|
|
|
function getDeltaFromEvent(e) {
|
|
var deltaX = e.deltaX;
|
|
var deltaY = -1 * e.deltaY;
|
|
|
|
if (typeof deltaX === "undefined" || typeof deltaY === "undefined") {
|
|
// OS X Safari
|
|
deltaX = -1 * e.wheelDeltaX / 6;
|
|
deltaY = e.wheelDeltaY / 6;
|
|
}
|
|
|
|
if (e.deltaMode && e.deltaMode === 1) {
|
|
// Firefox in deltaMode 1: Line scrolling
|
|
deltaX *= 10;
|
|
deltaY *= 10;
|
|
}
|
|
|
|
if (deltaX !== deltaX && deltaY !== deltaY/* NaN checks */) {
|
|
// IE in some mouse drivers
|
|
deltaX = 0;
|
|
deltaY = e.wheelDelta;
|
|
}
|
|
|
|
return [deltaX, deltaY];
|
|
}
|
|
|
|
function mousewheelHandler(e) {
|
|
// FIXME: this is a quick fix for the select problem in FF and IE.
|
|
// If there comes an effective way to deal with the problem,
|
|
// this lines should be removed.
|
|
if (!h.env.isWebKit && element.querySelector('select:focus')) {
|
|
return;
|
|
}
|
|
|
|
var delta = getDeltaFromEvent(e);
|
|
|
|
var deltaX = delta[0];
|
|
var deltaY = delta[1];
|
|
|
|
shouldPrevent = false;
|
|
if (!i.settings.useBothWheelAxes) {
|
|
// deltaX will only be used for horizontal scrolling and deltaY will
|
|
// only be used for vertical scrolling - this is the default
|
|
element.scrollTop = element.scrollTop - (deltaY * i.settings.wheelSpeed);
|
|
element.scrollLeft = element.scrollLeft + (deltaX * i.settings.wheelSpeed);
|
|
} else if (i.scrollbarYActive && !i.scrollbarXActive) {
|
|
// only vertical scrollbar is active and useBothWheelAxes option is
|
|
// active, so let's scroll vertical bar using both mouse wheel axes
|
|
if (deltaY) {
|
|
element.scrollTop = element.scrollTop - (deltaY * i.settings.wheelSpeed);
|
|
} else {
|
|
element.scrollTop = element.scrollTop + (deltaX * i.settings.wheelSpeed);
|
|
}
|
|
shouldPrevent = true;
|
|
} else if (i.scrollbarXActive && !i.scrollbarYActive) {
|
|
// useBothWheelAxes and only horizontal bar is active, so use both
|
|
// wheel axes for horizontal bar
|
|
if (deltaX) {
|
|
element.scrollLeft = element.scrollLeft + (deltaX * i.settings.wheelSpeed);
|
|
} else {
|
|
element.scrollLeft = element.scrollLeft - (deltaY * i.settings.wheelSpeed);
|
|
}
|
|
shouldPrevent = true;
|
|
}
|
|
|
|
updateGeometry(element);
|
|
|
|
shouldPrevent = (shouldPrevent || shouldPreventDefault(deltaX, deltaY));
|
|
if (shouldPrevent) {
|
|
e.stopPropagation();
|
|
e.preventDefault();
|
|
}
|
|
}
|
|
|
|
if (typeof window.onwheel !== "undefined") {
|
|
i.event.bind(element, 'wheel', mousewheelHandler);
|
|
} else if (typeof window.onmousewheel !== "undefined") {
|
|
i.event.bind(element, 'mousewheel', mousewheelHandler);
|
|
}
|
|
}
|
|
|
|
module.exports = function (element) {
|
|
var i = instances.get(element);
|
|
bindMouseWheelHandler(element, i);
|
|
};
|