From: Tvrtko Date: Mon, 18 Jan 2016 19:58:53 +0000 (+0100) Subject: slider stepping X-Git-Tag: v6.2.0-rc.1~64^2 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=11192d4078f67f69c37c3fe9f84e6dc6dbebd15e;p=thirdparty%2Ffoundation%2Ffoundation-sites.git slider stepping --- diff --git a/js/foundation.slider.js b/js/foundation.slider.js index 773eb9a49..faf4e8add 100644 --- a/js/foundation.slider.js +++ b/js/foundation.slider.js @@ -277,8 +277,8 @@ this.inputs.eq(idx).attr({ 'id': id, 'max': this.options.end, - 'min': this.options.start - + 'min': this.options.start, + 'step': this.options.step }); this.handles.eq(idx).attr({ 'role': 'slider', @@ -328,6 +328,7 @@ // eleDim = this.$element[0].getBoundingClientRect()[param], offsetPct = percent(barXY, barDim); value = (this.options.end - this.options.start) * offsetPct; + value = _this._adjustValue(null, value); hasVal = false; if(!$handle){//figure out which handle it is, pass it to the next function. @@ -337,12 +338,41 @@ } }else{//change event on input - value = val; + value = this._adjustValue($handle); hasVal = true; } this._setHandlePos($handle, value, hasVal); }; + + /** + * Adjustes value for handle in regard to step value. returns adjusted value + * @function + * @private + * @param {jQuery} $handle - the selected handle. + * @param {Number} value - value to adjust. used if $handle is falsy + */ + Slider.prototype._adjustValue = function($handle, value) { + var val, + step = this.options.step, + div = parseFloat(step/2), + left, prev_val, next_val; + if(!!$handle) { + val = parseFloat($handle.attr('aria-valuenow')); + } + else { + val = value; + } + left = val % step; + prev_val = val - left; + next_val = prev_val + step; + if (left === 0) { + return val; + } + val = val >= prev_val + div ? next_val : prev_val; + return val; + }; + /** * Adds event listeners to the slider elements. * @function @@ -365,10 +395,13 @@ this.$element.off('click.zf.slider').on('click.zf.slider', function(e){ if(_this.$element.data('dragging')){ return false; } _this.animComplete = false; - if(_this.options.doubleSided){ - _this._handleEvent(e); - }else{ - _this._handleEvent(e, _this.$handle); + + if(!$(e.target).is('[data-slider-handle]')) { + if (_this.options.doubleSided) { + _this._handleEvent(e); + } else { + _this._handleEvent(e, _this.$handle); + } } }); }