From a1b45f4c9f254fad73af06b4123b7208247bbba4 Mon Sep 17 00:00:00 2001 From: Benjamin Auder <benjamin.auder@somewhere> Date: Wed, 1 Jun 2022 20:52:06 +0200 Subject: [PATCH] Fix rescale() instability. TODO: hex rotation vertical board --- base_rules.js | 5 +++-- variants/Hex/class.js | 12 ++++++------ 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/base_rules.js b/base_rules.js index 33411f0..3117506 100644 --- a/base_rules.js +++ b/base_rules.js @@ -787,9 +787,10 @@ export default class ChessRules { if (newHeight > window.innerHeight) newHeight = window.innerHeight; const newRatio = newWidth / newHeight; - if (newRatio > self.size.ratio) + const epsilon = 1e-4; //arbitrary small value to avoid instabilities + if (newRatio - self.size.ratio > epsilon) newWidth = newHeight * self.size.ratio; - else if (newRatio < self.size.ratio) + else if (newRatio - self.size.ratio < -epsilon) newHeight = newWidth / self.size.ratio; chessboard.style.width = newWidth + "px"; chessboard.style.height = newHeight + "px"; diff --git a/variants/Hex/class.js b/variants/Hex/class.js index 37bd53c..ab634b8 100644 --- a/variants/Hex/class.js +++ b/variants/Hex/class.js @@ -78,14 +78,14 @@ export default class HexRules extends ChessRules { return (emptyCount + "/").repeat(this.size.x).slice(0, -1) + " w 0"; } - // TODO: re-enable rotation + // TODO: enable vertical board (rotate?) getSvgChessboard() { // NOTE: with small margin seems nicer let width = 173.2 * this.size.y + 173.2 * (this.size.y-1) / 2 + 30, height = 50 + Math.floor(150 * this.size.x) + 30, min_x = -86.6 - 15, min_y = -100 - 15; -// if (this.size.rotate) { +// if (this.size.ratio < 1) { // [width, height] = [height, width]; // [min_x, min_y] = [min_y, min_x]; // } @@ -93,7 +93,7 @@ export default class HexRules extends ChessRules { <svg viewBox="${min_x} ${min_y} ${width} ${height}" class="chessboard_SVG"`; -// if (this.size.rotate) +// if (this.size.ratio < 1) // board += ` transform="rotate(90 ${min_x} ${min_y})"` board += `> <defs> @@ -177,14 +177,14 @@ export default class HexRules extends ChessRules { document.addEventListener("touchstart", mousedown, {passive: false}); } + // TODO: enable rotation get size() { const baseRatio = 1.619191; // 2801.2 / 1730, "widescreen" - const rotate = window.innerWidth < window.innerHeight; //"vertical screen" + const rotate = false; //window.innerWidth < window.innerHeight; //"vertical screen" return { x: this.options["bsize"], y: this.options["bsize"], - ratio: rotate ? 1 / baseRatio : baseRatio, - rotate: rotate + ratio: (rotate ? 1 / baseRatio : baseRatio) }; } -- 2.44.0