Skip to content

Commit ff3aa9c

Browse files
NaotoshiFujitaNaotoshiFujita
committed
Revise the sync system with removing the loop point.
1 parent 83f3cee commit ff3aa9c

File tree

26 files changed

+185
-178
lines changed

26 files changed

+185
-178
lines changed

‎dist/js/splide-renderer.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/js/splide.cjs.js‎

Lines changed: 28 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*!
22
* Splide.js
3-
* Version : 3.2.7
3+
* Version : 3.3.0
44
* License : MIT
55
* Copyright: 2021 Naotoshi Fujita
66
*/
@@ -804,7 +804,7 @@ function Slide$1(Splide2, index, slideIndex, slide) {
804804
function initNavigation() {
805805
const idx = isClone ? slideIndex : index;
806806
const label = format(options.i18n.slideX, idx + 1);
807-
const controls = Splide2.splides.map((splide) => splide.root.id).join(" ");
807+
const controls = Splide2.splides.map((target) => target.splide.root.id).join(" ");
808808
setAttribute(slide, ARIA_LABEL, label);
809809
setAttribute(slide, ARIA_CONTROLS, controls);
810810
setAttribute(slide, ROLE, "menuitem");
@@ -1170,8 +1170,9 @@ function Move(Splide2, Components2, options) {
11701170
const { slideSize, getPadding, totalSize, listSize, sliderSize } = Components2.Layout;
11711171
const { resolve, orient } = Components2.Direction;
11721172
const { list, track } = Components2.Elements;
1173-
let waiting;
1173+
let Transition;
11741174
function mount() {
1175+
Transition = Components2.Transition;
11751176
on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition);
11761177
}
11771178
function destroy() {
@@ -1188,13 +1189,13 @@ function Move(Splide2, Components2, options) {
11881189
if (!isBusy()) {
11891190
const { set } = Splide2.state;
11901191
const position = getPosition();
1191-
const looping = dest !== index;
1192-
waiting = looping || options.waitForTransition;
1192+
if (dest !== index) {
1193+
Transition.cancel();
1194+
translate(shift(position, dest > index), true);
1195+
}
11931196
set(MOVING);
11941197
emit(EVENT_MOVE, index, prev, dest);
1195-
Components2.Transition.start(dest, () => {
1196-
looping && jump(index);
1197-
waiting = false;
1198+
Transition.start(index, () => {
11981199
set(IDLE);
11991200
emit(EVENT_MOVED, index, prev, dest);
12001201
if (options.trimSpace === "move" && dest !== prev && position === getPosition()) {
@@ -1214,7 +1215,7 @@ function Move(Splide2, Components2, options) {
12141215
}
12151216
}
12161217
function loop(position) {
1217-
if (!waiting && Splide2.is(LOOP)) {
1218+
if (Splide2.is(LOOP)) {
12181219
const diff = orient(position - getPosition());
12191220
const exceededMin = exceededLimit(false, position) && diff < 0;
12201221
const exceededMax = exceededLimit(true, position) && diff > 0;
@@ -1227,13 +1228,12 @@ function Move(Splide2, Components2, options) {
12271228
function shift(position, backwards) {
12281229
const excess = position - getLimit(backwards);
12291230
const size = sliderSize();
1230-
position -= sign(excess) * size * ceil(abs(excess) / size);
1231+
position -= orient(size * (ceil(abs(excess) / size) || 1)) * (backwards ? 1 : -1);
12311232
return position;
12321233
}
12331234
function cancel() {
1234-
waiting = false;
12351235
translate(getPosition());
1236-
Components2.Transition.cancel();
1236+
Transition.cancel();
12371237
}
12381238
function toIndex(position) {
12391239
const Slides = Components2.Slides.get();
@@ -1273,7 +1273,7 @@ function Move(Splide2, Components2, options) {
12731273
return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
12741274
}
12751275
function isBusy() {
1276-
return !!waiting;
1276+
return Splide2.state.is(MOVING) && options.waitForTransition;
12771277
}
12781278
function exceededLimit(max, position) {
12791279
position = isUndefined(position) ? getPosition() : position;
@@ -1828,6 +1828,10 @@ function Drag(Splide2, Components2, options) {
18281828
prevent(e);
18291829
}
18301830
emit(EVENT_DRAGGED);
1831+
} else {
1832+
if (!isFree) {
1833+
Controller.go(Splide2.index, true);
1834+
}
18311835
}
18321836
dragging = false;
18331837
}
@@ -2111,14 +2115,14 @@ function Pagination(Splide2, Components2, options) {
21112115

21122116
const TRIGGER_KEYS = [" ", "Enter", "Spacebar"];
21132117
function Sync(Splide2, Components2, options) {
2114-
const { splides } = Splide2;
21152118
const { list } = Components2.Elements;
21162119
const events = [];
21172120
function mount() {
2121+
Splide2.splides.forEach((target) => {
2122+
!target.isChild && sync(target.splide);
2123+
});
21182124
if (options.isNavigation) {
21192125
navigate();
2120-
} else {
2121-
splides.length && sync();
21222126
}
21232127
}
21242128
function destroy() {
@@ -2132,19 +2136,12 @@ function Sync(Splide2, Components2, options) {
21322136
destroy();
21332137
mount();
21342138
}
2135-
function sync() {
2136-
const processed = [];
2137-
splides.concat(Splide2).forEach((splide, index, instances) => {
2138-
const event = EventInterface(splide);
2139-
event.on(EVENT_MOVE, (index2, prev, dest) => {
2140-
instances.forEach((instance) => {
2141-
if (instance !== splide && !includes(processed, splide)) {
2142-
processed.push(instance);
2143-
instance.Components.Move.cancel();
2144-
instance.go(instance.is(LOOP) ? dest : index2);
2145-
}
2146-
});
2147-
empty(processed);
2139+
function sync(splide) {
2140+
[Splide2, splide].forEach((instance) => {
2141+
const event = EventInterface(instance);
2142+
const target = instance === Splide2 ? splide : Splide2;
2143+
event.on(EVENT_MOVE, (index, prev, dest) => {
2144+
target.go(target.is(LOOP) ? dest : index);
21482145
});
21492146
events.push(event);
21502147
});
@@ -2362,8 +2359,8 @@ const _Splide = class {
23622359
return this;
23632360
}
23642361
sync(splide) {
2365-
this.splides.push(splide);
2366-
splide.splides.push(this);
2362+
this.splides.push({ splide });
2363+
splide.splides.push({ splide: this, isChild: true });
23672364
if (this.state.is(IDLE)) {
23682365
this._Components.Sync.remount();
23692366
splide.Components.Sync.remount();

‎dist/js/splide.esm.js‎

Lines changed: 28 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*!
22
* Splide.js
3-
* Version : 3.2.7
3+
* Version : 3.3.0
44
* License : MIT
55
* Copyright: 2021 Naotoshi Fujita
66
*/
@@ -800,7 +800,7 @@ function Slide$1(Splide2, index, slideIndex, slide) {
800800
function initNavigation() {
801801
const idx = isClone ? slideIndex : index;
802802
const label = format(options.i18n.slideX, idx + 1);
803-
const controls = Splide2.splides.map((splide) => splide.root.id).join(" ");
803+
const controls = Splide2.splides.map((target) => target.splide.root.id).join(" ");
804804
setAttribute(slide, ARIA_LABEL, label);
805805
setAttribute(slide, ARIA_CONTROLS, controls);
806806
setAttribute(slide, ROLE, "menuitem");
@@ -1166,8 +1166,9 @@ function Move(Splide2, Components2, options) {
11661166
const { slideSize, getPadding, totalSize, listSize, sliderSize } = Components2.Layout;
11671167
const { resolve, orient } = Components2.Direction;
11681168
const { list, track } = Components2.Elements;
1169-
let waiting;
1169+
let Transition;
11701170
function mount() {
1171+
Transition = Components2.Transition;
11711172
on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition);
11721173
}
11731174
function destroy() {
@@ -1184,13 +1185,13 @@ function Move(Splide2, Components2, options) {
11841185
if (!isBusy()) {
11851186
const { set } = Splide2.state;
11861187
const position = getPosition();
1187-
const looping = dest !== index;
1188-
waiting = looping || options.waitForTransition;
1188+
if (dest !== index) {
1189+
Transition.cancel();
1190+
translate(shift(position, dest > index), true);
1191+
}
11891192
set(MOVING);
11901193
emit(EVENT_MOVE, index, prev, dest);
1191-
Components2.Transition.start(dest, () => {
1192-
looping && jump(index);
1193-
waiting = false;
1194+
Transition.start(index, () => {
11941195
set(IDLE);
11951196
emit(EVENT_MOVED, index, prev, dest);
11961197
if (options.trimSpace === "move" && dest !== prev && position === getPosition()) {
@@ -1210,7 +1211,7 @@ function Move(Splide2, Components2, options) {
12101211
}
12111212
}
12121213
function loop(position) {
1213-
if (!waiting && Splide2.is(LOOP)) {
1214+
if (Splide2.is(LOOP)) {
12141215
const diff = orient(position - getPosition());
12151216
const exceededMin = exceededLimit(false, position) && diff < 0;
12161217
const exceededMax = exceededLimit(true, position) && diff > 0;
@@ -1223,13 +1224,12 @@ function Move(Splide2, Components2, options) {
12231224
function shift(position, backwards) {
12241225
const excess = position - getLimit(backwards);
12251226
const size = sliderSize();
1226-
position -= sign(excess) * size * ceil(abs(excess) / size);
1227+
position -= orient(size * (ceil(abs(excess) / size) || 1)) * (backwards ? 1 : -1);
12271228
return position;
12281229
}
12291230
function cancel() {
1230-
waiting = false;
12311231
translate(getPosition());
1232-
Components2.Transition.cancel();
1232+
Transition.cancel();
12331233
}
12341234
function toIndex(position) {
12351235
const Slides = Components2.Slides.get();
@@ -1269,7 +1269,7 @@ function Move(Splide2, Components2, options) {
12691269
return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
12701270
}
12711271
function isBusy() {
1272-
return !!waiting;
1272+
return Splide2.state.is(MOVING) && options.waitForTransition;
12731273
}
12741274
function exceededLimit(max, position) {
12751275
position = isUndefined(position) ? getPosition() : position;
@@ -1824,6 +1824,10 @@ function Drag(Splide2, Components2, options) {
18241824
prevent(e);
18251825
}
18261826
emit(EVENT_DRAGGED);
1827+
} else {
1828+
if (!isFree) {
1829+
Controller.go(Splide2.index, true);
1830+
}
18271831
}
18281832
dragging = false;
18291833
}
@@ -2107,14 +2111,14 @@ function Pagination(Splide2, Components2, options) {
21072111

21082112
const TRIGGER_KEYS = [" ", "Enter", "Spacebar"];
21092113
function Sync(Splide2, Components2, options) {
2110-
const { splides } = Splide2;
21112114
const { list } = Components2.Elements;
21122115
const events = [];
21132116
function mount() {
2117+
Splide2.splides.forEach((target) => {
2118+
!target.isChild && sync(target.splide);
2119+
});
21142120
if (options.isNavigation) {
21152121
navigate();
2116-
} else {
2117-
splides.length && sync();
21182122
}
21192123
}
21202124
function destroy() {
@@ -2128,19 +2132,12 @@ function Sync(Splide2, Components2, options) {
21282132
destroy();
21292133
mount();
21302134
}
2131-
function sync() {
2132-
const processed = [];
2133-
splides.concat(Splide2).forEach((splide, index, instances) => {
2134-
const event = EventInterface(splide);
2135-
event.on(EVENT_MOVE, (index2, prev, dest) => {
2136-
instances.forEach((instance) => {
2137-
if (instance !== splide && !includes(processed, splide)) {
2138-
processed.push(instance);
2139-
instance.Components.Move.cancel();
2140-
instance.go(instance.is(LOOP) ? dest : index2);
2141-
}
2142-
});
2143-
empty(processed);
2135+
function sync(splide) {
2136+
[Splide2, splide].forEach((instance) => {
2137+
const event = EventInterface(instance);
2138+
const target = instance === Splide2 ? splide : Splide2;
2139+
event.on(EVENT_MOVE, (index, prev, dest) => {
2140+
target.go(target.is(LOOP) ? dest : index);
21442141
});
21452142
events.push(event);
21462143
});
@@ -2358,8 +2355,8 @@ const _Splide = class {
23582355
return this;
23592356
}
23602357
sync(splide) {
2361-
this.splides.push(splide);
2362-
splide.splides.push(this);
2358+
this.splides.push({ splide });
2359+
splide.splides.push({ splide: this, isChild: true });
23632360
if (this.state.is(IDLE)) {
23642361
this._Components.Sync.remount();
23652362
splide.Components.Sync.remount();

0 commit comments

Comments
 (0)