2022-06-20 00:18:47 +00:00
|
|
|
import {game} from "../game/game.js"
|
|
|
|
|
2022-06-19 21:54:34 +00:00
|
|
|
export var canvas = document.getElementById('canvas');
|
|
|
|
export var ctx = canvas.getContext('2d');
|
2022-06-23 00:16:57 +00:00
|
|
|
export var wrapper = document.getElementById('game');
|
|
|
|
export var rightBar = document.getElementById('rightBar');
|
|
|
|
export var leftBar = document.getElementById('leftBar');
|
|
|
|
canvas.width = game.tileSize*game.gridSize[0];
|
|
|
|
canvas.height = game.tileSize*game.gridSize[1];
|
|
|
|
scaleEverythingGood()
|
2022-06-20 00:18:47 +00:00
|
|
|
|
2022-06-23 00:16:57 +00:00
|
|
|
window.addEventListener('resize', scaleEverythingGood);
|
|
|
|
|
|
|
|
function scaleEverythingGood() {
|
|
|
|
const width = window.innerWidth-2;
|
|
|
|
const height = window.innerHeight-2;
|
|
|
|
let canvasWidth
|
|
|
|
if (canvas.width > canvas.height) {
|
|
|
|
canvasWidth = Math.max(width, height)
|
|
|
|
} else {
|
|
|
|
canvasWidth = width
|
|
|
|
}
|
|
|
|
canvasWidth = canvasWidth/4
|
|
|
|
canvas.style.width = `${canvasWidth}px`;
|
|
|
|
rightBar.style.width = `${canvasWidth}px`
|
|
|
|
leftBar.style.width = `${canvasWidth/2}px`
|
|
|
|
const wrapperWidth = rightBar.style.width + leftBar.style.width;
|
|
|
|
wrapper.style.width = `${wrapperWidth}px`
|
|
|
|
wrapper.style.height = `${height}px`
|
|
|
|
}
|