| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265 |
- /*!
- * # Fomantic-UI - Slider
- * http://github.com/fomantic/Fomantic-UI/
- *
- *
- * Released under the MIT license
- * http://opensource.org/licenses/MIT
- *
- */
- ;(function ( $, window, document, undefined ) {
- "use strict";
- window = (typeof window != 'undefined' && window.Math == Math)
- ? window
- : (typeof self != 'undefined' && self.Math == Math)
- ? self
- : Function('return this')()
- ;
- $.fn.slider = function(parameters) {
- var
- $allModules = $(this),
- $window = $(window),
- moduleSelector = $allModules.selector || '',
- time = new Date().getTime(),
- performance = [],
- query = arguments[0],
- methodInvoked = (typeof query == 'string'),
- queryArguments = [].slice.call(arguments, 1),
- alphabet = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'],
- SINGLE_STEP = 1,
- BIG_STEP = 2,
- NO_STEP = 0,
- SINGLE_BACKSTEP = -1,
- BIG_BACKSTEP = -2,
- // Used to manage document bound events.
- // Use this so that we can distinguish between which document events are bound to which range.
- currentRange = 0,
- returnedValue
- ;
- $allModules
- .each(function() {
- var
- settings = ( $.isPlainObject(parameters) )
- ? $.extend(true, {}, $.fn.slider.settings, parameters)
- : $.extend({}, $.fn.slider.settings),
- className = settings.className,
- metadata = settings.metadata,
- namespace = settings.namespace,
- error = settings.error,
- keys = settings.keys,
- interpretLabel = settings.interpretLabel,
- isHover = false,
- eventNamespace = '.' + namespace,
- moduleNamespace = 'module-' + namespace,
- $module = $(this),
- $currThumb,
- $thumb,
- $secondThumb,
- $track,
- $trackFill,
- $labels,
- element = this,
- instance = $module.data(moduleNamespace),
- documentEventID,
- value,
- position,
- secondPos,
- offset,
- precision,
- isTouch,
- gapRatio = 1,
- module
- ;
- module = {
- initialize: function() {
- module.debug('Initializing slider', settings);
- currentRange += 1;
- documentEventID = currentRange;
- isTouch = module.setup.testOutTouch();
- module.setup.layout();
- module.setup.labels();
- if(!module.is.disabled()) {
- module.bind.events();
- }
- module.read.metadata();
- module.read.settings();
- module.instantiate();
- },
- instantiate: function() {
- module.verbose('Storing instance of slider', module);
- instance = module;
- $module
- .data(moduleNamespace, module)
- ;
- },
- destroy: function() {
- module.verbose('Destroying previous slider for', $module);
- clearInterval(instance.interval);
- module.unbind.events();
- module.unbind.slidingEvents();
- $module.removeData(moduleNamespace);
- instance = undefined;
- },
- setup: {
- layout: function() {
- if( $module.attr('tabindex') === undefined) {
- $module.attr('tabindex', 0);
- }
- if($module.find('.inner').length == 0) {
- $module.append("<div class='inner'>"
- + "<div class='track'></div>"
- + "<div class='track-fill'></div>"
- + "<div class='thumb'></div>"
- + "</div>");
- }
- precision = module.get.precision();
- $thumb = $module.find('.thumb:not(.second)');
- $currThumb = $thumb;
- if(module.is.range()) {
- if($module.find('.thumb.second').length == 0) {
- $module.find('.inner').append("<div class='thumb second'></div>");
- }
- $secondThumb = $module.find('.thumb.second');
- }
- $track = $module.find('.track');
- $trackFill = $module.find('.track-fill');
- offset = $thumb.width() / 2;
- },
- labels: function() {
- if(module.is.labeled()) {
- $labels = $module.find('.labels:not(.auto)');
- if($labels.length != 0) {
- module.setup.customLabel();
- } else {
- module.setup.autoLabel();
- }
- if (settings.showLabelTicks) {
- $module.addClass(className.ticked)
- }
- }
- },
- testOutTouch: function() {
- try {
- document.createEvent('TouchEvent');
- return true;
- } catch (e) {
- return false;
- }
- },
- customLabel: function() {
- var
- $children = $labels.find('.label'),
- numChildren = $children.length,
- min = module.get.min(),
- max = module.get.max(),
- ratio
- ;
- $children.each(function(index) {
- var
- $child = $(this),
- attrValue = $child.attr('data-value')
- ;
- if(attrValue) {
- attrValue = attrValue > max ? max : attrValue < min ? min : attrValue;
- ratio = (attrValue - min) / (max - min);
- } else {
- ratio = (index + 1) / (numChildren + 1);
- }
- module.update.labelPosition(ratio, $(this));
- });
- },
- autoLabel: function() {
- if(module.get.step() != 0) {
- $labels = $module.find('.labels');
- if($labels.length != 0) {
- $labels.empty();
- }
- else {
- $labels = $module.append('<ul class="auto labels"></ul>').find('.labels');
- }
- for(var i = 0, len = module.get.numLabels(); i <= len; i++) {
- var
- labelText = module.get.label(i),
- $label = (labelText !== "")
- ? !(i % module.get.gapRatio())
- ? $('<li class="label">' + labelText + '</li>')
- : $('<li class="halftick label"></li>')
- : null,
- ratio = i / len
- ;
- if($label) {
- module.update.labelPosition(ratio, $label);
- $labels.append($label);
- }
- }
- }
- }
- },
- bind: {
- events: function() {
- module.bind.globalKeyboardEvents();
- module.bind.keyboardEvents();
- module.bind.mouseEvents();
- if(module.is.touch()) {
- module.bind.touchEvents();
- }
- if (settings.autoAdjustLabels) {
- module.bind.windowEvents();
- }
- },
- keyboardEvents: function() {
- module.verbose('Binding keyboard events');
- $module.on('keydown' + eventNamespace, module.event.keydown);
- },
- globalKeyboardEvents: function() {
- $(document).on('keydown' + eventNamespace + documentEventID, module.event.activateFocus);
- },
- mouseEvents: function() {
- module.verbose('Binding mouse events');
- $module.find('.track, .thumb, .inner').on('mousedown' + eventNamespace, function(event) {
- event.stopImmediatePropagation();
- event.preventDefault();
- module.event.down(event);
- });
- $module.on('mousedown' + eventNamespace, module.event.down);
- $module.on('mouseenter' + eventNamespace, function(event) {
- isHover = true;
- });
- $module.on('mouseleave' + eventNamespace, function(event) {
- isHover = false;
- });
- },
- touchEvents: function() {
- module.verbose('Binding touch events');
- $module.find('.track, .thumb, .inner').on('touchstart' + eventNamespace, function(event) {
- event.stopImmediatePropagation();
- event.preventDefault();
- module.event.down(event);
- });
- $module.on('touchstart' + eventNamespace, module.event.down);
- },
- slidingEvents: function() {
- // these don't need the identifier because we only ever want one of them to be registered with document
- module.verbose('Binding page wide events while handle is being draged');
- if(module.is.touch()) {
- $(document).on('touchmove' + eventNamespace, module.event.move);
- $(document).on('touchend' + eventNamespace, module.event.up);
- }
- else {
- $(document).on('mousemove' + eventNamespace, module.event.move);
- $(document).on('mouseup' + eventNamespace, module.event.up);
- }
- },
- windowEvents: function() {
- $window.on('resize' + eventNamespace, module.event.resize);
- }
- },
- unbind: {
- events: function() {
- $module.find('.track, .thumb, .inner').off('mousedown' + eventNamespace);
- $module.find('.track, .thumb, .inner').off('touchstart' + eventNamespace);
- $module.off('mousedown' + eventNamespace);
- $module.off('mouseenter' + eventNamespace);
- $module.off('mouseleave' + eventNamespace);
- $module.off('touchstart' + eventNamespace);
- $module.off('keydown' + eventNamespace);
- $module.off('focusout' + eventNamespace);
- $(document).off('keydown' + eventNamespace + documentEventID, module.event.activateFocus);
- $window.off('resize' + eventNamespace);
- },
- slidingEvents: function() {
- if(module.is.touch()) {
- $(document).off('touchmove' + eventNamespace);
- $(document).off('touchend' + eventNamespace);
- } else {
- $(document).off('mousemove' + eventNamespace);
- $(document).off('mouseup' + eventNamespace);
- }
- },
- },
- event: {
- down: function(event, originalEvent) {
- event.preventDefault();
- if(module.is.range()) {
- var
- eventPos = module.determine.eventPos(event, originalEvent),
- newPos = module.determine.pos(eventPos)
- ;
- $currThumb = module.determine.closestThumb(newPos);
- }
- if(!module.is.disabled()) {
- module.bind.slidingEvents();
- }
- },
- move: function(event, originalEvent) {
- event.preventDefault();
- var value = module.determine.valueFromEvent(event, originalEvent);
- if(module.get.step() == 0 || module.is.smooth()) {
- var
- thumbVal = module.thumbVal,
- secondThumbVal = module.secondThumbVal,
- thumbSmoothVal = module.determine.smoothValueFromEvent(event, originalEvent)
- ;
- if(!$currThumb.hasClass('second')) {
- thumbVal = value;
- } else {
- secondThumbVal = value;
- }
- value = Math.abs(thumbVal - (secondThumbVal || 0));
- module.update.position(thumbSmoothVal);
- settings.onMove.call(element, value, thumbVal, secondThumbVal);
- } else {
- module.update.value(value, function(value, thumbVal, secondThumbVal) {
- settings.onMove.call(element, value, thumbVal, secondThumbVal);
- });
- }
- },
- up: function(event, originalEvent) {
- event.preventDefault();
- var value = module.determine.valueFromEvent(event, originalEvent);
- module.set.value(value);
- module.unbind.slidingEvents();
- },
- keydown: function(event, first) {
- if(module.is.focused()) {
- $(document).trigger(event);
- }
- if(first || module.is.focused()) {
- var step = module.determine.keyMovement(event);
- if(step != NO_STEP) {
- event.preventDefault();
- switch(step) {
- case SINGLE_STEP:
- module.takeStep();
- break;
- case BIG_STEP:
- module.takeStep(module.get.multiplier());
- break;
- case SINGLE_BACKSTEP:
- module.backStep();
- break;
- case BIG_BACKSTEP:
- module.backStep(module.get.multiplier());
- break;
- }
- }
- }
- },
- activateFocus: function(event) {
- if(!module.is.focused() && module.is.hover() && module.determine.keyMovement(event) != NO_STEP) {
- event.preventDefault();
- module.event.keydown(event, true);
- $module.focus();
- }
- },
- resize: function(_event) {
- // To avoid a useless performance cost, we only call the label refresh when its necessary
- if (gapRatio != module.get.gapRatio()) {
- module.setup.labels();
- gapRatio = module.get.gapRatio();
- }
- }
- },
- resync: function() {
- module.verbose('Resyncing thumb position based on value');
- if(module.is.range()) {
- module.update.position(module.secondThumbVal, $secondThumb);
- }
- module.update.position(module.thumbVal, $thumb);
- module.setup.labels();
- },
- takeStep: function(multiplier) {
- var
- multiplier = multiplier != undefined ? multiplier : 1,
- step = module.get.step(),
- currValue = module.get.currentThumbValue()
- ;
- module.verbose('Taking a step');
- if(step > 0) {
- module.set.value(currValue + step * multiplier);
- } else if (step == 0){
- var
- precision = module.get.precision(),
- newValue = currValue + (multiplier/precision)
- ;
- module.set.value(Math.round(newValue * precision) / precision);
- }
- },
- backStep: function(multiplier) {
- var
- multiplier = multiplier != undefined ? multiplier : 1,
- step = module.get.step(),
- currValue = module.get.currentThumbValue()
- ;
- module.verbose('Going back a step');
- if(step > 0) {
- module.set.value(currValue - step * multiplier);
- } else if (step == 0) {
- var
- precision = module.get.precision(),
- newValue = currValue - (multiplier/precision)
- ;
- module.set.value(Math.round(newValue * precision) / precision);
- }
- },
- is: {
- range: function() {
- return $module.hasClass(settings.className.range);
- },
- hover: function() {
- return isHover;
- },
- focused: function() {
- return $module.is(':focus');
- },
- disabled: function() {
- return $module.hasClass(settings.className.disabled);
- },
- labeled: function() {
- return $module.hasClass(settings.className.labeled);
- },
- reversed: function() {
- return $module.hasClass(settings.className.reversed);
- },
- vertical: function() {
- return $module.hasClass(settings.className.vertical);
- },
- smooth: function() {
- return settings.smooth || $module.hasClass(settings.className.smooth);
- },
- touch: function() {
- return isTouch;
- }
- },
- get: {
- trackOffset: function() {
- if (module.is.vertical()) {
- return $track.offset().top;
- } else {
- return $track.offset().left;
- }
- },
- trackLength: function() {
- if (module.is.vertical()) {
- return $track.height();
- } else {
- return $track.width();
- }
- },
- trackLeft: function() {
- if (module.is.vertical()) {
- return $track.position().top;
- } else {
- return $track.position().left;
- }
- },
- trackStartPos: function() {
- return module.is.reversed() ? module.get.trackLeft() + module.get.trackLength() : module.get.trackLeft();
- },
- trackEndPos: function() {
- return module.is.reversed() ? module.get.trackLeft() : module.get.trackLeft() + module.get.trackLength();
- },
- trackStartMargin: function () {
- var margin;
- if (module.is.vertical()) {
- margin = module.is.reversed() ? $module.css('padding-bottom') : $module.css('padding-top');
- } else {
- margin = module.is.reversed() ? $module.css('padding-right') : $module.css('padding-left');
- }
- return margin || '0px';
- },
- trackEndMargin: function () {
- var margin;
- if (module.is.vertical()) {
- margin = module.is.reversed() ? $module.css('padding-top') : $module.css('padding-bottom');
- } else {
- margin = module.is.reversed() ? $module.css('padding-left') : $module.css('padding-right');
- }
- return margin || '0px';
- },
- precision: function() {
- var
- decimalPlaces,
- step = module.get.step()
- ;
- if(step != 0) {
- var split = String(step).split('.');
- if(split.length == 2) {
- decimalPlaces = split[1].length;
- } else {
- decimalPlaces = 0;
- }
- } else {
- decimalPlaces = settings.decimalPlaces;
- }
- var precision = Math.pow(10, decimalPlaces);
- module.debug('Precision determined', precision);
- return precision;
- },
- min: function() {
- return settings.min;
- },
- max: function() {
- var step = module.get.step(),
- min = module.get.min(),
- quotient = step === 0 ? 0 : Math.floor((settings.max - min) / step),
- remainder = step === 0 ? 0 : (settings.max - min) % step;
- return remainder === 0 ? settings.max : min + quotient * step;
- },
- step: function() {
- return settings.step;
- },
- numLabels: function() {
- var value = Math.round((module.get.max() - module.get.min()) / module.get.step());
- module.debug('Determined that there should be ' + value + ' labels');
- return value;
- },
- labelType: function() {
- return settings.labelType;
- },
- label: function(value) {
- if(interpretLabel) {
- return interpretLabel(value);
- }
- switch (settings.labelType) {
- case settings.labelTypes.number:
- return Math.round(((value * module.get.step()) + module.get.min()) * precision ) / precision;
- case settings.labelTypes.letter:
- return alphabet[(value) % 26];
- default:
- return value;
- }
- },
- value: function() {
- return value;
- },
- currentThumbValue: function() {
- return $currThumb.hasClass('second') ? module.secondThumbVal : module.thumbVal;
- },
- thumbValue: function(which) {
- switch(which) {
- case 'second':
- if(module.is.range()) {
- return module.secondThumbVal;
- }
- else {
- module.error(error.notrange);
- break;
- }
- case 'first':
- default:
- return module.thumbVal;
- }
- },
- multiplier: function() {
- return settings.pageMultiplier;
- },
- thumbPosition: function(which) {
- switch(which) {
- case 'second':
- if(module.is.range()) {
- return secondPos;
- }
- else {
- module.error(error.notrange);
- break;
- }
- case 'first':
- default:
- return position;
- }
- },
- gapRatio: function() {
- var gapRatio = 1;
-
- if( settings.autoAdjustLabels ) {
- var
- numLabels = module.get.numLabels(),
- gapCounter = 1
- ;
- // While the distance between two labels is too short,
- // we divide the number of labels at each iteration
- // and apply only if the modulo of the operation is an odd number.
- while ((module.get.trackLength() / numLabels) * gapCounter < settings.labelDistance) {
- if( !(numLabels % gapCounter) ) {
- gapRatio = gapCounter;
- }
- gapCounter += 1;
- }
- return gapRatio;
- } else {
- return 1;
- }
- }
- },
- determine: {
- pos: function(pagePos) {
- return module.is.reversed()
- ?
- module.get.trackStartPos() - pagePos + module.get.trackOffset()
- :
- pagePos - module.get.trackOffset() - module.get.trackStartPos()
- ;
- },
- closestThumb: function(eventPos) {
- var
- thumbPos = parseFloat(module.determine.thumbPos($thumb)),
- thumbDelta = Math.abs(eventPos - thumbPos),
- secondThumbPos = parseFloat(module.determine.thumbPos($secondThumb)),
- secondThumbDelta = Math.abs(eventPos - secondThumbPos)
- ;
- return thumbDelta <= secondThumbDelta ? $thumb : $secondThumb;
- },
- closestThumbPos: function(eventPos) {
- var
- thumbPos = parseFloat(module.determine.thumbPos($thumb)),
- thumbDelta = Math.abs(eventPos - thumbPos),
- secondThumbPos = parseFloat(module.determine.thumbPos($secondThumb)),
- secondThumbDelta = Math.abs(eventPos - secondThumbPos)
- ;
- return thumbDelta <= secondThumbDelta ? thumbPos : secondThumbPos;
- },
- thumbPos: function($element) {
- var pos =
- module.is.vertical()
- ?
- module.is.reversed() ? $element.css('bottom') : $element.css('top')
- :
- module.is.reversed() ? $element.css('right') : $element.css('left')
- ;
- return pos;
- },
- positionFromValue: function(value) {
- var
- min = module.get.min(),
- max = module.get.max(),
- value = value > max ? max : value < min ? min : value,
- trackLength = module.get.trackLength(),
- ratio = (value - min) / (max - min),
- position = Math.round(ratio * trackLength)
- ;
- module.verbose('Determined position: ' + position + ' from value: ' + value);
- return position;
- },
- positionFromRatio: function(ratio) {
- var
- trackLength = module.get.trackLength(),
- step = module.get.step(),
- position = Math.round(ratio * trackLength),
- adjustedPos = (step == 0) ? position : Math.round(position / step) * step
- ;
- return adjustedPos;
- },
- valueFromEvent: function(event, originalEvent) {
- var
- eventPos = module.determine.eventPos(event, originalEvent),
- newPos = module.determine.pos(eventPos),
- value
- ;
- if(eventPos < module.get.trackOffset()) {
- value = module.is.reversed() ? module.get.max() : module.get.min();
- } else if(eventPos > module.get.trackOffset() + module.get.trackLength()) {
- value = module.is.reversed() ? module.get.min() : module.get.max();
- } else {
- value = module.determine.value(newPos);
- }
- return value;
- },
- smoothValueFromEvent: function(event, originalEvent) {
- var
- min = module.get.min(),
- max = module.get.max(),
- trackLength = module.get.trackLength(),
- eventPos = module.determine.eventPos(event, originalEvent),
- newPos = eventPos - module.get.trackOffset(),
- ratio,
- value
- ;
- newPos = newPos < 0 ? 0 : newPos > trackLength ? trackLength : newPos;
- ratio = newPos / trackLength;
- if (module.is.reversed()) {
- ratio = 1 - ratio;
- }
- value = ratio * (max - min) + min;
- return value;
- },
- eventPos: function(event, originalEvent) {
- if(module.is.touch()) {
- var
- touchY = event.changedTouches[0].pageY || event.touches[0].pageY,
- touchX = event.changedTouches[0].pageX || event.touches[0].pageX
- ;
- return module.is.vertical() ? touchY : touchX;
- }
- var
- clickY = event.pageY || originalEvent.pageY,
- clickX = event.pageX || originalEvent.pageX
- ;
- return module.is.vertical() ? clickY : clickX;
- },
- value: function(position) {
- var
- startPos = module.is.reversed() ? module.get.trackEndPos() : module.get.trackStartPos(),
- endPos = module.is.reversed() ? module.get.trackStartPos() : module.get.trackEndPos(),
- ratio = (position - startPos) / (endPos - startPos),
- range = module.get.max() - module.get.min(),
- step = module.get.step(),
- value = (ratio * range),
- difference = (step == 0) ? value : Math.round(value / step) * step
- ;
- module.verbose('Determined value based upon position: ' + position + ' as: ' + value);
- if(value != difference) {
- module.verbose('Rounding value to closest step: ' + difference);
- }
- // Use precision to avoid ugly Javascript floating point rounding issues
- // (like 35 * .01 = 0.35000000000000003)
- difference = Math.round(difference * precision) / precision;
- module.verbose('Cutting off additional decimal places');
- return difference + module.get.min();
- },
- keyMovement: function(event) {
- var
- key = event.which,
- downArrow =
- module.is.vertical()
- ?
- module.is.reversed() ? keys.downArrow : keys.upArrow
- :
- keys.downArrow
- ,
- upArrow =
- module.is.vertical()
- ?
- module.is.reversed() ? keys.upArrow : keys.downArrow
- :
- keys.upArrow
- ,
- leftArrow =
- !module.is.vertical()
- ?
- module.is.reversed() ? keys.rightArrow : keys.leftArrow
- :
- keys.leftArrow
- ,
- rightArrow =
- !module.is.vertical()
- ?
- module.is.reversed() ? keys.leftArrow : keys.rightArrow
- :
- keys.rightArrow
- ;
- if(key == downArrow || key == leftArrow) {
- return SINGLE_BACKSTEP;
- } else if(key == upArrow || key == rightArrow) {
- return SINGLE_STEP;
- } else if (key == keys.pageDown) {
- return BIG_BACKSTEP;
- } else if (key == keys.pageUp) {
- return BIG_STEP;
- } else {
- return NO_STEP;
- }
- }
- },
- handleNewValuePosition: function(val) {
- var
- min = module.get.min(),
- max = module.get.max(),
- newPos
- ;
- if (val <= min) {
- val = min;
- } else if (val >= max) {
- val = max;
- }
- newPos = module.determine.positionFromValue(val);
- return newPos;
- },
- set: {
- value: function(newValue) {
- module.update.value(newValue, function(value, thumbVal, secondThumbVal) {
- settings.onChange.call(element, value, thumbVal, secondThumbVal);
- settings.onMove.call(element, value, thumbVal, secondThumbVal);
- });
- },
- rangeValue: function(first, second) {
- if(module.is.range()) {
- var
- min = module.get.min(),
- max = module.get.max()
- ;
- if (first <= min) {
- first = min;
- } else if(first >= max){
- first = max;
- }
- if (second <= min) {
- second = min;
- } else if(second >= max){
- second = max;
- }
- module.thumbVal = first;
- module.secondThumbVal = second;
- value = Math.abs(module.thumbVal - module.secondThumbVal);
- module.update.position(module.thumbVal, $thumb);
- module.update.position(module.secondThumbVal, $secondThumb);
- settings.onChange.call(element, value, module.thumbVal, module.secondThumbVal);
- settings.onMove.call(element, value, module.thumbVal, module.secondThumbVal);
- } else {
- module.error(error.notrange);
- }
- },
- position: function(position, which) {
- var thumbVal = module.determine.value(position);
- switch (which) {
- case 'second':
- module.secondThumbVal = thumbVal;
- module.update.position(thumbVal, $secondThumb);
- break;
- default:
- module.thumbVal = thumbVal;
- module.update.position(thumbVal, $thumb);
- }
- value = Math.abs(module.thumbVal - (module.secondThumbVal || 0));
- module.set.value(value);
- }
- },
- update: {
- value: function(newValue, callback) {
- var
- min = module.get.min(),
- max = module.get.max()
- ;
- if (newValue <= min) {
- newValue = min;
- } else if(newValue >= max){
- newValue = max;
- }
- if(!module.is.range()) {
- value = newValue;
- module.thumbVal = value;
- } else {
- if(!$currThumb.hasClass('second')) {
- module.thumbVal = newValue;
- } else {
- module.secondThumbVal = newValue;
- }
- value = Math.abs(module.thumbVal - module.secondThumbVal);
- }
- module.update.position(newValue);
- module.debug('Setting slider value to ' + value);
- if(typeof callback === 'function') {
- callback(value, module.thumbVal, module.secondThumbVal);
- }
- },
- position: function(newValue, $element) {
- var
- newPos = module.handleNewValuePosition(newValue),
- $targetThumb = $element != undefined ? $element : $currThumb,
- thumbVal = module.thumbVal || module.get.min(),
- secondThumbVal = module.secondThumbVal || module.get.min()
- ;
- if(module.is.range()) {
- if(!$targetThumb.hasClass('second')) {
- position = newPos;
- thumbVal = newValue;
- } else {
- secondPos = newPos;
- secondThumbVal = newValue;
- }
- } else {
- position = newPos;
- thumbVal = newValue;
- }
- var
- trackPosValue,
- thumbPosValue,
- min = module.get.min(),
- max = module.get.max(),
- thumbPosPercent = 100 * (newValue - min) / (max - min),
- trackStartPosPercent = 100 * (Math.min(thumbVal, secondThumbVal) - min) / (max - min),
- trackEndPosPercent = 100 * (1 - (Math.max(thumbVal, secondThumbVal) - min) / (max - min))
- ;
- if (module.is.vertical()) {
- if (module.is.reversed()) {
- thumbPosValue = {bottom: 'calc(' + thumbPosPercent + '% - ' + offset + 'px)', top: 'auto'};
- trackPosValue = {bottom: trackStartPosPercent + '%', top: trackEndPosPercent + '%'};
- }
- else {
- thumbPosValue = {top: 'calc(' + thumbPosPercent + '% - ' + offset + 'px)', bottom: 'auto'};
- trackPosValue = {top: trackStartPosPercent + '%', bottom: trackEndPosPercent + '%'};
- }
- } else {
- if (module.is.reversed()) {
- thumbPosValue = {right: 'calc(' + thumbPosPercent + '% - ' + offset + 'px)', left: 'auto'};
- trackPosValue = {right: trackStartPosPercent + '%', left: trackEndPosPercent + '%'};
- }
- else {
- thumbPosValue = {left: 'calc(' + thumbPosPercent + '% - ' + offset + 'px)', right: 'auto'};
- trackPosValue = {left: trackStartPosPercent + '%', right: trackEndPosPercent + '%'};
- }
- }
- $targetThumb.css(thumbPosValue);
- $trackFill.css(trackPosValue);
- module.debug('Setting slider position to ' + newPos);
- },
- labelPosition: function (ratio, $label) {
- var
- startMargin = module.get.trackStartMargin(),
- endMargin = module.get.trackEndMargin(),
- posDir =
- module.is.vertical()
- ?
- module.is.reversed() ? 'bottom' : 'top'
- :
- module.is.reversed() ? 'right' : 'left',
- startMarginMod = module.is.reversed() && !module.is.vertical() ? ' - ' : ' + '
- ;
- var position = '(100% - ' + startMargin + ' - ' + endMargin + ') * ' + ratio;
- $label.css(posDir, 'calc(' + position + startMarginMod + startMargin + ')');
- }
- },
- goto: {
- max: function() {
- module.set.value(module.get.max());
- },
- min: function() {
- module.set.value(module.get.min());
- },
- },
- read: {
- metadata: function() {
- var
- data = {
- thumbVal : $module.data(metadata.thumbVal),
- secondThumbVal : $module.data(metadata.secondThumbVal)
- }
- ;
- if(data.thumbVal) {
- if(module.is.range() && data.secondThumbVal) {
- module.debug('Current value set from metadata', data.thumbVal, data.secondThumbVal);
- module.set.rangeValue(data.thumbVal, data.secondThumbVal);
- } else {
- module.debug('Current value set from metadata', data.thumbVal);
- module.set.value(data.thumbVal);
- }
- }
- },
- settings: function() {
- if(settings.start !== false) {
- if(module.is.range()) {
- module.debug('Start position set from settings', settings.start, settings.end);
- module.set.rangeValue(settings.start, settings.end);
- } else {
- module.debug('Start position set from settings', settings.start);
- module.set.value(settings.start);
- }
- }
- }
- },
- setting: function(name, value) {
- module.debug('Changing setting', name, value);
- if( $.isPlainObject(name) ) {
- $.extend(true, settings, name);
- }
- else if(value !== undefined) {
- if($.isPlainObject(settings[name])) {
- $.extend(true, settings[name], value);
- }
- else {
- settings[name] = value;
- }
- }
- else {
- return settings[name];
- }
- },
- internal: function(name, value) {
- if( $.isPlainObject(name) ) {
- $.extend(true, module, name);
- }
- else if(value !== undefined) {
- module[name] = value;
- }
- else {
- return module[name];
- }
- },
- debug: function() {
- if(!settings.silent && settings.debug) {
- if(settings.performance) {
- module.performance.log(arguments);
- }
- else {
- module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
- module.debug.apply(console, arguments);
- }
- }
- },
- verbose: function() {
- if(!settings.silent && settings.verbose && settings.debug) {
- if(settings.performance) {
- module.performance.log(arguments);
- }
- else {
- module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
- module.verbose.apply(console, arguments);
- }
- }
- },
- error: function() {
- if(!settings.silent) {
- module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
- module.error.apply(console, arguments);
- }
- },
- performance: {
- log: function(message) {
- var
- currentTime,
- executionTime,
- previousTime
- ;
- if(settings.performance) {
- currentTime = new Date().getTime();
- previousTime = time || currentTime;
- executionTime = currentTime - previousTime;
- time = currentTime;
- performance.push({
- 'Name' : message[0],
- 'Arguments' : [].slice.call(message, 1) || '',
- 'Element' : element,
- 'Execution Time' : executionTime
- });
- }
- clearTimeout(module.performance.timer);
- module.performance.timer = setTimeout(module.performance.display, 500);
- },
- display: function() {
- var
- title = settings.name + ':',
- totalTime = 0
- ;
- time = false;
- clearTimeout(module.performance.timer);
- $.each(performance, function(index, data) {
- totalTime += data['Execution Time'];
- });
- title += ' ' + totalTime + 'ms';
- if(moduleSelector) {
- title += ' \'' + moduleSelector + '\'';
- }
- if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
- console.groupCollapsed(title);
- if(console.table) {
- console.table(performance);
- }
- else {
- $.each(performance, function(index, data) {
- console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
- });
- }
- console.groupEnd();
- }
- performance = [];
- }
- },
- invoke: function(query, passedArguments, context) {
- var
- object = instance,
- maxDepth,
- found,
- response
- ;
- passedArguments = passedArguments || queryArguments;
- context = element || context;
- if(typeof query == 'string' && object !== undefined) {
- query = query.split(/[\. ]/);
- maxDepth = query.length - 1;
- $.each(query, function(depth, value) {
- var camelCaseValue = (depth != maxDepth)
- ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
- : query
- ;
- if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
- object = object[camelCaseValue];
- }
- else if( object[camelCaseValue] !== undefined ) {
- found = object[camelCaseValue];
- return false;
- }
- else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
- object = object[value];
- }
- else if( object[value] !== undefined ) {
- found = object[value];
- return false;
- }
- else {
- module.error(error.method, query);
- return false;
- }
- });
- }
- if ( $.isFunction( found ) ) {
- response = found.apply(context, passedArguments);
- }
- else if(found !== undefined) {
- response = found;
- }
- if($.isArray(returnedValue)) {
- returnedValue.push(response);
- }
- else if(returnedValue !== undefined) {
- returnedValue = [returnedValue, response];
- }
- else if(response !== undefined) {
- returnedValue = response;
- }
- return found;
- }
- };
- if(methodInvoked) {
- if(instance === undefined) {
- module.initialize();
- }
- module.invoke(query);
- }
- else {
- if(instance !== undefined) {
- instance.invoke('destroy');
- }
- module.initialize();
- }
- })
- ;
- return (returnedValue !== undefined)
- ? returnedValue
- : this
- ;
- };
- $.fn.slider.settings = {
- silent : false,
- debug : false,
- verbose : false,
- performance : true,
- name : 'Slider',
- namespace : 'slider',
- error : {
- method : 'The method you called is not defined.',
- notrange : 'This slider is not a range slider'
- },
- metadata: {
- thumbVal : 'thumbVal',
- secondThumbVal : 'secondThumbVal'
- },
- min : 0,
- max : 20,
- step : 1,
- start : 0,
- end : 20,
- labelType : 'number',
- showLabelTicks : false,
- smooth : false,
- autoAdjustLabels : true,
- labelDistance : 100,
- //the decimal place to round to if step is undefined
- decimalPlaces : 2,
- // page up/down multiplier. How many more times the steps to take on page up/down press
- pageMultiplier : 2,
- selector: {
- },
- className : {
- reversed : 'reversed',
- disabled : 'disabled',
- labeled : 'labeled',
- ticked : 'ticked',
- vertical : 'vertical',
- range : 'range',
- smooth : 'smooth'
- },
- keys : {
- pageUp : 33,
- pageDown : 34,
- leftArrow : 37,
- upArrow : 38,
- rightArrow : 39,
- downArrow : 40
- },
- labelTypes : {
- number : 'number',
- letter : 'letter'
- },
- onChange : function(value, thumbVal, secondThumbVal){},
- onMove : function(value, thumbVal, secondThumbVal){},
- };
- })( jQuery, window, document );
|