12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474 |
- /*! nouislider - 14.0.2 - 6/28/2019 */
- (function(factory) {
- if (typeof define === "function" && define.amd) {
- // AMD. Register as an anonymous module.
- define([], factory);
- } else if (typeof exports === "object") {
- // Node/CommonJS
- module.exports = factory();
- } else {
- // Browser globals
- window.noUiSlider = factory();
- }
- })(function() {
- "use strict";
- var VERSION = "14.0.2";
- //region Helper Methods
- function isValidFormatter(entry) {
- return typeof entry === "object" && typeof entry.to === "function" && typeof entry.from === "function";
- }
- function removeElement(el) {
- el.parentElement.removeChild(el);
- }
- function isSet(value) {
- return value !== null && value !== undefined;
- }
- // Bindable version
- function preventDefault(e) {
- e.preventDefault();
- }
- // Removes duplicates from an array.
- function unique(array) {
- return array.filter(function(a) {
- return !this[a] ? (this[a] = true) : false;
- }, {});
- }
- // Round a value to the closest 'to'.
- function closest(value, to) {
- return Math.round(value / to) * to;
- }
- // Current position of an element relative to the document.
- function offset(elem, orientation) {
- var rect = elem.getBoundingClientRect();
- var doc = elem.ownerDocument;
- var docElem = doc.documentElement;
- var pageOffset = getPageOffset(doc);
- // getBoundingClientRect contains left scroll in Chrome on Android.
- // I haven't found a feature detection that proves this. Worst case
- // scenario on mis-match: the 'tap' feature on horizontal sliders breaks.
- if (/webkit.*Chrome.*Mobile/i.test(navigator.userAgent)) {
- pageOffset.x = 0;
- }
- return orientation
- ? rect.top + pageOffset.y - docElem.clientTop
- : rect.left + pageOffset.x - docElem.clientLeft;
- }
- // Checks whether a value is numerical.
- function isNumeric(a) {
- return typeof a === "number" && !isNaN(a) && isFinite(a);
- }
- // Sets a class and removes it after [duration] ms.
- function addClassFor(element, className, duration) {
- if (duration > 0) {
- addClass(element, className);
- setTimeout(function() {
- removeClass(element, className);
- }, duration);
- }
- }
- // Limits a value to 0 - 100
- function limit(a) {
- return Math.max(Math.min(a, 100), 0);
- }
- // Wraps a variable as an array, if it isn't one yet.
- // Note that an input array is returned by reference!
- function asArray(a) {
- return Array.isArray(a) ? a : [a];
- }
- // Counts decimals
- function countDecimals(numStr) {
- numStr = String(numStr);
- var pieces = numStr.split(".");
- return pieces.length > 1 ? pieces[1].length : 0;
- }
- // http://youmightnotneedjquery.com/#add_class
- function addClass(el, className) {
- if (el.classList) {
- el.classList.add(className);
- } else {
- el.className += " " + className;
- }
- }
- // http://youmightnotneedjquery.com/#remove_class
- function removeClass(el, className) {
- if (el.classList) {
- el.classList.remove(className);
- } else {
- el.className = el.className.replace(
- new RegExp("(^|\\b)" + className.split(" ").join("|") + "(\\b|$)", "gi"),
- " "
- );
- }
- }
- // https://plainjs.com/javascript/attributes/adding-removing-and-testing-for-classes-9/
- function hasClass(el, className) {
- return el.classList
- ? el.classList.contains(className)
- : new RegExp("\\b" + className + "\\b").test(el.className);
- }
- // https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY#Notes
- function getPageOffset(doc) {
- var supportPageOffset = window.pageXOffset !== undefined;
- var isCSS1Compat = (doc.compatMode || "") === "CSS1Compat";
- var x = supportPageOffset
- ? window.pageXOffset
- : isCSS1Compat
- ? doc.documentElement.scrollLeft
- : doc.body.scrollLeft;
- var y = supportPageOffset
- ? window.pageYOffset
- : isCSS1Compat
- ? doc.documentElement.scrollTop
- : doc.body.scrollTop;
- return {
- x: x,
- y: y
- };
- }
- // we provide a function to compute constants instead
- // of accessing window.* as soon as the module needs it
- // so that we do not compute anything if not needed
- function getActions() {
- // Determine the events to bind. IE11 implements pointerEvents without
- // a prefix, which breaks compatibility with the IE10 implementation.
- return window.navigator.pointerEnabled
- ? {
- start: "pointerdown",
- move: "pointermove",
- end: "pointerup"
- }
- : window.navigator.msPointerEnabled
- ? {
- start: "MSPointerDown",
- move: "MSPointerMove",
- end: "MSPointerUp"
- }
- : {
- start: "mousedown touchstart",
- move: "mousemove touchmove",
- end: "mouseup touchend"
- };
- }
- // https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md
- // Issue #785
- function getSupportsPassive() {
- var supportsPassive = false;
- /* eslint-disable */
- try {
- var opts = Object.defineProperty({}, "passive", {
- get: function() {
- supportsPassive = true;
- }
- });
- window.addEventListener("test", null, opts);
- } catch (e) {}
- /* eslint-enable */
- return supportsPassive;
- }
- function getSupportsTouchActionNone() {
- return window.CSS && CSS.supports && CSS.supports("touch-action", "none");
- }
- //endregion
- //region Range Calculation
- // Determine the size of a sub-range in relation to a full range.
- function subRangeRatio(pa, pb) {
- return 100 / (pb - pa);
- }
- // (percentage) How many percent is this value of this range?
- function fromPercentage(range, value) {
- return (value * 100) / (range[1] - range[0]);
- }
- // (percentage) Where is this value on this range?
- function toPercentage(range, value) {
- return fromPercentage(range, range[0] < 0 ? value + Math.abs(range[0]) : value - range[0]);
- }
- // (value) How much is this percentage on this range?
- function isPercentage(range, value) {
- return (value * (range[1] - range[0])) / 100 + range[0];
- }
- function getJ(value, arr) {
- var j = 1;
- while (value >= arr[j]) {
- j += 1;
- }
- return j;
- }
- // (percentage) Input a value, find where, on a scale of 0-100, it applies.
- function toStepping(xVal, xPct, value) {
- if (value >= xVal.slice(-1)[0]) {
- return 100;
- }
- var j = getJ(value, xVal);
- var va = xVal[j - 1];
- var vb = xVal[j];
- var pa = xPct[j - 1];
- var pb = xPct[j];
- return pa + toPercentage([va, vb], value) / subRangeRatio(pa, pb);
- }
- // (value) Input a percentage, find where it is on the specified range.
- function fromStepping(xVal, xPct, value) {
- // There is no range group that fits 100
- if (value >= 100) {
- return xVal.slice(-1)[0];
- }
- var j = getJ(value, xPct);
- var va = xVal[j - 1];
- var vb = xVal[j];
- var pa = xPct[j - 1];
- var pb = xPct[j];
- return isPercentage([va, vb], (value - pa) * subRangeRatio(pa, pb));
- }
- // (percentage) Get the step that applies at a certain value.
- function getStep(xPct, xSteps, snap, value) {
- if (value === 100) {
- return value;
- }
- var j = getJ(value, xPct);
- var a = xPct[j - 1];
- var b = xPct[j];
- // If 'snap' is set, steps are used as fixed points on the slider.
- if (snap) {
- // Find the closest position, a or b.
- if (value - a > (b - a) / 2) {
- return b;
- }
- return a;
- }
- if (!xSteps[j - 1]) {
- return value;
- }
- return xPct[j - 1] + closest(value - xPct[j - 1], xSteps[j - 1]);
- }
- function handleEntryPoint(index, value, that) {
- var percentage;
- // Wrap numerical input in an array.
- if (typeof value === "number") {
- value = [value];
- }
- // Reject any invalid input, by testing whether value is an array.
- if (!Array.isArray(value)) {
- throw new Error("noUiSlider (" + VERSION + "): 'range' contains invalid value.");
- }
- // Covert min/max syntax to 0 and 100.
- if (index === "min") {
- percentage = 0;
- } else if (index === "max") {
- percentage = 100;
- } else {
- percentage = parseFloat(index);
- }
- // Check for correct input.
- if (!isNumeric(percentage) || !isNumeric(value[0])) {
- throw new Error("noUiSlider (" + VERSION + "): 'range' value isn't numeric.");
- }
- // Store values.
- that.xPct.push(percentage);
- that.xVal.push(value[0]);
- // NaN will evaluate to false too, but to keep
- // logging clear, set step explicitly. Make sure
- // not to override the 'step' setting with false.
- if (!percentage) {
- if (!isNaN(value[1])) {
- that.xSteps[0] = value[1];
- }
- } else {
- that.xSteps.push(isNaN(value[1]) ? false : value[1]);
- }
- that.xHighestCompleteStep.push(0);
- }
- function handleStepPoint(i, n, that) {
- // Ignore 'false' stepping.
- if (!n) {
- return;
- }
- // Step over zero-length ranges (#948);
- if (that.xVal[i] === that.xVal[i + 1]) {
- that.xSteps[i] = that.xHighestCompleteStep[i] = that.xVal[i];
- return;
- }
- // Factor to range ratio
- that.xSteps[i] =
- fromPercentage([that.xVal[i], that.xVal[i + 1]], n) / subRangeRatio(that.xPct[i], that.xPct[i + 1]);
- var totalSteps = (that.xVal[i + 1] - that.xVal[i]) / that.xNumSteps[i];
- var highestStep = Math.ceil(Number(totalSteps.toFixed(3)) - 1);
- var step = that.xVal[i] + that.xNumSteps[i] * highestStep;
- that.xHighestCompleteStep[i] = step;
- }
- //endregion
- //region Spectrum
- function Spectrum(entry, snap, singleStep) {
- this.xPct = [];
- this.xVal = [];
- this.xSteps = [singleStep || false];
- this.xNumSteps = [false];
- this.xHighestCompleteStep = [];
- this.snap = snap;
- var index;
- var ordered = []; // [0, 'min'], [1, '50%'], [2, 'max']
- // Map the object keys to an array.
- for (index in entry) {
- if (entry.hasOwnProperty(index)) {
- ordered.push([entry[index], index]);
- }
- }
- // Sort all entries by value (numeric sort).
- if (ordered.length && typeof ordered[0][0] === "object") {
- ordered.sort(function(a, b) {
- return a[0][0] - b[0][0];
- });
- } else {
- ordered.sort(function(a, b) {
- return a[0] - b[0];
- });
- }
- // Convert all entries to subranges.
- for (index = 0; index < ordered.length; index++) {
- handleEntryPoint(ordered[index][1], ordered[index][0], this);
- }
- // Store the actual step values.
- // xSteps is sorted in the same order as xPct and xVal.
- this.xNumSteps = this.xSteps.slice(0);
- // Convert all numeric steps to the percentage of the subrange they represent.
- for (index = 0; index < this.xNumSteps.length; index++) {
- handleStepPoint(index, this.xNumSteps[index], this);
- }
- }
- Spectrum.prototype.getMargin = function(value) {
- var step = this.xNumSteps[0];
- if (step && (value / step) % 1 !== 0) {
- throw new Error("noUiSlider (" + VERSION + "): 'limit', 'margin' and 'padding' must be divisible by step.");
- }
- return this.xPct.length === 2 ? fromPercentage(this.xVal, value) : false;
- };
- Spectrum.prototype.toStepping = function(value) {
- value = toStepping(this.xVal, this.xPct, value);
- return value;
- };
- Spectrum.prototype.fromStepping = function(value) {
- return fromStepping(this.xVal, this.xPct, value);
- };
- Spectrum.prototype.getStep = function(value) {
- value = getStep(this.xPct, this.xSteps, this.snap, value);
- return value;
- };
- Spectrum.prototype.getDefaultStep = function(value, isDown, size) {
- var j = getJ(value, this.xPct);
- // When at the top or stepping down, look at the previous sub-range
- if (value === 100 || (isDown && value === this.xPct[j - 1])) {
- j = Math.max(j - 1, 1);
- }
- return (this.xVal[j] - this.xVal[j - 1]) / size;
- };
- Spectrum.prototype.getNearbySteps = function(value) {
- var j = getJ(value, this.xPct);
- return {
- stepBefore: {
- startValue: this.xVal[j - 2],
- step: this.xNumSteps[j - 2],
- highestStep: this.xHighestCompleteStep[j - 2]
- },
- thisStep: {
- startValue: this.xVal[j - 1],
- step: this.xNumSteps[j - 1],
- highestStep: this.xHighestCompleteStep[j - 1]
- },
- stepAfter: {
- startValue: this.xVal[j],
- step: this.xNumSteps[j],
- highestStep: this.xHighestCompleteStep[j]
- }
- };
- };
- Spectrum.prototype.countStepDecimals = function() {
- var stepDecimals = this.xNumSteps.map(countDecimals);
- return Math.max.apply(null, stepDecimals);
- };
- // Outside testing
- Spectrum.prototype.convert = function(value) {
- return this.getStep(this.toStepping(value));
- };
- //endregion
- //region Options
- /* Every input option is tested and parsed. This'll prevent
- endless validation in internal methods. These tests are
- structured with an item for every option available. An
- option can be marked as required by setting the 'r' flag.
- The testing function is provided with three arguments:
- - The provided value for the option;
- - A reference to the options object;
- - The name for the option;
- The testing function returns false when an error is detected,
- or true when everything is OK. It can also modify the option
- object, to make sure all values can be correctly looped elsewhere. */
- var defaultFormatter = {
- to: function(value) {
- return value !== undefined && value.toFixed(2);
- },
- from: Number
- };
- function validateFormat(entry) {
- // Any object with a to and from method is supported.
- if (isValidFormatter(entry)) {
- return true;
- }
- throw new Error("noUiSlider (" + VERSION + "): 'format' requires 'to' and 'from' methods.");
- }
- function testStep(parsed, entry) {
- if (!isNumeric(entry)) {
- throw new Error("noUiSlider (" + VERSION + "): 'step' is not numeric.");
- }
- // The step option can still be used to set stepping
- // for linear sliders. Overwritten if set in 'range'.
- parsed.singleStep = entry;
- }
- function testRange(parsed, entry) {
- // Filter incorrect input.
- if (typeof entry !== "object" || Array.isArray(entry)) {
- throw new Error("noUiSlider (" + VERSION + "): 'range' is not an object.");
- }
- // Catch missing start or end.
- if (entry.min === undefined || entry.max === undefined) {
- throw new Error("noUiSlider (" + VERSION + "): Missing 'min' or 'max' in 'range'.");
- }
- // Catch equal start or end.
- if (entry.min === entry.max) {
- throw new Error("noUiSlider (" + VERSION + "): 'range' 'min' and 'max' cannot be equal.");
- }
- parsed.spectrum = new Spectrum(entry, parsed.snap, parsed.singleStep);
- }
- function testStart(parsed, entry) {
- entry = asArray(entry);
- // Validate input. Values aren't tested, as the public .val method
- // will always provide a valid location.
- if (!Array.isArray(entry) || !entry.length) {
- throw new Error("noUiSlider (" + VERSION + "): 'start' option is incorrect.");
- }
- // Store the number of handles.
- parsed.handles = entry.length;
- // When the slider is initialized, the .val method will
- // be called with the start options.
- parsed.start = entry;
- }
- function testSnap(parsed, entry) {
- // Enforce 100% stepping within subranges.
- parsed.snap = entry;
- if (typeof entry !== "boolean") {
- throw new Error("noUiSlider (" + VERSION + "): 'snap' option must be a boolean.");
- }
- }
- function testAnimate(parsed, entry) {
- // Enforce 100% stepping within subranges.
- parsed.animate = entry;
- if (typeof entry !== "boolean") {
- throw new Error("noUiSlider (" + VERSION + "): 'animate' option must be a boolean.");
- }
- }
- function testAnimationDuration(parsed, entry) {
- parsed.animationDuration = entry;
- if (typeof entry !== "number") {
- throw new Error("noUiSlider (" + VERSION + "): 'animationDuration' option must be a number.");
- }
- }
- function testConnect(parsed, entry) {
- var connect = [false];
- var i;
- // Map legacy options
- if (entry === "lower") {
- entry = [true, false];
- } else if (entry === "upper") {
- entry = [false, true];
- }
- // Handle boolean options
- if (entry === true || entry === false) {
- for (i = 1; i < parsed.handles; i++) {
- connect.push(entry);
- }
- connect.push(false);
- }
- // Reject invalid input
- else if (!Array.isArray(entry) || !entry.length || entry.length !== parsed.handles + 1) {
- throw new Error("noUiSlider (" + VERSION + "): 'connect' option doesn't match handle count.");
- } else {
- connect = entry;
- }
- parsed.connect = connect;
- }
- function testOrientation(parsed, entry) {
- // Set orientation to an a numerical value for easy
- // array selection.
- switch (entry) {
- case "horizontal":
- parsed.ort = 0;
- break;
- case "vertical":
- parsed.ort = 1;
- break;
- default:
- throw new Error("noUiSlider (" + VERSION + "): 'orientation' option is invalid.");
- }
- }
- function testMargin(parsed, entry) {
- if (!isNumeric(entry)) {
- throw new Error("noUiSlider (" + VERSION + "): 'margin' option must be numeric.");
- }
- // Issue #582
- if (entry === 0) {
- return;
- }
- parsed.margin = parsed.spectrum.getMargin(entry);
- if (!parsed.margin) {
- throw new Error("noUiSlider (" + VERSION + "): 'margin' option is only supported on linear sliders.");
- }
- }
- function testLimit(parsed, entry) {
- if (!isNumeric(entry)) {
- throw new Error("noUiSlider (" + VERSION + "): 'limit' option must be numeric.");
- }
- parsed.limit = parsed.spectrum.getMargin(entry);
- if (!parsed.limit || parsed.handles < 2) {
- throw new Error(
- "noUiSlider (" +
- VERSION +
- "): 'limit' option is only supported on linear sliders with 2 or more handles."
- );
- }
- }
- function testPadding(parsed, entry) {
- if (!isNumeric(entry) && !Array.isArray(entry)) {
- throw new Error(
- "noUiSlider (" + VERSION + "): 'padding' option must be numeric or array of exactly 2 numbers."
- );
- }
- if (Array.isArray(entry) && !(entry.length === 2 || isNumeric(entry[0]) || isNumeric(entry[1]))) {
- throw new Error(
- "noUiSlider (" + VERSION + "): 'padding' option must be numeric or array of exactly 2 numbers."
- );
- }
- if (entry === 0) {
- return;
- }
- if (!Array.isArray(entry)) {
- entry = [entry, entry];
- }
- // 'getMargin' returns false for invalid values.
- parsed.padding = [parsed.spectrum.getMargin(entry[0]), parsed.spectrum.getMargin(entry[1])];
- if (parsed.padding[0] === false || parsed.padding[1] === false) {
- throw new Error("noUiSlider (" + VERSION + "): 'padding' option is only supported on linear sliders.");
- }
- if (parsed.padding[0] < 0 || parsed.padding[1] < 0) {
- throw new Error("noUiSlider (" + VERSION + "): 'padding' option must be a positive number(s).");
- }
- if (parsed.padding[0] + parsed.padding[1] > 100) {
- throw new Error("noUiSlider (" + VERSION + "): 'padding' option must not exceed 100% of the range.");
- }
- }
- function testDirection(parsed, entry) {
- // Set direction as a numerical value for easy parsing.
- // Invert connection for RTL sliders, so that the proper
- // handles get the connect/background classes.
- switch (entry) {
- case "ltr":
- parsed.dir = 0;
- break;
- case "rtl":
- parsed.dir = 1;
- break;
- default:
- throw new Error("noUiSlider (" + VERSION + "): 'direction' option was not recognized.");
- }
- }
- function testBehaviour(parsed, entry) {
- // Make sure the input is a string.
- if (typeof entry !== "string") {
- throw new Error("noUiSlider (" + VERSION + "): 'behaviour' must be a string containing options.");
- }
- // Check if the string contains any keywords.
- // None are required.
- var tap = entry.indexOf("tap") >= 0;
- var drag = entry.indexOf("drag") >= 0;
- var fixed = entry.indexOf("fixed") >= 0;
- var snap = entry.indexOf("snap") >= 0;
- var hover = entry.indexOf("hover") >= 0;
- var unconstrained = entry.indexOf("unconstrained") >= 0;
- if (fixed) {
- if (parsed.handles !== 2) {
- throw new Error("noUiSlider (" + VERSION + "): 'fixed' behaviour must be used with 2 handles");
- }
- // Use margin to enforce fixed state
- testMargin(parsed, parsed.start[1] - parsed.start[0]);
- }
- if (unconstrained && (parsed.margin || parsed.limit)) {
- throw new Error(
- "noUiSlider (" + VERSION + "): 'unconstrained' behaviour cannot be used with margin or limit"
- );
- }
- parsed.events = {
- tap: tap || snap,
- drag: drag,
- fixed: fixed,
- snap: snap,
- hover: hover,
- unconstrained: unconstrained
- };
- }
- function testTooltips(parsed, entry) {
- if (entry === false) {
- return;
- }
- if (entry === true) {
- parsed.tooltips = [];
- for (var i = 0; i < parsed.handles; i++) {
- parsed.tooltips.push(true);
- }
- } else {
- parsed.tooltips = asArray(entry);
- if (parsed.tooltips.length !== parsed.handles) {
- throw new Error("noUiSlider (" + VERSION + "): must pass a formatter for all handles.");
- }
- parsed.tooltips.forEach(function(formatter) {
- if (
- typeof formatter !== "boolean" &&
- (typeof formatter !== "object" || typeof formatter.to !== "function")
- ) {
- throw new Error("noUiSlider (" + VERSION + "): 'tooltips' must be passed a formatter or 'false'.");
- }
- });
- }
- }
- function testAriaFormat(parsed, entry) {
- parsed.ariaFormat = entry;
- validateFormat(entry);
- }
- function testFormat(parsed, entry) {
- parsed.format = entry;
- validateFormat(entry);
- }
- function testKeyboardSupport(parsed, entry) {
- parsed.keyboardSupport = entry;
- if (typeof entry !== "boolean") {
- throw new Error("noUiSlider (" + VERSION + "): 'keyboardSupport' option must be a boolean.");
- }
- }
- function testDocumentElement(parsed, entry) {
- // This is an advanced option. Passed values are used without validation.
- parsed.documentElement = entry;
- }
- function testCssPrefix(parsed, entry) {
- if (typeof entry !== "string" && entry !== false) {
- throw new Error("noUiSlider (" + VERSION + "): 'cssPrefix' must be a string or `false`.");
- }
- parsed.cssPrefix = entry;
- }
- function testCssClasses(parsed, entry) {
- if (typeof entry !== "object") {
- throw new Error("noUiSlider (" + VERSION + "): 'cssClasses' must be an object.");
- }
- if (typeof parsed.cssPrefix === "string") {
- parsed.cssClasses = {};
- for (var key in entry) {
- if (!entry.hasOwnProperty(key)) {
- continue;
- }
- parsed.cssClasses[key] = parsed.cssPrefix + entry[key];
- }
- } else {
- parsed.cssClasses = entry;
- }
- }
- // Test all developer settings and parse to assumption-safe values.
- function testOptions(options) {
- // To prove a fix for #537, freeze options here.
- // If the object is modified, an error will be thrown.
- // Object.freeze(options);
- var parsed = {
- margin: 0,
- limit: 0,
- padding: 0,
- animate: true,
- animationDuration: 300,
- ariaFormat: defaultFormatter,
- format: defaultFormatter
- };
- // Tests are executed in the order they are presented here.
- var tests = {
- step: { r: false, t: testStep },
- start: { r: true, t: testStart },
- connect: { r: true, t: testConnect },
- direction: { r: true, t: testDirection },
- snap: { r: false, t: testSnap },
- animate: { r: false, t: testAnimate },
- animationDuration: { r: false, t: testAnimationDuration },
- range: { r: true, t: testRange },
- orientation: { r: false, t: testOrientation },
- margin: { r: false, t: testMargin },
- limit: { r: false, t: testLimit },
- padding: { r: false, t: testPadding },
- behaviour: { r: true, t: testBehaviour },
- ariaFormat: { r: false, t: testAriaFormat },
- format: { r: false, t: testFormat },
- tooltips: { r: false, t: testTooltips },
- keyboardSupport: { r: true, t: testKeyboardSupport },
- documentElement: { r: false, t: testDocumentElement },
- cssPrefix: { r: true, t: testCssPrefix },
- cssClasses: { r: true, t: testCssClasses }
- };
- var defaults = {
- connect: false,
- direction: "ltr",
- behaviour: "tap",
- orientation: "horizontal",
- keyboardSupport: true,
- cssPrefix: "noUi-",
- cssClasses: {
- target: "target",
- base: "base",
- origin: "origin",
- handle: "handle",
- handleLower: "handle-lower",
- handleUpper: "handle-upper",
- touchArea: "touch-area",
- horizontal: "horizontal",
- vertical: "vertical",
- background: "background",
- connect: "connect",
- connects: "connects",
- ltr: "ltr",
- rtl: "rtl",
- draggable: "draggable",
- drag: "state-drag",
- tap: "state-tap",
- active: "active",
- tooltip: "tooltip",
- pips: "pips",
- pipsHorizontal: "pips-horizontal",
- pipsVertical: "pips-vertical",
- marker: "marker",
- markerHorizontal: "marker-horizontal",
- markerVertical: "marker-vertical",
- markerNormal: "marker-normal",
- markerLarge: "marker-large",
- markerSub: "marker-sub",
- value: "value",
- valueHorizontal: "value-horizontal",
- valueVertical: "value-vertical",
- valueNormal: "value-normal",
- valueLarge: "value-large",
- valueSub: "value-sub"
- }
- };
- // AriaFormat defaults to regular format, if any.
- if (options.format && !options.ariaFormat) {
- options.ariaFormat = options.format;
- }
- // Run all options through a testing mechanism to ensure correct
- // input. It should be noted that options might get modified to
- // be handled properly. E.g. wrapping integers in arrays.
- Object.keys(tests).forEach(function(name) {
- // If the option isn't set, but it is required, throw an error.
- if (!isSet(options[name]) && defaults[name] === undefined) {
- if (tests[name].r) {
- throw new Error("noUiSlider (" + VERSION + "): '" + name + "' is required.");
- }
- return true;
- }
- tests[name].t(parsed, !isSet(options[name]) ? defaults[name] : options[name]);
- });
- // Forward pips options
- parsed.pips = options.pips;
- // All recent browsers accept unprefixed transform.
- // We need -ms- for IE9 and -webkit- for older Android;
- // Assume use of -webkit- if unprefixed and -ms- are not supported.
- // https://caniuse.com/#feat=transforms2d
- var d = document.createElement("div");
- var msPrefix = d.style.msTransform !== undefined;
- var noPrefix = d.style.transform !== undefined;
- parsed.transformRule = noPrefix ? "transform" : msPrefix ? "msTransform" : "webkitTransform";
- // Pips don't move, so we can place them using left/top.
- var styles = [["left", "top"], ["right", "bottom"]];
- parsed.style = styles[parsed.dir][parsed.ort];
- return parsed;
- }
- //endregion
- function scope(target, options, originalOptions) {
- var actions = getActions();
- var supportsTouchActionNone = getSupportsTouchActionNone();
- var supportsPassive = supportsTouchActionNone && getSupportsPassive();
- // All variables local to 'scope' are prefixed with 'scope_'
- // Slider DOM Nodes
- var scope_Target = target;
- var scope_Base;
- var scope_Handles;
- var scope_Connects;
- var scope_Pips;
- var scope_Tooltips;
- // Slider state values
- var scope_Spectrum = options.spectrum;
- var scope_Values = [];
- var scope_Locations = [];
- var scope_HandleNumbers = [];
- var scope_ActiveHandlesCount = 0;
- var scope_Events = {};
- // Exposed API
- var scope_Self;
- // Document Nodes
- var scope_Document = target.ownerDocument;
- var scope_DocumentElement = options.documentElement || scope_Document.documentElement;
- var scope_Body = scope_Document.body;
- // Pips constants
- var PIPS_NONE = -1;
- var PIPS_NO_VALUE = 0;
- var PIPS_LARGE_VALUE = 1;
- var PIPS_SMALL_VALUE = 2;
- // For horizontal sliders in standard ltr documents,
- // make .noUi-origin overflow to the left so the document doesn't scroll.
- var scope_DirOffset = scope_Document.dir === "rtl" || options.ort === 1 ? 0 : 100;
- // Creates a node, adds it to target, returns the new node.
- function addNodeTo(addTarget, className) {
- var div = scope_Document.createElement("div");
- if (className) {
- addClass(div, className);
- }
- addTarget.appendChild(div);
- return div;
- }
- // Append a origin to the base
- function addOrigin(base, handleNumber) {
- var origin = addNodeTo(base, options.cssClasses.origin);
- var handle = addNodeTo(origin, options.cssClasses.handle);
- addNodeTo(handle, options.cssClasses.touchArea);
- handle.setAttribute("data-handle", handleNumber);
- if (options.keyboardSupport) {
- // https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
- // 0 = focusable and reachable
- handle.setAttribute("tabindex", "0");
- handle.addEventListener("keydown", function(event) {
- return eventKeydown(event, handleNumber);
- });
- }
- handle.setAttribute("role", "slider");
- handle.setAttribute("aria-orientation", options.ort ? "vertical" : "horizontal");
- if (handleNumber === 0) {
- addClass(handle, options.cssClasses.handleLower);
- } else if (handleNumber === options.handles - 1) {
- addClass(handle, options.cssClasses.handleUpper);
- }
- return origin;
- }
- // Insert nodes for connect elements
- function addConnect(base, add) {
- if (!add) {
- return false;
- }
- return addNodeTo(base, options.cssClasses.connect);
- }
- // Add handles to the slider base.
- function addElements(connectOptions, base) {
- var connectBase = addNodeTo(base, options.cssClasses.connects);
- scope_Handles = [];
- scope_Connects = [];
- scope_Connects.push(addConnect(connectBase, connectOptions[0]));
- // [::::O====O====O====]
- // connectOptions = [0, 1, 1, 1]
- for (var i = 0; i < options.handles; i++) {
- // Keep a list of all added handles.
- scope_Handles.push(addOrigin(base, i));
- scope_HandleNumbers[i] = i;
- scope_Connects.push(addConnect(connectBase, connectOptions[i + 1]));
- }
- }
- // Initialize a single slider.
- function addSlider(addTarget) {
- // Apply classes and data to the target.
- addClass(addTarget, options.cssClasses.target);
- if (options.dir === 0) {
- addClass(addTarget, options.cssClasses.ltr);
- } else {
- addClass(addTarget, options.cssClasses.rtl);
- }
- if (options.ort === 0) {
- addClass(addTarget, options.cssClasses.horizontal);
- } else {
- addClass(addTarget, options.cssClasses.vertical);
- }
- return addNodeTo(addTarget, options.cssClasses.base);
- }
- function addTooltip(handle, handleNumber) {
- if (!options.tooltips[handleNumber]) {
- return false;
- }
- return addNodeTo(handle.firstChild, options.cssClasses.tooltip);
- }
- function isSliderDisabled() {
- return scope_Target.hasAttribute("disabled");
- }
- // Disable the slider dragging if any handle is disabled
- function isHandleDisabled(handleNumber) {
- var handleOrigin = scope_Handles[handleNumber];
- return handleOrigin.hasAttribute("disabled");
- }
- function removeTooltips() {
- if (scope_Tooltips) {
- removeEvent("update.tooltips");
- scope_Tooltips.forEach(function(tooltip) {
- if (tooltip) {
- removeElement(tooltip);
- }
- });
- scope_Tooltips = null;
- }
- }
- // The tooltips option is a shorthand for using the 'update' event.
- function tooltips() {
- removeTooltips();
- // Tooltips are added with options.tooltips in original order.
- scope_Tooltips = scope_Handles.map(addTooltip);
- bindEvent("update.tooltips", function(values, handleNumber, unencoded) {
- if (!scope_Tooltips[handleNumber]) {
- return;
- }
- var formattedValue = values[handleNumber];
- if (options.tooltips[handleNumber] !== true) {
- formattedValue = options.tooltips[handleNumber].to(unencoded[handleNumber]);
- }
- scope_Tooltips[handleNumber].innerHTML = formattedValue;
- });
- }
- function aria() {
- bindEvent("update", function(values, handleNumber, unencoded, tap, positions) {
- // Update Aria Values for all handles, as a change in one changes min and max values for the next.
- scope_HandleNumbers.forEach(function(index) {
- var handle = scope_Handles[index];
- var min = checkHandlePosition(scope_Locations, index, 0, true, true, true);
- var max = checkHandlePosition(scope_Locations, index, 100, true, true, true);
- var now = positions[index];
- // Formatted value for display
- var text = options.ariaFormat.to(unencoded[index]);
- // Map to slider range values
- min = scope_Spectrum.fromStepping(min).toFixed(1);
- max = scope_Spectrum.fromStepping(max).toFixed(1);
- now = scope_Spectrum.fromStepping(now).toFixed(1);
- handle.children[0].setAttribute("aria-valuemin", min);
- handle.children[0].setAttribute("aria-valuemax", max);
- handle.children[0].setAttribute("aria-valuenow", now);
- handle.children[0].setAttribute("aria-valuetext", text);
- });
- });
- }
- function getGroup(mode, values, stepped) {
- // Use the range.
- if (mode === "range" || mode === "steps") {
- return scope_Spectrum.xVal;
- }
- if (mode === "count") {
- if (values < 2) {
- throw new Error("noUiSlider (" + VERSION + "): 'values' (>= 2) required for mode 'count'.");
- }
- // Divide 0 - 100 in 'count' parts.
- var interval = values - 1;
- var spread = 100 / interval;
- values = [];
- // List these parts and have them handled as 'positions'.
- while (interval--) {
- values[interval] = interval * spread;
- }
- values.push(100);
- mode = "positions";
- }
- if (mode === "positions") {
- // Map all percentages to on-range values.
- return values.map(function(value) {
- return scope_Spectrum.fromStepping(stepped ? scope_Spectrum.getStep(value) : value);
- });
- }
- if (mode === "values") {
- // If the value must be stepped, it needs to be converted to a percentage first.
- if (stepped) {
- return values.map(function(value) {
- // Convert to percentage, apply step, return to value.
- return scope_Spectrum.fromStepping(scope_Spectrum.getStep(scope_Spectrum.toStepping(value)));
- });
- }
- // Otherwise, we can simply use the values.
- return values;
- }
- }
- function generateSpread(density, mode, group) {
- function safeIncrement(value, increment) {
- // Avoid floating point variance by dropping the smallest decimal places.
- return (value + increment).toFixed(7) / 1;
- }
- var indexes = {};
- var firstInRange = scope_Spectrum.xVal[0];
- var lastInRange = scope_Spectrum.xVal[scope_Spectrum.xVal.length - 1];
- var ignoreFirst = false;
- var ignoreLast = false;
- var prevPct = 0;
- // Create a copy of the group, sort it and filter away all duplicates.
- group = unique(
- group.slice().sort(function(a, b) {
- return a - b;
- })
- );
- // Make sure the range starts with the first element.
- if (group[0] !== firstInRange) {
- group.unshift(firstInRange);
- ignoreFirst = true;
- }
- // Likewise for the last one.
- if (group[group.length - 1] !== lastInRange) {
- group.push(lastInRange);
- ignoreLast = true;
- }
- group.forEach(function(current, index) {
- // Get the current step and the lower + upper positions.
- var step;
- var i;
- var q;
- var low = current;
- var high = group[index + 1];
- var newPct;
- var pctDifference;
- var pctPos;
- var type;
- var steps;
- var realSteps;
- var stepSize;
- var isSteps = mode === "steps";
- // When using 'steps' mode, use the provided steps.
- // Otherwise, we'll step on to the next subrange.
- if (isSteps) {
- step = scope_Spectrum.xNumSteps[index];
- }
- // Default to a 'full' step.
- if (!step) {
- step = high - low;
- }
- // Low can be 0, so test for false. If high is undefined,
- // we are at the last subrange. Index 0 is already handled.
- if (low === false || high === undefined) {
- return;
- }
- // Make sure step isn't 0, which would cause an infinite loop (#654)
- step = Math.max(step, 0.0000001);
- // Find all steps in the subrange.
- for (i = low; i <= high; i = safeIncrement(i, step)) {
- // Get the percentage value for the current step,
- // calculate the size for the subrange.
- newPct = scope_Spectrum.toStepping(i);
- pctDifference = newPct - prevPct;
- steps = pctDifference / density;
- realSteps = Math.round(steps);
- // This ratio represents the amount of percentage-space a point indicates.
- // For a density 1 the points/percentage = 1. For density 2, that percentage needs to be re-divided.
- // Round the percentage offset to an even number, then divide by two
- // to spread the offset on both sides of the range.
- stepSize = pctDifference / realSteps;
- // Divide all points evenly, adding the correct number to this subrange.
- // Run up to <= so that 100% gets a point, event if ignoreLast is set.
- for (q = 1; q <= realSteps; q += 1) {
- // The ratio between the rounded value and the actual size might be ~1% off.
- // Correct the percentage offset by the number of points
- // per subrange. density = 1 will result in 100 points on the
- // full range, 2 for 50, 4 for 25, etc.
- pctPos = prevPct + q * stepSize;
- indexes[pctPos.toFixed(5)] = [scope_Spectrum.fromStepping(pctPos), 0];
- }
- // Determine the point type.
- type = group.indexOf(i) > -1 ? PIPS_LARGE_VALUE : isSteps ? PIPS_SMALL_VALUE : PIPS_NO_VALUE;
- // Enforce the 'ignoreFirst' option by overwriting the type for 0.
- if (!index && ignoreFirst) {
- type = 0;
- }
- if (!(i === high && ignoreLast)) {
- // Mark the 'type' of this point. 0 = plain, 1 = real value, 2 = step value.
- indexes[newPct.toFixed(5)] = [i, type];
- }
- // Update the percentage count.
- prevPct = newPct;
- }
- });
- return indexes;
- }
- function addMarking(spread, filterFunc, formatter) {
- var element = scope_Document.createElement("div");
- var valueSizeClasses = [];
- valueSizeClasses[PIPS_NO_VALUE] = options.cssClasses.valueNormal;
- valueSizeClasses[PIPS_LARGE_VALUE] = options.cssClasses.valueLarge;
- valueSizeClasses[PIPS_SMALL_VALUE] = options.cssClasses.valueSub;
- var markerSizeClasses = [];
- markerSizeClasses[PIPS_NO_VALUE] = options.cssClasses.markerNormal;
- markerSizeClasses[PIPS_LARGE_VALUE] = options.cssClasses.markerLarge;
- markerSizeClasses[PIPS_SMALL_VALUE] = options.cssClasses.markerSub;
- var valueOrientationClasses = [options.cssClasses.valueHorizontal, options.cssClasses.valueVertical];
- var markerOrientationClasses = [options.cssClasses.markerHorizontal, options.cssClasses.markerVertical];
- addClass(element, options.cssClasses.pips);
- addClass(element, options.ort === 0 ? options.cssClasses.pipsHorizontal : options.cssClasses.pipsVertical);
- function getClasses(type, source) {
- var a = source === options.cssClasses.value;
- var orientationClasses = a ? valueOrientationClasses : markerOrientationClasses;
- var sizeClasses = a ? valueSizeClasses : markerSizeClasses;
- return source + " " + orientationClasses[options.ort] + " " + sizeClasses[type];
- }
- function addSpread(offset, value, type) {
- // Apply the filter function, if it is set.
- type = filterFunc ? filterFunc(value, type) : type;
- if (type === PIPS_NONE) {
- return;
- }
- // Add a marker for every point
- var node = addNodeTo(element, false);
- node.className = getClasses(type, options.cssClasses.marker);
- node.style[options.style] = offset + "%";
- // Values are only appended for points marked '1' or '2'.
- if (type > PIPS_NO_VALUE) {
- node = addNodeTo(element, false);
- node.className = getClasses(type, options.cssClasses.value);
- node.setAttribute("data-value", value);
- node.style[options.style] = offset + "%";
- node.innerHTML = formatter.to(value);
- }
- }
- // Append all points.
- Object.keys(spread).forEach(function(offset) {
- addSpread(offset, spread[offset][0], spread[offset][1]);
- });
- return element;
- }
- function removePips() {
- if (scope_Pips) {
- removeElement(scope_Pips);
- scope_Pips = null;
- }
- }
- function pips(grid) {
- // Fix #669
- removePips();
- var mode = grid.mode;
- var density = grid.density || 1;
- var filter = grid.filter || false;
- var values = grid.values || false;
- var stepped = grid.stepped || false;
- var group = getGroup(mode, values, stepped);
- var spread = generateSpread(density, mode, group);
- var format = grid.format || {
- to: Math.round
- };
- scope_Pips = scope_Target.appendChild(addMarking(spread, filter, format));
- return scope_Pips;
- }
- // Shorthand for base dimensions.
- function baseSize() {
- var rect = scope_Base.getBoundingClientRect();
- var alt = "offset" + ["Width", "Height"][options.ort];
- return options.ort === 0 ? rect.width || scope_Base[alt] : rect.height || scope_Base[alt];
- }
- // Handler for attaching events trough a proxy.
- function attachEvent(events, element, callback, data) {
- // This function can be used to 'filter' events to the slider.
- // element is a node, not a nodeList
- var method = function(e) {
- e = fixEvent(e, data.pageOffset, data.target || element);
- // fixEvent returns false if this event has a different target
- // when handling (multi-) touch events;
- if (!e) {
- return false;
- }
- // doNotReject is passed by all end events to make sure released touches
- // are not rejected, leaving the slider "stuck" to the cursor;
- if (isSliderDisabled() && !data.doNotReject) {
- return false;
- }
- // Stop if an active 'tap' transition is taking place.
- if (hasClass(scope_Target, options.cssClasses.tap) && !data.doNotReject) {
- return false;
- }
- // Ignore right or middle clicks on start #454
- if (events === actions.start && e.buttons !== undefined && e.buttons > 1) {
- return false;
- }
- // Ignore right or middle clicks on start #454
- if (data.hover && e.buttons) {
- return false;
- }
- // 'supportsPassive' is only true if a browser also supports touch-action: none in CSS.
- // iOS safari does not, so it doesn't get to benefit from passive scrolling. iOS does support
- // touch-action: manipulation, but that allows panning, which breaks
- // sliders after zooming/on non-responsive pages.
- // See: https://bugs.webkit.org/show_bug.cgi?id=133112
- if (!supportsPassive) {
- e.preventDefault();
- }
- e.calcPoint = e.points[options.ort];
- // Call the event handler with the event [ and additional data ].
- callback(e, data);
- };
- var methods = [];
- // Bind a closure on the target for every event type.
- events.split(" ").forEach(function(eventName) {
- element.addEventListener(eventName, method, supportsPassive ? { passive: true } : false);
- methods.push([eventName, method]);
- });
- return methods;
- }
- // Provide a clean event with standardized offset values.
- function fixEvent(e, pageOffset, eventTarget) {
- // Filter the event to register the type, which can be
- // touch, mouse or pointer. Offset changes need to be
- // made on an event specific basis.
- var touch = e.type.indexOf("touch") === 0;
- var mouse = e.type.indexOf("mouse") === 0;
- var pointer = e.type.indexOf("pointer") === 0;
- var x;
- var y;
- // IE10 implemented pointer events with a prefix;
- if (e.type.indexOf("MSPointer") === 0) {
- pointer = true;
- }
- // The only thing one handle should be concerned about is the touches that originated on top of it.
- if (touch) {
- // Returns true if a touch originated on the target.
- var isTouchOnTarget = function(checkTouch) {
- return checkTouch.target === eventTarget || eventTarget.contains(checkTouch.target);
- };
- // In the case of touchstart events, we need to make sure there is still no more than one
- // touch on the target so we look amongst all touches.
- if (e.type === "touchstart") {
- var targetTouches = Array.prototype.filter.call(e.touches, isTouchOnTarget);
- // Do not support more than one touch per handle.
- if (targetTouches.length > 1) {
- return false;
- }
- x = targetTouches[0].pageX;
- y = targetTouches[0].pageY;
- } else {
- // In the other cases, find on changedTouches is enough.
- var targetTouch = Array.prototype.find.call(e.changedTouches, isTouchOnTarget);
- // Cancel if the target touch has not moved.
- if (!targetTouch) {
- return false;
- }
- x = targetTouch.pageX;
- y = targetTouch.pageY;
- }
- }
- pageOffset = pageOffset || getPageOffset(scope_Document);
- if (mouse || pointer) {
- x = e.clientX + pageOffset.x;
- y = e.clientY + pageOffset.y;
- }
- e.pageOffset = pageOffset;
- e.points = [x, y];
- e.cursor = mouse || pointer; // Fix #435
- return e;
- }
- // Translate a coordinate in the document to a percentage on the slider
- function calcPointToPercentage(calcPoint) {
- var location = calcPoint - offset(scope_Base, options.ort);
- var proposal = (location * 100) / baseSize();
- // Clamp proposal between 0% and 100%
- // Out-of-bound coordinates may occur when .noUi-base pseudo-elements
- // are used (e.g. contained handles feature)
- proposal = limit(proposal);
- return options.dir ? 100 - proposal : proposal;
- }
- // Find handle closest to a certain percentage on the slider
- function getClosestHandle(clickedPosition) {
- var smallestDifference = 100;
- var handleNumber = false;
- scope_Handles.forEach(function(handle, index) {
- // Disabled handles are ignored
- if (isHandleDisabled(index)) {
- return;
- }
- var handlePosition = scope_Locations[index];
- var differenceWithThisHandle = Math.abs(handlePosition - clickedPosition);
- // Initial state
- var clickAtEdge = differenceWithThisHandle === 100 && smallestDifference === 100;
- // Difference with this handle is smaller than the previously checked handle
- var isCloser = differenceWithThisHandle < smallestDifference;
- var isCloserAfter = differenceWithThisHandle <= smallestDifference && clickedPosition > handlePosition;
- if (isCloser || isCloserAfter || clickAtEdge) {
- handleNumber = index;
- smallestDifference = differenceWithThisHandle;
- }
- });
- return handleNumber;
- }
- // Fire 'end' when a mouse or pen leaves the document.
- function documentLeave(event, data) {
- if (event.type === "mouseout" && event.target.nodeName === "HTML" && event.relatedTarget === null) {
- eventEnd(event, data);
- }
- }
- // Handle movement on document for handle and range drag.
- function eventMove(event, data) {
- // Fix #498
- // Check value of .buttons in 'start' to work around a bug in IE10 mobile (data.buttonsProperty).
- // https://connect.microsoft.com/IE/feedback/details/927005/mobile-ie10-windows-phone-buttons-property-of-pointermove-event-always-zero
- // IE9 has .buttons and .which zero on mousemove.
- // Firefox breaks the spec MDN defines.
- if (navigator.appVersion.indexOf("MSIE 9") === -1 && event.buttons === 0 && data.buttonsProperty !== 0) {
- return eventEnd(event, data);
- }
- // Check if we are moving up or down
- var movement = (options.dir ? -1 : 1) * (event.calcPoint - data.startCalcPoint);
- // Convert the movement into a percentage of the slider width/height
- var proposal = (movement * 100) / data.baseSize;
- moveHandles(movement > 0, proposal, data.locations, data.handleNumbers);
- }
- // Unbind move events on document, call callbacks.
- function eventEnd(event, data) {
- // The handle is no longer active, so remove the class.
- if (data.handle) {
- removeClass(data.handle, options.cssClasses.active);
- scope_ActiveHandlesCount -= 1;
- }
- // Unbind the move and end events, which are added on 'start'.
- data.listeners.forEach(function(c) {
- scope_DocumentElement.removeEventListener(c[0], c[1]);
- });
- if (scope_ActiveHandlesCount === 0) {
- // Remove dragging class.
- removeClass(scope_Target, options.cssClasses.drag);
- setZindex();
- // Remove cursor styles and text-selection events bound to the body.
- if (event.cursor) {
- scope_Body.style.cursor = "";
- scope_Body.removeEventListener("selectstart", preventDefault);
- }
- }
- data.handleNumbers.forEach(function(handleNumber) {
- fireEvent("change", handleNumber);
- fireEvent("set", handleNumber);
- fireEvent("end", handleNumber);
- });
- }
- // Bind move events on document.
- function eventStart(event, data) {
- // Ignore event if any handle is disabled
- if (data.handleNumbers.some(isHandleDisabled)) {
- return false;
- }
- var handle;
- if (data.handleNumbers.length === 1) {
- var handleOrigin = scope_Handles[data.handleNumbers[0]];
- handle = handleOrigin.children[0];
- scope_ActiveHandlesCount += 1;
- // Mark the handle as 'active' so it can be styled.
- addClass(handle, options.cssClasses.active);
- }
- // A drag should never propagate up to the 'tap' event.
- event.stopPropagation();
- // Record the event listeners.
- var listeners = [];
- // Attach the move and end events.
- var moveEvent = attachEvent(actions.move, scope_DocumentElement, eventMove, {
- // The event target has changed so we need to propagate the original one so that we keep
- // relying on it to extract target touches.
- target: event.target,
- handle: handle,
- listeners: listeners,
- startCalcPoint: event.calcPoint,
- baseSize: baseSize(),
- pageOffset: event.pageOffset,
- handleNumbers: data.handleNumbers,
- buttonsProperty: event.buttons,
- locations: scope_Locations.slice()
- });
- var endEvent = attachEvent(actions.end, scope_DocumentElement, eventEnd, {
- target: event.target,
- handle: handle,
- listeners: listeners,
- doNotReject: true,
- handleNumbers: data.handleNumbers
- });
- var outEvent = attachEvent("mouseout", scope_DocumentElement, documentLeave, {
- target: event.target,
- handle: handle,
- listeners: listeners,
- doNotReject: true,
- handleNumbers: data.handleNumbers
- });
- // We want to make sure we pushed the listeners in the listener list rather than creating
- // a new one as it has already been passed to the event handlers.
- listeners.push.apply(listeners, moveEvent.concat(endEvent, outEvent));
- // Text selection isn't an issue on touch devices,
- // so adding cursor styles can be skipped.
- if (event.cursor) {
- // Prevent the 'I' cursor and extend the range-drag cursor.
- scope_Body.style.cursor = getComputedStyle(event.target).cursor;
- // Mark the target with a dragging state.
- if (scope_Handles.length > 1) {
- addClass(scope_Target, options.cssClasses.drag);
- }
- // Prevent text selection when dragging the handles.
- // In noUiSlider <= 9.2.0, this was handled by calling preventDefault on mouse/touch start/move,
- // which is scroll blocking. The selectstart event is supported by FireFox starting from version 52,
- // meaning the only holdout is iOS Safari. This doesn't matter: text selection isn't triggered there.
- // The 'cursor' flag is false.
- // See: http://caniuse.com/#search=selectstart
- scope_Body.addEventListener("selectstart", preventDefault, false);
- }
- data.handleNumbers.forEach(function(handleNumber) {
- fireEvent("start", handleNumber);
- });
- }
- // Move closest handle to tapped location.
- function eventTap(event) {
- // The tap event shouldn't propagate up
- event.stopPropagation();
- var proposal = calcPointToPercentage(event.calcPoint);
- var handleNumber = getClosestHandle(proposal);
- // Tackle the case that all handles are 'disabled'.
- if (handleNumber === false) {
- return false;
- }
- // Flag the slider as it is now in a transitional state.
- // Transition takes a configurable amount of ms (default 300). Re-enable the slider after that.
- if (!options.events.snap) {
- addClassFor(scope_Target, options.cssClasses.tap, options.animationDuration);
- }
- setHandle(handleNumber, proposal, true, true);
- setZindex();
- fireEvent("slide", handleNumber, true);
- fireEvent("update", handleNumber, true);
- fireEvent("change", handleNumber, true);
- fireEvent("set", handleNumber, true);
- if (options.events.snap) {
- eventStart(event, { handleNumbers: [handleNumber] });
- }
- }
- // Fires a 'hover' event for a hovered mouse/pen position.
- function eventHover(event) {
- var proposal = calcPointToPercentage(event.calcPoint);
- var to = scope_Spectrum.getStep(proposal);
- var value = scope_Spectrum.fromStepping(to);
- Object.keys(scope_Events).forEach(function(targetEvent) {
- if ("hover" === targetEvent.split(".")[0]) {
- scope_Events[targetEvent].forEach(function(callback) {
- callback.call(scope_Self, value);
- });
- }
- });
- }
- // Handles keydown on focused handles
- // Don't move the document when pressing arrow keys on focused handles
- function eventKeydown(event, handleNumber) {
- if (isSliderDisabled() || isHandleDisabled(handleNumber)) {
- return false;
- }
- var horizontalKeys = ["Left", "Right"];
- var verticalKeys = ["Down", "Up"];
- if (options.dir && !options.ort) {
- // On an right-to-left slider, the left and right keys act inverted
- horizontalKeys.reverse();
- } else if (options.ort && !options.dir) {
- // On a top-to-bottom slider, the up and down keys act inverted
- verticalKeys.reverse();
- }
- // Strip "Arrow" for IE compatibility. https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key
- var key = event.key.replace("Arrow", "");
- var isDown = key === verticalKeys[0] || key === horizontalKeys[0];
- var isUp = key === verticalKeys[1] || key === horizontalKeys[1];
- if (!isDown && !isUp) {
- return true;
- }
- event.preventDefault();
- var direction = isDown ? 0 : 1;
- var steps = getNextStepsForHandle(handleNumber);
- var step = steps[direction];
- // At the edge of a slider, do nothing
- if (step === null) {
- return false;
- }
- // No step set, use the default of 10% of the sub-range
- if (step === false) {
- step = scope_Spectrum.getDefaultStep(scope_Locations[handleNumber], isDown, 10);
- }
- // Step over zero-length ranges (#948);
- step = Math.max(step, 0.0000001);
- // Decrement for down steps
- step = (isDown ? -1 : 1) * step;
- setHandle(handleNumber, scope_Spectrum.toStepping(scope_Values[handleNumber] + step), true, true);
- fireEvent("slide", handleNumber);
- fireEvent("update", handleNumber);
- fireEvent("change", handleNumber);
- fireEvent("set", handleNumber);
- return false;
- }
- // Attach events to several slider parts.
- function bindSliderEvents(behaviour) {
- // Attach the standard drag event to the handles.
- if (!behaviour.fixed) {
- scope_Handles.forEach(function(handle, index) {
- // These events are only bound to the visual handle
- // element, not the 'real' origin element.
- attachEvent(actions.start, handle.children[0], eventStart, {
- handleNumbers: [index]
- });
- });
- }
- // Attach the tap event to the slider base.
- if (behaviour.tap) {
- attachEvent(actions.start, scope_Base, eventTap, {});
- }
- // Fire hover events
- if (behaviour.hover) {
- attachEvent(actions.move, scope_Base, eventHover, {
- hover: true
- });
- }
- // Make the range draggable.
- if (behaviour.drag) {
- scope_Connects.forEach(function(connect, index) {
- if (connect === false || index === 0 || index === scope_Connects.length - 1) {
- return;
- }
- var handleBefore = scope_Handles[index - 1];
- var handleAfter = scope_Handles[index];
- var eventHolders = [connect];
- addClass(connect, options.cssClasses.draggable);
- // When the range is fixed, the entire range can
- // be dragged by the handles. The handle in the first
- // origin will propagate the start event upward,
- // but it needs to be bound manually on the other.
- if (behaviour.fixed) {
- eventHolders.push(handleBefore.children[0]);
- eventHolders.push(handleAfter.children[0]);
- }
- eventHolders.forEach(function(eventHolder) {
- attachEvent(actions.start, eventHolder, eventStart, {
- handles: [handleBefore, handleAfter],
- handleNumbers: [index - 1, index]
- });
- });
- });
- }
- }
- // Attach an event to this slider, possibly including a namespace
- function bindEvent(namespacedEvent, callback) {
- scope_Events[namespacedEvent] = scope_Events[namespacedEvent] || [];
- scope_Events[namespacedEvent].push(callback);
- // If the event bound is 'update,' fire it immediately for all handles.
- if (namespacedEvent.split(".")[0] === "update") {
- scope_Handles.forEach(function(a, index) {
- fireEvent("update", index);
- });
- }
- }
- // Undo attachment of event
- function removeEvent(namespacedEvent) {
- var event = namespacedEvent && namespacedEvent.split(".")[0];
- var namespace = event && namespacedEvent.substring(event.length);
- Object.keys(scope_Events).forEach(function(bind) {
- var tEvent = bind.split(".")[0];
- var tNamespace = bind.substring(tEvent.length);
- if ((!event || event === tEvent) && (!namespace || namespace === tNamespace)) {
- delete scope_Events[bind];
- }
- });
- }
- // External event handling
- function fireEvent(eventName, handleNumber, tap) {
- Object.keys(scope_Events).forEach(function(targetEvent) {
- var eventType = targetEvent.split(".")[0];
- if (eventName === eventType) {
- scope_Events[targetEvent].forEach(function(callback) {
- callback.call(
- // Use the slider public API as the scope ('this')
- scope_Self,
- // Return values as array, so arg_1[arg_2] is always valid.
- scope_Values.map(options.format.to),
- // Handle index, 0 or 1
- handleNumber,
- // Un-formatted slider values
- scope_Values.slice(),
- // Event is fired by tap, true or false
- tap || false,
- // Left offset of the handle, in relation to the slider
- scope_Locations.slice()
- );
- });
- }
- });
- }
- // Split out the handle positioning logic so the Move event can use it, too
- function checkHandlePosition(reference, handleNumber, to, lookBackward, lookForward, getValue) {
- // For sliders with multiple handles, limit movement to the other handle.
- // Apply the margin option by adding it to the handle positions.
- if (scope_Handles.length > 1 && !options.events.unconstrained) {
- if (lookBackward && handleNumber > 0) {
- to = Math.max(to, reference[handleNumber - 1] + options.margin);
- }
- if (lookForward && handleNumber < scope_Handles.length - 1) {
- to = Math.min(to, reference[handleNumber + 1] - options.margin);
- }
- }
- // The limit option has the opposite effect, limiting handles to a
- // maximum distance from another. Limit must be > 0, as otherwise
- // handles would be unmovable.
- if (scope_Handles.length > 1 && options.limit) {
- if (lookBackward && handleNumber > 0) {
- to = Math.min(to, reference[handleNumber - 1] + options.limit);
- }
- if (lookForward && handleNumber < scope_Handles.length - 1) {
- to = Math.max(to, reference[handleNumber + 1] - options.limit);
- }
- }
- // The padding option keeps the handles a certain distance from the
- // edges of the slider. Padding must be > 0.
- if (options.padding) {
- if (handleNumber === 0) {
- to = Math.max(to, options.padding[0]);
- }
- if (handleNumber === scope_Handles.length - 1) {
- to = Math.min(to, 100 - options.padding[1]);
- }
- }
- to = scope_Spectrum.getStep(to);
- // Limit percentage to the 0 - 100 range
- to = limit(to);
- // Return false if handle can't move
- if (to === reference[handleNumber] && !getValue) {
- return false;
- }
- return to;
- }
- // Uses slider orientation to create CSS rules. a = base value;
- function inRuleOrder(v, a) {
- var o = options.ort;
- return (o ? a : v) + ", " + (o ? v : a);
- }
- // Moves handle(s) by a percentage
- // (bool, % to move, [% where handle started, ...], [index in scope_Handles, ...])
- function moveHandles(upward, proposal, locations, handleNumbers) {
- var proposals = locations.slice();
- var b = [!upward, upward];
- var f = [upward, !upward];
- // Copy handleNumbers so we don't change the dataset
- handleNumbers = handleNumbers.slice();
- // Check to see which handle is 'leading'.
- // If that one can't move the second can't either.
- if (upward) {
- handleNumbers.reverse();
- }
- // Step 1: get the maximum percentage that any of the handles can move
- if (handleNumbers.length > 1) {
- handleNumbers.forEach(function(handleNumber, o) {
- var to = checkHandlePosition(
- proposals,
- handleNumber,
- proposals[handleNumber] + proposal,
- b[o],
- f[o],
- false
- );
- // Stop if one of the handles can't move.
- if (to === false) {
- proposal = 0;
- } else {
- proposal = to - proposals[handleNumber];
- proposals[handleNumber] = to;
- }
- });
- }
- // If using one handle, check backward AND forward
- else {
- b = f = [true];
- }
- var state = false;
- // Step 2: Try to set the handles with the found percentage
- handleNumbers.forEach(function(handleNumber, o) {
- state = setHandle(handleNumber, locations[handleNumber] + proposal, b[o], f[o]) || state;
- });
- // Step 3: If a handle moved, fire events
- if (state) {
- handleNumbers.forEach(function(handleNumber) {
- fireEvent("update", handleNumber);
- fireEvent("slide", handleNumber);
- });
- }
- }
- // Takes a base value and an offset. This offset is used for the connect bar size.
- // In the initial design for this feature, the origin element was 1% wide.
- // Unfortunately, a rounding bug in Chrome makes it impossible to implement this feature
- // in this manner: https://bugs.chromium.org/p/chromium/issues/detail?id=798223
- function transformDirection(a, b) {
- return options.dir ? 100 - a - b : a;
- }
- // Updates scope_Locations and scope_Values, updates visual state
- function updateHandlePosition(handleNumber, to) {
- // Update locations.
- scope_Locations[handleNumber] = to;
- // Convert the value to the slider stepping/range.
- scope_Values[handleNumber] = scope_Spectrum.fromStepping(to);
- var translation = 10 * (transformDirection(to, 0) - scope_DirOffset);
- var translateRule = "translate(" + inRuleOrder(translation + "%", "0") + ")";
- scope_Handles[handleNumber].style[options.transformRule] = translateRule;
- updateConnect(handleNumber);
- updateConnect(handleNumber + 1);
- }
- // Handles before the slider middle are stacked later = higher,
- // Handles after the middle later is lower
- // [[7] [8] .......... | .......... [5] [4]
- function setZindex() {
- scope_HandleNumbers.forEach(function(handleNumber) {
- var dir = scope_Locations[handleNumber] > 50 ? -1 : 1;
- var zIndex = 3 + (scope_Handles.length + dir * handleNumber);
- scope_Handles[handleNumber].style.zIndex = zIndex;
- });
- }
- // Test suggested values and apply margin, step.
- function setHandle(handleNumber, to, lookBackward, lookForward) {
- to = checkHandlePosition(scope_Locations, handleNumber, to, lookBackward, lookForward, false);
- if (to === false) {
- return false;
- }
- updateHandlePosition(handleNumber, to);
- return true;
- }
- // Updates style attribute for connect nodes
- function updateConnect(index) {
- // Skip connects set to false
- if (!scope_Connects[index]) {
- return;
- }
- var l = 0;
- var h = 100;
- if (index !== 0) {
- l = scope_Locations[index - 1];
- }
- if (index !== scope_Connects.length - 1) {
- h = scope_Locations[index];
- }
- // We use two rules:
- // 'translate' to change the left/top offset;
- // 'scale' to change the width of the element;
- // As the element has a width of 100%, a translation of 100% is equal to 100% of the parent (.noUi-base)
- var connectWidth = h - l;
- var translateRule = "translate(" + inRuleOrder(transformDirection(l, connectWidth) + "%", "0") + ")";
- var scaleRule = "scale(" + inRuleOrder(connectWidth / 100, "1") + ")";
- scope_Connects[index].style[options.transformRule] = translateRule + " " + scaleRule;
- }
- // Parses value passed to .set method. Returns current value if not parse-able.
- function resolveToValue(to, handleNumber) {
- // Setting with null indicates an 'ignore'.
- // Inputting 'false' is invalid.
- if (to === null || to === false || to === undefined) {
- return scope_Locations[handleNumber];
- }
- // If a formatted number was passed, attempt to decode it.
- if (typeof to === "number") {
- to = String(to);
- }
- to = options.format.from(to);
- to = scope_Spectrum.toStepping(to);
- // If parsing the number failed, use the current value.
- if (to === false || isNaN(to)) {
- return scope_Locations[handleNumber];
- }
- return to;
- }
- // Set the slider value.
- function valueSet(input, fireSetEvent) {
- var values = asArray(input);
- var isInit = scope_Locations[0] === undefined;
- // Event fires by default
- fireSetEvent = fireSetEvent === undefined ? true : !!fireSetEvent;
- // Animation is optional.
- // Make sure the initial values were set before using animated placement.
- if (options.animate && !isInit) {
- addClassFor(scope_Target, options.cssClasses.tap, options.animationDuration);
- }
- // First pass, without lookAhead but with lookBackward. Values are set from left to right.
- scope_HandleNumbers.forEach(function(handleNumber) {
- setHandle(handleNumber, resolveToValue(values[handleNumber], handleNumber), true, false);
- });
- // Second pass. Now that all base values are set, apply constraints
- scope_HandleNumbers.forEach(function(handleNumber) {
- setHandle(handleNumber, scope_Locations[handleNumber], true, true);
- });
- setZindex();
- scope_HandleNumbers.forEach(function(handleNumber) {
- fireEvent("update", handleNumber);
- // Fire the event only for handles that received a new value, as per #579
- if (values[handleNumber] !== null && fireSetEvent) {
- fireEvent("set", handleNumber);
- }
- });
- }
- // Reset slider to initial values
- function valueReset(fireSetEvent) {
- valueSet(options.start, fireSetEvent);
- }
- // Set value for a single handle
- function valueSetHandle(handleNumber, value, fireSetEvent) {
- // Ensure numeric input
- handleNumber = Number(handleNumber);
- if (!(handleNumber >= 0 && handleNumber < scope_HandleNumbers.length)) {
- throw new Error("noUiSlider (" + VERSION + "): invalid handle number, got: " + handleNumber);
- }
- // Look both backward and forward, since we don't want this handle to "push" other handles (#960);
- setHandle(handleNumber, resolveToValue(value, handleNumber), true, true);
- fireEvent("update", handleNumber);
- if (fireSetEvent) {
- fireEvent("set", handleNumber);
- }
- }
- // Get the slider value.
- function valueGet() {
- var values = scope_Values.map(options.format.to);
- // If only one handle is used, return a single value.
- if (values.length === 1) {
- return values[0];
- }
- return values;
- }
- // Removes classes from the root and empties it.
- function destroy() {
- for (var key in options.cssClasses) {
- if (!options.cssClasses.hasOwnProperty(key)) {
- continue;
- }
- removeClass(scope_Target, options.cssClasses[key]);
- }
- while (scope_Target.firstChild) {
- scope_Target.removeChild(scope_Target.firstChild);
- }
- delete scope_Target.noUiSlider;
- }
- function getNextStepsForHandle(handleNumber) {
- var location = scope_Locations[handleNumber];
- var nearbySteps = scope_Spectrum.getNearbySteps(location);
- var value = scope_Values[handleNumber];
- var increment = nearbySteps.thisStep.step;
- var decrement = null;
- // If snapped, directly use defined step value
- if (options.snap) {
- return [
- value - nearbySteps.stepBefore.startValue || null,
- nearbySteps.stepAfter.startValue - value || null
- ];
- }
- // If the next value in this step moves into the next step,
- // the increment is the start of the next step - the current value
- if (increment !== false) {
- if (value + increment > nearbySteps.stepAfter.startValue) {
- increment = nearbySteps.stepAfter.startValue - value;
- }
- }
- // If the value is beyond the starting point
- if (value > nearbySteps.thisStep.startValue) {
- decrement = nearbySteps.thisStep.step;
- } else if (nearbySteps.stepBefore.step === false) {
- decrement = false;
- }
- // If a handle is at the start of a step, it always steps back into the previous step first
- else {
- decrement = value - nearbySteps.stepBefore.highestStep;
- }
- // Now, if at the slider edges, there is no in/decrement
- if (location === 100) {
- increment = null;
- } else if (location === 0) {
- decrement = null;
- }
- // As per #391, the comparison for the decrement step can have some rounding issues.
- var stepDecimals = scope_Spectrum.countStepDecimals();
- // Round per #391
- if (increment !== null && increment !== false) {
- increment = Number(increment.toFixed(stepDecimals));
- }
- if (decrement !== null && decrement !== false) {
- decrement = Number(decrement.toFixed(stepDecimals));
- }
- return [decrement, increment];
- }
- // Get the current step size for the slider.
- function getNextSteps() {
- return scope_HandleNumbers.map(getNextStepsForHandle);
- }
- // Updateable: margin, limit, padding, step, range, animate, snap
- function updateOptions(optionsToUpdate, fireSetEvent) {
- // Spectrum is created using the range, snap, direction and step options.
- // 'snap' and 'step' can be updated.
- // If 'snap' and 'step' are not passed, they should remain unchanged.
- var v = valueGet();
- var updateAble = [
- "margin",
- "limit",
- "padding",
- "range",
- "animate",
- "snap",
- "step",
- "format",
- "pips",
- "tooltips"
- ];
- // Only change options that we're actually passed to update.
- updateAble.forEach(function(name) {
- // Check for undefined. null removes the value.
- if (optionsToUpdate[name] !== undefined) {
- originalOptions[name] = optionsToUpdate[name];
- }
- });
- var newOptions = testOptions(originalOptions);
- // Load new options into the slider state
- updateAble.forEach(function(name) {
- if (optionsToUpdate[name] !== undefined) {
- options[name] = newOptions[name];
- }
- });
- scope_Spectrum = newOptions.spectrum;
- // Limit, margin and padding depend on the spectrum but are stored outside of it. (#677)
- options.margin = newOptions.margin;
- options.limit = newOptions.limit;
- options.padding = newOptions.padding;
- // Update pips, removes existing.
- if (options.pips) {
- pips(options.pips);
- } else {
- removePips();
- }
- // Update tooltips, removes existing.
- if (options.tooltips) {
- tooltips();
- } else {
- removeTooltips();
- }
- // Invalidate the current positioning so valueSet forces an update.
- scope_Locations = [];
- valueSet(optionsToUpdate.start || v, fireSetEvent);
- }
- // Initialization steps
- function setupSlider() {
- // Create the base element, initialize HTML and set classes.
- // Add handles and connect elements.
- scope_Base = addSlider(scope_Target);
- addElements(options.connect, scope_Base);
- // Attach user events.
- bindSliderEvents(options.events);
- // Use the public value method to set the start values.
- valueSet(options.start);
- if (options.pips) {
- pips(options.pips);
- }
- if (options.tooltips) {
- tooltips();
- }
- aria();
- }
- setupSlider();
- // noinspection JSUnusedGlobalSymbols
- scope_Self = {
- destroy: destroy,
- steps: getNextSteps,
- on: bindEvent,
- off: removeEvent,
- get: valueGet,
- set: valueSet,
- setHandle: valueSetHandle,
- reset: valueReset,
- // Exposed for unit testing, don't use this in your application.
- __moveHandles: function(a, b, c) {
- moveHandles(a, b, scope_Locations, c);
- },
- options: originalOptions, // Issue #600, #678
- updateOptions: updateOptions,
- target: scope_Target, // Issue #597
- removePips: removePips,
- removeTooltips: removeTooltips,
- pips: pips // Issue #594
- };
- return scope_Self;
- }
- // Run the standard initializer
- function initialize(target, originalOptions) {
- if (!target || !target.nodeName) {
- throw new Error("noUiSlider (" + VERSION + "): create requires a single element, got: " + target);
- }
- // Throw an error if the slider was already initialized.
- if (target.noUiSlider) {
- throw new Error("noUiSlider (" + VERSION + "): Slider was already initialized.");
- }
- // Test the options and create the slider environment;
- var options = testOptions(originalOptions, target);
- var api = scope(target, options, originalOptions);
- target.noUiSlider = api;
- return api;
- }
- // Use an object instead of a function for future expandability;
- return {
- // Exposed for unit testing, don't use this in your application.
- __spectrum: Spectrum,
- version: VERSION,
- create: initialize
- };
- });
|