73 lines
1.8 KiB
JavaScript
73 lines
1.8 KiB
JavaScript
// IIFE because paranoid
|
|
(() => {
|
|
let canvas_div = document.getElementById("canvasDiv")
|
|
|
|
keybinds["0"] = () => handle_zoom("in")
|
|
keybinds["9"] = () => handle_zoom("out")
|
|
|
|
const controls_table = document.getElementById("controlsTable").lastElementChild
|
|
controls_table.insertAdjacentHTML("beforeBegin",`
|
|
<tr>
|
|
<td>Zoom in/out</td>
|
|
<td><kbd>0</kbd>/<kbd>9</kbd>
|
|
</tr>
|
|
`)
|
|
|
|
const zoom_levels = [
|
|
0.5,
|
|
1,
|
|
2,
|
|
3,
|
|
6,
|
|
12
|
|
]
|
|
|
|
window.zoom_level = 1
|
|
|
|
function handle_zoom(direction){
|
|
switch (direction){
|
|
case "in":
|
|
if (!(zoom_level+1 in zoom_levels)) { break; }
|
|
window.zoom_level += 1
|
|
break;
|
|
case "out":
|
|
if (!(zoom_level-1 in zoom_levels)) { break; }
|
|
window.zoom_level -= 1
|
|
break;
|
|
}
|
|
|
|
logMessage(`${zoom_levels[zoom_level]}x`)
|
|
rescale()
|
|
}
|
|
|
|
function rescale(){
|
|
const scale = zoom_levels[zoom_level];
|
|
gameCanvas.style.transform = `scale(${scale})`
|
|
|
|
canvas_div.style.overflow = scale > 1 ? "scroll" : "unset"
|
|
}
|
|
|
|
// Redefine to give correct numbers when zoomed
|
|
window.getMousePos = (canvas, evt) => {
|
|
if (evt.touches) {
|
|
evt.preventDefault();
|
|
evt = evt.touches[0];
|
|
isMobile = true;
|
|
}
|
|
const rect = canvas.getBoundingClientRect();
|
|
|
|
let x = (evt.clientX - rect.left) / zoom_levels[window.zoom_level];
|
|
let y = (evt.clientY - rect.top) / zoom_levels[window.zoom_level];
|
|
|
|
x = Math.floor((x / canvas.clientWidth) * (width+1));
|
|
y = Math.floor((y / canvas.clientHeight) * (height+1));
|
|
|
|
return {x:x, y:y};
|
|
}
|
|
|
|
runAfterReset(() => {
|
|
window.zoom_level = 1
|
|
rescale()
|
|
})
|
|
})()
|