From eb460fbb161e76052b7bdd2c57afc65e2e99bc2e Mon Sep 17 00:00:00 2001 From: niliara-edu Date: Thu, 12 Dec 2024 13:51:59 +0100 Subject: place pieces --- src/engine/visual/placeOnBoard.js | 61 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 src/engine/visual/placeOnBoard.js (limited to 'src/engine/visual/placeOnBoard.js') 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 +} -- cgit v1.2.3