- Creado nuevo proyecto Nuxt 4 con estructura app/ - Servidor Colyseus separado para evitar problemas con decoradores - Migrado GameRoom y toda la lógica del juego - Implementado cliente con composables useGameClient - Panel de administración funcional - Componentes Vue migrados (HomeScreen, GameScreen, PlayerCard, etc) - Configuración para ejecutar ambos servidores (npm run dev:all)
70 lines
1.4 KiB
Vue
70 lines
1.4 KiB
Vue
<template>
|
|
<div id="app">
|
|
<HomeScreen
|
|
v-if="currentScreen === 'home'"
|
|
@join-game="onJoinGame"
|
|
@show-settings="showSettings = true"
|
|
/>
|
|
<GameScreen
|
|
v-else-if="currentScreen === 'game'"
|
|
:game-client="gameClient"
|
|
/>
|
|
|
|
<!-- Settings Modal -->
|
|
<SettingsModal
|
|
v-if="showSettings"
|
|
@close="showSettings = false"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
|
|
const currentScreen = ref<'home' | 'game'>('home')
|
|
const gameClient = ref<any>(null)
|
|
const showSettings = ref(false)
|
|
|
|
const onJoinGame = (client: any) => {
|
|
gameClient.value = client
|
|
currentScreen.value = 'game'
|
|
console.log('Transitioning to game screen')
|
|
|
|
// Handle admin kick notification
|
|
client.onAdminKicked((data: any) => {
|
|
// Show alert message
|
|
alert(`🚫 ${data.message}`)
|
|
|
|
// Return to home screen
|
|
currentScreen.value = 'home'
|
|
gameClient.value = null
|
|
|
|
console.log('Player kicked by admin, returned to home screen')
|
|
})
|
|
|
|
// Handle round change notification
|
|
client.onRoundChanged((data: any) => {
|
|
// Show alert message
|
|
alert(`🎯 ${data.message}`)
|
|
|
|
console.log('Round changed by admin:', data)
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
#app {
|
|
min-height: 100vh;
|
|
}
|
|
</style> |