35 lines
1.2 KiB
Vue
Executable file
35 lines
1.2 KiB
Vue
Executable file
<template>
|
|
<div class="flex flex-col h-full">
|
|
<h1 class="font-800 text-9 p-10 pb-0">
|
|
{{ current.scene.name }}
|
|
</h1>
|
|
<div class="h-full flex space-x-4 p-10 pt-8 flex-grow overflow-hidden">
|
|
<StepSelection class="w-1/2"/>
|
|
<div class="w-1/2 flex flex-col space-y-4">
|
|
<MessageEdit class="h-1/2"/>
|
|
<ActorsOnStageBox class="h-1/2"/>
|
|
</div>
|
|
</div>
|
|
<MusicProgressBar class="h-10"/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import MusicProgressBar from "../components/MusicProgressBar.vue"
|
|
import { onKeyStroke } from "@vueuse/core"
|
|
import StepSelection from "../components/StepSelection.vue"
|
|
import MessageEdit from "../components/MessageEdit.vue"
|
|
import ActorsOnStageBox from "../components/ActorsOnStageBox.vue"
|
|
import { goToPosition } from "../syncing"
|
|
import { current, getNextValidPosition, getPreviousValidPosition, state } from "../state"
|
|
|
|
onKeyStroke("ArrowRight", () => {
|
|
const position = getNextValidPosition(state.position)
|
|
if (position !== null) goToPosition(position)
|
|
})
|
|
|
|
onKeyStroke("ArrowLeft", () => {
|
|
const position = getPreviousValidPosition(state.position)
|
|
if (position !== null) goToPosition(position)
|
|
})
|
|
</script>
|