From: Benjamin Auder Date: Wed, 14 Apr 2021 17:45:01 +0000 (+0200) Subject: Better board size auto-adjust. Still far from perfect X-Git-Url: https://git.auder.net/%7B%7B%20asset%28%27mixstore/images/css/img/%24%7BgetWhatsApp%28link%29%7D?a=commitdiff_plain;h=4665d3c6b2d9a7d1f1254690e63531a45f2305a4;p=vchess.git Better board size auto-adjust. Still far from perfect --- diff --git a/client/src/components/MoveList.vue b/client/src/components/MoveList.vue index 290897c0..26c54719 100644 --- a/client/src/components/MoveList.vue +++ b/client/src/components/MoveList.vue @@ -81,7 +81,7 @@ export default { // Take full width on small screens: let boardSize = window.innerWidth >= 768 - ? 0.75 * Math.min(window.innerWidth, window.innerHeight) + ? 0.7 * Math.min(window.innerWidth, window.innerHeight) : window.innerWidth; const movesWidth = window.innerWidth >= 768 ? 280 : 0; document.getElementById("boardContainer").style.width = boardSize + "px"; @@ -89,10 +89,12 @@ export default { gameContainer.style.width = boardSize + movesWidth + "px"; document.getElementById("boardSize").value = (boardSize * 100) / (window.innerWidth - movesWidth); - window.addEventListener("resize", this.adjustBoard); - // TODO: find sometjhing better than next height adjustment... - // maybe each variant could give its ratio (?!) - setTimeout( () => { this.adjustBoard("vertical"); }, 1000); + window.addEventListener("resize", () => this.adjustBoard()); + if ("ontouchstart" in window) { + // TODO: find something better than next height adjustment... + // maybe each variant could give its ratio (?!) + setTimeout( () => { this.adjustBoard("vertical"); }, 1000); + } }, beforeDestroy: function() { window.removeEventListener("resize", this.adjustBoard);