added night reminders

This commit is contained in:
Steffen 2020-04-25 22:19:47 +02:00
parent 8856cefe27
commit bcb91edef2
No known key found for this signature in database
GPG Key ID: 764D74E98267DFC6
4 changed files with 109 additions and 39 deletions

View File

@ -233,8 +233,8 @@ export default {
otherNight.push(role.otherNight); otherNight.push(role.otherNight);
} }
}); });
firstNight.sort(); firstNight.sort((a, b) => a - b);
otherNight.sort(); otherNight.sort((a, b) => a - b);
newPlayers.forEach(player => { newPlayers.forEach(player => {
player.firstNight = Math.max( player.firstNight = Math.max(
firstNight.indexOf(player.role.firstNight), firstNight.indexOf(player.role.firstNight),

View File

@ -14,11 +14,11 @@
<div class="night first" v-if="player.firstNight"> <div class="night first" v-if="player.firstNight">
<em>{{ player.firstNight }}.</em> <em>{{ player.firstNight }}.</em>
<span>{{ player.role.firstNightReminder }}</span> <span>{{ player.role.firstNightReminder | handleEmojis }}</span>
</div> </div>
<div class="night other" v-if="player.otherNight"> <div class="night other" v-if="player.otherNight">
<em>{{ player.otherNight }}.</em> <em>{{ player.otherNight }}.</em>
<span>{{ player.role.otherNightReminder }}</span> <span>{{ player.role.otherNightReminder | handleEmojis }}</span>
</div> </div>
<Token :role="player.role" @set-role="setRole" /> <Token :role="player.role" @set-role="setRole" />
@ -74,6 +74,9 @@ export default {
data() { data() {
return {}; return {};
}, },
filters: {
handleEmojis: text => text.replace(/:([^: ]+?):/g, "").replace(/ •/g, "\n•")
},
methods: { methods: {
takeScreenshot() { takeScreenshot() {
const { width, height, x, y } = this.$refs.player.getBoundingClientRect(); const { width, height, x, y } = this.$refs.player.getBoundingClientRect();
@ -161,6 +164,7 @@ export default {
/****** Life token *******/ /****** Life token *******/
.player { .player {
z-index: 2;
.life { .life {
border-radius: 50%; border-radius: 50%;
height: $token + 6px; height: $token + 6px;
@ -287,12 +291,16 @@ export default {
/**** Night reminders ****/ /**** Night reminders ****/
.player .night { .player .night {
position: absolute; position: absolute;
top: 40%; height: 100%;
width: 100%; width: 100%;
z-index: 2; z-index: 2;
cursor: pointer; cursor: pointer;
opacity: 1; opacity: 1;
transition: opacity 200ms; transition: opacity 200ms;
display: flex;
top: -16px;
align-items: center;
pointer-events: none;
#townsquare.public & { #townsquare.public & {
opacity: 0; opacity: 0;
@ -303,22 +311,71 @@ export default {
opacity: 0; opacity: 0;
} }
&.first em { span {
left: -15px; display: flex;
background: linear-gradient( position: absolute;
180deg, padding: 5px 10px 5px 30px;
rgba(0, 0, 0, 1) 0%, width: 350px;
rgba(147, 0, 0, 1) 100% z-index: 25;
); font-size: 70%;
background: rgba(0, 0, 0, 0.5);
border-radius: 10px;
border: 3px solid black;
filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.5));
text-align: left;
align-items: center;
opacity: 0;
transition: opacity 200ms ease-in-out;
&:before {
transform: rotate(-90deg);
transform-origin: center top;
left: -98px;
top: 50%;
font-size: 100%;
position: absolute;
font-weight: bold;
text-align: center;
width: 200px;
}
&:after {
content: " ";
border: 10px solid transparent;
width: 0;
height: 0;
position: absolute;
}
} }
&.other em { &.first span {
right: -15px; right: 120%;
background: linear-gradient( background: linear-gradient(
180deg, to right,
rgba(0, 0, 0, 1) 0%, $townsfolk 0%,
rgba(7, 0, 147, 1) 100% rgba(0, 0, 0, 0.5) 20%
); );
&:before {
content: "First Night";
}
&:after {
border-left-color: $townsfolk;
margin-left: 3px;
left: 100%;
}
}
&.other span {
left: 120%;
background: linear-gradient(to right, $demon 0%, rgba(0, 0, 0, 0.5) 20%);
&:before {
content: "Other Nights";
}
&:after {
right: 100%;
margin-right: 3px;
border-right-color: $demon;
}
} }
em { em {
@ -328,15 +385,29 @@ export default {
height: 40px; height: 40px;
text-align: center; text-align: center;
line-height: 37px; line-height: 37px;
top: -20px;
border-radius: 50%; border-radius: 50%;
border: 3px solid black; border: 3px solid black;
filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.5)); filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.5));
font-weight: bold; font-weight: bold;
opacity: 1; opacity: 1;
pointer-events: all;
transition: opacity 200ms; transition: opacity 200ms;
} }
&.first em {
left: -15px;
background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, $townsfolk 100%);
}
&.other em {
right: -15px;
background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, $demon 100%);
}
em:hover + span {
opacity: 1;
}
#app.screenshot & { #app.screenshot & {
display: none; display: none;
} }

View File

@ -212,8 +212,7 @@ export default {
z-index: $item-count - $i + 1; z-index: $item-count - $i + 1;
} @else { } @else {
z-index: $i - 1; z-index: $i - 1;
.ability, .ability {
.night span {
right: 120%; right: 120%;
left: auto; left: auto;
&:before { &:before {

View File

@ -5,7 +5,7 @@
"edition": "tb", "edition": "tb",
"team": "townsfolk", "team": "townsfolk",
"firstNight": 15, "firstNight": 15,
"firstNightReminder": "", "firstNightReminder": ":eye: Show the character token of a Townsfolk in play. Point to two players, one of which is that character. :eye-slash:",
"otherNight": 0, "otherNight": 0,
"otherNightReminder": "", "otherNightReminder": "",
"reminders": [ "reminders": [
@ -21,7 +21,7 @@
"edition": "tb", "edition": "tb",
"team": "townsfolk", "team": "townsfolk",
"firstNight": 16, "firstNight": 16,
"firstNightReminder": "", "firstNightReminder": ":eye: Show the character token of a Outsider in play. Point to two players, one of which is that character. :eye-slash:",
"otherNight": 0, "otherNight": 0,
"otherNightReminder": "", "otherNightReminder": "",
"reminders": [ "reminders": [
@ -37,7 +37,7 @@
"edition": "tb", "edition": "tb",
"team": "townsfolk", "team": "townsfolk",
"firstNight": 17, "firstNight": 17,
"firstNightReminder": "", "firstNightReminder": ":eye: Show the character token of a Minion in play. Point to two players, one of which is that character. :eye-slash:",
"otherNight": 0, "otherNight": 0,
"otherNightReminder": "", "otherNightReminder": "",
"reminders": [ "reminders": [
@ -53,7 +53,7 @@
"edition": "tb", "edition": "tb",
"team": "townsfolk", "team": "townsfolk",
"firstNight": 18, "firstNight": 18,
"firstNightReminder": "", "firstNightReminder": ":eye: Show the finger signal (0, 1, 2, …) for the number of pairs of neighbouring evil players. :eye-slash:",
"otherNight": 0, "otherNight": 0,
"otherNightReminder": "", "otherNightReminder": "",
"reminders": [], "reminders": [],
@ -66,9 +66,9 @@
"edition": "tb", "edition": "tb",
"team": "townsfolk", "team": "townsfolk",
"firstNight": 19, "firstNight": 19,
"firstNightReminder": "", "firstNightReminder": ":eye: Show the finger signal (0, 1, 2) for the number of evil alive neighbours of the Empath. :eye-slash:",
"otherNight": 37, "otherNight": 37,
"otherNightReminder": "", "otherNightReminder": ":eye: Show the finger signal (0, 1, 2) for the number of evil neighbours. :eye-slash:",
"reminders": [], "reminders": [],
"setup": false, "setup": false,
"ability": "Each night, you learn how many of your 2 alive neighbours are evil." "ability": "Each night, you learn how many of your 2 alive neighbours are evil."
@ -79,9 +79,9 @@
"edition": "tb", "edition": "tb",
"team": "townsfolk", "team": "townsfolk",
"firstNight": 20, "firstNight": 20,
"firstNightReminder": "", "firstNightReminder": ":eye: The Fortune Teller points to two players. Give the head signal (nod yes, shake no) for whether one of those players is the Demon. :eye-slash:",
"otherNight": 38, "otherNight": 38,
"otherNightReminder": "", "otherNightReminder": ":eye: The Fortune Teller points to two players. Show the head signal (nod “yes”, shake “no”) for whether one of those players is the Demon. :eye-slash:",
"reminders": [ "reminders": [
"Decoy" "Decoy"
], ],
@ -96,7 +96,7 @@
"firstNight": 0, "firstNight": 0,
"firstNightReminder": "", "firstNightReminder": "",
"otherNight": 40, "otherNight": 40,
"otherNightReminder": "", "otherNightReminder": ":question-circle: If a player was executed today: :eye: Show that players character token. :eye-slash:",
"reminders": [ "reminders": [
"Executed" "Executed"
], ],
@ -111,7 +111,7 @@
"firstNight": 0, "firstNight": 0,
"firstNightReminder": "", "firstNightReminder": "",
"otherNight": 8, "otherNight": 8,
"otherNightReminder": "", "otherNightReminder": "The previously protected player is no longer protected. :plus-circle: :eye: The Monk points to a player not themself. :eye-slash: Mark that player “Protected”. :plus-circle:",
"reminders": [ "reminders": [
"Protected" "Protected"
], ],
@ -126,7 +126,7 @@
"firstNight": 0, "firstNight": 0,
"firstNightReminder": "", "firstNightReminder": "",
"otherNight": 35, "otherNight": 35,
"otherNightReminder": "", "otherNightReminder": ":question-circle: If the Ravenkeeper died tonight: :eye: The Ravenkeeper points to a player. Show that players character token. :eye-slash:",
"reminders": [], "reminders": [],
"setup": false, "setup": false,
"ability": "If you die at night, you are woken to choose a player: you learn their character." "ability": "If you die at night, you are woken to choose a player: you learn their character."
@ -193,9 +193,9 @@
"edition": "tb", "edition": "tb",
"team": "outsider", "team": "outsider",
"firstNight": 21, "firstNight": 21,
"firstNightReminder": "", "firstNightReminder": ":eye: The Butler points to a player. :eye-slash: Mark that player as “Master”. :plus-circle:",
"otherNight": 39, "otherNight": 39,
"otherNightReminder": "", "otherNightReminder": ":eye: The Butler points to a player. :eye-slash: Mark that player as “Master”. :plus-circle:",
"reminders": [ "reminders": [
"Master" "Master"
], ],
@ -262,9 +262,9 @@
"edition": "tb", "edition": "tb",
"team": "minion", "team": "minion",
"firstNight": 4, "firstNight": 4,
"firstNightReminder": "", "firstNightReminder": ":eye: The Poisoner points to a player. :eye-slash: That player is poisoned. :plus-circle:",
"otherNight": 3, "otherNight": 3,
"otherNightReminder": "", "otherNightReminder": "The previously poisoned player is no longer poisoned. :plus-circle: :eye: The Poisoner points to a player. :eye-slash: That player is poisoned. :plus-circle:",
"reminders": [ "reminders": [
"Poisoned" "Poisoned"
], ],
@ -277,9 +277,9 @@
"edition": "tb", "edition": "tb",
"team": "minion", "team": "minion",
"firstNight": 26, "firstNight": 26,
"firstNightReminder": "", "firstNightReminder": ":eye: Show the Grimoire to the Spy for as long as they need. :eye-slash:",
"otherNight": 47, "otherNight": 47,
"otherNightReminder": "", "otherNightReminder": ":eye: Show the Grimoire to the Spy for as long as they need. :eye-slash:",
"reminders": [], "reminders": [],
"setup": false, "setup": false,
"ability": "Each night, you see the Grimoire. You might register as good and as a Townsfolk or Outsider, even if dead." "ability": "Each night, you see the Grimoire. You might register as good and as a Townsfolk or Outsider, even if dead."
@ -292,7 +292,7 @@
"firstNight": 0, "firstNight": 0,
"firstNightReminder": "", "firstNightReminder": "",
"otherNight": 13, "otherNight": 13,
"otherNightReminder": "", "otherNightReminder": ":question-circle: If the Scarlet Woman became the Demon today: :eye: Show the “You are” card, then the demon token. :eye-slash:",
"reminders": [ "reminders": [
"Demon" "Demon"
], ],
@ -307,7 +307,7 @@
"firstNight": 0, "firstNight": 0,
"firstNightReminder": "", "firstNightReminder": "",
"otherNight": 18, "otherNight": 18,
"otherNightReminder": "", "otherNightReminder": ":eye: The Imp points to a player. :eye-slash: That player dies. :plus-circle: If the Imp chose themself: • Replace the character of 1 alive minion with a spare Imp token. :plus-circle: • :eye: Wake the new Imp. Show the “You are” card, then the Imp token. :eye-slash:",
"reminders": [ "reminders": [
"Die" "Die"
], ],