@egjs/flicking 4.6.1 → 4.6.2
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/control/Control.d.ts +1 -1
- package/dist/flicking.esm.js +132 -138
- package/dist/flicking.esm.js.map +1 -1
- package/dist/flicking.js +132 -138
- 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 +132 -138
- 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 +1 -1
- package/src/cfc/sync.ts +3 -1
- package/src/control/Control.ts +2 -2
- package/src/control/FreeControl.ts +1 -1
- package/src/control/SnapControl.ts +1 -1
- package/src/control/StrictControl.ts +1 -1
- package/src/control/states/AnimatingState.ts +4 -1
- package/src/control/states/DraggingState.ts +7 -2
- package/src/renderer/Renderer.ts +16 -14
|
@@ -19,7 +19,7 @@ declare abstract class Control {
|
|
|
19
19
|
destroy(): void;
|
|
20
20
|
enable(): this;
|
|
21
21
|
disable(): this;
|
|
22
|
-
updatePosition(
|
|
22
|
+
updatePosition(progressInPanel: number): void;
|
|
23
23
|
updateInput(): this;
|
|
24
24
|
resetActive(): this;
|
|
25
25
|
moveToPanel(panel: Panel, { duration, direction, axesEvent }: {
|
package/dist/flicking.esm.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.6.
|
|
7
|
+
version: 4.6.2
|
|
8
8
|
*/
|
|
9
9
|
import Component, { ComponentEvent } from '@egjs/component';
|
|
10
10
|
import Axes, { PanInput } from '@egjs/axes';
|
|
@@ -1868,6 +1868,8 @@ function (_super) {
|
|
|
1868
1868
|
};
|
|
1869
1869
|
|
|
1870
1870
|
__proto.onRelease = function (ctx) {
|
|
1871
|
+
var _a;
|
|
1872
|
+
|
|
1871
1873
|
var flicking = ctx.flicking,
|
|
1872
1874
|
axesEvent = ctx.axesEvent,
|
|
1873
1875
|
transitTo = ctx.transitTo; // Update last position to cope with Axes's animating behavior
|
|
@@ -1887,7 +1889,13 @@ function (_super) {
|
|
|
1887
1889
|
var control = flicking.control;
|
|
1888
1890
|
var position = axesEvent.destPos[POSITION_KEY];
|
|
1889
1891
|
var duration = Math.max(axesEvent.duration, flicking.duration);
|
|
1890
|
-
|
|
1892
|
+
|
|
1893
|
+
try {
|
|
1894
|
+
void control.moveToPosition(position, duration, axesEvent);
|
|
1895
|
+
} catch (err) {
|
|
1896
|
+
transitTo(STATE_TYPE.IDLE);
|
|
1897
|
+
axesEvent.setTo((_a = {}, _a[POSITION_KEY] = flicking.camera.position, _a), 0);
|
|
1898
|
+
}
|
|
1891
1899
|
};
|
|
1892
1900
|
|
|
1893
1901
|
return DraggingState;
|
|
@@ -1963,7 +1971,11 @@ function (_super) {
|
|
|
1963
1971
|
direction: getDirection(animatingContext.start, animatingContext.end),
|
|
1964
1972
|
axesEvent: axesEvent
|
|
1965
1973
|
}));
|
|
1966
|
-
|
|
1974
|
+
var targetPanel = this._targetPanel;
|
|
1975
|
+
|
|
1976
|
+
if (targetPanel) {
|
|
1977
|
+
control.setActive(targetPanel, control.activePanel, axesEvent.isTrusted);
|
|
1978
|
+
}
|
|
1967
1979
|
};
|
|
1968
1980
|
|
|
1969
1981
|
return AnimatingState;
|
|
@@ -2718,7 +2730,7 @@ function () {
|
|
|
2718
2730
|
*/
|
|
2719
2731
|
|
|
2720
2732
|
|
|
2721
|
-
__proto.updatePosition = function (
|
|
2733
|
+
__proto.updatePosition = function (progressInPanel) {
|
|
2722
2734
|
var flicking = getFlickingAttached(this._flicking);
|
|
2723
2735
|
var camera = flicking.camera;
|
|
2724
2736
|
var activePanel = this._activePanel;
|
|
@@ -3094,48 +3106,41 @@ function (_super) {
|
|
|
3094
3106
|
*/
|
|
3095
3107
|
|
|
3096
3108
|
__proto.moveToPosition = function (position, duration, axesEvent) {
|
|
3097
|
-
|
|
3098
|
-
|
|
3099
|
-
|
|
3100
|
-
|
|
3101
|
-
|
|
3102
|
-
activeAnchor = camera.findActiveAnchor();
|
|
3103
|
-
anchorAtCamera = camera.findNearestAnchor(camera.position);
|
|
3104
|
-
state = flicking.control.controller.state;
|
|
3109
|
+
var flicking = getFlickingAttached(this._flicking);
|
|
3110
|
+
var camera = flicking.camera;
|
|
3111
|
+
var activeAnchor = camera.findActiveAnchor();
|
|
3112
|
+
var anchorAtCamera = camera.findNearestAnchor(camera.position);
|
|
3113
|
+
var state = flicking.control.controller.state;
|
|
3105
3114
|
|
|
3106
|
-
|
|
3107
|
-
|
|
3108
|
-
|
|
3109
|
-
, Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE))];
|
|
3110
|
-
}
|
|
3115
|
+
if (!activeAnchor || !anchorAtCamera) {
|
|
3116
|
+
return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
|
|
3117
|
+
}
|
|
3111
3118
|
|
|
3112
|
-
|
|
3113
|
-
posDelta = flicking.animating ? state.delta : position - camera.position;
|
|
3114
|
-
absPosDelta = Math.abs(posDelta);
|
|
3115
|
-
snapDelta = axesEvent && axesEvent.delta[POSITION_KEY] !== 0 ? Math.abs(axesEvent.delta[POSITION_KEY]) : absPosDelta;
|
|
3116
|
-
|
|
3117
|
-
if (snapDelta >= snapThreshold && snapDelta > 0) {
|
|
3118
|
-
// Move to anchor at position
|
|
3119
|
-
targetAnchor = this._findSnappedAnchor(position, anchorAtCamera);
|
|
3120
|
-
} else if (absPosDelta >= flicking.threshold && absPosDelta > 0) {
|
|
3121
|
-
// Move to the adjacent panel
|
|
3122
|
-
targetAnchor = this._findAdjacentAnchor(posDelta, anchorAtCamera);
|
|
3123
|
-
} else {
|
|
3124
|
-
// Restore to active panel
|
|
3125
|
-
targetAnchor = anchorAtCamera;
|
|
3126
|
-
}
|
|
3119
|
+
var snapThreshold = this._calcSnapThreshold(position, activeAnchor);
|
|
3127
3120
|
|
|
3128
|
-
|
|
3121
|
+
var posDelta = flicking.animating ? state.delta : position - camera.position;
|
|
3122
|
+
var absPosDelta = Math.abs(posDelta);
|
|
3123
|
+
var snapDelta = axesEvent && axesEvent.delta[POSITION_KEY] !== 0 ? Math.abs(axesEvent.delta[POSITION_KEY]) : absPosDelta;
|
|
3124
|
+
var targetAnchor;
|
|
3129
3125
|
|
|
3130
|
-
|
|
3131
|
-
|
|
3132
|
-
|
|
3133
|
-
|
|
3134
|
-
|
|
3135
|
-
|
|
3136
|
-
|
|
3137
|
-
|
|
3138
|
-
|
|
3126
|
+
if (snapDelta >= snapThreshold && snapDelta > 0) {
|
|
3127
|
+
// Move to anchor at position
|
|
3128
|
+
targetAnchor = this._findSnappedAnchor(position, anchorAtCamera);
|
|
3129
|
+
} else if (absPosDelta >= flicking.threshold && absPosDelta > 0) {
|
|
3130
|
+
// Move to the adjacent panel
|
|
3131
|
+
targetAnchor = this._findAdjacentAnchor(posDelta, anchorAtCamera);
|
|
3132
|
+
} else {
|
|
3133
|
+
// Restore to active panel
|
|
3134
|
+
targetAnchor = anchorAtCamera;
|
|
3135
|
+
}
|
|
3136
|
+
|
|
3137
|
+
this._triggerIndexChangeEvent(targetAnchor.panel, position, axesEvent);
|
|
3138
|
+
|
|
3139
|
+
return this._animateToPosition({
|
|
3140
|
+
position: camera.clampToReachablePosition(targetAnchor.position),
|
|
3141
|
+
duration: duration,
|
|
3142
|
+
newActivePanel: targetAnchor.panel,
|
|
3143
|
+
axesEvent: axesEvent
|
|
3139
3144
|
});
|
|
3140
3145
|
};
|
|
3141
3146
|
|
|
@@ -3324,35 +3329,26 @@ function (_super) {
|
|
|
3324
3329
|
|
|
3325
3330
|
|
|
3326
3331
|
__proto.moveToPosition = function (position, duration, axesEvent) {
|
|
3327
|
-
|
|
3328
|
-
|
|
3329
|
-
|
|
3330
|
-
|
|
3331
|
-
camera = flicking.camera;
|
|
3332
|
-
targetPos = camera.clampToReachablePosition(position);
|
|
3333
|
-
anchorAtPosition = camera.findAnchorIncludePosition(targetPos);
|
|
3332
|
+
var flicking = getFlickingAttached(this._flicking);
|
|
3333
|
+
var camera = flicking.camera;
|
|
3334
|
+
var targetPos = camera.clampToReachablePosition(position);
|
|
3335
|
+
var anchorAtPosition = camera.findAnchorIncludePosition(targetPos);
|
|
3334
3336
|
|
|
3335
|
-
|
|
3336
|
-
|
|
3337
|
-
|
|
3338
|
-
, Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE))];
|
|
3339
|
-
}
|
|
3337
|
+
if (!anchorAtPosition) {
|
|
3338
|
+
return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
|
|
3339
|
+
}
|
|
3340
3340
|
|
|
3341
|
-
|
|
3341
|
+
var targetPanel = anchorAtPosition.panel; // Trigger only change event
|
|
3342
3342
|
|
|
3343
|
-
|
|
3344
|
-
|
|
3345
|
-
|
|
3343
|
+
if (targetPanel !== this._activePanel) {
|
|
3344
|
+
this._triggerIndexChangeEvent(targetPanel, position, axesEvent);
|
|
3345
|
+
}
|
|
3346
3346
|
|
|
3347
|
-
|
|
3348
|
-
|
|
3349
|
-
|
|
3350
|
-
|
|
3351
|
-
|
|
3352
|
-
newActivePanel: targetPanel,
|
|
3353
|
-
axesEvent: axesEvent
|
|
3354
|
-
})];
|
|
3355
|
-
});
|
|
3347
|
+
return this._animateToPosition({
|
|
3348
|
+
position: this._stopAtEdge ? targetPos : position,
|
|
3349
|
+
duration: duration,
|
|
3350
|
+
newActivePanel: targetPanel,
|
|
3351
|
+
axesEvent: axesEvent
|
|
3356
3352
|
});
|
|
3357
3353
|
};
|
|
3358
3354
|
|
|
@@ -3550,62 +3546,56 @@ function (_super) {
|
|
|
3550
3546
|
|
|
3551
3547
|
|
|
3552
3548
|
__proto.moveToPosition = function (position, duration, axesEvent) {
|
|
3553
|
-
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
|
|
3557
|
-
|
|
3558
|
-
|
|
3559
|
-
|
|
3560
|
-
|
|
3561
|
-
cameraRange = camera.range;
|
|
3562
|
-
clampedPosition = clamp(camera.clampToReachablePosition(position), axesRange[0], axesRange[1]);
|
|
3563
|
-
anchorAtPosition = camera.findAnchorIncludePosition(clampedPosition);
|
|
3564
|
-
|
|
3565
|
-
if (!anchorAtPosition || !activePanel) {
|
|
3566
|
-
return [2
|
|
3567
|
-
/*return*/
|
|
3568
|
-
, Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE))];
|
|
3569
|
-
}
|
|
3549
|
+
var flicking = getFlickingAttached(this._flicking);
|
|
3550
|
+
var camera = flicking.camera;
|
|
3551
|
+
var activePanel = this._activePanel;
|
|
3552
|
+
var axesRange = this._controller.range;
|
|
3553
|
+
var indexRange = this._indexRange;
|
|
3554
|
+
var cameraRange = camera.range;
|
|
3555
|
+
var clampedPosition = clamp(camera.clampToReachablePosition(position), axesRange[0], axesRange[1]);
|
|
3556
|
+
var anchorAtPosition = camera.findAnchorIncludePosition(clampedPosition);
|
|
3570
3557
|
|
|
3571
|
-
|
|
3572
|
-
|
|
3573
|
-
|
|
3574
|
-
|
|
3575
|
-
|
|
3576
|
-
|
|
3577
|
-
|
|
3578
|
-
|
|
3579
|
-
|
|
3580
|
-
|
|
3581
|
-
|
|
3582
|
-
|
|
3583
|
-
|
|
3584
|
-
|
|
3585
|
-
|
|
3586
|
-
|
|
3587
|
-
|
|
3588
|
-
|
|
3589
|
-
|
|
3590
|
-
|
|
3591
|
-
|
|
3592
|
-
|
|
3593
|
-
|
|
3594
|
-
|
|
3595
|
-
|
|
3596
|
-
|
|
3558
|
+
if (!anchorAtPosition || !activePanel) {
|
|
3559
|
+
return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
|
|
3560
|
+
}
|
|
3561
|
+
|
|
3562
|
+
var prevPos = activePanel.position;
|
|
3563
|
+
var isOverThreshold = Math.abs(position - prevPos) >= flicking.threshold;
|
|
3564
|
+
var adjacentAnchor = position > prevPos ? camera.getNextAnchor(anchorAtPosition) : camera.getPrevAnchor(anchorAtPosition);
|
|
3565
|
+
var targetPos;
|
|
3566
|
+
var targetPanel;
|
|
3567
|
+
var anchors = camera.anchorPoints;
|
|
3568
|
+
var firstAnchor = anchors[0];
|
|
3569
|
+
var lastAnchor = anchors[anchors.length - 1];
|
|
3570
|
+
var shouldBounceToFirst = position <= cameraRange.min && isBetween(firstAnchor.panel.index, indexRange.min, indexRange.max);
|
|
3571
|
+
var shouldBounceToLast = position >= cameraRange.max && isBetween(lastAnchor.panel.index, indexRange.min, indexRange.max);
|
|
3572
|
+
|
|
3573
|
+
if (shouldBounceToFirst || shouldBounceToLast) {
|
|
3574
|
+
// In bounce area
|
|
3575
|
+
var targetAnchor = position < cameraRange.min ? firstAnchor : lastAnchor;
|
|
3576
|
+
targetPanel = targetAnchor.panel;
|
|
3577
|
+
targetPos = targetAnchor.position;
|
|
3578
|
+
} else if (isOverThreshold && anchorAtPosition.position !== activePanel.position) {
|
|
3579
|
+
// Move to anchor at position
|
|
3580
|
+
targetPanel = anchorAtPosition.panel;
|
|
3581
|
+
targetPos = anchorAtPosition.position;
|
|
3582
|
+
} else if (isOverThreshold && adjacentAnchor && isBetween(adjacentAnchor.index, indexRange.min, indexRange.max)) {
|
|
3583
|
+
// Move to adjacent anchor
|
|
3584
|
+
targetPanel = adjacentAnchor.panel;
|
|
3585
|
+
targetPos = adjacentAnchor.position;
|
|
3586
|
+
} else {
|
|
3587
|
+
// Restore to active panel
|
|
3588
|
+
targetPos = camera.clampToReachablePosition(activePanel.position);
|
|
3589
|
+
targetPanel = activePanel;
|
|
3590
|
+
}
|
|
3597
3591
|
|
|
3598
|
-
|
|
3592
|
+
this._triggerIndexChangeEvent(targetPanel, position, axesEvent);
|
|
3599
3593
|
|
|
3600
|
-
|
|
3601
|
-
|
|
3602
|
-
|
|
3603
|
-
|
|
3604
|
-
|
|
3605
|
-
newActivePanel: targetPanel,
|
|
3606
|
-
axesEvent: axesEvent
|
|
3607
|
-
})];
|
|
3608
|
-
});
|
|
3594
|
+
return this._animateToPosition({
|
|
3595
|
+
position: targetPos,
|
|
3596
|
+
duration: duration,
|
|
3597
|
+
newActivePanel: targetPanel,
|
|
3598
|
+
axesEvent: axesEvent
|
|
3609
3599
|
});
|
|
3610
3600
|
};
|
|
3611
3601
|
|
|
@@ -5253,29 +5243,31 @@ function () {
|
|
|
5253
5243
|
|
|
5254
5244
|
void this.render();
|
|
5255
5245
|
|
|
5256
|
-
if (!
|
|
5257
|
-
if (
|
|
5258
|
-
|
|
5259
|
-
|
|
5260
|
-
|
|
5261
|
-
|
|
5246
|
+
if (!flicking.animating) {
|
|
5247
|
+
if (!activePanel || activePanel.removed) {
|
|
5248
|
+
if (panels.length <= 0) {
|
|
5249
|
+
// All panels removed
|
|
5250
|
+
camera.lookAt(0);
|
|
5251
|
+
} else {
|
|
5252
|
+
var targetIndex = (_a = activePanel === null || activePanel === void 0 ? void 0 : activePanel.index) !== null && _a !== void 0 ? _a : 0;
|
|
5262
5253
|
|
|
5263
|
-
|
|
5264
|
-
|
|
5265
|
-
|
|
5254
|
+
if (targetIndex > panels.length - 1) {
|
|
5255
|
+
targetIndex = panels.length - 1;
|
|
5256
|
+
}
|
|
5266
5257
|
|
|
5267
|
-
|
|
5258
|
+
void control.moveToPanel(panels[targetIndex], {
|
|
5259
|
+
duration: 0
|
|
5260
|
+
}).catch(function () {
|
|
5261
|
+
return void 0;
|
|
5262
|
+
});
|
|
5263
|
+
}
|
|
5264
|
+
} else {
|
|
5265
|
+
void control.moveToPanel(activePanel, {
|
|
5268
5266
|
duration: 0
|
|
5269
5267
|
}).catch(function () {
|
|
5270
5268
|
return void 0;
|
|
5271
5269
|
});
|
|
5272
5270
|
}
|
|
5273
|
-
} else {
|
|
5274
|
-
void control.moveToPanel(control.activePanel, {
|
|
5275
|
-
duration: 0
|
|
5276
|
-
}).catch(function () {
|
|
5277
|
-
return void 0;
|
|
5278
|
-
});
|
|
5279
5271
|
}
|
|
5280
5272
|
|
|
5281
5273
|
flicking.camera.updateOffset();
|
|
@@ -8384,7 +8376,7 @@ function (_super) {
|
|
|
8384
8376
|
*/
|
|
8385
8377
|
|
|
8386
8378
|
|
|
8387
|
-
Flicking.VERSION = "4.6.
|
|
8379
|
+
Flicking.VERSION = "4.6.2";
|
|
8388
8380
|
return Flicking;
|
|
8389
8381
|
}(Component);
|
|
8390
8382
|
|
|
@@ -8538,7 +8530,9 @@ var sync = (function (flicking, diffResult, rendered) {
|
|
|
8538
8530
|
}
|
|
8539
8531
|
}
|
|
8540
8532
|
|
|
8541
|
-
|
|
8533
|
+
if (diffResult.added.length > 0 || diffResult.removed.length > 0) {
|
|
8534
|
+
renderer.updateAfterPanelChange(added, removed);
|
|
8535
|
+
}
|
|
8542
8536
|
});
|
|
8543
8537
|
|
|
8544
8538
|
var batchInsert = function (renderer, diffResult, addedElements, startIdx, endIdx) {
|