import { Tool } from '../tool.js'; import { ZOOM_IN_FACTOR, ZOOM_OUT_FACTOR, } from '../config.js'; export class Zoom extends Tool { constructor(toolbar) { super(toolbar); const zoomOut = document.createElement('button'); const zoomIn = document.createElement('button'); const zoomAll = document.createElement('button'); this.div.appendChild(zoomOut); this.div.appendChild(zoomIn); this.div.appendChild(document.createElement('br')); this.div.appendChild(zoomAll); this.div.appendChild(document.createElement('br')); zoomAll.classList.add('wide'); zoomOut.innerHTML = '

Zoom
Out

'; zoomIn.innerHTML = '

Zoom
In

'; zoomAll.innerHTML = '

Zoom to Fit

'; zoomOut.addEventListener('click', () => { // Aim at center of view const x = this.sim.display.width * this.sim.display.scale / 2; const y = this.sim.display.height * this.sim.display.scale / 2; this.sim.scheduleZoom(this.sim.screenToSim(x, y), ZOOM_OUT_FACTOR); }); zoomIn.addEventListener('click', () => { // Aim at center of view const x = this.sim.display.width * this.sim.display.scale / 2; const y = this.sim.display.height * this.sim.display.scale / 2; this.sim.scheduleZoom(this.sim.screenToSim(x, y), ZOOM_IN_FACTOR); }); zoomAll.addEventListener('click', () => { // Determine bounding box const box = this.sim.objects.boundingBox; const x = (box.start.x + box.end.x) / 2; const y = (box.start.y + box.end.y) / 2; if (box.start.x !== box.end.x && box.start.y !== box.end.y) { const widthRatio = Math.abs(box.start.x - box.end.x) / this.sim.display.width; const heightRatio = Math.abs(box.start.y - box.end.y) / this.sim.display.height; const biggerRatio = Math.max(widthRatio, heightRatio); const base2factor = Math.log(1/biggerRatio) / Math.log(2); const factor = Math.floor(base2factor) - 1; console.log({biggerRatio, base2factor, factor}); this.sim.scheduleZoom({x, y}, factor); } }); } }