| @@ -17,7 +17,7 @@ let scale; | |||||
| document.addEventListener("DOMContentLoaded", e => { | document.addEventListener("DOMContentLoaded", e => { | ||||
| document.querySelector("#reset-button").addEventListener("click", reset); | document.querySelector("#reset-button").addEventListener("click", reset); | ||||
| document.querySelector("#load-button").addEventListener("click", e => { | document.querySelector("#load-button").addEventListener("click", e => { | ||||
| console.log("Trying to load..."); | console.log("Trying to load..."); | ||||
| const baseInput = document.querySelector("#base-url").value; | const baseInput = document.querySelector("#base-url").value; | ||||
| @@ -329,11 +329,10 @@ function setup() { | |||||
| const scaleH = availableHeight / baseImg.height; | const scaleH = availableHeight / baseImg.height; | ||||
| scale = Math.min(scaleW, scaleH); | scale = Math.min(scaleW, scaleH); | ||||
| const width = availableWidth * scale / scaleW; | |||||
| const height = availableHeight * scale / scaleH; | |||||
| width = Math.floor(availableWidth * scale / scaleW); | |||||
| height = Math.floor(availableHeight * scale / scaleH); | |||||
| [baseCtx, baseCtxResized, overlayCtx, overlayCtxResized].forEach(ctx => { | [baseCtx, baseCtxResized, overlayCtx, overlayCtxResized].forEach(ctx => { | ||||
| console.log(ctx.canvas) | |||||
| ctx.canvas.width = width; | ctx.canvas.width = width; | ||||
| ctx.canvas.height = height; | ctx.canvas.height = height; | ||||
| ctx.canvas.style.left = (availableWidth - width) / 2 + "px"; | ctx.canvas.style.left = (availableWidth - width) / 2 + "px"; | ||||