@egjs/flicking 4.9.3 → 4.10.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/declaration/Flicking.d.ts +2 -0
- package/declaration/control/AxesController.d.ts +2 -0
- package/declaration/control/Control.d.ts +3 -0
- package/dist/flicking.esm.js +166 -37
- package/dist/flicking.esm.js.map +1 -1
- package/dist/flicking.js +166 -37
- package/dist/flicking.js.map +1 -1
- package/dist/flicking.min.js +2 -2
- package/dist/flicking.min.js.map +1 -1
- package/dist/flicking.pkgd.js +188 -46
- package/dist/flicking.pkgd.js.map +1 -1
- package/dist/flicking.pkgd.min.js +2 -2
- package/dist/flicking.pkgd.min.js.map +1 -1
- package/package.json +6 -3
- package/src/Flicking.ts +42 -0
- package/src/control/AxesController.ts +34 -0
- package/src/control/Control.ts +77 -35
package/dist/flicking.js
CHANGED
|
@@ -4,7 +4,7 @@ name: @egjs/flicking
|
|
|
4
4
|
license: MIT
|
|
5
5
|
author: NAVER Corp.
|
|
6
6
|
repository: https://github.com/naver/egjs-flicking
|
|
7
|
-
version: 4.
|
|
7
|
+
version: 4.10.1
|
|
8
8
|
*/
|
|
9
9
|
(function (global, factory) {
|
|
10
10
|
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('@egjs/component'), require('@egjs/axes'), require('@egjs/imready')) :
|
|
@@ -2212,10 +2212,6 @@ version: 4.9.3
|
|
|
2212
2212
|
return StateMachine;
|
|
2213
2213
|
}();
|
|
2214
2214
|
|
|
2215
|
-
/*
|
|
2216
|
-
* Copyright (c) 2015 NAVER Corp.
|
|
2217
|
-
* egjs projects are licensed under the MIT license
|
|
2218
|
-
*/
|
|
2219
2215
|
/**
|
|
2220
2216
|
* A controller that handles the {@link https://naver.github.io/egjs-axes/ @egjs/axes} events
|
|
2221
2217
|
* @ko {@link https://naver.github.io/egjs-axes/ @egjs/axes}의 이벤트를 처리하는 컨트롤러 컴포넌트
|
|
@@ -2425,6 +2421,7 @@ version: 4.9.3
|
|
|
2425
2421
|
});
|
|
2426
2422
|
this._panInput = new Axes.PanInput(flicking.viewport.element, {
|
|
2427
2423
|
inputType: flicking.inputType,
|
|
2424
|
+
threshold: 1,
|
|
2428
2425
|
iOSEdgeSwipeThreshold: flicking.iOSEdgeSwipeThreshold,
|
|
2429
2426
|
scale: flicking.horizontal ? [-1, 0] : [0, -1],
|
|
2430
2427
|
releaseOnScroll: true
|
|
@@ -2510,6 +2507,44 @@ version: 4.9.3
|
|
|
2510
2507
|
(_a = this._panInput) === null || _a === void 0 ? void 0 : _a.release();
|
|
2511
2508
|
return this;
|
|
2512
2509
|
};
|
|
2510
|
+
/**
|
|
2511
|
+
* Change the destination and duration of the animation currently playing
|
|
2512
|
+
* @ko 재생 중인 애니메이션의 목적지와 재생 시간을 변경합니다
|
|
2513
|
+
* @param {number} position A position to move<ko>이동할 좌표</ko>
|
|
2514
|
+
* @param {number} duration Duration of the animation (unit: ms)<ko>애니메이션 진행 시간 (단위: ms)</ko>
|
|
2515
|
+
* @chainable
|
|
2516
|
+
* @return {this}
|
|
2517
|
+
*/
|
|
2518
|
+
|
|
2519
|
+
|
|
2520
|
+
__proto.updateAnimation = function (position, duration) {
|
|
2521
|
+
var _a;
|
|
2522
|
+
|
|
2523
|
+
var _b;
|
|
2524
|
+
|
|
2525
|
+
this._animatingContext = __assign(__assign({}, this._animatingContext), {
|
|
2526
|
+
end: position
|
|
2527
|
+
});
|
|
2528
|
+
(_b = this._axes) === null || _b === void 0 ? void 0 : _b.updateAnimation({
|
|
2529
|
+
destPos: (_a = {}, _a[POSITION_KEY] = position, _a),
|
|
2530
|
+
duration: duration
|
|
2531
|
+
});
|
|
2532
|
+
return this;
|
|
2533
|
+
};
|
|
2534
|
+
/**
|
|
2535
|
+
* Stops the animation currently playing
|
|
2536
|
+
* @ko 재생 중인 애니메이션을 중단시킵니다
|
|
2537
|
+
* @chainable
|
|
2538
|
+
* @return {this}
|
|
2539
|
+
*/
|
|
2540
|
+
|
|
2541
|
+
|
|
2542
|
+
__proto.stopAnimation = function () {
|
|
2543
|
+
var _a;
|
|
2544
|
+
|
|
2545
|
+
(_a = this._axes) === null || _a === void 0 ? void 0 : _a.stopAnimation();
|
|
2546
|
+
return this;
|
|
2547
|
+
};
|
|
2513
2548
|
/**
|
|
2514
2549
|
* Update {@link https://naver.github.io/egjs-axes/ @egjs/axes}'s state
|
|
2515
2550
|
* @ko {@link https://naver.github.io/egjs-axes/ @egjs/axes}의 상태를 갱신합니다
|
|
@@ -2834,6 +2869,47 @@ version: 4.9.3
|
|
|
2834
2869
|
|
|
2835
2870
|
return this;
|
|
2836
2871
|
};
|
|
2872
|
+
/**
|
|
2873
|
+
* Change the destination and duration of the animation currently playing
|
|
2874
|
+
* @ko 재생 중인 애니메이션의 목적지와 재생 시간을 변경합니다
|
|
2875
|
+
* @param {Panel} panel The target panel to move<ko>이동할 패널</ko>
|
|
2876
|
+
* @param {number} duration Duration of the animation (unit: ms)<ko>애니메이션 진행 시간 (단위: ms)</ko>
|
|
2877
|
+
* @param {DIRECTION} direction Direction to move, only available in the {@link Flicking#circular circular} mode<ko>이동할 방향. {@link Flicking#circular circular} 옵션 활성화시에만 사용 가능합니다</ko>
|
|
2878
|
+
* @chainable
|
|
2879
|
+
* @throws {FlickingError}
|
|
2880
|
+
* {@link ERROR_CODE POSITION_NOT_REACHABLE} When the given panel is already removed or not in the Camera's {@link Camera#range range}
|
|
2881
|
+
* <ko>{@link ERROR_CODE POSITION_NOT_REACHABLE} 주어진 패널이 제거되었거나, Camera의 {@link Camera#range range} 밖에 있을 경우</ko>
|
|
2882
|
+
* @return {this}
|
|
2883
|
+
*/
|
|
2884
|
+
|
|
2885
|
+
|
|
2886
|
+
__proto.updateAnimation = function (panel, duration, direction) {
|
|
2887
|
+
var state = this._controller.state;
|
|
2888
|
+
|
|
2889
|
+
var position = this._getPosition(panel, direction !== null && direction !== void 0 ? direction : DIRECTION.NONE);
|
|
2890
|
+
|
|
2891
|
+
state.targetPanel = panel;
|
|
2892
|
+
|
|
2893
|
+
this._controller.updateAnimation(position, duration);
|
|
2894
|
+
|
|
2895
|
+
return this;
|
|
2896
|
+
};
|
|
2897
|
+
/**
|
|
2898
|
+
* Stops the animation currently playing
|
|
2899
|
+
* @ko 재생 중인 애니메이션을 중단시킵니다
|
|
2900
|
+
* @chainable
|
|
2901
|
+
* @return {this}
|
|
2902
|
+
*/
|
|
2903
|
+
|
|
2904
|
+
|
|
2905
|
+
__proto.stopAnimation = function () {
|
|
2906
|
+
var state = this._controller.state;
|
|
2907
|
+
state.targetPanel = null;
|
|
2908
|
+
|
|
2909
|
+
this._controller.stopAnimation();
|
|
2910
|
+
|
|
2911
|
+
return this;
|
|
2912
|
+
};
|
|
2837
2913
|
/**
|
|
2838
2914
|
* Update position after resizing
|
|
2839
2915
|
* @ko resize 이후에 position을 업데이트합니다
|
|
@@ -2929,38 +3005,9 @@ version: 4.9.3
|
|
|
2929
3005
|
direction = _b === void 0 ? DIRECTION.NONE : _b,
|
|
2930
3006
|
axesEvent = _a.axesEvent;
|
|
2931
3007
|
return __awaiter(this, void 0, void 0, function () {
|
|
2932
|
-
var
|
|
3008
|
+
var position;
|
|
2933
3009
|
return __generator(this, function (_c) {
|
|
2934
|
-
|
|
2935
|
-
camera = flicking.camera;
|
|
2936
|
-
position = panel.position;
|
|
2937
|
-
nearestAnchor = camera.findNearestAnchor(position);
|
|
2938
|
-
|
|
2939
|
-
if (panel.removed || !nearestAnchor) {
|
|
2940
|
-
return [2
|
|
2941
|
-
/*return*/
|
|
2942
|
-
, Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(panel.position), CODE.POSITION_NOT_REACHABLE))];
|
|
2943
|
-
}
|
|
2944
|
-
|
|
2945
|
-
if (!camera.canReach(panel)) {
|
|
2946
|
-
// Override position & panel if that panel is not reachable
|
|
2947
|
-
position = nearestAnchor.position;
|
|
2948
|
-
panel = nearestAnchor.panel;
|
|
2949
|
-
} else if (flicking.circularEnabled) {
|
|
2950
|
-
camPos_1 = this._controller.position;
|
|
2951
|
-
camRangeDiff = camera.rangeDiff;
|
|
2952
|
-
possiblePositions = [position, position + camRangeDiff, position - camRangeDiff].filter(function (pos) {
|
|
2953
|
-
if (direction === DIRECTION.NONE) return true;
|
|
2954
|
-
return direction === DIRECTION.PREV ? pos <= camPos_1 : pos >= camPos_1;
|
|
2955
|
-
});
|
|
2956
|
-
position = possiblePositions.reduce(function (nearestPosition, pos) {
|
|
2957
|
-
if (Math.abs(camPos_1 - pos) < Math.abs(camPos_1 - nearestPosition)) {
|
|
2958
|
-
return pos;
|
|
2959
|
-
} else {
|
|
2960
|
-
return nearestPosition;
|
|
2961
|
-
}
|
|
2962
|
-
}, Infinity);
|
|
2963
|
-
}
|
|
3010
|
+
position = this._getPosition(panel, direction);
|
|
2964
3011
|
|
|
2965
3012
|
this._triggerIndexChangeEvent(panel, panel.position, axesEvent);
|
|
2966
3013
|
|
|
@@ -3077,6 +3124,45 @@ version: 4.9.3
|
|
|
3077
3124
|
});
|
|
3078
3125
|
};
|
|
3079
3126
|
|
|
3127
|
+
__proto._getPosition = function (panel, direction) {
|
|
3128
|
+
if (direction === void 0) {
|
|
3129
|
+
direction = DIRECTION.NONE;
|
|
3130
|
+
}
|
|
3131
|
+
|
|
3132
|
+
var flicking = getFlickingAttached(this._flicking);
|
|
3133
|
+
var camera = flicking.camera;
|
|
3134
|
+
var position = panel.position;
|
|
3135
|
+
var nearestAnchor = camera.findNearestAnchor(position);
|
|
3136
|
+
|
|
3137
|
+
if (panel.removed || !nearestAnchor) {
|
|
3138
|
+
throw new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(panel.position), CODE.POSITION_NOT_REACHABLE);
|
|
3139
|
+
}
|
|
3140
|
+
|
|
3141
|
+
if (!camera.canReach(panel)) {
|
|
3142
|
+
// Override position & panel if that panel is not reachable
|
|
3143
|
+
position = nearestAnchor.position;
|
|
3144
|
+
panel = nearestAnchor.panel;
|
|
3145
|
+
} else if (flicking.circularEnabled) {
|
|
3146
|
+
// Circular mode is enabled, find nearest distance to panel
|
|
3147
|
+
var camPos_1 = this._controller.position; // Actual position of the Axes
|
|
3148
|
+
|
|
3149
|
+
var camRangeDiff = camera.rangeDiff;
|
|
3150
|
+
var possiblePositions = [position, position + camRangeDiff, position - camRangeDiff].filter(function (pos) {
|
|
3151
|
+
if (direction === DIRECTION.NONE) return true;
|
|
3152
|
+
return direction === DIRECTION.PREV ? pos <= camPos_1 : pos >= camPos_1;
|
|
3153
|
+
});
|
|
3154
|
+
position = possiblePositions.reduce(function (nearestPosition, pos) {
|
|
3155
|
+
if (Math.abs(camPos_1 - pos) < Math.abs(camPos_1 - nearestPosition)) {
|
|
3156
|
+
return pos;
|
|
3157
|
+
} else {
|
|
3158
|
+
return nearestPosition;
|
|
3159
|
+
}
|
|
3160
|
+
}, Infinity);
|
|
3161
|
+
}
|
|
3162
|
+
|
|
3163
|
+
return position;
|
|
3164
|
+
};
|
|
3165
|
+
|
|
3080
3166
|
return Control;
|
|
3081
3167
|
}();
|
|
3082
3168
|
|
|
@@ -8130,6 +8216,49 @@ version: 4.9.3
|
|
|
8130
8216
|
direction: direction
|
|
8131
8217
|
});
|
|
8132
8218
|
};
|
|
8219
|
+
/**
|
|
8220
|
+
* Change the destination and duration of the animation currently playing
|
|
8221
|
+
* @ko 재생 중인 애니메이션의 목적지와 재생 시간을 변경합니다
|
|
8222
|
+
* @param {number} index The index of the panel to move<ko>이동할 패널의 인덱스</ko>
|
|
8223
|
+
* @param {number} duration Duration of the animation (unit: ms)<ko>애니메이션 진행 시간 (단위: ms)</ko>
|
|
8224
|
+
* @param {DIRECTION} direction Direction to move, only available in the {@link Flicking#circular circular} mode<ko>이동할 방향. {@link Flicking#circular circular} 옵션 활성화시에만 사용 가능합니다</ko>
|
|
8225
|
+
* @throws {FlickingError}
|
|
8226
|
+
* {@link ERROR_CODE INDEX_OUT_OF_RANGE} When the root is not either string or HTMLElement
|
|
8227
|
+
* <ko>{@link ERROR_CODE INDEX_OUT_OF_RANGE} 해당 인덱스를 가진 패널이 존재하지 않을 경우</ko>
|
|
8228
|
+
* @return {void}
|
|
8229
|
+
*/
|
|
8230
|
+
|
|
8231
|
+
|
|
8232
|
+
__proto.updateAnimation = function (index, duration, direction) {
|
|
8233
|
+
if (!this._control.animating) {
|
|
8234
|
+
return;
|
|
8235
|
+
}
|
|
8236
|
+
|
|
8237
|
+
var renderer = this._renderer;
|
|
8238
|
+
var panelCount = renderer.panelCount;
|
|
8239
|
+
var panel = renderer.getPanel(index);
|
|
8240
|
+
|
|
8241
|
+
if (!panel) {
|
|
8242
|
+
throw new FlickingError(MESSAGE.INDEX_OUT_OF_RANGE(index, 0, panelCount - 1), CODE.INDEX_OUT_OF_RANGE);
|
|
8243
|
+
}
|
|
8244
|
+
|
|
8245
|
+
this._control.updateAnimation(panel, duration, direction);
|
|
8246
|
+
};
|
|
8247
|
+
/**
|
|
8248
|
+
* Stops the animation currently playing
|
|
8249
|
+
* @ko 재생 중인 애니메이션을 중단시킵니다
|
|
8250
|
+
* @fires Flicking#moveEnd
|
|
8251
|
+
* @return {void}
|
|
8252
|
+
*/
|
|
8253
|
+
|
|
8254
|
+
|
|
8255
|
+
__proto.stopAnimation = function () {
|
|
8256
|
+
if (!this._control.animating) {
|
|
8257
|
+
return;
|
|
8258
|
+
}
|
|
8259
|
+
|
|
8260
|
+
this._control.stopAnimation();
|
|
8261
|
+
};
|
|
8133
8262
|
/**
|
|
8134
8263
|
* Return the {@link Panel} at the given index. `null` if it doesn't exists.
|
|
8135
8264
|
* @ko 주어진 인덱스에 해당하는 {@link Panel}을 반환합니다. 주어진 인덱스에 해당하는 패널이 존재하지 않을 경우 `null`을 반환합니다.
|
|
@@ -8673,7 +8802,7 @@ version: 4.9.3
|
|
|
8673
8802
|
*/
|
|
8674
8803
|
|
|
8675
8804
|
|
|
8676
|
-
Flicking.VERSION = "4.
|
|
8805
|
+
Flicking.VERSION = "4.10.1";
|
|
8677
8806
|
return Flicking;
|
|
8678
8807
|
}(Component);
|
|
8679
8808
|
|