diff --git a/src/components/Menu.vue b/src/components/Menu.vue index a1eec66..0fcf5af 100644 --- a/src/components/Menu.vue +++ b/src/components/Menu.vue @@ -172,7 +172,7 @@
  • Game State JSON - G +
  • diff --git a/src/components/modals/GameStateModal.vue b/src/components/modals/GameStateModal.vue index af36986..1a977a1 100644 --- a/src/components/modals/GameStateModal.vue +++ b/src/components/modals/GameStateModal.vue @@ -5,7 +5,20 @@ @close="toggleModal('gameState')" >

    Current Game State

    - + +
    +
    + Copy JSON +
    +
    + Load State +
    +
    @@ -20,16 +33,72 @@ export default { computed: { gamestate: function() { return JSON.stringify({ - bluffs: "", - edition: "", - roles: "", - fabled: "", - players: "" + bluffs: this.players.bluffs.map(({ id }) => id), + edition: this.edition, + roles: this.edition !== "custom" ? "" : this.$store.getters.customRoles, + fabled: this.players.fabled.map(({ id }) => id), + players: this.players.players.map(player => ({ + ...player, + role: player.role.id || {} + })) }); }, - ...mapState(["modals"]) + ...mapState(["modals", "players", "edition", "roles", "session"]) + }, + data() { + return { + input: "" + }; }, methods: { + copy: function() { + // check for clipboard permissions + navigator.permissions + .query({ name: "clipboard-write" }) + .then(({ state }) => { + if (state === "granted" || state === "prompt") { + navigator.clipboard.writeText(this.input || this.gamestate); + } + }); + }, + load: function() { + if (this.session.isSpectator) return; + try { + const data = JSON.parse(this.input || this.gamestate); + const { bluffs, edition, roles, fabled, players } = data; + if (edition) { + this.$store.commit("setEdition", edition); + } + if (roles) { + this.$store.commit("setCustomRoles", roles); + } + if (bluffs.length) { + bluffs.forEach((role, index) => { + this.$store.commit("players/setBluff", { + index, + role: this.$store.state.roles.get(role) || {} + }); + }); + } + if (fabled) { + this.$store.commit("players/setFabled", { + fabled: fabled.map(id => this.$store.state.fabled.get(id)) + }); + } + if (players) { + this.$store.commit( + "players/set", + players.map(player => ({ + ...player, + role: this.$store.state.roles.get(player.role) || {} + })) + ); + } + this.toggleModal("gameState"); + } catch (e) { + alert("Unable to parse JSON: " + e); + } + }, ...mapMutations(["toggleModal"]) } }; @@ -40,8 +109,17 @@ export default { h3 { margin: 0 40px; - svg { - vertical-align: middle; - } +} + +textarea { + background: transparent; + color: white; + white-space: pre-wrap; + word-break: break-all; + border: 1px solid rgba(255, 255, 255, 0.5); + width: 60vw; + height: 30vh; + max-width: 100%; + margin: 5px 0; } diff --git a/src/main.js b/src/main.js index e7c2fc4..df13f7e 100644 --- a/src/main.js +++ b/src/main.js @@ -19,6 +19,7 @@ const faIcons = [ "Dice", "Dragon", "ExchangeAlt", + "FileCode", "FileUpload", "HandPaper", "HandPointRight", diff --git a/src/store/socket.js b/src/store/socket.js index 8fb9d5e..6a4494d 100644 --- a/src/store/socket.js +++ b/src/store/socket.js @@ -714,7 +714,7 @@ export default store => { case "setEdition": session.sendEdition(); break; - case "setFabled": + case "players/setFabled": session.sendFabled(); break; case "players/swap":