]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
Clean up slider logic and fix bug with top end
authorKevin Ball <kmball11@gmail.com>
Wed, 18 May 2016 17:34:18 +0000 (10:34 -0700)
committerKevin Ball <kmball11@gmail.com>
Wed, 18 May 2016 17:34:18 +0000 (10:34 -0700)
js/foundation.slider.js

index db0fd50020019977a8f82063a35c656832117a8f..89da741aeb6d3a880244e5566d38b3c4febab7be 100644 (file)
@@ -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
    */