Added Script and Vote Systems

babel.config.js

@@ -1,3 +1,4 @@
 module.exports = {
   presets: ["@vue/cli-plugin-babel/preset"],
+  plugins: ["wildcard"],
 };

package.json

@@ -20,6 +20,7 @@
     "@vue/compiler-sfc": "^3.0.0",
     "@vue/eslint-config-prettier": "^6.0.0",
     "babel-eslint": "^10.1.0",
+    "babel-plugin-wildcard": "^6.0.0",
     "eslint": "^6.7.2",
     "eslint-plugin-prettier": "^3.3.1",
     "eslint-plugin-vue": "^7.0.0",

src/components/DiplomacyGame.vue

@@ -34,6 +34,33 @@
     <button class="end-game" @click="endGame">Выйти из игры</button>
   </div>
 
+  <modal v-if="isResolutionVisible" @closeModal="closeModalWindow">
+    <template #header>
+      <h2>Внесите резолюцию на голосование в ООН</h2>
+    </template>
+    <template #content>
+      <div class="resolutions-list">
+        <label
+          class="resolution-title"
+          v-for="(script, index) in Scripts"
+          :key="index"
+        >
+          <input type="radio" v-model="selectedResolution" :value="script" />
+          {{ script.optionName }}
+        </label>
+      </div>
+    </template>
+    <template #footer>
+      <button
+        v-if="selectedResolution"
+        class="modal-footer-button"
+        @click="initResolution"
+      >
+        Внести
+      </button>
+    </template>
+  </modal>
+
   <modal v-if="isModalVisible" @closeModal="closeModalWindow">
     <template #header>
       <h2>{{ modalObject.title }}</h2>
@@ -48,6 +75,9 @@
 import WorldMap from "./WorldMap";
 import GameData from "../assets/gameData";
 import WorldMapData from "../assets/worldRussiaCrimeaLow";
