Merge pull request nolimits4web#2370 from fenyagg/master

add parameter watchOverflow

src/components/core/check-overflow/index.js

@@ -0,0 +1,15 @@
+
+function checkOverflow() {
+  const swiper = this;
+  const wasLocked = swiper.isLocked;
+
+  swiper.isLocked = swiper.snapGrid.length === 1;
+  swiper.allowTouchMove = !swiper.isLocked;
+
+  if (wasLocked && wasLocked !== swiper.isLocked) {
+    swiper.isEnd = false;
+    swiper.navigation.update();
+  }
+}
+
+export default { checkOverflow };

src/components/core/core-class.js

@@ -16,6 +16,7 @@ import events from './events/index';
 import breakpoints from './breakpoints/index';
 import classes from './classes/index';
 import images from './images/index';
+import checkOverflow from './check-overflow/index';
 
 import defaults from './defaults';
 
@@ -29,6 +30,7 @@ const prototypes = {
   manipulation,
   events,
   breakpoints,
+  checkOverflow,
   classes,
   images,
 };
@@ -317,6 +319,10 @@ class Swiper extends SwiperClass {
     // Update slides
     swiper.updateSlides();
 
+    if (swiper.params.watchOverflow) {
+      swiper.checkOverflow();
+    }
+
     // Set Grab Cursor
     if (swiper.params.grabCursor) {
       swiper.setGrabCursor();

src/components/core/defaults.js

@@ -45,6 +45,9 @@ export default {
   slidesOffsetAfter: 0, // in px
   normalizeSlideIndex: true,
 
+  // Disable swiper and hide navigation when container not overflow
+  watchOverflow: false,
+
   // Round length
   roundLengths: false,
 

src/components/core/update/updateSlides.js

@@ -200,6 +200,7 @@ export default function () {
     swiper.emit('slidesLengthChange');
   }
   if (snapGrid.length !== previousSnapGridLength) {
+    if (swiper.params.watchOverflow) swiper.checkOverflow();
     swiper.emit('snapGridLengthChange');
   }
   if (slidesGrid.length !== previousSlidesGridLength) {

src/components/navigation/navigation.js

@@ -16,13 +16,15 @@ const Navigation = {
       } else {
         $prevEl.removeClass(params.disabledClass);
       }
+      $prevEl[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](params.lockClass);
     }
     if ($nextEl && $nextEl.length > 0) {
       if (swiper.isEnd) {
         $nextEl.addClass(params.disabledClass);
       } else {
         $nextEl.removeClass(params.disabledClass);
       }
+      $nextEl[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](params.lockClass);
     }
   },
   init() {
@@ -101,6 +103,7 @@ export default {
       hideOnClick: false,
       disabledClass: 'swiper-button-disabled',
       hiddenClass: 'swiper-button-hidden',
+      lockClass: 'swiper-button-lock',
     },
   },
   create() {

src/components/navigation/navigation.less

@@ -37,3 +37,6 @@
     }
   }
 });
+.swiper-button-lock {
+  display: none;
+}

src/components/pagination/pagination.js

@@ -95,6 +95,7 @@ const Pagination = {
     } else {
       swiper.emit('paginationUpdate', swiper, $el[0]);
     }
+    $el[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](params.lockClass);
   },
   render() {
     // Render Container
@@ -219,6 +220,7 @@ export default {
       hiddenClass: 'swiper-pagination-hidden',
       progressbarFillClass: 'swiper-pagination-progressbar-fill',
       clickableClass: 'swiper-pagination-clickable', // NEW
+      lockClass: 'swiper-pagination-lock',
     },
   },
   create() {

src/components/pagination/pagination.less

@@ -140,3 +140,6 @@
     }
   }
 });
+.swiper-pagination-lock {
+  display: none;
+}

src/components/scrollbar/scrollbar.js

@@ -95,6 +95,7 @@ const Scrollbar = {
       moveDivider,
       dragSize,
     });
+    scrollbar.$el[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](swiper.params.scrollbar.lockClass);
   },
   setDragPosition(e) {
     const swiper = this;
@@ -251,6 +252,7 @@ export default {
       hide: false,
       draggable: false,
       snapOnRelease: true,
+      lockClass: 'swiper-scrollbar-lock',
     },
   },
   create() {

src/components/scrollbar/scrollbar.less

@@ -33,3 +33,6 @@
 .swiper-scrollbar-cursor-drag {
   cursor: move;
 }
+.swiper-scrollbar-lock {
+  display: none;
+}