Skip to content

Commit

Permalink
1262 - Fire afterChange via Separate Timer
Browse files Browse the repository at this point in the history
This ensures `afterChange` is always fired even when the carousel is
not animating and even if the animation gets interrupted by a window
resize.
  • Loading branch information
Guy Elsmore-Paddock committed Dec 28, 2020
1 parent de674c0 commit 89d8680
Showing 1 changed file with 17 additions and 4 deletions.
21 changes: 17 additions & 4 deletions src/inner-slider.js
Original file line number Diff line number Diff line change
Expand Up @@ -378,7 +378,8 @@ export class InnerSlider extends React.Component {
beforeChange,
onLazyLoad,
speed,
afterChange
afterChange,
waitForAnimate
} = this.props;
// capture currentslide before state is updated
const currentSlide = this.state.currentSlide;
Expand All @@ -395,9 +396,8 @@ export class InnerSlider extends React.Component {
value => this.state.lazyLoadedList.indexOf(value) < 0
);
onLazyLoad && slidesToLoad.length > 0 && onLazyLoad(slidesToLoad);
if (!this.props.waitForAnimate && this.animationEndCallback) {
if (!waitForAnimate && this.animationEndCallback) {
clearTimeout(this.animationEndCallback);
afterChange && afterChange(currentSlide);
delete this.animationEndCallback;
}
this.setState(state, () => {
Expand All @@ -406,17 +406,30 @@ export class InnerSlider extends React.Component {
this.asNavForIndex = index;
asNavFor.innerSlider.slideHandler(index);
}

if (!waitForAnimate && afterChange) {
afterChange(state.currentSlide);
}

if (!nextState) return;

this.animationEndCallback = setTimeout(() => {
const { animating, ...firstBatch } = nextState;
this.setState(firstBatch, () => {
this.callbackTimers.push(
setTimeout(() => this.setState({ animating }), 10)
);
afterChange && afterChange(state.currentSlide);
delete this.animationEndCallback;
});
}, speed);

// Ensure we always fire afterChange callbacks even if we are not
// animating or if the animation gets interrupted by a window resize.
if (waitForAnimate && afterChange) {
this.callbackTimers.push(
setTimeout(() => afterChange(state.currentSlide), speed)
);
}
});
};
changeSlide = (options, dontAnimate = false) => {
Expand Down

0 comments on commit 89d8680

Please sign in to comment.