/* usage: base.wheel = new wheel({ el: document.querySelector("#map"), update: function(e, val, delta){ // do something with val }, }) */ function wheel (opt) { opt = defaults(opt, { el: document, fn: function(e, val, delta){}, propagate: false, locked: false, reversible: true, ratio: 0.02, val: 0, }) opt.el.addEventListener('mousewheel', onMouseWheel, false); opt.el.addEventListener('DOMMouseScroll', onMouseWheel, false); function onMouseWheel (e) { if (opt.locked) { return } if (! opt.propagate) { e.stopPropagation() e.preventDefault() } var delta = 0; // WebKit if ( event.wheelDeltaY ) { delta -= event.wheelDeltaY * opt.ratio } // Opera / Explorer 9 else if ( event.wheelDelta ) { delta -= event.wheelDelta * opt.ratio } // Firefox else if ( event.detail ) { delta += event.detail * 2 } if (! opt.reversible && delta < 0) return; opt.val = clamp(opt.val + delta, opt.min, opt.max) opt.update(e, opt.val, delta) } opt.lock = function(){ opt.locked = true } opt.unlock = function(){ opt.locked = false } return opt }