Skip to content
8 changes: 5 additions & 3 deletions src/components/Container.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function () {
let mousedownId = useRef<any>();
let isMounted = useRef<boolean>(true);

const { width, height, loop, currentIndex, isPaused, keyboardNavigation, preventDefault, storyContainerStyles = {} } = useContext<GlobalCtx>(GlobalContext);
const { width, height, loop, currentIndex, isPaused, keyboardNavigation, preventDefault, storyContainerStyles = {}, onAllStoriesEnd } = useContext<GlobalCtx>(GlobalContext);
const { stories } = useContext<StoriesContextInterface>(StoriesContext);

useEffect(() => {
Expand Down Expand Up @@ -71,6 +71,7 @@ export default function () {
}

const previous = () => {
console.log(currentIndex);
setCurrentIdWrapper(prev => prev > 0 ? prev - 1 : prev)
}

Expand All @@ -91,6 +92,7 @@ export default function () {
const updateNextStoryId = () => {
setCurrentIdWrapper(prev => {
if (prev < stories.length - 1) return prev + 1
onAllStoriesEnd && onAllStoriesEnd(currentId, stories)
return prev
})
}
Expand Down Expand Up @@ -135,8 +137,8 @@ export default function () {
getVideoDuration={getVideoDuration}
/>
{!preventDefault && <div style={styles.overlay}>
<div style={{ width: '50%', zIndex: 999 }} onTouchStart={debouncePause} onTouchEnd={mouseUp('previous')} onMouseDown={debouncePause} onMouseUp={mouseUp('previous')} />
<div style={{ width: '50%', zIndex: 999 }} onTouchStart={debouncePause} onTouchEnd={mouseUp('next')} onMouseDown={debouncePause} onMouseUp={mouseUp('next')} />
<div className="previous-story-button" style={{ width: '50%', zIndex: 999 }} onTouchStart={debouncePause} onTouchEnd={mouseUp('previous')} onMouseDown={debouncePause} onMouseUp={mouseUp('previous')} />
<div className="next-story-button" style={{ width: '50%', zIndex: 999 }} onTouchStart={debouncePause} onTouchEnd={mouseUp('next')} onMouseDown={debouncePause} onMouseUp={mouseUp('next')} />
</div>}
</div>
)
Expand Down