diff --git a/playground/vue/src/pages/advanced/MemoryTresObjects.vue b/playground/vue/src/pages/advanced/MemoryTresObjects.vue index 7bced574c..8d36ee55a 100644 --- a/playground/vue/src/pages/advanced/MemoryTresObjects.vue +++ b/playground/vue/src/pages/advanced/MemoryTresObjects.vue @@ -9,27 +9,40 @@ const toggleCount = ref(0) const show = ref(false) const msg = ref('Test is running.') const r = ref(null) +const isPaused = ref(true) let intervalId: ReturnType -// eslint-disable-next-line prefer-const -intervalId = setInterval(() => { - if (toggleCount.value < toggleMax) { - // NOTE: Make sure that objects are mounted by - // checking `!!r.value`. - if (r.value) { - show.value = false - toggleCount.value++ + +const startInterval = () => { + intervalId = setInterval(() => { + if (toggleCount.value < toggleMax) { + // NOTE: Make sure that objects are mounted by + // checking `!!r.value`. + if (r.value) { + show.value = false + toggleCount.value++ + } + else { + show.value = true + } } else { - show.value = true + clearInterval(intervalId) + const elapsedSec = (Date.now() - startTimeMS) / 1000 + msg.value = `Test completed in ${elapsedSec} seconds.` } + }, 1000 / 120) +} + +const togglePause = () => { + isPaused.value = !isPaused.value + if (!isPaused.value) { + startInterval() } else { clearInterval(intervalId) - const elapsedSec = (Date.now() - startTimeMS) / 1000 - msg.value = `Test completed in ${elapsedSec} seconds.` } -}, 1000 / 120) +} onUnmounted(() => clearInterval(intervalId)) @@ -43,6 +56,9 @@ onUnmounted(() => clearInterval(intervalId))

{{ msg }}

Number of TresCanvases created: {{ toggleCount }} / {{ toggleMax }}

Number of Objects per TresCanvas: {{ numObjectsMax }}

+