diff --git a/src/components/ObjectCard.vue b/src/components/ObjectCard.vue index 36fc4c4..77f7817 100644 --- a/src/components/ObjectCard.vue +++ b/src/components/ObjectCard.vue @@ -20,18 +20,32 @@ touch-action: none; transition: transform 50ms ease, background-color 200ms ease; } + + .combineFirst { + animation: 500ms ease-in-out alternate infinite combineFirst; + } + + @keyframes combineFirst { + from { + @apply border-blue-400; + } + + to { + @apply border-blue-700; + } + } \ No newline at end of file diff --git a/src/game.ts b/src/game.ts index c24d8b7..ef9ebb6 100644 --- a/src/game.ts +++ b/src/game.ts @@ -25,8 +25,9 @@ export const useGame = defineStore("gameState", () => { currentInteraction.value = interaction trpcClient.player.voteForInteraction.mutate({ interaction }) }, - removeInteractionVote(queueItemId: string) { - trpcClient.player.removeInteractionVote.mutate({ queueItemId }) + revokeCurrentInteractionVote() { + if (currentInteractionId.value === null) return + trpcClient.player.removeInteractionVote.mutate({ queueItemId: currentInteractionId.value }) currentInteraction.value = null }, switchRoom(roomId: string) { diff --git a/src/screens/InteractionsScreen.vue b/src/screens/InteractionsScreen.vue index 2fba867..c95504a 100644 --- a/src/screens/InteractionsScreen.vue +++ b/src/screens/InteractionsScreen.vue @@ -13,6 +13,7 @@ class="bg-blue-900" :has-floating="combineFloatingObjectIds.size > 0" @object-change="(v, i) => createSetInclusionSetter(combineFloatingObjectIds)(v, i)" + @object-drop="onObjectInteractionDrop" />
@@ -50,6 +51,8 @@ const combineFloatingObjectIds = reactive(new Set()) const allFloatingObjectIds = computed(() => new Set([...useFloatingObjectIds, ...combineFloatingObjectIds])) + const firstCombinationObjectId = ref(null) + function createSetInclusionSetter(set: Set) { return (value: T, isIncluded: boolean) => { if (isIncluded) set.add(value) @@ -58,7 +61,9 @@ } function getMarkedFor(objectId: string) { - if (game.currentInteraction !== null) { + if (firstCombinationObjectId.value !== null) { + if (firstCombinationObjectId.value === objectId) return "combine-first" + } else if (game.currentInteraction !== null) { switch (game.currentInteraction.type) { case "use": if (game.currentInteraction.objectId === objectId) return "use" @@ -88,4 +93,23 @@ objectId }) } + + function onObjectInteractionDrop(objectId: string) { + if (firstCombinationObjectId.value === null) { + game.revokeCurrentInteractionVote() + firstCombinationObjectId.value = objectId + } else { + if (firstCombinationObjectId.value === objectId) { + firstCombinationObjectId.value = null + return + } + + game.voteForInteraction({ + type: "combine", + objectIds: new Set([firstCombinationObjectId.value, objectId]) + }) + + firstCombinationObjectId.value = null + } + } \ No newline at end of file