diff --git a/frontend/src/components/Card.vue b/frontend/src/components/Card.vue index 545bc1e..cfad2e7 100644 --- a/frontend/src/components/Card.vue +++ b/frontend/src/components/Card.vue @@ -20,7 +20,7 @@ :style="`background-image: url(${card.avatar});`" >
{{ emoji }}
-
🫡
+
{{ card.alt_text }}
{{ number @@ -280,6 +280,26 @@ export default { top: 52%; right: 12pt; } +.emoji.isMe::after { + content: "🫡"; + display: block; +} +.card:HOVER .isMe::after { + content: "πŸ‘‹"; + animation: wave 0.5s infinite; + will-change: transform; +} +@keyframes wave { + 0% { + transform: translate(-5px, 0px) rotate(0deg); + } + 50% { + transform: translate(-5px, -5px) rotate(25deg); + } + 100% { + transform: translate(-5px, 0) rotate(0deg); + } +} .emoji.bottomed { top: 45%; left: 8pt; diff --git a/frontend/src/components/Lobby.vue b/frontend/src/components/Lobby.vue index 988e878..7b1272f 100644 --- a/frontend/src/components/Lobby.vue +++ b/frontend/src/components/Lobby.vue @@ -390,6 +390,7 @@ @@ -470,7 +471,7 @@ export default { displayAdminStatus: false, is_replay: false, turn: -1, - deadRoleData: null, + deadRoleData: false, cardsToAnimate: [], characters_to_distribute: 2, fullScreenEffects: [], @@ -505,7 +506,7 @@ export default { notify_dead_role(data) { this.deadRoleData = data; setTimeout(() => { - this.deadRoleData = null; + this.deadRoleData = false; }, 4000); }, debug(data) { @@ -575,32 +576,35 @@ export default { let params = msg.split('|') let type = params.shift().substring(1) let messageMap = { - prison_turn: '⛓️', - explode: 'πŸ’₯', - purchase_card: 'πŸ›’', - prison_free: 'πŸ†“', - snake_bit: '🐍', - beer_save: 'πŸΊπŸ˜‡', + prison_turn: '⛓️;πŸ”’;⏭️', + explode: 'πŸ’₯;🧨', + purchase_card: 'πŸ›’;πŸ’Έ', + prison_free: 'πŸ†“;πŸ”‘', + snake_bit: '🐍;🩸', + beer_save: '🍺;πŸ˜‡', sheriff: '⭐', - spilled_beer: '🍺😭', - use_special: 'πŸ”', + spilled_beer: '🍺;😭', + use_special: 'πŸ”;✨', + died: 'πŸ’€;πŸ‘»;😭;☠️;πŸͺ¦;F', + died_role: 'πŸ’€;πŸ‘»;😭;☠️;πŸͺ¦;F', } if (messageMap[type]) { let key = Math.random(); + let avail = messageMap[type].split(';'); for (let i = 0; i < 5; i++) { setTimeout(() => { this.fullScreenEffects.push({ - key, - text: messageMap[type], + key: key+i, + text: avail[Math.floor(Math.random() * avail.length)], startPosition: cumulativeOffset(document.getElementById(params[0])), }); }, 50 * i); + setTimeout(() => { + this.fullScreenEffects = this.fullScreenEffects.filter( + (x) => x.key !== key+i + ); + }, 3000); } - setTimeout(() => { - this.fullScreenEffects = this.fullScreenEffects.filter( - (x) => x.key !== key - ); - }, 3000); } }, suggest_expansion(expansionName) { @@ -612,17 +616,17 @@ export default { for (let i = 0; i < 6; i++) { setTimeout(() => { this.fullScreenEffects.push({ - key: key, + key: key+i, text: i == 0 ? '🀠' : i == 5 ? 'πŸ’­' : emojiMap[expansionName], startPosition: decelOffset, }); }, 50 * i); + setTimeout(() => { + this.fullScreenEffects = this.fullScreenEffects.filter( + (x) => x.key !== key+i + ); + }, 3000); } - setTimeout(() => { - this.fullScreenEffects = this.fullScreenEffects.filter( - (x) => x.key !== key - ); - }, 3000); }, card_scrapped(data) { let decel = document.getElementById("actual-scrap");