Skip to content

Commit 8e86979

Browse files
author
Guy Elsmore-Paddock
committed
1262 - Fire afterChange via Separate Timer
This ensures `afterChange` is always fired even when the carousel is not animating and even if the animation gets interrupted by a window resize.
1 parent de674c0 commit 8e86979

File tree

1 file changed

+19
-4
lines changed

1 file changed

+19
-4
lines changed

src/inner-slider.js

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -378,7 +378,8 @@ export class InnerSlider extends React.Component {
378378
beforeChange,
379379
onLazyLoad,
380380
speed,
381-
afterChange
381+
afterChange,
382+
waitForAnimate
382383
} = this.props;
383384
// capture currentslide before state is updated
384385
const currentSlide = this.state.currentSlide;
@@ -395,9 +396,8 @@ export class InnerSlider extends React.Component {
395396
value => this.state.lazyLoadedList.indexOf(value) < 0
396397
);
397398
onLazyLoad && slidesToLoad.length > 0 && onLazyLoad(slidesToLoad);
398-
if (!this.props.waitForAnimate && this.animationEndCallback) {
399+
if (!waitForAnimate && this.animationEndCallback) {
399400
clearTimeout(this.animationEndCallback);
400-
afterChange && afterChange(currentSlide);
401401
delete this.animationEndCallback;
402402
}
403403
this.setState(state, () => {
@@ -406,17 +406,32 @@ export class InnerSlider extends React.Component {
406406
this.asNavForIndex = index;
407407
asNavFor.innerSlider.slideHandler(index);
408408
}
409+
410+
// Ensure we always fire afterChange callbacks even if we are not
411+
// animating
412+
if (!waitForAnimate && afterChange) {
413+
afterChange(state.currentSlide);
414+
}
415+
409416
if (!nextState) return;
417+
410418
this.animationEndCallback = setTimeout(() => {
411419
const { animating, ...firstBatch } = nextState;
412420
this.setState(firstBatch, () => {
413421
this.callbackTimers.push(
414422
setTimeout(() => this.setState({ animating }), 10)
415423
);
416-
afterChange && afterChange(state.currentSlide);
417424
delete this.animationEndCallback;
418425
});
419426
}, speed);
427+
428+
// Ensure we always fire afterChange callbacks even if animation gets
429+
// interrupted by a window resize.
430+
if (waitForAnimate && afterChange) {
431+
this.callbackTimers.push(
432+
setTimeout(() => afterChange(state.currentSlide), speed)
433+
);
434+
}
420435
});
421436
};
422437
changeSlide = (options, dontAnimate = false) => {

0 commit comments

Comments
 (0)