diff --git a/app/Http/Middleware/HandleInertiaRequests.php b/app/Http/Middleware/HandleInertiaRequests.php index fb80018..c3be037 100644 --- a/app/Http/Middleware/HandleInertiaRequests.php +++ b/app/Http/Middleware/HandleInertiaRequests.php @@ -32,11 +32,13 @@ public function share(Request $request): array { $index = intval(request()->input('index')); $progress = request()->input('progress'); + $loop = intval(request()->input('loop')); return [ ...parent::share($request), 'index' => $index, 'progress' => $progress, + 'loop' => $loop, 'auth' => [ 'user' => $request->user(), ], diff --git a/resources/js/Components/SlideView.vue b/resources/js/Components/SlideView.vue index 19e1a8d..d24f8a1 100644 --- a/resources/js/Components/SlideView.vue +++ b/resources/js/Components/SlideView.vue @@ -11,14 +11,15 @@ import Keys from '@/constants/keys.ts'; import dataStore from '@/store/dataStore.ts' import slideStore from '@/store/slideStore.ts' -const content = computed(() => { - return dataStore.data[slideStore.index]; -}); - +let loopInterval: null | ReturnType = null; let fontLoadInterval: null | ReturnType = null; const fontLoaded = ref(false); const FONT = '16px Montserrat'; +const content = computed(() => { + return dataStore.data[slideStore.index]; +}); + const showProgressLabel = computed(() => { return slideStore.progress === ProgressType.Label; }); @@ -35,6 +36,14 @@ const buildQueryParams = () : QueryParams => { return query; }; +const checkAndClearLoopInterval = () : void => { + if (!loopInterval) { + return; + } + + clearInterval(Number(loopInterval)); +}; + const incrementContent = (count: number) : void => { slideStore.increment(count); @@ -58,6 +67,10 @@ const bindKeyDown = (event: KeyboardEvent): void => { } } + if (Keys.ALL_APP_KEYS.includes(key)) { + checkAndClearLoopInterval(); + } + if (Keys.INCREMENTORS.includes(key)) { incrementContent(1); } else if (Keys.DECREMENTORS.includes(key)) { @@ -86,8 +99,25 @@ onMounted(() => { fontLoaded.value = true; clearInterval(Number(fontLoadInterval)); }, 50); + + if (!slideStore.canLoop()) { + return; + } + + loopInterval = setInterval(() => { + if (slideStore.isEnd()) { + incrementContent(-1 * dataStore.data.length); + return; + } + + incrementContent(1) + }, slideStore.loop * 1000); +}); + +onUnmounted(() => { + window.removeEventListener('keydown', bindKeyDown); + checkAndClearLoopInterval(); }); -onUnmounted(() => window.removeEventListener('keydown', bindKeyDown));