From b51509b2e28d0522133b08f79a9c0a3ac1cbe72b Mon Sep 17 00:00:00 2001 From: Kevin Ball Date: Wed, 18 May 2016 10:34:18 -0700 Subject: [PATCH] Clean up slider logic and fix bug with top end --- js/foundation.slider.js | 26 +++++++++++++++++--------- 1 file changed, 17 insertions(+), 9 deletions(-) diff --git a/js/foundation.slider.js b/js/foundation.slider.js index db0fd5002..89da741ae 100644 --- a/js/foundation.slider.js +++ b/js/foundation.slider.js @@ -208,7 +208,7 @@ class Slider { /** * Fires when the value has not been change for a given time. * @event Slider#changed - */ + */ clearTimeout(_this.timeout); _this.timeout = setTimeout(function(){ _this.$element.trigger('changed.zf.slider', [$hndl]); @@ -272,15 +272,24 @@ class Slider { vertical = this.options.vertical, param = vertical ? 'height' : 'width', direction = vertical ? 'top' : 'left', - pageXY = vertical ? e.pageY : e.pageX, + eventOffset = vertical ? e.pageY : e.pageX, halfOfHandle = this.$handle[0].getBoundingClientRect()[param] / 2, barDim = this.$element[0].getBoundingClientRect()[param], // touch events emulated by the touch util give position relative to screen, add window.scroll to event coordinates... - windowScroll = vertical ? $(window).scrollTop() : $(window).scrollLeft(), - barOffset = this.$element.offset()[direction] - (this.$element.offset()[direction] < pageXY ? pageXY : (pageXY + windowScroll)), - //if the cursor position is less than or greater than the elements bounding coordinates, set coordinates within those bounds - barXY = barOffset > 0 ? -halfOfHandle : (barOffset - halfOfHandle) < -barDim ? barDim : Math.abs(barOffset), - offsetPct = percent(barXY, barDim); + windowScroll = vertical ? $(window).scrollTop() : $(window).scrollLeft(); + + + var eventFromBar = eventOffset - this.$element.offset()[direction]; + var barXY; + if (eventFromBar < 0) { + barXY = 0; + } else if (eventFromBar > barDim) { + barXY = barDim; + } else { + barXY = eventFromBar; + } + offsetPct = percent(barXY, barDim); + value = (this.options.end - this.options.start) * offsetPct + this.options.start; // turn everything around for RTL, yay math! @@ -377,7 +386,6 @@ class Slider { $body.on('mousemove.zf.slider', function(e) { e.preventDefault(); - _this._handleEvent(e, curHandle); }).on('mouseup.zf.slider', function(e) { @@ -540,7 +548,7 @@ Slider.defaults = { */ invertVertical: false, /** - * Milliseconds before the `changed.zf-slider` event is triggered after value change. + * Milliseconds before the `changed.zf-slider` event is triggered after value change. * @option * @example 500 */ -- 2.47.3