Skip to content

Commit cf35dc2

Browse files
NaotoshiFujitaNaotoshiFujita
committed
Fix #867.
1 parent 2586acd commit cf35dc2

10 files changed

Lines changed: 66 additions & 25 deletions

File tree

‎dist/js/splide.cjs.js‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*!
22
* Splide.js
3-
* Version : 4.0.11
3+
* Version : 4.0.12
44
* License : MIT
55
* Copyright: 2022 Naotoshi Fujita
66
*/
@@ -2403,19 +2403,30 @@ function LazyLoad(Splide2, Components2, options) {
24032403
emit = _EventInterface12.emit;
24042404

24052405
var isSequential = options.lazyLoad === "sequential";
2406-
var events = [EVENT_MOUNTED, EVENT_REFRESH, EVENT_MOVED, EVENT_SCROLLED];
2406+
var events = [EVENT_MOVED, EVENT_SCROLLED];
24072407
var entries = [];
24082408

24092409
function mount() {
24102410
if (options.lazyLoad) {
24112411
init();
24122412
on(EVENT_REFRESH, init);
2413-
isSequential || on(events, check);
24142413
}
24152414
}
24162415

24172416
function init() {
24182417
empty(entries);
2418+
register();
2419+
2420+
if (isSequential) {
2421+
loadNext();
2422+
} else {
2423+
off(events);
2424+
on(events, check);
2425+
check();
2426+
}
2427+
}
2428+
2429+
function register() {
24192430
Components2.Slides.forEach(function (Slide) {
24202431
queryAll(Slide.slide, IMAGE_SELECTOR).forEach(function (img) {
24212432
var src = getAttribute(img, SRC_DATA_ATTRIBUTE);
@@ -2430,7 +2441,6 @@ function LazyLoad(Splide2, Components2, options) {
24302441
}
24312442
});
24322443
});
2433-
isSequential && loadNext();
24342444
}
24352445

24362446
function check() {

‎dist/js/splide.esm.js‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
44

55
/*!
66
* Splide.js
7-
* Version : 4.0.11
7+
* Version : 4.0.12
88
* License : MIT
99
* Copyright: 2022 Naotoshi Fujita
1010
*/
@@ -2398,19 +2398,30 @@ function LazyLoad(Splide2, Components2, options) {
23982398
emit = _EventInterface12.emit;
23992399

24002400
var isSequential = options.lazyLoad === "sequential";
2401-
var events = [EVENT_MOUNTED, EVENT_REFRESH, EVENT_MOVED, EVENT_SCROLLED];
2401+
var events = [EVENT_MOVED, EVENT_SCROLLED];
24022402
var entries = [];
24032403

24042404
function mount() {
24052405
if (options.lazyLoad) {
24062406
init();
24072407
on(EVENT_REFRESH, init);
2408-
isSequential || on(events, check);
24092408
}
24102409
}
24112410

24122411
function init() {
24132412
empty(entries);
2413+
register();
2414+
2415+
if (isSequential) {
2416+
loadNext();
2417+
} else {
2418+
off(events);
2419+
on(events, check);
2420+
check();
2421+
}
2422+
}
2423+
2424+
function register() {
24142425
Components2.Slides.forEach(function (Slide) {
24152426
queryAll(Slide.slide, IMAGE_SELECTOR).forEach(function (img) {
24162427
var src = getAttribute(img, SRC_DATA_ATTRIBUTE);
@@ -2425,7 +2436,6 @@ function LazyLoad(Splide2, Components2, options) {
24252436
}
24262437
});
24272438
});
2428-
isSequential && loadNext();
24292439
}
24302440

24312441
function check() {

‎dist/js/splide.js‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
44

55
/*!
66
* Splide.js
7-
* Version : 4.0.11
7+
* Version : 4.0.12
88
* License : MIT
99
* Copyright: 2022 Naotoshi Fujita
1010
*/
@@ -2396,19 +2396,30 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
23962396
emit = _EventInterface12.emit;
23972397

23982398
var isSequential = options.lazyLoad === "sequential";
2399-
var events = [EVENT_MOUNTED, EVENT_REFRESH, EVENT_MOVED, EVENT_SCROLLED];
2399+
var events = [EVENT_MOVED, EVENT_SCROLLED];
24002400
var entries = [];
24012401

24022402
function mount() {
24032403
if (options.lazyLoad) {
24042404
init();
24052405
on(EVENT_REFRESH, init);
2406-
isSequential || on(events, check);
24072406
}
24082407
}
24092408

24102409
function init() {
24112410
empty(entries);
2411+
register();
2412+
2413+
if (isSequential) {
2414+
loadNext();
2415+
} else {
2416+
off(events);
2417+
on(events, check);
2418+
check();
2419+
}
2420+
}
2421+
2422+
function register() {
24122423
Components2.Slides.forEach(function (Slide) {
24132424
queryAll(Slide.slide, IMAGE_SELECTOR).forEach(function (img) {
24142425
var src = getAttribute(img, SRC_DATA_ATTRIBUTE);
@@ -2423,7 +2434,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
24232434
}
24242435
});
24252436
});
2426-
isSequential && loadNext();
24272437
}
24282438

24292439
function check() {

‎dist/js/splide.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.min.js.gz‎

6 Bytes
Binary file not shown.

‎dist/js/splide.min.js.map‎

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

‎package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@splidejs/splide",
3-
"version": "4.0.11",
3+
"version": "4.0.12",
44
"description": "Splide is a lightweight, flexible and accessible slider/carousel. No dependencies, no Lighthouse errors.",
55
"author": "Naotoshi Fujita",
66
"license": "MIT",

‎src/js/components/LazyLoad/LazyLoad.ts‎

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { CLASS_LOADING } from '../../constants/classes';
22
import {
33
EVENT_LAZYLOAD_LOADED,
4-
EVENT_MOUNTED,
54
EVENT_MOVED,
65
EVENT_REFRESH,
76
EVENT_RESIZE,
@@ -60,7 +59,7 @@ type LazyLoadEntry = [ HTMLImageElement, SlideComponent, HTMLSpanElement ];
6059
export function LazyLoad( Splide: Splide, Components: Components, options: Options ): LazyLoadComponent {
6160
const { on, off, bind, emit } = EventInterface( Splide );
6261
const isSequential = options.lazyLoad === 'sequential';
63-
const events = [ EVENT_MOUNTED, EVENT_REFRESH, EVENT_MOVED, EVENT_SCROLLED ];
62+
const events = [ EVENT_MOVED, EVENT_SCROLLED ];
6463

6564
/**
6665
* Stores data of images.
@@ -74,17 +73,31 @@ export function LazyLoad( Splide: Splide, Components: Components, options: Optio
7473
if ( options.lazyLoad ) {
7574
init();
7675
on( EVENT_REFRESH, init );
77-
isSequential || on( events, check );
7876
}
7977
}
8078

8179
/**
82-
* Finds images to register entries.
83-
* Note that spinner can be already available because of `refresh()`.
80+
* Initializes the component and start loading images.
81+
* Be aware that `refresh` also calls this method.
8482
*/
8583
function init() {
8684
empty( entries );
85+
register();
86+
87+
if ( isSequential ) {
88+
loadNext();
89+
} else {
90+
off( events );
91+
on( events, check );
92+
check();
93+
}
94+
}
8795

96+
/**
97+
* Finds images and register them as entries with creating spinner elements.
98+
* Note that spinner can be already available because of `refresh()`.
99+
*/
100+
function register(): void {
88101
Components.Slides.forEach( Slide => {
89102
queryAll<HTMLImageElement>( Slide.slide, IMAGE_SELECTOR ).forEach( img => {
90103
const src = getAttribute( img, SRC_DATA_ATTRIBUTE );
@@ -100,8 +113,6 @@ export function LazyLoad( Splide: Splide, Components: Components, options: Optio
100113
}
101114
} );
102115
} );
103-
104-
isSequential && loadNext();
105116
}
106117

107118
/**

‎src/js/test/php/examples/lazyLoad.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<script>
1818
document.addEventListener( 'DOMContentLoaded', function () {
1919
var splide01 = new Splide( '#splide01', {
20-
perPage : 2,
20+
perPage : 1,
2121
// type : 'fade',
2222
lazyLoad : 'nearby',
2323
// cover : true,

0 commit comments

Comments
 (0)