moved fabled to player store

cleaned up some things around fabled night reminders
added fabled to night sheet

src/components/Menu.vue

@@ -277,13 +277,11 @@ export default {
       if (this.session.isSpectator) return;
       if (confirm("Are you sure you want to remove all players?")) {
         this.$store.commit("players/clear");
-        this.$store.commit("setBluff");
       }
     },
     clearRoles() {
       if (confirm("Are you sure you want to remove all player roles?")) {
         this.$store.dispatch("players/clearRoles");
-        this.$store.commit("setBluff");
       }
     },
     ...mapMutations([

src/components/TownSquare.vue

@@ -39,20 +39,16 @@
       </h3>
       <ul>
         <li
-          v-for="index in bluffs"
+          v-for="index in bluffSize"
           :key="index"
           @click="openRoleModal(index * -1)"
         >
-          <Token :role="grimoire.bluffs[index - 1]"></Token>
+          <Token :role="bluffs[index - 1]"></Token>
         </li>
       </ul>
     </div>
 
-    <div
+    <div class="fabled" :class="{ closed: !isFabledOpen }" v-if="fabled.length">
-      class="fabled"
-      :class="{ closed: !isFabledOpen }"
-      v-if="grimoire.fabled.length"
-    >
       <h3>
         <span>Fabled</span>
         <font-awesome-icon icon="times-circle" @click.stop="toggleFabled" />
@@ -60,11 +56,11 @@
       </h3>
       <ul>
         <li
-          v-for="(fabled, index) in grimoire.fabled"
+          v-for="(fabledRole, index) in fabled"
           :key="index"
           @click="removeFabled(index)"
         >
-          <Token :role="fabled"></Token>
+          <Token :role="fabledRole"></Token>
         </li>
       </ul>
     </div>
@@ -90,12 +86,12 @@ export default {
   },
   computed: {
     ...mapState(["grimoire", "roles", "session"]),
-    ...mapState("players", ["players"])
+    ...mapState("players", ["players", "bluffs", "fabled"])
   },
   data() {
     return {
       selectedPlayer: 0,
-      bluffs: 3,
+      bluffSize: 3,
       swap: -1,
       move: -1,
       nominate: -1,
@@ -116,7 +112,7 @@ export default {
     },
     removeFabled(index) {
       if (this.session.isSpectator) return;
-      this.$store.commit("setFabled", { index });
+      this.$store.commit("players/setFabled", { index });
     },
     handleTrigger(playerIndex, [method, params]) {
       if (typeof this[method] === "function") {
@@ -320,8 +316,8 @@ export default {
 }
 
 /***** Demon bluffs / Fabled *******/
-.bluffs,
+#townsquare > .bluffs,
-.fabled {
+#townsquare > .fabled {
   position: absolute;
   &.bluffs {
     bottom: 10px;

src/components/modals/EditionModal.vue

@@ -164,7 +164,7 @@ export default {
             fabled.push(this.$store.state.fabled.get(id));
           }
         });
-        this.$store.commit("setFabled", { fabled });
+        this.$store.commit("players/setFabled", { fabled });
       }
       this.isCustom = false;
     },

src/components/modals/FabledModal.vue

@@ -25,7 +25,7 @@ export default {
       this.$store.state.fabled.forEach(role => {
         // don't show fabled that are already in play
         if (
-          !this.$store.state.grimoire.fabled.some(fable => fable.id === role.id)
+          !this.$store.state.players.fabled.some(fable => fable.id === role.id)
         ) {
           fabled.push(role);
         }
@@ -35,7 +35,7 @@ export default {
   },
   methods: {
     setFabled(role) {
-      this.$store.commit("setFabled", {
+      this.$store.commit("players/setFabled", {
         fabled: role
       });
       this.$store.commit("toggleModal", "fabled");

src/components/modals/NightOrderModal.vue

@@ -108,6 +108,11 @@ export default {
           rolesFirstNight.push(role);
         }
       });
+      this.fabled
+        .filter(({ firstNight }) => firstNight)
+        .forEach(fabled => {
+          rolesFirstNight.push(fabled);
+        });
       rolesFirstNight.sort((a, b) => a.firstNight - b.firstNight);
       return rolesFirstNight;
     },
@@ -122,11 +127,16 @@ export default {
           rolesOtherNight.push(role);
         }
       });
+      this.fabled
+        .filter(({ otherNight }) => otherNight)
+        .forEach(fabled => {
+          rolesOtherNight.push(fabled);
+        });
       rolesOtherNight.sort((a, b) => a.otherNight - b.otherNight);
       return rolesOtherNight;
     },
-    ...mapState(["roles", "modals", "edition"]),
+    ...mapState(["roles", "modals", "edition", "grimoire"]),
-    ...mapState("players", ["players"])
+    ...mapState("players", ["players", "fabled"])
   },
   methods: {
     ...mapMutations(["toggleModal"])
@@ -174,6 +184,17 @@ h4 {
   }
 }
 
+.fabled {
+  .name,
+  .player,
+  h4 {
+    color: $fabled;
+    &:before,
+    &:after {
+      background-color: $fabled;
+    }
+  }
+}
 .townsfolk {
   .name,
   .player,

src/components/modals/ReminderModal.vue

@@ -59,7 +59,7 @@ export default {
           ];
         }
       });
-      this.$store.state.grimoire.fabled.forEach(role => {
+      this.$store.state.players.fabled.forEach(role => {
         reminders = [
           ...reminders,
           ...role.reminders.map(name => ({

src/components/modals/RoleModal.vue

@@ -55,8 +55,8 @@ export default {
   methods: {
     setRole(role) {
       if (this.playerIndex < 0) {
-        // assign to bluff slot
+        // assign to bluff slot (index < 0)
-        this.$store.commit("setBluff", {
+        this.$store.commit("players/setBluff", {
           index: this.playerIndex * -1 - 1,
           role
         });

src/fabled.json

@@ -62,6 +62,7 @@
   {
     "id": "toymaker",
     "firstNightReminder": "",
+    "otherNight": 1,
     "otherNightReminder": "If it is a night when a Demon attack could end the game, and the Demon is marked “Final night: No Attack,” then the Demon does not act tonight. (Do not wake them.)",
     "reminders": ["Final Night: No Attack"],
     "setup": false,
@@ -82,6 +83,7 @@
   {
     "id": "duchess",
     "firstNightReminder": "",
+    "otherNight": 1,
     "otherNightReminder": "Wake each player marked “Visitor” or “False Info” one at a time. Show them the Duchess token, then fingers (1, 2, 3) equaling the number of evil players marked “Visitor” or, if you are waking the player marked “False Info,” show them any number of fingers except the number of evil players marked “Visitor.”",
     "reminders": ["Visitor", "False Info"],
     "setup": false,
@@ -111,6 +113,7 @@
   },
   {
     "id": "djinn",
+    "firstNight": 1,
     "firstNightReminder": "Wake each evil player and show them which jinxed characters are in play, so that they know not to bluff as characters that can not be in play.",
     "otherNightReminder": "",
     "reminders": [],
@@ -121,6 +124,7 @@
   },
   {
     "id": "stormcatcher",
+    "firstNight": 1,
     "firstNightReminder": "Mark a good player as \"Safe\". Wake each evil player and show them the marked player.",
     "otherNightReminder": "",
     "reminders": ["Safe"],

src/store/index.js

@@ -56,9 +56,7 @@ export default new Vuex.Store({
       isScreenshot: false,
       isScreenshotSuccess: false,
       zoom: 0,
-      background: "",
+      background: ""
-      bluffs: [],
-      fabled: []
     },
     modals: {
       edition: false,
@@ -124,24 +122,6 @@ export default new Vuex.Store({
     setBackground({ grimoire }, background) {
       grimoire.background = background;
     },
-    setBluff({ grimoire }, { index, role } = {}) {
-      if (index !== undefined) {
-        grimoire.bluffs.splice(index, 1, role);
-      } else {
-        grimoire.bluffs = [];
-      }
-    },
-    setFabled({ grimoire }, { index, fabled } = {}) {
-      if (index !== undefined) {
-        grimoire.fabled.splice(index, 1);
-      } else if (fabled) {
-        if (!Array.isArray(fabled)) {
-          grimoire.fabled.push(fabled);
-        } else {
-          grimoire.fabled = fabled;
-        }
-      }
-    },
     toggleModal({ modals }, name) {
       if (name) {
         modals[name] = !modals[name];

src/store/modules/players.js

@@ -8,7 +8,9 @@ const NEWPLAYER = {
 };
 
 const state = () => ({
-  players: []
+  players: [],
+  fabled: [],
+  bluffs: []
 });
 
 const getters = {
@@ -26,7 +28,6 @@ const getters = {
     const firstNight = [0];
     const otherNight = [0];
     players.forEach(({ role }) => {
-      // if (isDead) return;
       if (role.firstNight && !firstNight.includes(role.firstNight)) {
         firstNight.push(role.firstNight);
       }
@@ -72,12 +73,14 @@ const actions = {
       }));
     }
     commit("set", players);
+    commit("setBluff");
   }
 };
 
 const mutations = {
   clear(state) {
     state.players = [];
+    state.bluffs = [];
   },
   set(state, players = []) {
     state.players = players;
@@ -107,6 +110,24 @@ const mutations = {
   },
   move(state, [from, to]) {
     state.players.splice(to, 0, state.players.splice(from, 1)[0]);
+  },
+  setBluff(state, { index, role } = {}) {
+    if (index !== undefined) {
+      state.bluffs.splice(index, 1, role);
+    } else {
+      state.bluffs = [];
+    }
+  },
+  setFabled(state, { index, fabled } = {}) {
+    if (index !== undefined) {
+      state.fabled.splice(index, 1);
+    } else if (fabled) {
+      if (!Array.isArray(fabled)) {
+        state.fabled.push(fabled);
+      } else {
+        state.fabled = fabled;
+      }
+    }
   }
 };
 

src/store/persistence.js

@@ -91,13 +91,13 @@ module.exports = store => {
       case "setBluff":
         localStorage.setItem(
           "bluffs",
-          JSON.stringify(state.grimoire.bluffs.map(({ id }) => id))
+          JSON.stringify(state.players.bluffs.map(({ id }) => id))
         );
         break;
       case "setFabled":
         localStorage.setItem(
           "fabled",
-          JSON.stringify(state.grimoire.fabled.map(({ id }) => id))
+          JSON.stringify(state.players.fabled.map(({ id }) => id))
         );
         break;
       case "players/add":

src/store/socket.js

@@ -3,7 +3,8 @@ import rolesJSON from "../roles.json";
 class LiveSession {
   constructor(store) {
     //this._wss = "ws://localhost:8081/";
-    this._wss = "wss://baumgart.biz:8080/";
+    this._wss = "wss://live.clocktower.online:8080/";
+    this._wss = "wss://baumgart.biz:8080/"; //todo: delete this
     this._socket = null;
     this._isSpectator = true;
     this._gamestate = [];
@@ -305,7 +306,7 @@ class LiveSession {
    */
   sendFabled() {
     if (this._isSpectator) return;
-    const { fabled } = this._store.state.grimoire;
+    const { fabled } = this._store.state.players;
     this._send(
       "fabled",
       fabled.map(({ id }) => id)
@@ -319,7 +320,7 @@ class LiveSession {
    */
   _updateFabled(fabled) {
     if (!this._isSpectator) return;
-    this._store.commit("setFabled", {
+    this._store.commit("players/setFabled", {
       fabled: fabled.map(id => this._store.state.fabled.get(id))
     });
   }

src/vars.scss

@@ -1,3 +1,4 @@
+$fabled: #ffe91f;
 $townsfolk: #1f65ff;
 $outsider: #46d5ff;
 $minion: #ff6900;