diff --git a/core/src/components/slides/slides.tsx b/core/src/components/slides/slides.tsx index 15087de16f..87cd55f102 100644 --- a/core/src/components/slides/slides.tsx +++ b/core/src/components/slides/slides.tsx @@ -18,6 +18,9 @@ export class Slides { private container!: HTMLElement; private swiper: any; + private readyResolve: any; + private readyPromise: Promise = new Promise(resolve => { this.readyResolve = resolve; }); + mode!: Mode; @Element() el!: HTMLStencilElement; @@ -138,6 +141,7 @@ export class Slides { const finalOptions = this.normalizeOptions(); // init swiper core this.swiper = new Swiper(this.container, finalOptions); + this.readyResolve(true); } /** @@ -145,7 +149,8 @@ export class Slides { * child slides. */ @Method() - update() { + async update() { + await this.waitUntilReady(); this.swiper.update(); } @@ -153,7 +158,8 @@ export class Slides { * Transition to the specified slide. */ @Method() - slideTo(index: number, speed?: number, runCallbacks?: boolean) { + async slideTo(index: number, speed?: number, runCallbacks?: boolean) { + await this.waitUntilReady(); this.swiper.slideTo(index, speed, runCallbacks); } @@ -161,7 +167,8 @@ export class Slides { * Transition to the next slide. */ @Method() - slideNext(speed?: number, runCallbacks?: boolean) { + async slideNext(speed?: number, runCallbacks?: boolean) { + await this.waitUntilReady(); this.swiper.slideNext(speed, runCallbacks); } @@ -169,7 +176,8 @@ export class Slides { * Transition to the previous slide. */ @Method() - slidePrev(speed?: number, runCallbacks?: boolean) { + async slidePrev(speed?: number, runCallbacks?: boolean) { + await this.waitUntilReady(); this.swiper.slidePrev(speed, runCallbacks); } @@ -177,7 +185,8 @@ export class Slides { * Get the index of the active slide. */ @Method() - getActiveIndex(): Promise { + async getActiveIndex(): Promise { + await this.waitUntilReady(); return Promise.resolve(this.swiper.activeIndex); } @@ -185,7 +194,8 @@ export class Slides { * Get the index of the previous slide. */ @Method() - getPreviousIndex(): Promise { + async getPreviousIndex(): Promise { + await this.waitUntilReady(); return Promise.resolve(this.swiper.previousIndex); } @@ -193,7 +203,8 @@ export class Slides { * Get the total number of slides. */ @Method() - length(): Promise { + async length(): Promise { + await this.waitUntilReady(); return Promise.resolve(this.swiper.slides.length); } @@ -202,7 +213,8 @@ export class Slides { * */ @Method() - isEnd(): Promise { + async isEnd(): Promise { + await this.waitUntilReady(); return Promise.resolve(this.swiper.isEnd); } @@ -210,7 +222,8 @@ export class Slides { * Get whether or not the current slide is the first slide. */ @Method() - isBeginning(): Promise { + async isBeginning(): Promise { + await this.waitUntilReady(); return Promise.resolve(this.swiper.isBeginning); } @@ -218,7 +231,8 @@ export class Slides { * Start auto play. */ @Method() - startAutoplay() { + async startAutoplay() { + await this.waitUntilReady(); this.swiper.autoplay.start(); } @@ -226,7 +240,8 @@ export class Slides { * Stop auto play. */ @Method() - stopAutoplay() { + async stopAutoplay() { + await this.waitUntilReady(); this.swiper.autoplay.stop(); } @@ -234,7 +249,8 @@ export class Slides { * Lock or unlock the ability to slide to the next slides. */ @Method() - lockSwipeToNext(shouldLockSwipeToNext: boolean) { + async lockSwipeToNext(shouldLockSwipeToNext: boolean) { + await this.waitUntilReady(); this.swiper.allowSlideNext = !shouldLockSwipeToNext; } @@ -242,7 +258,8 @@ export class Slides { * Lock or unlock the ability to slide to the previous slides. */ @Method() - lockSwipeToPrev(shouldLockSwipeToPrev: boolean) { + async lockSwipeToPrev(shouldLockSwipeToPrev: boolean) { + await this.waitUntilReady(); this.swiper.allowSlidePrev = !shouldLockSwipeToPrev; } @@ -250,10 +267,19 @@ export class Slides { * Lock or unlock the ability to slide to change slides. */ @Method() - lockSwipes(shouldLockSwipes: boolean) { + async lockSwipes(shouldLockSwipes: boolean) { + await this.waitUntilReady(); this.swiper.allowSlideNext = !shouldLockSwipes; this.swiper.allowSlidePrev = !shouldLockSwipes; this.swiper.allowTouchMove = !shouldLockSwipes; + + } + + /** + * Calls true if the swiper core is initialized + */ + private waitUntilReady(): Promise { + return this.readyPromise; } private normalizeOptions() {