0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

Ox.Element: add custom mousewheel event

Browse source
This commit is contained in:
rolux 2013-12-04 23:44:07 +01:00
parent 9ea8e0352d
commit 56c5998668
1 changed files with 44 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
source/Ox.UI/js/Core/Element.js
View file

@ -66,6 +66,12 @@ Ox.Element <f> Basic UI element object
on mouseleave or mouseup (this fires like a key that is being
pressed and held, and is useful for buttons like scrollbars arrows
that need to react to both clicking and holding)
mousewheel <!> mousewheel
Fires on mousewheel scroll or trackpad swipe
deltaFactor <n> Original delta = normalized delta * delta factor
deltaX <n> Normalized horizontal scroll delta in px
deltaY <n> Vertical scroll delta in px
* <*> Original event properties
singleclick <!> singleclick
Fires 250 ms after mouseup, if there was no subsequent mousedown
(this is useful if one wants to listen for both singleclicks and
@ -87,7 +93,10 @@ Ox.Element = function(options, self) {
// create public object
var that = new Ox.JQueryElement($(self.options.element || '<div>'))
.addClass('OxElement')
.on({mousedown: mousedown});
.on({
mousedown: mousedown,
mousewheel: mousewheel
});
if (self.options.element == '<iframe>') {
that.on('load', function() {
@ -220,6 +229,40 @@ Ox.Element = function(options, self) {
that.$tooltip.options({title: self.options.tooltip(e)}).show(e);
}
function mousewheel(e) {
// see https://github.com/brandonaaron/jquery-mousewheel/blob/master/jquery.mousewheel.js
e = e.originalEvent;
var absDelta,
deltaX = 'deltaX' in e ? e.deltaX
: 'wheelDeltaX' in e ? -e.wheelDeltaX
: 0,
deltaY = 'deltaY' in e ? -e.deltaY
: 'wheelDeltaY' in e ? e.wheelDeltaY
: 'wheelDelta' in e ? e.wheelDelta
: 0;
// Firefox < 17
if ('axis' in e && e.axis === e.HORIZONTAL_AXIS) {
deltaX = -deltaY;
deltaY = 0;
}
Ox.print('MOUSEWHEEL', e, deltaX, deltaY)
if (deltaX || deltaY) {
absDelta = Math.max(Math.abs(deltaY), Math.abs(deltaX));
if (!self._deltaFactor || self._deltaFactor > absDelta) {
self._deltaFactor = absDelta;
}
that.triggerEvent('mousewheel', Ox.extend(e, {
deltaFactor: self._deltaFactor,
deltaX: Ox.trunc(deltaX / self._deltaFactor),
deltaY: Ox.trunc(deltaY / self._deltaFactor)
}));
clearTimeout(self._deltaTimeout)
self._deltaTimeout = setTimeout(function() {
self._deltaFactor = null;
}, 200);
}
}
// TODO: in other widgets, use this,
// rather than some self.$tooltip that
// will not get garbage collected