瀏覽代碼

Check if there is enough width to shift the slider.

NaotoshiFujita 3 年之前
父節點
當前提交
6432b0e59a

文件差異過大導致無法顯示
+ 0 - 0
dist/js/splide-renderer.min.js


+ 12 - 6
dist/js/splide.js

@@ -656,6 +656,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     paddingLeft: ["paddingTop", "paddingRight"],
     paddingLeft: ["paddingTop", "paddingRight"],
     paddingRight: ["paddingBottom", "paddingLeft"],
     paddingRight: ["paddingBottom", "paddingLeft"],
     width: ["height"],
     width: ["height"],
+    Width: ["Height"],
     left: ["top", "right"],
     left: ["top", "right"],
     right: ["bottom", "left"],
     right: ["bottom", "left"],
     x: ["y"],
     x: ["y"],
@@ -1322,7 +1323,8 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       } else if (!clones2) {
       } else if (!clones2) {
         var fixedSize = options[resolve("fixedWidth")] && Components2.Layout.slideSize(0);
         var fixedSize = options[resolve("fixedWidth")] && Components2.Layout.slideSize(0);
         var fixedCount = fixedSize && ceil(rect(Elements.track)[resolve("width")] / fixedSize);
         var fixedCount = fixedSize && ceil(rect(Elements.track)[resolve("width")] / fixedSize);
-        clones2 = fixedCount || options[resolve("autoWidth")] && Splide2.length || options.perPage;
+        var baseCount = fixedCount || options[resolve("autoWidth")] && Splide2.length || options.perPage;
+        clones2 = baseCount * 2;
       }
       }
 
 
       return clones2;
       return clones2;
@@ -1370,8 +1372,8 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     function move(dest, index, prev, callback) {
     function move(dest, index, prev, callback) {
       var position = getPosition();
       var position = getPosition();
 
 
-      if (dest !== index) {
-        Transition.cancel();
+      if (dest !== index && canShift(dest > index)) {
+        cancel();
         translate(shift(position, dest > index), true);
         translate(shift(position, dest > index), true);
       }
       }
 
 
@@ -1398,7 +1400,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     function translate(position, preventLoop) {
     function translate(position, preventLoop) {
       if (!Splide2.is(FADE)) {
       if (!Splide2.is(FADE)) {
         var destination = preventLoop ? position : loop(position);
         var destination = preventLoop ? position : loop(position);
-        list.style.transform = "translate" + resolve("X") + "(" + destination + "px)";
+        style(list, "transform", "translate" + resolve("X") + "(" + destination + "px)");
         position !== destination && emit(EVENT_SHIFTED);
         position !== destination && emit(EVENT_SHIFTED);
       }
       }
     }
     }
@@ -1476,6 +1478,11 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
       return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
     }
     }
 
 
+    function canShift(backwards) {
+      var shifted = orient(shift(getPosition(), backwards));
+      return backwards ? shifted >= 0 : shifted <= list["scroll" + resolve("Width")] - rect(track)[resolve("width")];
+    }
+
     function exceededLimit(max, position) {
     function exceededLimit(max, position) {
       position = isUndefined(position) ? getPosition() : position;
       position = isUndefined(position) ? getPosition() : position;
       var exceededMin = max !== true && orient(position) < orient(getLimit(false));
       var exceededMin = max !== true && orient(position) < orient(getLimit(false));
@@ -1495,8 +1502,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       getPosition: getPosition,
       getPosition: getPosition,
       getLimit: getLimit,
       getLimit: getLimit,
       exceededLimit: exceededLimit,
       exceededLimit: exceededLimit,
-      reposition: reposition,
-      loop: loop
+      reposition: reposition
     };
     };
   }
   }
 
 

文件差異過大導致無法顯示
+ 0 - 0
dist/js/splide.min.js


二進制
dist/js/splide.min.js.gz


文件差異過大導致無法顯示
+ 0 - 0
dist/js/splide.min.js.map


+ 4 - 1
src/js/components/Clones/Clones.ts