+import Country from "../models/Country";
+import Vote from "../models/Vote";
+import ScriptsCreator from "../models/ScriptsCreator";
 import Modal from "./Modal";
 
 export default {
@@ -61,9 +91,16 @@ export default {
       isIntro: true,
       intro: GameData.intro,
 
+      Countries: [],
+      Scripts: [],
+      Votes: [],
+
       stages: 9,
       currentStage: 1,
-      countries: WorldMapData.countries,
+      // countries: WorldMapData.countries,
+
+      isResolutionVisible: false,
+      selectedResolution: null,
 
       isModalVisible: false,
       modalObject: {
@@ -80,6 +117,9 @@ export default {
     },
     startGame() {
       this.isIntro = false;
+      WorldMapData.countries.forEach((countryData) => {
+        this.Countries.push(new Country(countryData));
+      });
     },
     endStage() {
       this.currentStage++;
@@ -88,13 +128,62 @@ export default {
       this.isIntro = true;
     },
     vote() {
-      let voteSum = 0;
-      this.countries.forEach((country) => {
-        if (country.scripts) {
-          voteSum += country.scripts[0];
-        }
+      const filteredScripts = this.Scripts.filter(
+        (script) => script.active == true
+      );
+      filteredScripts.forEach((script) => {
+        this.Votes.push(new Vote(this.Countries, script));
       });
-      console.log(voteSum);
+    },
+    chooseResolution() {
+      const scriptLauncher = new ScriptsCreator();
+      this.Scripts.push(scriptLauncher.createScript("bitcoin"));
+      this.Scripts.push(scriptLauncher.createScript("space"));
+      this.isResolutionVisible = true;
+    },
+    initResolution() {
+      this.selectedResolution.active = true;
+      console.log(this.selectedResolution.active);
+      const scriptIndex = this.Scripts.findIndex(
+        (script) => script.title === this.selectedResolution.title
+      );
+      this.Scripts.splice(scriptIndex, 1, this.selectedResolution);
+      this.Countries.forEach((country) =>
+        country.setActualScriptAtt(
+          this.selectedResolution.title,
+          this.selectedResolution.calculateCountryAtt(country)
+        )
+      );
+      this.selectedResolution = null;
+      this.isResolutionVisible = false;
+      this.vote();
+      let vm = this;
+      setTimeout(() => {
+        vm.voteResults();
+      }, 3000);
+    },
+    voteResults() {
+      const voteData = this.Votes.slice(-1)[0];
+      console.log(voteData);
+      let result = "";
+      if (voteData.ayes.length > voteData.nays.length) {
+        result = "Резолюция принята";
+      } else {
+        result = "Резолюиция не принята";
+      }
+      const resolution = this.Scripts.find(
+        (script) => script.title === voteData.resolution
+      );
+      let voteResults = `<h3>${resolution.optionName}</h3>
+      <div class="votes">
+      <p>За: <span>${voteData.ayes.length}</span></p>
+      <p>Против: <span>${voteData.nays.length}</span></p>
+      <p>Воздержалось: <span>${voteData.abstainers.length}</span></p>
+      </div>
+      <p>${result}</p>`;
+      this.modalObject.title = "Итоги голосования";
+      this.modalObject.body = voteResults;
+      this.isModalVisible = true;
     },
     closeModalWindow() {
       this.isModalVisible = false;
@@ -103,7 +192,8 @@ export default {
   watch: {
     currentStage(stage) {
       if (stage % 3 == 0) {
-        this.vote();
+        this.chooseResolution();
+        // this.vote();
       }
     },
   },
@@ -152,4 +242,14 @@ export default {
   background-color: orangered;
   border: 1px solid #fff;
 }
+.resolutions-list {
+  width: 60%;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+.resolution-title {
+  font-weight: 600;
+}
 </style>

src/models/Country.js

@@ -0,0 +1,33 @@
+export default class Country {
+  constructor(countryData) {
+    this.title = countryData.title;
+    this.description = "";
+    // this.attToRussia = countryData.attToRussia;
+    this.attToRussia = this.getRandom(10);
+    // this.initScriptsAtt = countryData.initScriptsAtt;
+    this.initScriptsAtt = [
+      { name: "bitcoin", value: this.getRandom(10) },
+      { name: "space", value: this.getRandom(10) },
+    ];
+    this.actualScriptsAtt = [];
+  }
+  getRandom(max) {
+    return Math.floor(Math.random() * max * 2) - max;
+  }
+  getInitScriptAtt(scriptName) {
+    const attitude = this.initScriptsAtt.find(
+      (attitude) => attitude.name === scriptName
+    );
+    return attitude.value;
+  }
+  setActualScriptAtt(scriptName, scriptValue) {
+    const attIndex = this.actualScriptsAtt.findIndex(
+      (attitude) => attitude.name === scriptName
+    );
+    if (attIndex != -1) {
+      this.actualScriptsAtt.splice(attIndex, 1, scriptValue);
+    } else {
+      this.actualScriptsAtt.push({ name: scriptName, value: scriptValue });
+    }
+  }
+}

src/models/ScriptsCreator.js

@@ -0,0 +1,17 @@
+import Bitcoin from "./scripts/Bitcoin";
+import Space from "./scripts/Space";
+
+export default class ScriptsCreator {
+  createScript(type) {
+    let script;
+    switch (type) {
+      case "bitcoin":
+        script = new Bitcoin();
+        break;
+      case "space":
+        script = new Space();
+        break;
+    }
+    return script;
+  }
+}

src/models/Vote.js

@@ -0,0 +1,28 @@
+export default class Vote {
+  constructor(countries, script) {
+    this.resolution = script.title;
+    this.ayes = [];
+    this.nays = [];
+    this.abstainers = [];
+    this.getVotes(countries, script);
+  }
+
+  getVotes(countries, script) {
+    countries.forEach((country) => {
+      const countryAttitude = country.actualScriptsAtt.find(
+        (attitude) => attitude.name === script.title
+      );
+      if (countryAttitude.value > 0) {
+        this.ayes.push(country.title);
+      } else if (countryAttitude.value < 0) {
+        this.nays.push(country.title);
+      } else {
+        this.abstainers.push(country.title);
+      }
+    });
+  }
+
+  countVotes(votes) {
+    return votes.length;
+  }
+}

src/models/scripts/Bitcoin.js

@@ -0,0 +1,12 @@
+export default class Bitcoin {
+  constructor() {
+    this.title = "bitcoin";
+    this.description = "";
+    this.optionName =
+      "Принять Bitcoin в качестве международной резервной валюты";
+    this.active = false;
+  }
+  calculateCountryAtt(country) {
+    return country.getInitScriptAtt(this.title) + country.attToRussia;
+  }
+}

src/models/scripts/Space.js

@@ -0,0 +1,26 @@
+export default class Space {
+  constructor() {
+    this.title = "space";
+    this.description = "";
+    this.optionName = "Запрет на конкуренцию в космосе";
+    this.active = false;
+  }
+  spaceDaybonus() {
+    const spaceDay = new Date(1961, 3, 12);
+    const isToday = () => {
+      const today = new Date();
+      return (
+        spaceDay.getDate() == today.getDate() &&
+        spaceDay.getMonth() == today.getMonth()
+      );
+    };
+    return isToday ? 5 : 0;
+  }
+  calculateCountryAtt(country) {
+    return (
+      country.getInitScriptAtt(this.title) +
+      country.attToRussia +
+      this.spaceDaybonus()
+    );
+  }
+}