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

Refractor socket store into game store

Browse Source
This commit is contained in:
Dennis Postma
2024-07-12 11:58:06 +02:00
parent 6a1b2dd107
commit 79bef033f3
22 changed files with 161 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/utilities/Notifications.vue
View File

@ -11,12 +11,12 @@
<script setup lang="ts">
import { useNotificationStore } from '@/stores/notifications'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import Modal from '@/components/utilities/Modal.vue'
import { onBeforeMount, onBeforeUnmount, watch } from 'vue'
const notifications = useNotificationStore()
const socket = useSocketStore()
const gameStore = useGameStore()
function closeNotification(id: string) {
notifications.removeNotification(id)
@ -31,13 +31,13 @@ function setupNotificationListener(connection: any) {
}
onBeforeMount(() => {
const connection = socket.connection
const connection = gameStore.connection
if (connection) {
setupNotificationListener(connection)
} else {
// Watch for changes in the socket connection
watch(
() => socket.connection,
() => gameStore.connection,
(newConnection) => {
if (newConnection) setupNotificationListener(newConnection)
}
@ -46,7 +46,7 @@ onBeforeMount(() => {
})
onBeforeUnmount(() => {
const connection = socket.connection
const connection = gameStore.connection
if (connection) {
connection.off('notification')
}

4
src/components/utilities/assetManager/AssetManager.vue
View File

@ -42,14 +42,14 @@
<script setup lang="ts">
import { ref } from 'vue'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import TileList from '@/components/utilities/assetManager/partials/TileList.vue'
import TileDetails from '@/components/utilities/assetManager/partials/TileDetails.vue'
import ObjectList from '@/components/utilities/assetManager/partials/ObjectList.vue'
import ObjectDetails from '@/components/utilities/assetManager/partials/ObjectDetails.vue'
import { useAssetManagerStore } from '@/stores/assetManager'
const socket = useSocketStore()
const gameStore = useGameStore()
const assetManagerStore = useAssetManagerStore()
const selectedCategory = ref('tiles')

10
src/components/utilities/assetManager/partials/ObjectDetails.vue
View File

@ -31,10 +31,10 @@ import type { Object } from '@/types'
import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
import { useAssetManagerStore } from '@/stores/assetManager'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import config from '@/config'
const socket = useSocketStore()
const gameStore = useGameStore()
const assetManagerStore = useAssetManagerStore()
const zoneEditorStore = useZoneEditorStore()
@ -62,7 +62,7 @@ watch(selectedObject, (object: Object | null) => {
})
function removeObject() {
socket.connection.emit('gm:object:remove', { object: selectedObject.value?.id }, (response: boolean) => {
gameStore.connection.emit('gm:object:remove', { object: selectedObject.value?.id }, (response: boolean) => {
if (!response) {
console.error('Failed to remove object')
return
@ -72,7 +72,7 @@ function removeObject() {
}
function refreshObjectList() {
socket.connection.emit('gm:object:list', {}, (response: Object[]) => {
gameStore.connection.emit('gm:object:list', {}, (response: Object[]) => {
assetManagerStore.setObjectList(response)
assetManagerStore.setSelectedObject(null)
@ -89,7 +89,7 @@ function saveObject() {
return
}
socket.connection.emit(
gameStore.connection.emit(
'gm:object:update',
{
id: selectedObject.value.id,

10
src/components/utilities/assetManager/partials/ObjectList.vue
View File

@ -20,13 +20,13 @@
<script setup lang="ts">
import config from '@/config'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import { onMounted, ref, computed } from 'vue'
import { useAssetManagerStore } from '@/stores/assetManager'
import { useAssetStore } from '@/stores/assets'
import type { Object } from '@/types'
const socket = useSocketStore()
const gameStore = useGameStore()
const objectUploadField = ref(null)
const assetManagerStore = useAssetManagerStore()
const assetStore = useAssetStore()
@ -36,7 +36,7 @@ const searchQuery = ref('')
const handleFileUpload = (e: Event) => {
const files = (e.target as HTMLInputElement).files
if (!files) return
socket.connection.emit('gm:object:upload', files, (response: boolean) => {
gameStore.connection.emit('gm:object:upload', files, (response: boolean) => {
if (!response) {
if (config.development) console.error('Failed to upload object')
return
@ -44,7 +44,7 @@ const handleFileUpload = (e: Event) => {
assetStore.fetchAssets()
socket.connection.emit('gm:object:list', {}, (response: Object[]) => {
gameStore.connection.emit('gm:object:list', {}, (response: Object[]) => {
assetManagerStore.setObjectList(response)
})
})
@ -63,7 +63,7 @@ const filteredObjects = computed(() => {
})
onMounted(() => {
socket.connection.emit('gm:object:list', {}, (response: Object[]) => {
gameStore.connection.emit('gm:object:list', {}, (response: Object[]) => {
assetManagerStore.setObjectList(response)
})
})

10
src/components/utilities/assetManager/partials/TileDetails.vue
View File

@ -27,11 +27,11 @@ import type { Tile } from '@/types'
import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
import { useAssetManagerStore } from '@/stores/assetManager'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import config from '@/config'
import ChipsInput from '@/components/forms/ChipsInput.vue'
const socket = useSocketStore()
const gameStore = useGameStore()
const assetManagerStore = useAssetManagerStore()
const zoneEditorStore = useZoneEditorStore()
@ -56,7 +56,7 @@ watch(selectedTile, (tile: Tile | null) => {
})
function removeTile() {
socket.connection.emit('gm:tile:remove', { tile: selectedTile.value?.id }, (response: boolean) => {
gameStore.connection.emit('gm:tile:remove', { tile: selectedTile.value?.id }, (response: boolean) => {
if (!response) {
console.error('Failed to remove tile')
return
@ -66,7 +66,7 @@ function removeTile() {
}
function refreshTileList() {
socket.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
gameStore.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
assetManagerStore.setTileList(response)
assetManagerStore.setSelectedTile(null)
@ -83,7 +83,7 @@ function saveTile() {
return
}
socket.connection.emit(
gameStore.connection.emit(
'gm:tile:update',
{
id: selectedTile.value.id,

10
src/components/utilities/assetManager/partials/TileList.vue
View File

@ -20,13 +20,13 @@
<script setup lang="ts">
import config from '@/config'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import { onMounted, ref, computed } from 'vue'
import { useAssetManagerStore } from '@/stores/assetManager'
import { useAssetStore } from '@/stores/assets'
import type { Tile } from '@/types'
const socket = useSocketStore()
const gameStore = useGameStore()
const tileUploadField = ref(null)
const assetManagerStore = useAssetManagerStore()
const assetStore = useAssetStore()
@ -36,7 +36,7 @@ const searchQuery = ref('')
const handleFileUpload = (e: Event) => {
const files = (e.target as HTMLInputElement).files
if (!files) return
socket.connection.emit('gm:tile:upload', files, (response: boolean) => {
gameStore.connection.emit('gm:tile:upload', files, (response: boolean) => {
if (!response) {
if (config.development) console.error('Failed to upload tile')
return
@ -44,7 +44,7 @@ const handleFileUpload = (e: Event) => {
assetStore.fetchAssets()
socket.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
gameStore.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
assetManagerStore.setTileList(response)
})
})
@ -63,7 +63,7 @@ const filteredTiles = computed(() => {
})
onMounted(() => {
socket.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
gameStore.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
assetManagerStore.setTileList(response)
})
})

6
src/components/utilities/zoneEditor/CreateZone.vue
View File

@ -35,11 +35,11 @@
<script setup lang="ts">
import { ref } from 'vue'
import Modal from '@/components/utilities/Modal.vue'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import type { Zone } from '@/types'
const socket = useSocketStore()
const gameStore = useGameStore()
const zoneEditorStore = useZoneEditorStore()
const name = ref('')
@ -47,7 +47,7 @@ const width = ref(0)
const height = ref(0)
function submit() {
socket.connection.emit('gm:zone_editor:zone:create', { name: name.value, width: width.value, height: height.value }, (response: Zone[]) => {
gameStore.connection.emit('gm:zone_editor:zone:create', { name: name.value, width: width.value, height: height.value }, (response: Zone[]) => {
zoneEditorStore.setZoneList(response)
})
zoneEditorStore.toggleCreateZoneModal()

6
src/components/utilities/zoneEditor/Objects.vue
View File

@ -50,11 +50,11 @@
import config from '@/config'
import { ref, onMounted, computed, watch } from 'vue'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import Modal from '@/components/utilities/Modal.vue'
import type { Object } from '@/types'
const socket = useSocketStore()
const gameStore = useGameStore()
const isModalOpen = ref(false)
const zoneEditorStore = useZoneEditorStore()
const searchQuery = ref('')
@ -77,7 +77,7 @@ onMounted(async () => {
zoneEditorStore.setObjectDepth(0)
isModalOpen.value = true
socket.connection.emit('gm:object:list', {}, (response: Object[]) => {
gameStore.connection.emit('gm:object:list', {}, (response: Object[]) => {
zoneEditorStore.setObjectList(response)
})
})

6
src/components/utilities/zoneEditor/Tiles.vue
View File

@ -46,11 +46,11 @@
import config from '@/config'
import { ref, onMounted, computed, watch } from 'vue'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import Modal from '@/components/utilities/Modal.vue'
import type { Tile } from '@/types'
const socket = useSocketStore()
const gameStore = useGameStore()
const isModalOpen = ref(false)
const zoneEditorStore = useZoneEditorStore()
const searchQuery = ref('')
@ -66,7 +66,7 @@ const filteredTiles = computed(() => {
onMounted(async () => {
isModalOpen.value = true
socket.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
gameStore.connection.emit('gm:tile:list', {}, (response: Tile[]) => {
zoneEditorStore.setTileList(response)
})
})

8
src/components/utilities/zoneEditor/ZoneEditor.vue
View File

@ -22,7 +22,7 @@ import config from '@/config'
import { Container, Image, TilemapLayer as TilemapLayerC, useScene } from 'phavuer'
import { onBeforeMount, onBeforeUnmount, ref, toRaw, watch } from 'vue'
import Controls from '@/components/utilities/Controls.vue'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import Toolbar from '@/components/utilities/zoneEditor/Toolbar.vue'
import Tiles from '@/components/utilities/zoneEditor/Tiles.vue'
import { useZoneEditorStore } from '@/stores/zoneEditor'
@ -43,7 +43,7 @@ function uuidv4() {
}
const scene = useScene()
const socket = useSocketStore()
const gameStore = useGameStore()
const zoneEditorStore = useZoneEditorStore()
const assetStore = useAssetStore()
@ -192,9 +192,9 @@ function save() {
}))
};
socket.connection.emit('gm:zone_editor:zone:update', data);
gameStore.connection.emit('gm:zone_editor:zone:update', data);
socket.connection.emit('gm:zone_editor:zone:request', { zoneId: zoneEditorStore.zone.id }, (response: Zone) => {
gameStore.connection.emit('gm:zone_editor:zone:request', { zoneId: zoneEditorStore.zone.id }, (response: Zone) => {
zoneEditorStore.setZone(response)
});

10
src/components/utilities/zoneEditor/ZoneList.vue
View File

@ -30,13 +30,13 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useSocketStore } from '@/stores/socket'
import { useGameStore } from '@/stores/game'
import Modal from '@/components/utilities/Modal.vue'
import type { Zone } from '@/types'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import CreateZone from '@/components/utilities/zoneEditor/CreateZone.vue'
const socket = useSocketStore()
const gameStore = useGameStore()
const zoneEditorStore = useZoneEditorStore()
onMounted(async () => {
@ -44,21 +44,21 @@ onMounted(async () => {
})
function fetchZones() {
socket.connection.emit('gm:zone_editor:zone:list', {}, (response: Zone[]) => {
gameStore.connection.emit('gm:zone_editor:zone:list', {}, (response: Zone[]) => {
zoneEditorStore.setZoneList(response)
})
}
function loadZone(id: number) {
console.log('loadZone', id)
socket.connection.emit('gm:zone_editor:zone:request', { zoneId: id }, (response: Zone) => {
gameStore.connection.emit('gm:zone_editor:zone:request', { zoneId: id }, (response: Zone) => {
zoneEditorStore.setZone(response)
});
zoneEditorStore.toggleZoneListModal()
}
function deleteZone(id: number) {
socket.connection.emit('gm:zone_editor:zone:delete', { zoneId: id }, () => {
gameStore.connection.emit('gm:zone_editor:zone:delete', { zoneId: id }, () => {
fetchZones()
})
}