/**
* Slider elements for Lens LAF (inputs with "range" type).
*
* @name Lens.LAF.Sliders
* @namespace
*/
define(["lib/jquery", "lib/underscore", "common/util/dom_utils"],
function($, _, DOMUtils) {
"use strict";
var enabled = true;
var Sliders = /** @lends Lens.LAF.Sliders */ {
/**
* Enables slider styling and interaction
*/
enable: function() {
DOMUtils.addStylesheet("LAF/widgets/sliders.less");
enabled = true;
},
/**
* Disabled slider styling and interaction
*/
disable: function() {
DOMUtils.removeStylesheet("LAF/widgets/sliders.less");
enabled = false;
},
/**
* Returns true iff this LAF module is enabled
* @return {Boolean}
* @memberOf Lens.LAF.Sliders
*/
enabled: function() {
return enabled;
}
};
$(function(){
// bind to touchstart to add behavior to sliders
document.addEventListener("lens:touchstart", function(evt) {
if(!enabled) {
return;
}
_.each(evt.changedTouches, function(touch) {
if($(touch.target).is("input[type='range']")) {
var slider = $(touch.target);
var sliderLeft = slider.offset().left - $(window).scrollLeft();
var sliderWidth = slider.width();
var sliderMin = Number(slider.attr("min") || 0);
var sliderMax = Number(slider.attr("max") || 100);
var sliderRange = sliderMax - sliderMin;
touch.moved(function() {
// calculate new slider value
var ratio = (touch.pageX - sliderLeft) / sliderWidth;
var val = (sliderRange * ratio) + sliderMin;
// update the slider
slider.val(val);
DOMUtils.fire("change", touch.target);
});
}
});
});
});
Sliders.enable();
Lens._addMember(Sliders, "Sliders", Lens.LAF);
return Sliders;
});