board module

src/stores/index.js

@@ -1,4 +1,5 @@
 import { defineStore } from "pinia";
+import { Board } from "../modules/board.js";
 
 export const globalStore = defineStore("globalStore", {
   state: () => {
@@ -21,19 +22,12 @@ export const globalStore = defineStore("globalStore", {
         name: "Conway's Game of Life",
         description: "The most popular 2d automata",
       },
-      cellProperties: {
-        size: 3,
-        liveColor: "#000000",
-        deadColor: "#F5F5F5",
-      },
       canvasWidth: 0,
       canvasHeight: 0,
-      boardWidth: 0,
-      boardHeight: 0,
       refreshRate: 300,
       initial1dState: "onecell",
       drawingDirection: "y",
-      lastBoard: null,
+      board: new Board(),
       draw1d: false,
       draw2d: false,
       draw2dLast: false,
@@ -49,13 +43,27 @@ export const globalStore = defineStore("globalStore", {
   },
   actions: {
     setBoardWidth() {
-      this.boardWidth = Math.floor(this.canvasWidth / this.cellProperties.size);
+      this.board.width = Math.floor(
+        this.canvasWidth / this.board.cellProperties.size
+      );
     },
     setBoardHeight() {
-      this.boardHeight = Math.floor(
-        this.canvasHeight / this.cellProperties.size
+      this.board.height = Math.floor(
+        this.canvasHeight / this.board.cellProperties.size
       );
     },
+    setCellProperties(name, value) {
+      this.board.cellProperties[name] = value;
+    },
+    switchColor() {
+      [
+        this.board.cellProperties["liveColor"],
+        this.board.cellProperties["deadColor"],
+      ] = [
+        this.board.cellProperties["deadColor"],
+        this.board.cellProperties["liveColor"],
+      ];
+    },
     toggleDraw1d() {
       this.setActiveSubMenu("");
       this.setMainMenu(false);