Browse Source

Refactoring.

NaotoshiFujita 3 năm trước cách đây
mục cha
commit
c7349364e1

+ 33 - 41
dist/js/splide.js

@@ -1417,9 +1417,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     var _Components2$Elements3 = Components2.Elements,
         list = _Components2$Elements3.list,
         track = _Components2$Elements3.track;
-    var looping;
     var waiting;
-    var currPosition = 0;
     var shouldSnap = true;
 
     function mount() {
@@ -1436,47 +1434,40 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
     function move(dest, index, prev) {
       if (!isBusy()) {
+        var set = Splide2.state.set;
         var position = getPosition();
-        looping = dest !== index;
-        waiting = options.waitForTransition;
-        Splide2.state.set(MOVING);
+        var looping = dest !== index;
+        waiting = looping || options.waitForTransition;
+        set(MOVING);
         emit(EVENT_MOVE, index, prev, dest);
         Components2.Transition.start(dest, function () {
-          onMoved(dest, index, prev, position);
-        });
-      }
-    }
-
-    function onMoved(dest, index, prev, oldPosition) {
-      if (looping) {
-        jump(index);
-      }
-
-      waiting = false;
-      Splide2.state.set(IDLE);
-      emit(EVENT_MOVED, index, prev, dest);
+          looping && jump(index);
+          waiting = false;
+          set(IDLE);
+          emit(EVENT_MOVED, index, prev, dest);
 
-      if (options.trimSpace === "move" && dest !== prev && oldPosition === getPosition()) {
-        Components2.Controller.go(dest > prev ? ">" : "<");
+          if (options.trimSpace === "move" && dest !== prev && position === getPosition()) {
+            Components2.Controller.go(dest > prev ? ">" : "<");
+          }
+        });
       }
     }
 
     function jump(index) {
       waiting = false;
-      looping = false;
       Components2.Transition.cancel();
       translate(toPosition(index, true));
     }
 
     function translate(position) {
-      currPosition = loop(position);
-      shouldSnap = canSnap(currPosition);
-      Components2.Style.ruleBy(list, "transform", "translate" + resolve("X") + "(" + 100 * currPosition / listSize() + "%)");
+      position = loop(position);
+      shouldSnap = canSnap(position);
+      Components2.Style.ruleBy(list, "transform", "translate" + resolve("X") + "(" + 100 * position / listSize() + "%)");
     }
 
     function loop(position) {
-      if (!looping && Splide2.is(LOOP)) {
-        var diff = position - currPosition;
+      if (!waiting && Splide2.is(LOOP)) {
+        var diff = position - getPosition();
         var exceededMin = exceededLimit(false, position);
         var exceededMax = exceededLimit(true, position);
 
@@ -1552,14 +1543,11 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function isBusy() {
-      return !!(looping || waiting);
+      return waiting;
     }
 
     function exceededLimit(max, position) {
-      if (position === void 0) {
-        position = currPosition;
-      }
-
+      position = isUndefined(position) ? getPosition() : position;
       var exceededMin = max !== true && orient(position) < orient(getLimit(false));
       var exceededMax = max !== false && orient(position) > orient(getLimit(true));
       return exceededMin || exceededMax;
@@ -2160,16 +2148,20 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       if (!disabled) {
         isMouse = e.type === "mousedown";
 
-        if (!Move.isBusy() && (!isMouse || !e.button)) {
-          target = isMouse ? window : track;
-          prevBaseEvent = null;
-          lastEvent = null;
-          clickPrevented = false;
-          bind(target, POINTER_MOVE_EVENTS, onPointerMove);
-          bind(target, POINTER_UP_EVENTS, onPointerUp);
-          Move.cancel();
-          Scroll.cancel();
-          save(e);
+        if (!isMouse || !e.button) {
+          if (!Move.isBusy()) {
+            target = isMouse ? window : track;
+            prevBaseEvent = null;
+            lastEvent = null;
+            clickPrevented = false;
+            bind(target, POINTER_MOVE_EVENTS, onPointerMove);
+            bind(target, POINTER_UP_EVENTS, onPointerUp);
+            Move.cancel();
+            Scroll.cancel();
+            save(e);
+          } else {
+            prevent(e, true);
+          }
         }
       }
     }

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
dist/js/splide.js.map


Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
dist/js/splide.min.js


BIN
dist/js/splide.min.js.gz


+ 16 - 11
src/js/components/Drag/Drag.ts

@@ -112,6 +112,7 @@ export function Drag( Splide: Splide, Components: Components, options: Options )
 
   /**
    * Called when the user clicks or touches the slider.
+   * Needs to prevent the default behaviour when the slider is busy to deny any action, such as dragging images.
    * Note that IE does not support MouseEvent and TouchEvent constructors.
    *
    * @param e - A TouchEvent or MouseEvent object
@@ -120,17 +121,21 @@ export function Drag( Splide: Splide, Components: Components, options: Options )
     if ( ! disabled ) {
       isMouse = e.type === 'mousedown';
 
-      if ( ! Move.isBusy() && ( ! isMouse || ! ( e as MouseEvent ).button ) ) {
-        target         = isMouse ? window : track;
-        prevBaseEvent  = null;
-        lastEvent      = null;
-        clickPrevented = false;
-
-        bind( target, POINTER_MOVE_EVENTS, onPointerMove );
-        bind( target, POINTER_UP_EVENTS, onPointerUp );
-        Move.cancel();
-        Scroll.cancel();
-        save( e );
+      if ( ! isMouse || ! ( e as MouseEvent ).button ) {
+        if ( ! Move.isBusy() ) {
+          target         = isMouse ? window : track;
+          prevBaseEvent  = null;
+          lastEvent      = null;
+          clickPrevented = false;
+
+          bind( target, POINTER_MOVE_EVENTS, onPointerMove );
+          bind( target, POINTER_UP_EVENTS, onPointerUp );
+          Move.cancel();
+          Scroll.cancel();
+          save( e );
+        } else {
+          prevent( e, true );
+        }
       }
     }
   }

+ 20 - 45
src/js/components/Move/Move.ts

@@ -44,21 +44,11 @@ export function Move( Splide: Splide, Components: Components, options: Options )
   const { resolve, orient } = Components.Direction;
   const { list, track } = Components.Elements;
 
-  /**
-   * Indicates whether the slider is just looping or not.
-   */
-  let looping: boolean;
-
   /**
    * Indicates whether the component can move the slider or not.
    */
   let waiting: boolean;
 
-  /**
-   * Keeps the current position.
-   */
-  let currPosition = 0;
-
   /**
    * Indicates whether the the slider should snap the position to the specific slide or not.
    */
@@ -92,42 +82,27 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    */
   function move( dest: number, index: number, prev: number ): void {
     if ( ! isBusy() ) {
+      const { set } = Splide.state;
       const position = getPosition();
+      const looping  = dest !== index;
 
-      looping = dest !== index; // todo
-      waiting = options.waitForTransition;
-
-      Splide.state.set( MOVING );
+      waiting = looping || options.waitForTransition;
+      set( MOVING );
       emit( EVENT_MOVE, index, prev, dest );
 
       Components.Transition.start( dest, () => {
-        onMoved( dest, index, prev, position );
+        looping && jump( index );
+        waiting = false;
+        set( IDLE );
+        emit( EVENT_MOVED, index, prev, dest );
+
+        if ( options.trimSpace === 'move' && dest !== prev && position === getPosition() ) {
+          Components.Controller.go( dest > prev ? '>' : '<' );
+        }
       } );
     }
   }
 
-  /**
-   * Called after the transition ends.
-   *
-   * @param dest        - A destination index to go to.
-   * @param index       - A slide index.
-   * @param prev        - A previous index.
-   * @param oldPosition - An old position.
-   */
-  function onMoved( dest: number, index: number, prev: number, oldPosition: number ) {
-    if ( looping ) {
-      jump( index );
-    }
-
-    waiting = false;
-    Splide.state.set( IDLE );
-    emit( EVENT_MOVED, index, prev, dest );
-
-    if ( options.trimSpace === 'move' && dest !== prev && oldPosition === getPosition() ) {
-      Components.Controller.go( dest > prev ? '>' : '<' );
-    }
-  }
-
   /**
    * Jumps to the slide at the specified index.
    *
@@ -135,7 +110,6 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    */
   function jump( index: number ): void {
     waiting = false;
-    looping = false;
     Components.Transition.cancel();
     translate( toPosition( index, true ) );
   }
@@ -146,13 +120,13 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    * @param position - The destination.
    */
   function translate( position: number ): void {
-    currPosition = loop( position );
-    shouldSnap   = canSnap( currPosition );
+    position   = loop( position );
+    shouldSnap = canSnap( position );
 
     Components.Style.ruleBy(
       list,
       'transform',
-      `translate${ resolve( 'X' ) }(${ 100 * currPosition / listSize() }%)`
+      `translate${ resolve( 'X' ) }(${ 100 * position / listSize() }%)`
     );
   }
 
@@ -162,8 +136,8 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    * @param position - A position to loop.
    */
   function loop( position: number ): number {
-    if ( ! looping && Splide.is( LOOP ) ) {
-      const diff        = position - currPosition;
+    if ( ! waiting && Splide.is( LOOP ) ) {
+      const diff        = position - getPosition();
       const exceededMin = exceededLimit( false, position );
       const exceededMax = exceededLimit( true, position );
 
@@ -294,7 +268,7 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    * @return `true` if the slider can move, or otherwise `false`.
    */
   function isBusy(): boolean {
-    return !! ( looping || waiting );
+    return waiting;
   }
 
   /**
@@ -305,7 +279,8 @@ export function Move( Splide: Splide, Components: Components, options: Options )
    *
    * @return `true` if the position exceeds the limit, or otherwise `false`.
    */
-  function exceededLimit( max?: boolean | undefined, position = currPosition ): boolean {
+  function exceededLimit( max?: boolean | undefined, position?: number ): boolean {
+    position = isUndefined( position ) ? getPosition() : position;
     const exceededMin = max !== true && orient( position ) < orient( getLimit( false ) );
     const exceededMax = max !== false && orient( position ) > orient( getLimit( true ) );
     return exceededMin || exceededMax;

Một số tệp đã không được hiển thị bởi vì quá nhiều tập tin thay đổi trong này khác