range-slider.min.js

!function(e,t){"use strict";function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var i=function(){function e(e,t){for(var s=0;s<t.length;s++){var i=t[s];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,s,i){return s&&e(t.prototype,s),i&&e(t,i),t}}();/*!
 * Range-slider 1.0.0
 * Customizable slider (range) component for JavaScript.
 *
 * Copyright: Alexey Grinko, 2017
 * Git repository: https://github.com/agrinko/range-slider.git
 *
 * @license MIT - https://opensource.org/licenses/MIT
 */
!function(e){var t={value:0,min:0,max:100,step:1,unit:null,width:null,design:"3d",theme:"default",size:"medium",handle:"square",popup:"top",showMinMaxLabels:!0,showCurrentValueLabel:!1,labelsPosition:"top",onstart:function(){},onmove:function(){},onfinish:function(){}},n=function(){function e(i,n){s(this,e),i instanceof HTMLElement||(i=e._el(),n||(n=i)),this.el=i,this.s=a({},t,n),this._validateSettings(),this._buildDOM(),this._bindEvents(),this.initialValue=this.s.value,this.value=null,this.setValue(this.s.value)}return i(e,[{key:"getValue",value:function(){return this.value}},{key:"getElement",value:function(){return this.el}},{key:"labelValue",value:function(){return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.value)+" "+(this.s.unit||"")}},{key:"setValue",value:function(e){(e=this._normalize(e))<this.s.min||e>this.s.max||(null===this.value||e!=this.value&&this.s.onmove.call(this,e)!==!1)&&(this.value=e,this._updatePopup(),this._updateLabel(),this._moveToValue(e))}},{key:"setWidth",value:function(e){arguments.length&&("number"==typeof e&&(e+="px"),this.el.style.width=e)}},{key:"_validateSettings",value:function(){this.s.value=e.toNumber(this.s.value,t.value),this.s.min=e.toNumber(this.s.min,t.min),this.s.max=e.toNumber(this.s.max,t.max),this.s.step=e.toNumber(this.s.step,t.step)}},{key:"_buildDOM",value:function(){this._setClasses(),this._createBar(),this.setWidth(this.s.width),(this.s.showMinMaxLabels||this.s.showCurrentValueLabel)&&this._createLabels(),this.s.popup&&this._createPopup()}},{key:"_setClasses",value:function(){var e=this;["range-slider","rs-theme-"+this.s.theme,"rs-size-"+this.s.size,"rs-design-"+this.s.design,"rs-handle-"+this.s.handle,this.s.showMinMaxLabels||this.s.showCurrentValueLabel?"rs-labels-"+this.s.labelsPosition:null].forEach(function(t){t&&(e.el.className+=" "+t)})}},{key:"_createBar",value:function(){var t=e._el(),s=e._el(),i=e._el(),n=e._el();t.className="rs-bar",s.className="rs-progress",i.className="rs-wrap",n.className="rs-handle",t.appendChild(i),i.appendChild(s),i.appendChild(n),this.el.appendChild(t),this.bar=t,this.progressBar=s,this.range=i,this.handle=n}},{key:"_createLabels",value:function(){var t=e._el(),s=e._el(),i=e._el(),n=e._el(),a=e._el();t.className="rs-labels",s.className="rs-wrap",i.className="rs-label-left",n.className="rs-label-middle",a.className="rs-label-right",t.appendChild(i),t.appendChild(a),t.appendChild(s),s.appendChild(n),this.el.appendChild(t),this.labels={left:i,right:a,middle:n},this._updateLabels()}},{key:"_updateLabels",value:function(){this.s.showMinMaxLabels&&(this.labels.left.innerText=this.labelValue(this.s.min),this.labels.right.innerText=this.labelValue(this.s.max))}},{key:"_updateLabel",value:function(){this.s.showCurrentValueLabel&&(this.labels.middle.innerText=this.labelValue(this.value))}},{key:"_createPopup",value:function(){var t=e._el();t.className="rs-popup rs-hidden rs-popup-"+this.s.popup,this.handle.appendChild(t),this.popup=t}},{key:"_updatePopup",value:function(){this.s.popup&&(this.popup.innerText=this.labelValue(this.value))}},{key:"_togglePopup",value:function(e){this.s.popup&&(e?(this.popup.className=this.popup.className.replace("rs-hidden",""),this.s.showCurrentValueLabel&&(this.labels.middle.className+=" rs-hidden")):(this.popup.className+=" rs-hidden",this.s.showCurrentValueLabel&&(this.labels.middle.className=this.labels.middle.className.replace("rs-hidden",""))))}},{key:"_bindEvents",value:function(){var e=this;this.bar.addEventListener("mousedown",function(t){0==t.button&&(t.preventDefault(),e._begin(t.clientX,t.target))}),this.bar.addEventListener("touchstart",function(t){t.changedTouches&&t.changedTouches[0]&&(t.preventDefault(),e._begin(t.changedTouches[0].clientX,t.target))})}},{key:"_begin",value:function(e,t){this.s.onstart.call(this,this.value)!==!1&&(this.prevValue=this.value,this.el.className+=" rs-active",this._togglePopup(!0),t!=this.handle?this._move(e):this._ensureNoElementsIntersection(),this._initHandle(e))}},{key:"_initHandle",value:function(e){var t=this,s=this.handle.getBoundingClientRect(),i=e-(s.left+s.width/2),n=function(e){var s=e.changedTouches?e.changedTouches[0].clientX:e.clientX;t._move(s-i),e.preventDefault()},a=function e(){document.removeEventListener("mousemove",n),document.removeEventListener("touchmove",n),document.removeEventListener("mouseup",e),document.removeEventListener("touchend",e),document.removeEventListener("touchcancel",e),t._end()};document.addEventListener("mousemove",n),document.addEventListener("touchmove",n),document.addEventListener("mouseup",a),document.addEventListener("touchend",a),document.addEventListener("touchcancel",a)}},{key:"_end",value:function(){this.value!=this.prevValue&&this.s.onfinish.call(this,this.value),this.el.className=this.el.className.replace("rs-active",""),this._togglePopup(!1),this._ensureNoElementsIntersection()}},{key:"_move",value:function(e){var t=this._getRelX(e),s=this._toValue(t);this.setValue(s)}},{key:"_moveToValue",value:function(e){e=100*this._toFraction(e),this.progressBar.style.width=this.handle.style.left=e+"%",this._moveLabel(e)}},{key:"_moveLabel",value:function(e){this.s.showCurrentValueLabel&&(this.labels.middle.style.left=e+"%"),this._ensureNoElementsIntersection()}},{key:"_ensureNoElementsIntersection",value:function(){this.s.showMinMaxLabels&&(this.s.popup&&this.popup.className.indexOf("rs-hidden")==-1&&(e.ensureNoIntersection(this.popup,this.labels.left),e.ensureNoIntersection(this.popup,this.labels.right)),this.s.showCurrentValueLabel&&this.labels.middle.className.indexOf("rs-hidden")==-1&&(e.ensureNoIntersection(this.labels.middle,this.labels.left),e.ensureNoIntersection(this.labels.middle,this.labels.right)))}},{key:"_normalize",value:function(e){e=Math.round(Math.min(Math.max(e,this.s.min),this.s.max));var t=(e-this.initialValue)%this.s.step;return t>=this.s.step/2&&(e+=this.s.step),e-=t}},{key:"_getRelX",value:function(e){var t=this.range.getBoundingClientRect(),s=(e-t.left)/t.width;return Math.min(Math.max(s,0),1)}},{key:"_toValue",value:function(e){return this.s.min+(this.s.max-this.s.min)*e}},{key:"_toFraction",value:function(e){return(e-this.s.min)/(this.s.max-this.s.min)}}],[{key:"_el",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"DIV";return document.createElement(e)}},{key:"ensureNoIntersection",value:function(t,s){s.className=s.className.replace("rs-hidden",""),t.className.indexOf("rs-hidden")==-1&&e.intersects(t,s)&&(s.className+=" rs-hidden")}},{key:"toNumber",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;return e=+e,e||0===e||(e=t),e}},{key:"intersects",value:function(e,t){var s=e.getBoundingClientRect(),i=t.getBoundingClientRect();return(this._intersectsRectH(s,i)||this._intersectsRectH(i,s))&&(this._intersectsRectV(s,i)||this._intersectsRectV(i,s))}},{key:"_intersectsRectH",value:function(e,t){return e.left<=t.right&&(e.left>=t.left||e.right>=t.left)}},{key:"_intersectsRectV",value:function(e,t){return e.top<=t.bottom&&(e.top>=t.top||e.bottom>=t.top)}}]),e}(),a=Object.assign||function(e){for(var t=1;t<arguments.length;t++)for(var s in arguments[t])arguments[t].hasOwnProperty(s)&&(e[s]=arguments[t][s]);return e};"function"==typeof define&&define.amd?define(function(){return n}):"undefined"!=typeof module&&module.exports?module.exports=n:e.RangeSlider=n}(window),t.true=e}({},function(){return this}());