Merge branch 'main' into feature-visible-nom-log-indicator-button

This commit is contained in:
Michael Langford 2021-03-18 15:49:04 -04:00 committed by GitHub
commit 3cfc9939f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 382 additions and 160 deletions

19
.github/workflows/changelog-check.yml vendored Normal file
View File

@ -0,0 +1,19 @@
name: Enforce Changelog Update
on:
pull_request:
types: [assigned, opened, synchronize, reopened, labeled, unlabeled]
branches:
- main
jobs:
build:
name: Check Actions
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v1
- name: Changelog check
uses: Zomzog/changelog-checker@v1.1.0
with:
fileName: CHANGELOG.md
noChangelogLabel: no changelog
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

View File

@ -2,6 +2,20 @@
### Version 2.9.1
- added [nomination log indicator](https://fontawesome.com/icons/book-dead). When a nomination log [v] is available, the number of currently visible entries is displayed. Clicking the indicator can reveal/hide the nomination log.
- fix gamestate JSON not showing (custom) roles and failing to load states with custom scripts properly
- fix gamestate not stripping out special characters from role.id on load
- made character assignment modal a bit prettier
- got rid of the extra pixels on the Soldier icon
- fixed lengthy live session channel names not being correctly cut off
- hide player names in night order / character reference popup when town square is public
- fix (pre-)vote calculation being off by one if the nominee votes
---
### Version 2.9.0
- added support for assigning pronouns to players and display of the pronouns in a tooltip on the player name.
- added button to modals that allows the user to maximize them
- added Mephit and Snitch to roles.json
### Version 2.8.0
- added hands-off live session support for homebrew / custom characters again!

188
package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "townsquare",
"version": "2.8.0",
"version": "2.9.1",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@ -500,6 +500,15 @@
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
"integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ=="
},
"ansi-styles": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"optional": true,
"requires": {
"color-convert": "^2.0.1"
}
},
"cacache": {
"version": "13.0.1",
"resolved": "https://registry.npmjs.org/cacache/-/cacache-13.0.1.tgz",
@ -525,6 +534,31 @@
"unique-filename": "^1.1.1"
}
},
"chalk": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
"optional": true,
"requires": {
"ansi-styles": "^4.1.0",
"supports-color": "^7.1.0"
}
},
"color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
"optional": true,
"requires": {
"color-name": "~1.1.4"
}
},
"color-name": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"optional": true
},
"find-cache-dir": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.1.tgz",
@ -544,6 +578,32 @@
"path-exists": "^4.0.0"
}
},
"has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"optional": true
},
"json5": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
"integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
"optional": true,
"requires": {
"minimist": "^1.2.5"
}
},
"loader-utils": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
"optional": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
},
"locate-path": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
@ -605,6 +665,15 @@
"minipass": "^3.1.1"
}
},
"supports-color": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
"optional": true,
"requires": {
"has-flag": "^4.0.0"
}
},
"terser-webpack-plugin": {
"version": "2.3.8",
"resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
@ -620,6 +689,17 @@
"terser": "^4.6.12",
"webpack-sources": "^1.4.3"
}
},
"vue-loader-v16": {
"version": "npm:vue-loader@16.1.2",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.1.2.tgz",
"integrity": "sha512-8QTxh+Fd+HB6fiL52iEVLKqE9N1JSlMXLR92Ijm6g8PZrwIxckgpqjPDWRP5TWxdiPaHR+alUWsnu1ShQOwt+Q==",
"optional": true,
"requires": {
"chalk": "^4.1.0",
"hash-sum": "^2.0.0",
"loader-utils": "^2.0.0"
}
}
}
},
@ -3064,23 +3144,23 @@
"integrity": "sha512-FeIuBzArONbAmKmZIsZIFGu/Gc9AVGlVeVbhCq+G2YIl6QkT0TDn2HKN/FMf1btXEB9kEmIuQf3/lBTVAbmFOg=="
},
"elliptic": {
"version": "6.5.3",
"resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz",
"integrity": "sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==",
"version": "6.5.4",
"resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
"integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
"requires": {
"bn.js": "^4.4.0",
"brorand": "^1.0.1",
"bn.js": "^4.11.9",
"brorand": "^1.1.0",
"hash.js": "^1.0.0",
"hmac-drbg": "^1.0.0",
"inherits": "^2.0.1",
"minimalistic-assert": "^1.0.0",
"minimalistic-crypto-utils": "^1.0.0"
"hmac-drbg": "^1.0.1",
"inherits": "^2.0.4",
"minimalistic-assert": "^1.0.1",
"minimalistic-crypto-utils": "^1.0.1"
},
"dependencies": {
"bn.js": {
"version": "4.11.9",
"resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.9.tgz",
"integrity": "sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw=="
"version": "4.12.0",
"resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
"integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA=="
}
}
},
@ -8840,88 +8920,6 @@
}
}
},
"vue-loader-v16": {
"version": "npm:vue-loader@16.1.1",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.1.1.tgz",
"integrity": "sha512-wz/+HFg/3SBayHWAlZXARcnDTl3VOChrfW9YnxvAweiuyKX/7IGx1ad/4yJHmwhgWlOVYMAbTiI7GV8G33PfGQ==",
"optional": true,
"requires": {
"chalk": "^4.1.0",
"hash-sum": "^2.0.0",
"loader-utils": "^2.0.0"
},
"dependencies": {
"ansi-styles": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"optional": true,
"requires": {
"color-convert": "^2.0.1"
}
},
"chalk": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
"optional": true,
"requires": {
"ansi-styles": "^4.1.0",
"supports-color": "^7.1.0"
}
},
"color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
"optional": true,
"requires": {
"color-name": "~1.1.4"
}
},
"color-name": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"optional": true
},
"has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"optional": true
},
"json5": {
"version": "2.1.3",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.1.3.tgz",
"integrity": "sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==",
"optional": true,
"requires": {
"minimist": "^1.2.5"
}
},
"loader-utils": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
"optional": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
},
"supports-color": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
"optional": true,
"requires": {
"has-flag": "^4.0.0"
}
}
}
},
"vue-style-loader": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",

