123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167 |
- ( function( $ ) {
- ( function( $ ) {
- 'use strict';
-
- var slice = Array.prototype.slice;
- function noop() {}
-
- function defineBridget( $ ) {
-
- if ( !$ ) {
- return;
- }
-
-
- function addOptionMethod( PluginClass ) {
-
- if ( PluginClass.prototype.option ) {
- return;
- }
-
- PluginClass.prototype.option = function( opts ) {
-
- if ( !$.isPlainObject( opts ) ){
- return;
- }
- this.options = $.extend( true, this.options, opts );
- };
- }
-
-
-
- var logError = typeof console === 'undefined' ? noop :
- function( message ) {
- console.error( message );
- };
-
- function bridge( namespace, PluginClass ) {
-
- $.fn[ namespace ] = function( options ) {
- if ( typeof options === 'string' ) {
-
-
- var args = slice.call( arguments, 1 );
- for ( var i=0, len = this.length; i < len; i++ ) {
- var elem = this[i];
- var instance = $.data( elem, namespace );
- if ( !instance ) {
- logError( "cannot call methods on " + namespace + " prior to initialization; " +
- "attempted to call '" + options + "'" );
- continue;
- }
- if ( !$.isFunction( instance[options] ) || options.charAt(0) === '_' ) {
- logError( "no such method '" + options + "' for " + namespace + " instance" );
- continue;
- }
-
- var returnValue = instance[ options ].apply( instance, args);
-
- if ( returnValue !== undefined && returnValue !== instance) {
- return returnValue;
- }
- }
-
- return this;
- } else {
- var objects = this.map( function() {
- var instance = $.data( this, namespace );
- if ( instance ) {
-
- instance.option( options );
- instance._init();
- } else {
-
- instance = new PluginClass( this, options );
- $.data( this, namespace, instance );
- }
- return $(this);
- });
- if(!objects || objects.length > 1) {
- return objects;
- } else {
- return objects[0];
- }
- }
- };
- }
-
-
- $.bridget = function( namespace, PluginClass ) {
- addOptionMethod( PluginClass );
- bridge( namespace, PluginClass );
- };
- return $.bridget;
- }
-
- defineBridget( $ );
- })( $ );
-
- (function( $ ) {
- var ErrorMsgs = {
- formatInvalidInputErrorMsg : function(input) {
- return "Invalid input value '" + input + "' passed in";
- },
- callingContextNotSliderInstance : "Calling context element does not have instance of Slider bound to it. Check your code to make sure the JQuery object returned from the call to the slider() initializer is calling the method"
- };
-
- var Slider = function(element, options) {
- createNewSlider.call(this, element, options);
- return this;
- };
- function createNewSlider(element, options) {
-
- if(typeof element === "string") {
- this.element = document.querySelector(element);
- } else if(element instanceof HTMLElement) {
- this.element = element;
- }
-
- var origWidth = this.element.style.width;
- var updateSlider = false;
- var parent = this.element.parentNode;
- var sliderTrackSelection;
- var sliderMinHandle;
- var sliderMaxHandle;
- if (this.sliderElem) {
- updateSlider = true;
- } else {
-
- this.sliderElem = document.createElement("div");
- this.sliderElem.className = "slider";
-
- var sliderTrack = document.createElement("div");
- sliderTrack.className = "slider-track";
- sliderTrackSelection = document.createElement("div");
- sliderTrackSelection.className = "slider-selection";
- sliderMinHandle = document.createElement("div");
- sliderMinHandle.className = "slider-handle min-slider-handle";
- sliderMaxHandle = document.createElement("div");
- sliderMaxHandle.className = "slider-handle max-slider-handle";
- sliderTrack.appendChild(sliderTrackSelection);
- sliderTrack.appendChild(sliderMinHandle);
- sliderTrack.appendChild(sliderMaxHandle);
- var createAndAppendTooltipSubElements = function(tooltipElem) {
- var arrow = document.createElement("div");
- arrow.className = "tooltip-arrow";
- var inner = document.createElement("div");
- inner.className = "tooltip-inner";
- tooltipElem.appendChild(arrow);
- tooltipElem.appendChild(inner);
- };
-
- var sliderTooltip = document.createElement("div");
- sliderTooltip.className = "tooltip tooltip-main";
- createAndAppendTooltipSubElements(sliderTooltip);
- var sliderTooltipMin = document.createElement("div");
- sliderTooltipMin.className = "tooltip tooltip-min";
- createAndAppendTooltipSubElements(sliderTooltipMin);
- var sliderTooltipMax = document.createElement("div");
- sliderTooltipMax.className = "tooltip tooltip-max";
- createAndAppendTooltipSubElements(sliderTooltipMax);
-
- this.sliderElem.appendChild(sliderTrack);
- this.sliderElem.appendChild(sliderTooltip);
- this.sliderElem.appendChild(sliderTooltipMin);
- this.sliderElem.appendChild(sliderTooltipMax);
-
- parent.insertBefore(this.sliderElem, this.element);
-
-
- this.element.style.display = "none";
- }
-
- if($) {
- this.$element = $(this.element);
- this.$sliderElem = $(this.sliderElem);
- }
-
- options = options ? options : {};
- var optionTypes = Object.keys(this.defaultOptions);
- for(var i = 0; i < optionTypes.length; i++) {
- var optName = optionTypes[i];
-
- var val = options[optName];
-
- val = (typeof val !== 'undefined') ? val : getDataAttrib(this.element, optName);
-
- val = (val !== null) ? val : this.defaultOptions[optName];
-
- if(!this.options) {
- this.options = {};
- }
- this.options[optName] = val;
- }
- function getDataAttrib(element, optName) {
- var dataName = "data-slider-" + optName;
- var dataValString = element.getAttribute(dataName);
-
- try {
- return JSON.parse(dataValString);
- }
- catch(err) {
- return dataValString;
- }
- }
-
- this.eventToCallbackMap = {};
- this.sliderElem.id = this.options.id;
- this.touchCapable = 'ontouchstart' in window || (window.DocumentTouch && document instanceof window.DocumentTouch);
- this.tooltip = this.sliderElem.querySelector('.tooltip-main');
- this.tooltipInner = this.tooltip.querySelector('.tooltip-inner');
- this.tooltip_min = this.sliderElem.querySelector('.tooltip-min');
- this.tooltipInner_min = this.tooltip_min.querySelector('.tooltip-inner');
- this.tooltip_max = this.sliderElem.querySelector('.tooltip-max');
- this.tooltipInner_max= this.tooltip_max.querySelector('.tooltip-inner');
- if (updateSlider === true) {
-
- this._removeClass(this.sliderElem, 'slider-horizontal');
- this._removeClass(this.sliderElem, 'slider-vertical');
- this._removeClass(this.tooltip, 'hide');
- this._removeClass(this.tooltip_min, 'hide');
- this._removeClass(this.tooltip_max, 'hide');
-
- ["left", "top", "width", "height"].forEach(function(prop) {
- this._removeProperty(this.trackSelection, prop);
- }, this);
-
- [this.handle1, this.handle2].forEach(function(handle) {
- this._removeProperty(handle, 'left');
- this._removeProperty(handle, 'top');
- }, this);
-
- [this.tooltip, this.tooltip_min, this.tooltip_max].forEach(function(tooltip) {
- this._removeProperty(tooltip, 'left');
- this._removeProperty(tooltip, 'top');
- this._removeProperty(tooltip, 'margin-left');
- this._removeProperty(tooltip, 'margin-top');
- this._removeClass(tooltip, 'right');
- this._removeClass(tooltip, 'top');
- }, this);
- }
- if(this.options.orientation === 'vertical') {
- this._addClass(this.sliderElem,'slider-vertical');
-
- this.stylePos = 'top';
- this.mousePos = 'pageY';
- this.sizePos = 'offsetHeight';
- this._addClass(this.tooltip, 'right');
- this.tooltip.style.left = '100%';
-
- this._addClass(this.tooltip_min, 'right');
- this.tooltip_min.style.left = '100%';
- this._addClass(this.tooltip_max, 'right');
- this.tooltip_max.style.left = '100%';
- } else {
- this._addClass(this.sliderElem, 'slider-horizontal');
- this.sliderElem.style.width = origWidth;
- this.options.orientation = 'horizontal';
- this.stylePos = 'left';
- this.mousePos = 'pageX';
- this.sizePos = 'offsetWidth';
-
- this._addClass(this.tooltip, 'top');
- this.tooltip.style.top = -this.tooltip.outerHeight - 14 + 'px';
-
- this._addClass(this.tooltip_min, 'top');
- this.tooltip_min.style.top = -this.tooltip_min.outerHeight - 14 + 'px';
- this._addClass(this.tooltip_max, 'top');
- this.tooltip_max.style.top = -this.tooltip_max.outerHeight - 14 + 'px';
- }
- if (this.options.value instanceof Array) {
- this.options.range = true;
- } else if (this.options.range) {
-
- this.options.value = [this.options.value, this.options.max];
- }
- this.trackSelection = sliderTrackSelection || this.trackSelection;
- if (this.options.selection === 'none') {
- this._addClass(this.trackSelection, 'hide');
- }
- this.handle1 = sliderMinHandle || this.handle1;
- this.handle2 = sliderMaxHandle || this.handle2;
- if (updateSlider === true) {
-
- this._removeClass(this.handle1, 'round triangle');
- this._removeClass(this.handle2, 'round triangle hide');
- }
- var availableHandleModifiers = ['round', 'triangle', 'custom'];
- var isValidHandleType = availableHandleModifiers.indexOf(this.options.handle) !== -1;
- if (isValidHandleType) {
- this._addClass(this.handle1, this.options.handle);
- this._addClass(this.handle2, this.options.handle);
- }
- this.offset = this._offset(this.sliderElem);
- this.size = this.sliderElem[this.sizePos];
- this.setValue(this.options.value);
-
-
- this.handle1Keydown = this._keydown.bind(this, 0);
- this.handle1.addEventListener("keydown", this.handle1Keydown, false);
- this.handle2Keydown = this._keydown.bind(this, 0);
- this.handle2.addEventListener("keydown", this.handle2Keydown, false);
- if (this.touchCapable) {
-
- this.mousedown = this._mousedown.bind(this);
- this.sliderElem.addEventListener("touchstart", this.mousedown, false);
- } else {
-
- this.mousedown = this._mousedown.bind(this);
- this.sliderElem.addEventListener("mousedown", this.mousedown, false);
- }
-
- if(this.options.tooltip === 'hide') {
- this._addClass(this.tooltip, 'hide');
- this._addClass(this.tooltip_min, 'hide');
- this._addClass(this.tooltip_max, 'hide');
- } else if(this.options.tooltip === 'always') {
- this._showTooltip();
- this._alwaysShowTooltip = true;
- } else {
- this.showTooltip = this._showTooltip.bind(this);
- this.hideTooltip = this._hideTooltip.bind(this);
- this.sliderElem.addEventListener("mouseenter", this.showTooltip, false);
- this.sliderElem.addEventListener("mouseleave", this.hideTooltip, false);
- this.handle1.addEventListener("focus", this.showTooltip, false);
- this.handle1.addEventListener("blur", this.hideTooltip, false);
- this.handle2.addEventListener("focus", this.showTooltip, false);
- this.handle2.addEventListener("blur", this.hideTooltip, false);
- }
- if(this.options.enabled) {
- this.enable();
- } else {
- this.disable();
- }
- }
-
- Slider.prototype = {
- _init: function() {},
- constructor: Slider,
- defaultOptions: {
- id: "",
- min: 0,
- max: 10,
- step: 1,
- precision: 0,
- orientation: 'horizontal',
- value: 5,
- range: false,
- selection: 'before',
- tooltip: 'show',
- tooltip_split: false,
- handle: 'round',
- reversed: false,
- enabled: true,
- formatter: function(val) {
- if(val instanceof Array) {
- return val[0] + " : " + val[1];
- } else {
- return val;
- }
- },
- natural_arrow_keys: false
- },
-
- over: false,
-
- inDrag: false,
- getValue: function() {
- if (this.options.range) {
- return this.options.value;
- }
- return this.options.value[0];
- },
- setValue: function(val, triggerSlideEvent) {
- if (!val) {
- val = 0;
- }
- this.options.value = this._validateInputValue(val);
- var applyPrecision = this._applyPrecision.bind(this);
- if (this.options.range) {
- this.options.value[0] = applyPrecision(this.options.value[0]);
- this.options.value[1] = applyPrecision(this.options.value[1]);
- this.options.value[0] = Math.max(this.options.min, Math.min(this.options.max, this.options.value[0]));
- this.options.value[1] = Math.max(this.options.min, Math.min(this.options.max, this.options.value[1]));
- } else {
- this.options.value = applyPrecision(this.options.value);
- this.options.value = [ Math.max(this.options.min, Math.min(this.options.max, this.options.value))];
- this._addClass(this.handle2, 'hide');
- if (this.options.selection === 'after') {
- this.options.value[1] = this.options.max;
- } else {
- this.options.value[1] = this.options.min;
- }
- }
- this.diff = this.options.max - this.options.min;
- if (this.diff > 0) {
- this.percentage = [
- (this.options.value[0] - this.options.min) * 100 / this.diff,
- (this.options.value[1] - this.options.min) * 100 / this.diff,
- this.options.step * 100 / this.diff
- ];
- } else {
- this.percentage = [0, 0, 100];
- }
- this._layout();
- var sliderValue = this.options.range ? this.options.value : this.options.value[0];
- this._setDataVal(sliderValue);
- if(triggerSlideEvent === true) {
- this._trigger('slide', sliderValue);
- }
- return this;
- },
- destroy: function(){
-
- this._removeSliderEventHandlers();
-
- this.sliderElem.parentNode.removeChild(this.sliderElem);
-
- this.element.style.display = "";
-
- this._cleanUpEventCallbacksMap();
-
- this.element.removeAttribute("data");
-
- if($) {
- this._unbindJQueryEventHandlers();
- this.$element.removeData('slider');
- }
- },
- disable: function() {
- this.options.enabled = false;
- this.handle1.removeAttribute("tabindex");
- this.handle2.removeAttribute("tabindex");
- this._addClass(this.sliderElem, 'slider-disabled');
- this._trigger('slideDisabled');
- return this;
- },
- enable: function() {
- this.options.enabled = true;
- this.handle1.setAttribute("tabindex", 0);
- this.handle2.setAttribute("tabindex", 0);
- this._removeClass(this.sliderElem, 'slider-disabled');
- this._trigger('slideEnabled');
- return this;
- },
- toggle: function() {
- if(this.options.enabled) {
- this.disable();
- } else {
- this.enable();
- }
- return this;
- },
- isEnabled: function() {
- return this.options.enabled;
- },
- on: function(evt, callback) {
- if($) {
- this.$element.on(evt, callback);
- this.$sliderElem.on(evt, callback);
- } else {
- this._bindNonQueryEventHandler(evt, callback);
- }
- return this;
- },
- getAttribute: function(attribute) {
- if(attribute) {
- return this.options[attribute];
- } else {
- return this.options;
- }
- },
- setAttribute: function(attribute, value) {
- this.options[attribute] = value;
- return this;
- },
- refresh: function() {
- this._removeSliderEventHandlers();
- createNewSlider.call(this, this.element, this.options);
- if($) {
-
- $.data(this.element, 'slider', this);
- }
- return this;
- },
-
-
- _removeSliderEventHandlers: function() {
-
- this.handle1.removeEventListener("keydown", this.handle1Keydown, false);
- this.handle1.removeEventListener("focus", this.showTooltip, false);
- this.handle1.removeEventListener("blur", this.hideTooltip, false);
-
- this.handle2.removeEventListener("keydown", this.handle2Keydown, false);
- this.handle2.removeEventListener("focus", this.handle2Keydown, false);
- this.handle2.removeEventListener("blur", this.handle2Keydown, false);
-
- this.sliderElem.removeEventListener("mouseenter", this.showTooltip, false);
- this.sliderElem.removeEventListener("mouseleave", this.hideTooltip, false);
- this.sliderElem.removeEventListener("touchstart", this.mousedown, false);
- this.sliderElem.removeEventListener("mousedown", this.mousedown, false);
- },
- _bindNonQueryEventHandler: function(evt, callback) {
- if(this.eventToCallbackMap[evt]===undefined) {
- this.eventToCallbackMap[evt] = [];
- }
- this.eventToCallbackMap[evt].push(callback);
- },
- _cleanUpEventCallbacksMap: function() {
- var eventNames = Object.keys(this.eventToCallbackMap);
- for(var i = 0; i < eventNames.length; i++) {
- var eventName = eventNames[i];
- this.eventToCallbackMap[eventName] = null;
- }
- },
- _showTooltip: function() {
- if (this.options.tooltip_split === false ){
- this._addClass(this.tooltip, 'in');
- } else {
- this._addClass(this.tooltip_min, 'in');
- this._addClass(this.tooltip_max, 'in');
- }
- this.over = true;
- },
- _hideTooltip: function() {
- if (this.inDrag === false && this.alwaysShowTooltip !== true) {
- this._removeClass(this.tooltip, 'in');
- this._removeClass(this.tooltip_min, 'in');
- this._removeClass(this.tooltip_max, 'in');
- }
- this.over = false;
- },
- _layout: function() {
- var positionPercentages;
- if(this.options.reversed) {
- positionPercentages = [ 100 - this.percentage[0], this.percentage[1] ];
- } else {
- positionPercentages = [ this.percentage[0], this.percentage[1] ];
- }
- this.handle1.style[this.stylePos] = positionPercentages[0]+'%';
- this.handle2.style[this.stylePos] = positionPercentages[1]+'%';
- if (this.options.orientation === 'vertical') {
- this.trackSelection.style.top = Math.min(positionPercentages[0], positionPercentages[1]) +'%';
- this.trackSelection.style.height = Math.abs(positionPercentages[0] - positionPercentages[1]) +'%';
- } else {
- this.trackSelection.style.left = Math.min(positionPercentages[0], positionPercentages[1]) +'%';
- this.trackSelection.style.width = Math.abs(positionPercentages[0] - positionPercentages[1]) +'%';
- var offset_min = this.tooltip_min.getBoundingClientRect();
- var offset_max = this.tooltip_max.getBoundingClientRect();
- if (offset_min.right > offset_max.left) {
- this._removeClass(this.tooltip_max, 'top');
- this._addClass(this.tooltip_max, 'bottom');
- this.tooltip_max.style.top = 18 + 'px';
- } else {
- this._removeClass(this.tooltip_max, 'bottom');
- this._addClass(this.tooltip_max, 'top');
- this.tooltip_max.style.top = -30 + 'px';
- }
- }
- var formattedTooltipVal;
- if (this.options.range) {
- formattedTooltipVal = this.options.formatter(this.options.value);
- this._setText(this.tooltipInner, formattedTooltipVal);
- this.tooltip.style[this.stylePos] = (positionPercentages[1] + positionPercentages[0])/2 + '%';
- if (this.options.orientation === 'vertical') {
- this._css(this.tooltip, 'margin-top', -this.tooltip.offsetHeight / 2 + 'px');
- } else {
- this._css(this.tooltip, 'margin-left', -this.tooltip.offsetWidth / 2 + 'px');
- }
-
- if (this.options.orientation === 'vertical') {
- this._css(this.tooltip, 'margin-top', -this.tooltip.offsetHeight / 2 + 'px');
- } else {
- this._css(this.tooltip, 'margin-left', -this.tooltip.offsetWidth / 2 + 'px');
- }
-
- var innerTooltipMinText = this.options.formatter(this.options.value[0]);
- this._setText(this.tooltipInner_min, innerTooltipMinText);
- var innerTooltipMaxText = this.options.formatter(this.options.value[1]);
- this._setText(this.tooltipInner_max, innerTooltipMaxText);
- this.tooltip_min.style[this.stylePos] = positionPercentages[0] + '%';
- if (this.options.orientation === 'vertical') {
- this._css(this.tooltip_min, 'margin-top', -this.tooltip_min.offsetHeight / 2 + 'px');
- } else {
- this._css(this.tooltip_min, 'margin-left', -this.tooltip_min.offsetWidth / 2 + 'px');
- }
- this.tooltip_max.style[this.stylePos] = positionPercentages[1] + '%';
- if (this.options.orientation === 'vertical') {
- this._css(this.tooltip_max, 'margin-top', -this.tooltip_max.offsetHeight / 2 + 'px');
- } else {
- this._css(this.tooltip_max, 'margin-left', -this.tooltip_max.offsetWidth / 2 + 'px');
- }
- } else {
- formattedTooltipVal = this.options.formatter(this.options.value[0]);
- this._setText(this.tooltipInner, formattedTooltipVal);
- this.tooltip.style[this.stylePos] = positionPercentages[0] + '%';
- if (this.options.orientation === 'vertical') {
- this._css(this.tooltip, 'margin-top', -this.tooltip.offsetHeight / 2 + 'px');
- } else {
- this._css(this.tooltip, 'margin-left', -this.tooltip.offsetWidth / 2 + 'px');
- }
- }
- },
- _removeProperty: function(element, prop) {
- if (element.style.removeProperty) {
- element.style.removeProperty(prop);
- } else {
- element.style.removeAttribute(prop);
- }
- },
- _mousedown: function(ev) {
- if(!this.options.enabled) {
- return false;
- }
- this._triggerFocusOnHandle();
- this.offset = this._offset(this.sliderElem);
- this.size = this.sliderElem[this.sizePos];
- var percentage = this._getPercentage(ev);
- if (this.options.range) {
- var diff1 = Math.abs(this.percentage[0] - percentage);
- var diff2 = Math.abs(this.percentage[1] - percentage);
- this.dragged = (diff1 < diff2) ? 0 : 1;
- } else {
- this.dragged = 0;
- }
- this.percentage[this.dragged] = this.options.reversed ? 100 - percentage : percentage;
- this._layout();
- this.mousemove = this._mousemove.bind(this);
- this.mouseup = this._mouseup.bind(this);
- if (this.touchCapable) {
-
- document.addEventListener("touchmove", this.mousemove, false);
- document.addEventListener("touchend", this.mouseup, false);
- } else {
-
- document.addEventListener("mousemove", this.mousemove, false);
- document.addEventListener("mouseup", this.mouseup, false);
- }
- this.inDrag = true;
- var val = this._calculateValue();
- this._trigger('slideStart', val);
- this._setDataVal(val);
- this.setValue(val);
- this._pauseEvent(ev);
- return true;
- },
- _triggerFocusOnHandle: function(handleIdx) {
- if(handleIdx === 0) {
- this.handle1.focus();
- }
- if(handleIdx === 1) {
- this.handle2.focus();
- }
- },
- _keydown: function(handleIdx, ev) {
- if(!this.options.enabled) {
- return false;
- }
- var dir;
- switch (ev.keyCode) {
- case 37:
- case 40:
- dir = -1;
- break;
- case 39:
- case 38:
- dir = 1;
- break;
- }
- if (!dir) {
- return;
- }
-
- if (this.options.natural_arrow_keys) {
- var ifVerticalAndNotReversed = (this.options.orientation === 'vertical' && !this.options.reversed);
- var ifHorizontalAndReversed = (this.options.orientation === 'horizontal' && this.options.reversed);
- if (ifVerticalAndNotReversed || ifHorizontalAndReversed) {
- dir = dir * -1;
- }
- }
- var oneStepValuePercentageChange = dir * this.percentage[2];
- var percentage = this.percentage[handleIdx] + oneStepValuePercentageChange;
- if (percentage > 100) {
- percentage = 100;
- } else if (percentage < 0) {
- percentage = 0;
- }
- this.dragged = handleIdx;
- this._adjustPercentageForRangeSliders(percentage);
- this.percentage[this.dragged] = percentage;
- this._layout();
- var val = this._calculateValue();
-
- this._trigger('slideStart', val);
- this._setDataVal(val);
- this.setValue(val, true);
- this._trigger('slideStop', val);
- this._setDataVal(val);
-
- this._pauseEvent(ev);
- return false;
- },
- _pauseEvent: function(ev) {
- if(ev.stopPropagation) {
- ev.stopPropagation();
- }
- if(ev.preventDefault) {
- ev.preventDefault();
- }
- ev.cancelBubble=true;
- ev.returnValue=false;
- },
- _mousemove: function(ev) {
- if(!this.options.enabled) {
- return false;
- }
- var percentage = this._getPercentage(ev);
- this._adjustPercentageForRangeSliders(percentage);
- this.percentage[this.dragged] = this.options.reversed ? 100 - percentage : percentage;
- this._layout();
- var val = this._calculateValue();
- this.setValue(val, true);
- return false;
- },
- _adjustPercentageForRangeSliders: function(percentage) {
- if (this.options.range) {
- if (this.dragged === 0 && this.percentage[1] < percentage) {
- this.percentage[0] = this.percentage[1];
- this.dragged = 1;
- } else if (this.dragged === 1 && this.percentage[0] > percentage) {
- this.percentage[1] = this.percentage[0];
- this.dragged = 0;
- }
- }
- },
- _mouseup: function() {
- if(!this.options.enabled) {
- return false;
- }
- if (this.touchCapable) {
-
- document.removeEventListener("touchmove", this.mousemove, false);
- document.removeEventListener("touchend", this.mouseup, false);
- } else {
-
- document.removeEventListener("mousemove", this.mousemove, false);
- document.removeEventListener("mouseup", this.mouseup, false);
- }
-
- this.inDrag = false;
- if (this.over === false) {
- this._hideTooltip();
- }
- var val = this._calculateValue();
-
- this._layout();
- this._setDataVal(val);
- this._trigger('slideStop', val);
-
- return false;
- },
- _calculateValue: function() {
- var val;
- if (this.options.range) {
- val = [this.options.min,this.options.max];
- if (this.percentage[0] !== 0){
- val[0] = (Math.max(this.options.min, this.options.min + Math.round((this.diff * this.percentage[0]/100)/this.options.step)*this.options.step));
- val[0] = this._applyPrecision(val[0]);
- }
- if (this.percentage[1] !== 100){
- val[1] = (Math.min(this.options.max, this.options.min + Math.round((this.diff * this.percentage[1]/100)/this.options.step)*this.options.step));
- val[1] = this._applyPrecision(val[1]);
- }
- this.options.value = val;
- } else {
- val = (this.options.min + Math.round((this.diff * this.percentage[0]/100)/this.options.step)*this.options.step);
- if (val < this.options.min) {
- val = this.options.min;
- }
- else if (val > this.options.max) {
- val = this.options.max;
- }
- val = parseFloat(val);
- val = this._applyPrecision(val);
- this.options.value = [val, this.options.value[1]];
- }
- return val;
- },
- _applyPrecision: function(val) {
- var precision = this.options.precision || this._getNumDigitsAfterDecimalPlace(this.step);
- return this._applyToFixedAndParseFloat(val, precision);
- },
- _getNumDigitsAfterDecimalPlace: function(num) {
- var match = (''+num).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
- if (!match) { return 0; }
- return Math.max(0, (match[1] ? match[1].length : 0) - (match[2] ? +match[2] : 0));
- },
- _applyToFixedAndParseFloat: function(num, toFixedInput) {
- var truncatedNum = num.toFixed(toFixedInput);
- return parseFloat(truncatedNum);
- },
-
- _getPercentage: function(ev) {
- if (this.touchCapable && (ev.type === 'touchstart' || ev.type === 'touchmove')) {
- ev = ev.touches[0];
- }
- var percentage = (ev[this.mousePos] - this.offset[this.stylePos])*100/this.size;
- percentage = Math.round(percentage/this.percentage[2])*this.percentage[2];
- return Math.max(0, Math.min(100, percentage));
- },
- _validateInputValue: function(val) {
- if(typeof val === 'number') {
- return val;
- } else if(val instanceof Array) {
- this._validateArray(val);
- return val;
- } else {
- throw new Error( ErrorMsgs.formatInvalidInputErrorMsg(val) );
- }
- },
- _validateArray: function(val) {
- for(var i = 0; i < val.length; i++) {
- var input = val[i];
- if (typeof input !== 'number') { throw new Error( ErrorMsgs.formatInvalidInputErrorMsg(input) ); }
- }
- },
- _setDataVal: function(val) {
- var value = "value: '" + val + "'";
- this.element.setAttribute('data', value);
- this.element.setAttribute('value', val);
- },
- _trigger: function(evt, val) {
- val = val || undefined;
- var callbackFnArray = this.eventToCallbackMap[evt];
- if(callbackFnArray && callbackFnArray.length) {
- for(var i = 0; i < callbackFnArray.length; i++) {
- var callbackFn = callbackFnArray[i];
- callbackFn(val);
- }
- }
-
- if($) {
- this._triggerJQueryEvent(evt, val);
- }
- },
- _triggerJQueryEvent: function(evt, val) {
- var eventData = {
- type: evt,
- value: val
- };
- this.$element.trigger(eventData);
- this.$sliderElem.trigger(eventData);
- },
- _unbindJQueryEventHandlers: function() {
- this.$element.off();
- this.$sliderElem.off();
- },
- _setText: function(element, text) {
- if(typeof element.innerText !== "undefined") {
- element.innerText = text;
- } else if(typeof element.textContent !== "undefined") {
- element.textContent = text;
- }
- },
- _removeClass: function(element, classString) {
- var classes = classString.split(" ");
- var newClasses = element.className;
- for(var i = 0; i < classes.length; i++) {
- var classTag = classes[i];
- var regex = new RegExp("(?:\\s|^)" + classTag + "(?:\\s|$)");
- newClasses = newClasses.replace(regex, " ");
- }
- element.className = newClasses.trim();
- },
- _addClass: function(element, classString) {
- var classes = classString.split(" ");
- var newClasses = element.className;
- for(var i = 0; i < classes.length; i++) {
- var classTag = classes[i];
- var regex = new RegExp("(?:\\s|^)" + classTag + "(?:\\s|$)");
- var ifClassExists = regex.test(newClasses);
-
- if(!ifClassExists) {
- newClasses += " " + classTag;
- }
- }
- element.className = newClasses.trim();
- },
- _offset: function (obj) {
- var ol = 0;
- var ot = 0;
- if (obj.offsetParent) {
- do {
- ol += obj.offsetLeft;
- ot += obj.offsetTop;
- } while (obj = obj.offsetParent);
- }
- return {
- left: ol,
- top: ot
- };
- },
- _css: function(elementRef, styleName, value) {
- elementRef.style[styleName] = value;
- }
- };
-
- if($) {
- var namespace = $.fn.slider ? 'bootstrapSlider' : 'slider';
- $.bridget(namespace, Slider);
- } else {
- window.Slider = Slider;
- }
- })( $ );
- })( window.jQuery );
|