@@ -70,6 +70,8 @@ export function Clones( Splide: Splide, Components: Components, options: Options
 
 
   /**
   /**
    * Observes the required clone count and refreshes the slider if necessary.
    * Observes the required clone count and refreshes the slider if necessary.
+   *
+   * @todo
    */
    */
   function observe(): void {
   function observe(): void {
     if ( cloneCount < computeCloneCount() ) {
     if ( cloneCount < computeCloneCount() ) {
@@ -130,7 +132,8 @@ export function Clones( Splide: Splide, Components: Components, options: Options
     } else if ( ! clones ) {
     } else if ( ! clones ) {
       const fixedSize  = options[ resolve( 'fixedWidth' ) ] && Components.Layout.slideSize( 0 );
       const fixedSize  = options[ resolve( 'fixedWidth' ) ] && Components.Layout.slideSize( 0 );
       const fixedCount = fixedSize && ceil( rect( Elements.track )[ resolve( 'width' ) ] / fixedSize );
       const fixedCount = fixedSize && ceil( rect( Elements.track )[ resolve( 'width' ) ] / fixedSize );
-      clones = fixedCount || ( options[ resolve( 'autoWidth' ) ] && Splide.length ) || options.perPage;
+      const baseCount  = fixedCount || ( options[ resolve( 'autoWidth' ) ] && Splide.length ) || options.perPage;
+      clones = baseCount * 2; // todo
     }
     }
 
 
     return clones;
     return clones;

+ 1 - 0
src/js/components/Direction/Direction.ts

@@ -25,6 +25,7 @@ export const ORIENTATION_MAP = {
   paddingLeft : [ 'paddingTop', 'paddingRight' ],
   paddingLeft : [ 'paddingTop', 'paddingRight' ],
   paddingRight: [ 'paddingBottom', 'paddingLeft' ],
   paddingRight: [ 'paddingBottom', 'paddingLeft' ],
   width       : [ 'height' ],
   width       : [ 'height' ],
+  Width       : [ 'Height' ],
   left        : [ 'top', 'right' ],
   left        : [ 'top', 'right' ],
   right       : [ 'bottom', 'left' ],
   right       : [ 'bottom', 'left' ],
   x           : [ 'y' ],
   x           : [ 'y' ],

+ 19 - 5
src/js/components/Move/Move.ts

@@ -13,7 +13,7 @@ import { FADE, LOOP, SLIDE } from '../../constants/types';
 import { EventInterface } from '../../constructors';
 import { EventInterface } from '../../constructors';
 import { Splide } from '../../core/Splide/Splide';
 import { Splide } from '../../core/Splide/Splide';
 import { AnyFunction, BaseComponent, Components, Options, TransitionComponent } from '../../types';
 import { AnyFunction, BaseComponent, Components, Options, TransitionComponent } from '../../types';
-import { abs, apply, ceil, clamp, isUndefined, rect } from '../../utils';
+import { abs, apply, ceil, clamp, isUndefined, rect, style } from '../../utils';
 
 
 
 
 /**
 /**
@@ -93,9 +93,8 @@ export function Move( Splide: Splide, Components: Components, options: Options )
   function move( dest: number, index: number, prev: number, callback?: AnyFunction ): void {
   function move( dest: number, index: number, prev: number, callback?: AnyFunction ): void {
     const position = getPosition();
     const position = getPosition();
 
 
-    // todo shift...
-    if ( dest !== index ) {
-      Transition.cancel();
+    if ( dest !== index && canShift( dest > index ) ) {
+      cancel();
       translate( shift( position, dest > index ), true );
       translate( shift( position, dest > index ), true );
     }
     }
 
 
@@ -118,6 +117,7 @@ export function Move( Splide: Splide, Components: Components, options: Options )
     set( IDLE );
     set( IDLE );
     emit( EVENT_MOVED, index, prev, dest );
     emit( EVENT_MOVED, index, prev, dest );
 
 
+    // todo can I optimize?
     if ( options.trimSpace === 'move' && dest !== prev && from === getPosition() ) {
     if ( options.trimSpace === 'move' && dest !== prev && from === getPosition() ) {
       Components.Controller.go( dest > prev ? '>' : '<', false, callback );
       Components.Controller.go( dest > prev ? '>' : '<', false, callback );
     } else {
     } else {
@@ -143,7 +143,7 @@ export function Move( Splide: Splide, Components: Components, options: Options )
   function translate( position: number, preventLoop?: boolean ): void {
   function translate( position: number, preventLoop?: boolean ): void {
     if ( ! Splide.is( FADE ) ) {
     if ( ! Splide.is( FADE ) ) {
       const destination = preventLoop ? position : loop( position );
       const destination = preventLoop ? position : loop( position );
-      list.style.transform = `translate${ resolve( 'X' ) }(${ destination }px)`;
+      style( list, 'transform', `translate${ resolve( 'X' ) }(${ destination }px)` );
       position !== destination && emit( EVENT_SHIFTED );
       position !== destination && emit( EVENT_SHIFTED );
     }
     }
   }
   }
@@ -277,6 +277,20 @@ export function Move( Splide: Splide, Components: Components, options: Options )
     return toPosition( max ? Components.Controller.getEnd() : 0, !! options.trimSpace );
     return toPosition( max ? Components.Controller.getEnd() : 0, !! options.trimSpace );
   }
   }
 
 
+  /**
+   * Checks if there is enough width to shift the slider.
+   *
+   * @param backwards - `true` for checking backwards, or `false` for doing forwards.
+   *
+   * @return `true` if the slider can be shifted for the specified direction, or otherwise `false`.
+   */
+  function canShift( backwards: boolean ): boolean {
+    const shifted = orient( shift( getPosition(), backwards ) );
+    return backwards
+      ? shifted >= 0
+      : shifted <= list[ `scroll${ resolve( 'Width' ) }` ] - rect( track )[ resolve( 'width' ) ];
+  }
+
   /**
   /**
    * Checks if the provided position exceeds the minimum or maximum limit or not.
    * Checks if the provided position exceeds the minimum or maximum limit or not.
    *
    *

部分文件因文件數量過多而無法顯示