View File

@ -1,6 +1,6 @@
{
"name": "townsquare",
"version": "2.8.0",
"version": "2.9.1",
"description": "Blood on the Clocktower Town Square",
"author": "Steffen Baumgart",
"scripts": {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 82 KiB

After

Width:  |  Height:  |  Size: 76 KiB

View File

@ -361,7 +361,7 @@ export default {
top: 3px;
text-align: right;
padding-right: 50px;
z-index: 200;
z-index: 75;
svg {
filter: drop-shadow(0 0 5px rgba(0, 0, 0, 1));

View File

@ -97,13 +97,16 @@
@click="updatePlayer('isVoteless', true)"
title="Ghost vote"
/>
<div
class="name"
@click="isMenuOpen = !isMenuOpen"
:class="{ active: isMenuOpen }"
>
{{ player.name }}
<span>{{ player.name }}</span>
<font-awesome-icon icon="venus-mars" v-if="player.pronouns" />
<div class="pronouns" v-if="player.pronouns">
<span>{{ player.pronouns }}</span>
</div>
</div>
<transition name="fold">
@ -150,6 +153,15 @@
</template>
<template v-else> Seat occupied</template>
</li>
<li
@click="changePronouns"
v-if="
!session.isSpectator ||
(session.isSpectator && player.id === session.playerId)
"
>
<font-awesome-icon icon="venus-mars" />Change Pronouns
</li>
</ul>
</transition>
</div>
@ -232,6 +244,15 @@ export default {
};
},
methods: {
changePronouns() {
if (this.session.isSpectator && this.player.id !== this.session.playerId)
return;
const pronouns = prompt("Player pronouns", this.player.pronouns);
//Only update pronouns if not null (prompt was not cancelled)
if (pronouns !== null) {
this.updatePlayer("pronouns", pronouns, true);
}
},
toggleStatus() {
if (this.grimoire.isPublic) {
if (!this.player.isDead) {
@ -260,7 +281,12 @@ export default {
this.updatePlayer("reminders", reminders, true);
},
updatePlayer(property, value, closeMenu = false) {
if (this.session.isSpectator && property !== "reminders") return;
if (
this.session.isSpectator &&
property !== "reminders" &&
property !== "pronouns"
)
return;
this.$store.commit("players/update", {
player: this.player,
property,
@ -629,25 +655,72 @@ li.move:not(.from) .player .overlay svg.move {
/***** Player name *****/
.player > .name {
text-align: center;
right: 10%;
display: flex;
justify-content: center;
font-size: 120%;
line-height: 120%;
cursor: pointer;
white-space: nowrap;
width: 100%;
width: 120%;
background: rgba(0, 0, 0, 0.5);
border: 3px solid black;
border-radius: 10px;
top: 5px;
box-shadow: 0 0 5px black;
text-overflow: ellipsis;
overflow: hidden;
padding: 0 4px;
svg {
top: 3px;
margin-right: 2px;
}
span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
flex-grow: 1;
}
#townsquare:not(.spectator) &:hover,
&.active {
color: red;
}
&:hover .pronouns {
opacity: 1;
color: white;
}
.pronouns {
display: flex;
position: absolute;
right: 110%;
max-width: 250px;
z-index: 25;
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));
align-items: center;
pointer-events: none;
opacity: 0;
transition: opacity 200ms ease-in-out;
padding: 0 4px;
bottom: -3px;
&:before {
content: " ";
border: 10px solid transparent;
width: 0;
height: 0;
border-left-color: black;
position: absolute;
margin-left: 2px;
left: 100%;
}
}
}
.player.dead > .name {
@ -657,7 +730,7 @@ li.move:not(.from) .player .overlay svg.move {
/***** Player menu *****/
.player > .menu {
position: absolute;
left: 100%;
left: 110%;
bottom: -5px;
text-align: left;
white-space: nowrap;

View File

@ -264,7 +264,7 @@ export default {
// open menu on the left
.player > .menu {
left: auto;
right: 100%;
right: 110%;
margin-right: 15px;
&:before {
border-left-color: black;
@ -292,6 +292,16 @@ export default {
left: 100%;
}
}
.pronouns {
left: 110%;
right: auto;
&:before {
border-left-color: transparent;
border-right-color: black;
left: auto;
right: 100%;
}
}
} @else {
// second half of players
z-index: $i - 1;

View File

@ -10,17 +10,14 @@
<em>{{ nominee.name }}</em
>!
<br />
<template v-if="nominee.role.team !== 'traveler'">
<em class="blue">
{{ voters.length }} vote{{ voters.length !== 1 ? "s" : "" }}
</em>
in favor
<em>(majority is {{ Math.ceil(alive / 2) }})</em>
</template>
<template v-else>
<em>{{ Math.ceil(players.length / 2) }} votes</em> required for a
<em>majority</em>.
</template>
<em class="blue">
{{ voters.length }} vote{{ voters.length !== 1 ? "s" : "" }}
</em>
in favor
<em v-if="nominee.role.team !== 'traveler'">
(majority is {{ Math.ceil(alive / 2) }})
</em>
<em v-else>(majority is {{ Math.ceil(players.length / 2) }})</em>
<div v-if="session.isVoteInProgress || session.lockedVote > 1">
<em class="blue" v-if="voters.length">{{ voters.join(", ") }} </em>
@ -170,7 +167,10 @@ export default {
...voters.slice(nomination + 1),
...voters.slice(0, nomination + 1)
];
return reorder.slice(0, this.session.lockedVote - 1).filter(n => !!n);
return (this.session.lockedVote
? reorder.slice(0, this.session.lockedVote - 1)
: reorder
).filter(n => !!n);
}
},
data() {

View File

@ -163,19 +163,15 @@ export default {
if (metaIndex > -1) {
meta = roles.splice(metaIndex, 1).pop();
}
const customRoles = roles.map(role => {
role.id = role.id.toLocaleLowerCase().replace(/[^a-z0-9]/g, "");
return role;
});
this.$store.commit("setCustomRoles", customRoles);
this.$store.commit("setCustomRoles", roles);
this.$store.commit(
"setEdition",
Object.assign({}, meta, { id: "custom" })
);
// check for fabled and set those too, if present
if (customRoles.some(({ id }) => this.$store.state.fabled.has(id))) {
if (roles.some(({ id }) => this.$store.state.fabled.has(id))) {
const fabled = [];
customRoles.forEach(({ id }) => {
roles.forEach(({ id }) => {
if (this.$store.state.fabled.has(id)) {
fabled.push(this.$store.state.fabled.get(id));
}

View File

@ -37,7 +37,9 @@ export default {
edition: this.edition.isOfficial
? { id: this.edition.id }
: this.edition,
roles: this.edition.isOfficial ? "" : this.$store.getters.customRoles,
roles: this.edition.isOfficial
? ""
: this.$store.getters.customRolesStripped,
fabled: this.players.fabled.map(({ id }) => id),
players: this.players.players.map(player => ({
...player,

View File

@ -3,13 +3,27 @@
<div class="modal-backdrop" @click="close">
<div
class="modal"
:class="{ maximized: isMaximized }"
role="dialog"
aria-labelledby="modalTitle"
aria-describedby="modalDescription"
@click.stop=""
>
<font-awesome-icon @click="close" class="close" icon="times-circle" />
<slot></slot>
<div class="top-right-buttons">
<font-awesome-icon
@click="isMaximized = !isMaximized"
class="top-right-button"
:icon="['fas', isMaximized ? 'window-minimize' : 'window-maximize']"
/>
<font-awesome-icon
@click="close"
class="top-right-button"
icon="times-circle"
/>
</div>
<div class="slot">
<slot></slot>
</div>
</div>
</div>
</transition>
@ -17,6 +31,11 @@
<script>
export default {
data: function() {
return {
isMaximized: false
};
},
methods: {
close() {
this.$emit("close");
@ -46,16 +65,20 @@ export default {
box-shadow: 2px 2px 20px 1px #000;
display: flex;
flex-direction: column;
max-width: 60%;
max-height: 80%;
max-width: 80%;
.characters &,
.vote-history &,
.night-reference & {
max-height: 80%;
max-width: 80%;
.night-reference &,
.characters & {
overflow-y: auto;
}
.roles & {
max-height: 100%;
max-width: 60%;
}
ul {
list-style-type: none;
margin: 0;
@ -67,16 +90,37 @@ export default {
justify-content: center;
line-height: 100%;
}
> .close {
> .top-right-buttons {
position: absolute;
z-index: 100;
top: 15px;
right: 20px;
top: 20px;
cursor: pointer;
z-index: 5;
&:hover {
color: red;
> .top-right-button {
cursor: pointer;
width: 28px;
&:hover {
color: red;
}
}
}
> .slot {
max-height: 100%;
position: initial;
}
}
.maximized {
background: rgba(0, 0, 0, 0.95);
padding: 0;
height: 100%;
width: 100%;
max-width: 100%;
max-height: 100%;
display: flex;
align-content: center;
justify-content: center;
}
.modal-fade-enter,

View File

@ -25,7 +25,7 @@
>
<span class="name">
{{ role.name }}
<template v-if="role.players.length">
<span class="player" v-if="role.players.length">
<br />
<small
v-for="(player, index) in role.players"
@ -35,7 +35,7 @@
player.name + (role.players.length > index + 1 ? "," : "")
}}</small
>
</template>
</span>
</span>
<span
class="icon"
@ -77,7 +77,7 @@
></span>
<span class="name">
{{ role.name }}
<template v-if="role.players.length">
<span class="player" v-if="role.players.length">
<br />
<small
v-for="(player, index) in role.players"
@ -87,7 +87,7 @@
player.name + (role.players.length > index + 1 ? "," : "")
}}</small
>
</template>
</span>
</span>
<span class="reminder" v-if="role.otherNightReminder">
{{ role.otherNightReminder }}
@ -180,7 +180,7 @@ export default {
.toggle {
position: absolute;
left: 20px;
top: 20px;
top: 15px;
cursor: pointer;
&:hover {
color: red;
@ -362,4 +362,9 @@ ul {
}
}
}
/** hide players when town square is set to "public" **/
#townsquare.public ~ .night-reference .modal .player {
display: none;
}
</style>

View File

@ -100,7 +100,7 @@ export default {
.toggle {
position: absolute;
left: 20px;
top: 20px;
top: 15px;
cursor: pointer;
&:hover {
color: red;
@ -195,7 +195,7 @@ ul {
&:after {
content: " ";
display: block;
padding-top: 66%;
padding-top: 65%;
}
}
.name {
@ -219,6 +219,7 @@ ul {
}
}
&.legend {
width: 100%;
font-weight: bold;
height: 20px;
margin-top: 10px;
@ -234,4 +235,9 @@ ul {
}
}
}
/** hide players when town square is set to "public" **/
#townsquare.public ~ .characters .modal .player {
display: none;
}
</style>

View File

@ -168,8 +168,8 @@ ul.tokens {
padding-left: 5%;
li {
border-radius: 50%;
width: 6vw;
margin: 1%;
width: 5vw;
margin: 5px;
opacity: 0.5;
transition: all 250ms;
&.selected {

View File

@ -1,7 +1,7 @@
<template>
<Modal
class="vote-history"
v-show="modals.voteHistory && session.voteHistory"
v-if="modals.voteHistory && session.voteHistory"
@close="toggleModal('voteHistory')"
>
<font-awesome-icon
@ -91,7 +91,7 @@ export default {
.clear {
position: absolute;
left: 20px;
top: 20px;
top: 15px;
cursor: pointer;
&:hover {
color: red;
@ -99,7 +99,7 @@ export default {
}
h3 {
margin: 0 40px;
margin: 0 40px 0 10px;
svg {
vertical-align: middle;
}
@ -107,6 +107,8 @@ h3 {
table {
border-spacing: 10px 0;
margin-left: auto;
margin-right: auto;
}
thead td {

View File

@ -45,9 +45,12 @@ const faIcons = [
"UserEdit",
"UserFriends",
"Users",
"VenusMars",
"VolumeUp",
"VolumeMute",
"VoteYea"
"VoteYea",
"WindowMaximize",
"WindowMinimize"
];
const fabIcons = ["Github", "Discord"];
library.add(

View File

@ -179,6 +179,11 @@ export default new Vuex.Store({
return role;
}
})
// clean up role.id
.map(role => {
role.id = role.id.toLocaleLowerCase().replace(/[^a-z0-9]/g, "");
return role;
})
// map existing roles to base definition or pre-populate custom roles to ensure all properties
.map(
role =>

View File

@ -4,7 +4,8 @@ const NEWPLAYER = {
role: {},
reminders: [],
isVoteless: false,
isDead: false
isDead: false,
pronouns: ""
};
const state = () => ({
@ -79,10 +80,11 @@ const actions = {
return player;
});
} else {
players = state.players.map(({ name, id }) => ({
players = state.players.map(({ name, id, pronouns }) => ({
...NEWPLAYER,
name,
id
id,
pronouns
}));
commit("setFabled", { fabled: [] });
}

View File

@ -189,6 +189,9 @@ class LiveSession {
case "bye":
this._handleBye(params);
break;
case "pronouns":
this._updatePlayerPronouns(params);
break;
}
}
@ -244,6 +247,7 @@ class LiveSession {
id: player.id,
isDead: player.isDead,
isVoteless: player.isVoteless,
pronouns: player.pronouns,
...(player.role && player.role.team === "traveler"
? { roleId: player.role.id }
: {})
@ -304,7 +308,7 @@ class LiveSession {
const player = players[x];
const { roleId } = state;
// update relevant properties
["name", "id", "isDead", "isVoteless"].forEach(property => {
["name", "id", "isDead", "isVoteless", "pronouns"].forEach(property => {
const value = state[property];
if (player[property] !== value) {
this._store.commit("players/update", { player, property, value });
@ -481,6 +485,41 @@ class LiveSession {
}
}
/**
* Publish a player pronouns update
* @param player
* @param value
*/
sendPlayerPronouns({ player, value }) {
//send pronoun only for the seated player or storyteller
if (this._isSpectator && this._store.state.session.playerId !== player.id)
return;
const index = this._store.state.players.players.indexOf(player);
this._send("pronouns", [index, value, !this._isSpectator]);
}
/**
* Update a pronouns based on incoming data. Player only.
* @param index
* @param value
* @param fromSt
* @private
*/
_updatePlayerPronouns([index, value, fromST]) {
const player = this._store.state.players.players[index];
if (
player &&
(fromST || this._store.state.session.playerId !== player.id) &&
player.pronouns !== value
) {
this._store.commit("players/update", {
player,
property: "pronouns",
value
});
}
}
/**
* Handle a ping message by another player / storyteller
* @param playerIdOrCount
@ -752,11 +791,11 @@ export default store => {
const session = new LiveSession(store);
// listen to mutations
store.subscribe(({ type, payload }) => {
store.subscribe(({ type, payload }, state) => {
switch (type) {
case "session/setSessionId":
if (payload) {
session.connect(payload);
if (state.session.sessionId) {
session.connect(state.session.sessionId);
} else {
window.location.hash = "";
session.disconnect();
@ -810,7 +849,11 @@ export default store => {
session.sendGamestate("", true);
break;
case "players/update":
session.sendPlayer(payload);
if (payload.property === "pronouns") {
session.sendPlayerPronouns(payload);
} else {
session.sendPlayer(payload);
}
break;
}
});