Replace internal count based on visible option with width calculations

i-like-robots · Mar 14, 2014 · 204d83d · 204d83d
1 parent c766ced
commit 204d83d
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 31 deletions.
diff --git a/dist/slideshow.js b/dist/slideshow.js
diff --git a/src/slideshow.js b/src/slideshow.js
@@ -34,13 +34,13 @@
     };
 
     function Slides(target, options) {
-
         this.target = target;
         this.$target = $(target);
         this.opts = $.extend({}, defaults, options, this.$target.data());
         this.$carousel = this.$target.children(this.opts.carousel);
         this.$items = this.$carousel.children(this.opts.items);
         this.count = this.$items.length;
+        this.scrollable = true;
 
         if ( this.count > 1 ) {
             this._init();
@@ -54,7 +54,6 @@
      * @private
      */
     Slides.prototype._init = function() {
-
         var self = this;
 
         // $wrapper is a document fragment, not the new DOM reference
@@ -80,13 +79,11 @@
 
         // Controls
         if ( this.opts.pagination || this.opts.skip ) {
-
             this.$target.on('click.slides', '[data-slides]', function( e ) {
+                var $this = $(this);
 
                 e.preventDefault();
 
-                var $this = $(this);
-
                 if ( ! $this.hasClass('disabled') ) {
                     self.to($this.data('slides'), true);
                 }
@@ -184,7 +181,7 @@
      * @returns {boolean}
      */
     Slides.prototype.hasNext = function() {
-        return this.current < (this.count - 1);
+        return this.scrollable && this.current < (this.count - 1);
     };
 
     /**
@@ -218,10 +215,11 @@
     Slides.prototype.to = function( x, user ) {
 
         // Allow while animating?
+        // <http://jsperf.com/animated-pseudo-selector/3>
         if ( this.opts.jumpQueue ) {
             this.$items.stop(true, true);
         }
-        else if ( this.$items.queue('fx').length ) { // <http://jsperf.com/animated-pseudo-selector/3>
+        else if ( this.$items.queue('fx').length ) {
             return;
         }
 
@@ -271,7 +269,6 @@
      * @param {string} transition
      */
     Slides.prototype.redraw = function( transition ) {
-
         if ( this.transition ) {
             this.transition.teardown.call(this);
         }
@@ -331,12 +328,12 @@
                 .css('display', 'none');
 
             this.execute = function() {
-                var $next = this.$items.eq(this.future),
-                    $current = this.$items.eq(this.current).css({
-                        position: 'absolute',
-                        left: 0,
-                        top: 0
-                    });
+                var $next = this.$items.eq(this.future);
+                var $current = this.$items.eq(this.current).css({
+                    position: 'absolute',
+                    left: 0,
+                    top: 0
+                });
 
                 $next.fadeIn(this.opts.speed, this.opts.easing, function() {
                     self._oncomplete.call(self);
@@ -357,39 +354,43 @@
         // Scroll
         scroll: function() {
             var self = this;
+            var carouselWidth = 0;
 
             this.$items.css({
                 'float': 'left',
                 'width': this.opts.slideWidth
             });
 
-            var carouselWidth = 0;
-
-            for (var i = 0; i < this.count; i++) {
+            for ( var i = 0; i < this.count; i++ ) {
                 carouselWidth+= this.$items.eq(i).outerWidth(true);
             }
 
+            // setting the `width` property does not work on iOS 4
             this.$carousel.css({
-                'minWidth': carouselWidth // setting width property does not work on iOS 4
+                'minWidth': carouselWidth
             });
 
-            this.realcount = this.count;
-            this.count -= this.opts.visible - 1;
-
             this.execute = function() {
-                var left = this.$items.eq(this.future).position().left + this.$wrapper.scrollLeft();
+                var scroll = this.$items.eq(this.future).position().left + this.$wrapper.scrollLeft();
+                var maxScroll = this.$carousel.width() - this.$wrapper.width();
+                var limitScroll = scroll >= maxScroll;
+
+                if ( ! limitScroll || this.scrollable ) {
+                    // Using scroll rather than positioning prevents redraws
+                    this.$wrapper.animate({
+                        scrollLeft: limitScroll ? maxScroll : scroll
+                    }, this.opts.speed, this.opts.easing, function() {
+                        self._oncomplete.call(self);
+                    });
+                }
 
-                this.$wrapper.animate({
-                    scrollLeft: left // Scroll prevents redraws
-                }, this.opts.speed, this.opts.easing, function() {
-                    self._oncomplete.call(self);
-                });
+                this.scrollable = ! limitScroll;
             };
 
             this.teardown = function() {
-                this.count = this.realcount;
-                this.$carousel.stop(true, true).removeAttr('style');
+                this.scrollable = true;
                 this.$items.removeAttr('style');
+                this.$carousel.stop(true, true).removeAttr('style');
             };
 
             return this;