4 files changed, 102 insertions, 50 deletions
diff --git a/src/engine/turns.js b/src/engine/turns.js
new file mode 100644
index 0000000..7026dcc
--- /dev/null
+++ b/src/engine/turns.js
@@ -0,0 +1,35 @@
+import { board } from "../board.js"
+import { Vector2 } from "../engine/visual/vector2.js"
+import { Link } from "../link.js"
+import { PLAYER } from "../constants.js"
+
+export let turn = ""
+
+export function nextTurn() {
+    turn = turn == PLAYER.BLACK ? PLAYER.WHITE : PLAYER.BLACK
+    placeLinks()
+}
+
+function placeLinks() {
+    resetLink()
+    board.links = [...Array(board.size)].map(_ => Array(board.size))
+    for (let row = 0; row < board.size; row++) {
+        for (let col = 0; col < board.size; col++) {
+            tryLink(new Vector2(row, col))
+        }
+    }
+}
+
+function resetLink() {
+    Array.from(board.links).forEach(x => {
+        Array.from(x).filter((x) => x !== undefined).map(y => {
+            y.removeLink()
+        })
+    })
+}
+
+function tryLink(position) {
+    new Link({
+        position: position,
+    })
+}
diff --git a/src/engine/visual.js b/src/engine/visual.js
deleted file mode 100644
index a2fab0a..0000000
--- a/src/engine/visual.js
+++ /dev/null
@@ -1,50 +0,0 @@
-import { board } from "../board.js"
-
-const HEAD_TOP_VW = 20
-const HEAD_TOP_VH = 20
-
-const MEDIA_LISTENER = window.matchMedia("(max-width: 600px)")
-
-MEDIA_LISTENER.addEventListener("change", function() {
-    Array.from(board.stones).forEach(x => {
-        Array.from(x).map(y => {
-            if (y != null) {
-                y.update(MEDIA_LISTENER)
-            }
-        })
-    })
-});
-
-const PLACE_VALUES = {
-    size: 54,
-    size_mob: 72,
-}
-
-
-export function placeOnBoard({
-    position = new Vector2(0, 0),
-    board_size = 9,
-}) {
-    let response = {}
-    if (MEDIA_LISTENER.matches) {
-        let size = PLACE_VALUES.size_mob / board_size
-        response["left"] = `calc(50% + ${position.x * (80 / (board_size - 1)) - size / 2 - 40}vw)`
-        response["top"] = `calc(${30 + 5 + position.y * (80 / (board_size - 1)) - size / 2 - HEAD_TOP_VW}vw + ${HEAD_TOP_VH}vh)`
-        response["width"] = `${size}vw`
-    } else {
-        let size = PLACE_VALUES.size / board_size
-        response["left"] = `calc(50% - 30vh + ${position.x * (60 / (board_size - 1)) - 54 / board_size / 2}vh)`
-        response["top"] = `${14 + 5 + position.y * (60 / (board_size - 1)) - size / 2}vh`
-        response["width"] = `${size}vh`
-    }
-
-    return response
-}
-
-
-export class Vector2 {
-    constructor(x, y) {
-        this.x = x
-        this.y = y
-    }
-}
diff --git a/src/engine/visual/placeOnBoard.js b/src/engine/visual/placeOnBoard.js
new file mode 100644
index 0000000..cee2969
--- /dev/null
+++ b/src/engine/visual/placeOnBoard.js
@@ -0,0 +1,61 @@
+import { board } from "../../board.js"
+
+const HEAD_TOP_VW = 20
+const HEAD_TOP_VH = 20
+
+const MEDIA_LISTENER = window.matchMedia("(max-width: 600px)")
+
+MEDIA_LISTENER.addEventListener("change", function() {
+    Array.from(board.stones).forEach(x => {
+        Array.from(x).filter((x) => x !== undefined).map(y => {
+            y.update(MEDIA_LISTENER)
+        })
+    })
+
+    Array.from(board.links).forEach(x => {
+        Array.from(x).filter((x) => x !== undefined).map(y => {
+            y.update(MEDIA_LISTENER)
+        })
+    })
+});
+
+const PLACE_VALUES = {
+    stone: {
+        size: 54,
+        size_mob: 72,
+    },
+    link: {
+        size: 69,
+        size_mob: 92,
+    }
+}
+
+
+export function placeOnBoard({
+    position = new Vector2(0, 0),
+    board_size = 9,
+    use_real_size = false,
+}) {
+    let response = {}
+    if (MEDIA_LISTENER.matches) {
+        let totalSize = (
+            use_real_size ?
+                PLACE_VALUES.link.size_mob : PLACE_VALUES.stone.size_mob
+        )
+        let size = totalSize / board_size
+        response["left"] = `calc(50% + ${position.x * (80 / (board_size - 1)) - size / 2 - 40}vw)`
+        response["top"] = `calc(${30 + 5 + position.y * (80 / (board_size - 1)) - size / 2 - HEAD_TOP_VW}vw + ${HEAD_TOP_VH}vh)`
+        response["size"] = `${size}vw`
+    } else {
+        let totalSize = (
+            use_real_size ?
+                PLACE_VALUES.link.size : PLACE_VALUES.stone.size
+        )
+        let size = totalSize / board_size
+        response["left"] = `calc(50% - 30vh + ${position.x * (60 / (board_size - 1)) - totalSize / board_size / 2}vh)`
+        response["top"] = `${14 + 5 + position.y * (60 / (board_size - 1)) - size / 2}vh`
+        response["size"] = `${size}vh`
+    }
+
+    return response
+}
diff --git a/src/engine/visual/vector2.js b/src/engine/visual/vector2.js
new file mode 100644
index 0000000..a3a1bc2
--- /dev/null
+++ b/src/engine/visual/vector2.js
@@ -0,0 +1,6 @@
+export class Vector2 {
+    constructor(x, y) {
+        this.x = x
+        this.y = y
+    }
+}