imshvc/noxious_client
1
0
Fork 0
forked from noxious/client
Code Pull Requests Activity

Removed unnecessary complexity in App.vue

Browse Source
This commit is contained in:
Dennis Postma 2024-09-10 13:13:52 +02:00
parent 5edf197533
commit 236aac0b9b
3 changed files with 66 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

106
package-lock.json generated
View File

@ -2121,39 +2121,39 @@
} }
}, },
"node_modules/@vue/compiler-core": { "node_modules/@vue/compiler-core": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.4.tgz",
"integrity": "sha512-adAfy9boPkP233NTyvLbGEqVuIfK/R0ZsBsIOW4BZNfb4BRpRW41Do1u+ozJpsb+mdoy80O20IzAsHaihRb5qA==", "integrity": "sha512-oNwn+BAt3n9dK9uAYvI+XGlutwuTq/wfj4xCBaZCqwwVIGtD7D6ViihEbyYZrDHIHTDE3Q6oL3/hqmAyFEy9DQ==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@babel/parser": "^7.25.3", "@babel/parser": "^7.25.3",
"@vue/shared": "3.5.3", "@vue/shared": "3.5.4",
"entities": "^4.5.0", "entities": "^4.5.0",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"source-map-js": "^1.2.0" "source-map-js": "^1.2.0"
} }
}, },
"node_modules/@vue/compiler-dom": { "node_modules/@vue/compiler-dom": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.4.tgz",
"integrity": "sha512-wnzFArg9zpvk/811CDOZOadJRugf1Bgl/TQ3RfV4nKfSPok4hi0w10ziYUQR6LnnBAUlEXYLUfZ71Oj9ds/+QA==", "integrity": "sha512-yP9RRs4BDLOLfldn6ah+AGCNovGjMbL9uHvhDHf5wan4dAHLnFGOkqtfE7PPe4HTXIqE7l/NILdYw53bo1C8jw==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/compiler-core": "3.5.3", "@vue/compiler-core": "3.5.4",
"@vue/shared": "3.5.3" "@vue/shared": "3.5.4"
} }
}, },
"node_modules/@vue/compiler-sfc": { "node_modules/@vue/compiler-sfc": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.4.tgz",
"integrity": "sha512-P3uATLny2tfyvMB04OQFe7Sczteno7SLFxwrOA/dw01pBWQHB5HL15a8PosoNX2aG/EAMGqnXTu+1LnmzFhpTQ==", "integrity": "sha512-P+yiPhL+NYH7m0ZgCq7AQR2q7OIE+mpAEgtkqEeH9oHSdIRvUO+4X6MPvblJIWcoe4YC5a2Gdf/RsoyP8FFiPQ==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@babel/parser": "^7.25.3", "@babel/parser": "^7.25.3",
"@vue/compiler-core": "3.5.3", "@vue/compiler-core": "3.5.4",
"@vue/compiler-dom": "3.5.3", "@vue/compiler-dom": "3.5.4",
"@vue/compiler-ssr": "3.5.3", "@vue/compiler-ssr": "3.5.4",
"@vue/shared": "3.5.3", "@vue/shared": "3.5.4",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.30.11", "magic-string": "^0.30.11",
"postcss": "^8.4.44", "postcss": "^8.4.44",
@ -2161,13 +2161,13 @@
} }
}, },
"node_modules/@vue/compiler-ssr": { "node_modules/@vue/compiler-ssr": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.4.tgz",
"integrity": "sha512-F/5f+r2WzL/2YAPl7UlKcJWHrvoZN8XwEBLnT7S4BXwncH25iDOabhO2M2DWioyTguJAGavDOawejkFXj8EM1w==", "integrity": "sha512-acESdTXsxPnYr2C4Blv0ggx5zIFMgOzZmYU2UgvIff9POdRGbRNBHRyzHAnizcItvpgerSKQbllUc9USp3V7eg==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/compiler-dom": "3.5.3", "@vue/compiler-dom": "3.5.4",
"@vue/shared": "3.5.3" "@vue/shared": "3.5.4"
} }
}, },
"node_modules/@vue/devtools-api": { "node_modules/@vue/devtools-api": {
@ -2287,53 +2287,53 @@
} }
}, },
"node_modules/@vue/reactivity": { "node_modules/@vue/reactivity": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.4.tgz",
"integrity": "sha512-2w61UnRWTP7+rj1H/j6FH706gRBHdFVpIqEkSDAyIpafBXYH8xt4gttstbbCWdU3OlcSWO8/3mbKl/93/HSMpw==", "integrity": "sha512-HKKbEuP7tYSGCq4e4nK6ZW6l5hyG66OUetefBp4budUyjvAYsnQDf+bgFzg2RAgnH0CInyqXwD9y47jwJEHrQw==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/shared": "3.5.3" "@vue/shared": "3.5.4"
} }
}, },
"node_modules/@vue/runtime-core": { "node_modules/@vue/runtime-core": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.4.tgz",
"integrity": "sha512-5b2AQw5OZlmCzSsSBWYoZOsy75N4UdMWenTfDdI5bAzXnuVR7iR8Q4AOzQm2OGoA41xjk53VQKrqQhOz2ktWaw==", "integrity": "sha512-f3ek2sTA0AFu0n+w+kCtz567Euqqa3eHewvo4klwS7mWfSj/A+UmYTwsnUFo35KeyAFY60JgrCGvEBsu1n/3LA==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/reactivity": "3.5.3", "@vue/reactivity": "3.5.4",
"@vue/shared": "3.5.3" "@vue/shared": "3.5.4"
} }
}, },
"node_modules/@vue/runtime-dom": { "node_modules/@vue/runtime-dom": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.4.tgz",
"integrity": "sha512-wPR1DEGc3XnQ7yHbmkTt3GoY0cEnVGQnARRdAkDzZ8MbUKEs26gogCQo6AOvvgahfjIcnvWJzkZArQ1fmWjcSg==", "integrity": "sha512-ofyc0w6rbD5KtjhP1i9hGOKdxGpvmuB1jprP7Djlj0X7R5J/oLwuNuE98GJ8WW31Hu2VxQHtk/LYTAlW8xrJdw==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/reactivity": "3.5.3", "@vue/reactivity": "3.5.4",
"@vue/runtime-core": "3.5.3", "@vue/runtime-core": "3.5.4",
"@vue/shared": "3.5.3", "@vue/shared": "3.5.4",
"csstype": "^3.1.3" "csstype": "^3.1.3"
} }
}, },
"node_modules/@vue/server-renderer": { "node_modules/@vue/server-renderer": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.4.tgz",
"integrity": "sha512-28volmaZVG2PGO3V3+gBPKoSHvLlE8FGfG/GKXKkjjfxLuj/50B/0OQGakM/g6ehQeqCrZYM4eHC4Ks48eig1Q==", "integrity": "sha512-FbjV6DJLgKRetMYFBA1UXCroCiED/Ckr53/ba9wivyd7D/Xw9fpo0T6zXzCnxQwyvkyrL7y6plgYhWhNjGxY5g==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/compiler-ssr": "3.5.3", "@vue/compiler-ssr": "3.5.4",
"@vue/shared": "3.5.3" "@vue/shared": "3.5.4"
}, },
"peerDependencies": { "peerDependencies": {
"vue": "3.5.3" "vue": "3.5.4"
} }
}, },
"node_modules/@vue/shared": { "node_modules/@vue/shared": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.3.tgz", "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.4.tgz",
"integrity": "sha512-Jp2v8nylKBT+PlOUjun2Wp/f++TfJVFjshLzNtJDdmFJabJa7noGMncqXRM1vXGX+Yo2V7WykQFNxusSim8SCA==", "integrity": "sha512-L2MCDD8l7yC62Te5UUyPVpmexhL9ipVnYRw9CsWfm/BGRL5FwDX4a25bcJ/OJSD3+Hx+k/a8LDKcG2AFdJV3BA==",
"license": "MIT" "license": "MIT"
}, },
"node_modules/@vue/test-utils": { "node_modules/@vue/test-utils": {
@ -7072,16 +7072,16 @@
} }
}, },
"node_modules/vue": { "node_modules/vue": {
"version": "3.5.3", "version": "3.5.4",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.5.3.tgz", "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.4.tgz",
"integrity": "sha512-xvRbd0HpuLovYbOHXRHlSBsSvmUJbo0pzbkKTApWnQGf3/cu5Z39mQeA5cZdLRVIoNf3zI6MSoOgHUT5i2jO+Q==", "integrity": "sha512-3yAj2gkmiY+i7+22A1PWM+kjOVXjU74UPINcTiN7grIVPyFFI0lpGwHlV/4xydDmobaBn7/xmi+YG8HeSlCTcg==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/compiler-dom": "3.5.3", "@vue/compiler-dom": "3.5.4",
"@vue/compiler-sfc": "3.5.3", "@vue/compiler-sfc": "3.5.4",
"@vue/runtime-dom": "3.5.3", "@vue/runtime-dom": "3.5.4",
"@vue/server-renderer": "3.5.3", "@vue/server-renderer": "3.5.4",
"@vue/shared": "3.5.3" "@vue/shared": "3.5.4"
}, },
"peerDependencies": { "peerDependencies": {
"typescript": "*" "typescript": "*"

37
src/App.vue
View File

@ -2,7 +2,7 @@
<div class="overflow-hidden"> <div class="overflow-hidden">
<Notifications /> <Notifications />
<Login v-if="screen === 'login'" /> <Login v-if="screen === 'login'" />
<Register v-if="screen === 'register'" /> <!-- <Register v-if="screen === 'register'" />-->
<Characters v-if="screen === 'characters'" /> <Characters v-if="screen === 'characters'" />
<Game v-if="screen === 'game'" /> <Game v-if="screen === 'game'" />
</div> </div>
@ -12,33 +12,22 @@
import { useGameStore } from '@/stores/game' import { useGameStore } from '@/stores/game'
import Notifications from '@/components/utilities/Notifications.vue' import Notifications from '@/components/utilities/Notifications.vue'
import Login from '@/screens/Login.vue' import Login from '@/screens/Login.vue'
import Register from '@/screens/Register.vue' // import Register from '@/screens/Register.vue'
import Characters from '@/screens/Characters.vue' import Characters from '@/screens/Characters.vue'
import Game from '@/screens/Game.vue' import Game from '@/screens/Game.vue'
import { storeToRefs } from 'pinia' import { computed } from 'vue'
const gameStore = useGameStore() const gameStore = useGameStore()
const { screen } = storeToRefs(gameStore)
gameStore.$subscribe( const screen = computed(() => {
(mutation, state) => { if (!gameStore.connection) {
let newScreen = screen.value return 'login'
} else if (gameStore.token && gameStore.connection) {
if (!state.connection) { if (gameStore.character) {
newScreen = 'login' return 'game'
} else if (state.token && state.connection) {
newScreen = 'characters'
if (state.character) {
newScreen = 'game'
}
} }
return 'characters'
// Update screen.value only if it's different from the new state }
if (screen.value !== newScreen) { return 'login' // default fallback
screen.value = newScreen })
}
},
{ detached: true }
)
</script> </script>

4
src/stores/game.ts
View File

@ -6,7 +6,6 @@ import { useCookies } from '@vueuse/integrations/useCookies'
export const useGameStore = defineStore('game', { export const useGameStore = defineStore('game', {
state: () => ({ state: () => ({
screen: 'login',
token: '' as string | null, token: '' as string | null,
connection: null as Socket | null, connection: null as Socket | null,
user: null as User | null, user: null as User | null,
@ -17,9 +16,6 @@ export const useGameStore = defineStore('game', {
isUserPanelOpen: false isUserPanelOpen: false
}), }),
actions: { actions: {
setScreen(screen: string) {
this.screen = screen
},
setToken(token: string) { setToken(token: string) {
this.token = token this.token = token
}, },