diff --git a/src/App.vue b/src/App.vue index d41bcf3..7a2314d 100644 --- a/src/App.vue +++ b/src/App.vue @@ -2,12 +2,31 @@
-
-
- Verbindung wird hergestellt… -
-
- +
+ Verbindung wird hergestellt… +
+
+ +
+ +
@@ -74,8 +93,10 @@ import { trpcClient } from "./trpc" import { useGame } from "./game" import InteractionsScreen from "./screens/InteractionsScreen.vue" + import QueueScreen from "./screens/QueueScreen.vue" const isLoading = ref(true) + const activeTab = ref<"interactions" | "queue">("interactions") const game = useGame() trpcClient.join.subscribe(undefined, { diff --git a/src/components/InteractionQueueItemCard.vue b/src/components/InteractionQueueItemCard.vue new file mode 100644 index 0000000..8f58bcf --- /dev/null +++ b/src/components/InteractionQueueItemCard.vue @@ -0,0 +1,65 @@ + + + + + \ No newline at end of file diff --git a/src/components/ObjectCard.vue b/src/components/ObjectCard.vue index 77f7817..9419cc0 100644 --- a/src/components/ObjectCard.vue +++ b/src/components/ObjectCard.vue @@ -8,7 +8,7 @@ }" :data-object-id="object.id" > - +
{{ object.label }}
@@ -41,6 +41,7 @@ import interact from "@interactjs/interact" import { useCurrentElement } from "@vueuse/core" import { computed, onMounted, onUnmounted, ref, useCssModule } from "vue" + import ObjectPicture from "./ObjectPicture.vue" const props = defineProps<{ object: GameObject diff --git a/src/components/ObjectPicture.vue b/src/components/ObjectPicture.vue new file mode 100644 index 0000000..f211be7 --- /dev/null +++ b/src/components/ObjectPicture.vue @@ -0,0 +1,13 @@ + + + + + \ No newline at end of file diff --git a/src/game.ts b/src/game.ts index ef9ebb6..5f5ec84 100644 --- a/src/game.ts +++ b/src/game.ts @@ -1,7 +1,7 @@ import { defineStore } from "pinia" import { computed, reactive, ref } from "vue" import { script } from "./shared/script" -import type { Interaction, InteractionQueueItem } from "./shared/script/types" +import type { GameObject, Interaction, InteractionQueueItem } from "./shared/script/types" import { trpcClient } from "./trpc" import type { GameEvent } from "./shared/gameEvents" import { getInteractionQueueItemId } from "./shared/util" @@ -13,10 +13,20 @@ export const useGame = defineStore("gameState", () => { const currentInteractionId = computed(() => currentInteraction.value === null ? null : getInteractionQueueItemId(currentInteraction.value)) + const sortedInteractionQueue = computed(() => [...interactionQueue.values()].sort((a, b) => b.votes - a.votes)) + + const currentRoom = computed(() => script.roomsById.get(currentRoomId.value)!) + return { currentRoomId, interactionQueue, - currentRoom: computed(() => script.roomsById.get(currentRoomId.value)!), + sortedInteractionQueue, + currentRoom, + allObjectsById: computed(() => { + const map = new Map() + currentRoom.value.initialObjects.union(currentRoom.value.hiddenObjects).forEach(o => map.set(o.id, o)) + return map + }), currentInteraction, currentInteractionId, voteForInteraction(interaction: Interaction) { diff --git a/src/screens/InteractionsScreen.vue b/src/screens/InteractionsScreen.vue index c95504a..d515b6a 100644 --- a/src/screens/InteractionsScreen.vue +++ b/src/screens/InteractionsScreen.vue @@ -1,22 +1,22 @@ + + + + \ No newline at end of file