Oliver/Gravwell-Online
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add a state that allows changing the controls bar

Browse source
This commit is contained in:
Oliver Akins 2022-07-30 17:45:38 -06:00
parent 4c318a9aeb
commit 0045cd4184
No known key found for this signature in database
GPG key ID: 3C2014AF9457AF99
1 changed files with 11 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

13
web-svelte/src/views/movement.svelte
View file

@ -1,8 +1,11 @@
<script lang="ts"> <script lang="ts">
import ShipsMoving from "../components/ShipsMoving.svelte";
import PlayerHand from "../components/PlayerHand.svelte"; import PlayerHand from "../components/PlayerHand.svelte";
import Board from "../components/Board.svelte"; import Board from "../components/Board.svelte";
import { board } from "../stores"; import { board } from "../stores";
const controlsState: string = "player-order";
const notice = { const notice = {
visible: false, visible: false,
message: null, message: null,
@ -48,11 +51,17 @@ function previewBoard(e: any) {
</div> </div>
</div> </div>
{/if} {/if}
<div id="player-hand"> {#if controlsState == "player-hand"}
<div id="player-controls">
<PlayerHand <PlayerHand
on:hover="{previewBoard}" on:hover="{previewBoard}"
/> />
</div> </div>
{:else if controlsState == "player-order"}
<div id="player-controls">
<ShipsMoving />
</div>
{/if}
</main> </main>
@ -106,7 +115,7 @@ main {
} }
} }
#player-hand { #player-controls {
grid-column: 2 / 3; grid-column: 2 / 3;
grid-row: 4 / 5; grid-row: 4 / 5;
} }