Wire up online game creation and show UI message
Add game creation lifecycle hooks and UI feedback for online games. - OnlineGame: add onGameCreated and onGameJoinedFailed callbacks, wire player.onGameCreated to set gameId and invoke onGameCreated, and implement createGame to connect and create a game on the player connection. Small cleanup in drop(). - GameSettings: add optional message field to carry informational text to the UI. - OnlineMode.vue: register handlers for onGameStateChanged, onGameEnded and onGameCreated to update the reactive state and transition to the end/waiting states; update createGame to call OnlineGame.createGame; adjust component rendering logic to include WaitingForOpponent state. - GameCreationMenu.vue: hide form controls when a settings.message exists and display the message instead; minor layout class adjustments. These changes enable creating a game, propagating the generated game code to the UI, and showing a message to the user while waiting for opponents.
This commit is contained in:
@@ -19,7 +19,7 @@ function gameFieldPreset(x: number, y: number) {
|
||||
<v-sheet width="100%" class="text-centered pa-2 w-75" rounded>
|
||||
<h1 class="text-center mb-4">Spiel Erstellen</h1>
|
||||
<v-divider class="mb-4"></v-divider>
|
||||
<v-row>
|
||||
<v-row class="d-flex align-center justify-space-evenly ma-4 w-100" v-if="!settingsProp.message">
|
||||
<v-col cols="12" md="6">
|
||||
<h2 class="settingsCat">Spieler</h2>
|
||||
<v-text-field
|
||||
@@ -60,10 +60,11 @@ function gameFieldPreset(x: number, y: number) {
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<div class="d-flex align-center justify-space-evenly ma-4 w-100">
|
||||
<div class="d-flex align-center justify-space-evenly ma-4 w-100" v-if="!settingsProp.message">
|
||||
<v-btn color="red" @click="$router.push('/')" rounded="xl"> Abbrechen </v-btn>
|
||||
<v-btn color="primary" @click="$emit('createGame')" rounded="xl"> Spiel Starten </v-btn>
|
||||
</div>
|
||||
<h2 v-else class="text-center">{{ settingsProp.message }}</h2>
|
||||
</v-sheet>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user