pabloid
/
tsgames
1
0
Fork 0
Code

Nice zoom

This commit is contained in:
Pabloader 2024-06-25 22:25:55 +00:00
parent e5a1f361ed
commit 0f7304851e
2 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/game.ts
View File

@ -33,12 +33,15 @@ export default class Game {
private onScroll = (event: WheelEvent) => {
const direction = event.deltaY / Math.abs(event.deltaY);
let scale = 1;
if (direction < 0) {
this.graphics.scale /= 1.1;
scale = 1.1;
} else if (direction > 0) {
this.graphics.scale *= 1.1;
scale = 1/ 1.1;
}
this.graphics.applyScale(scale, [event.clientX, event.clientY]);
event.preventDefault();
}

16
src/graphics.ts
View File

@ -21,16 +21,16 @@ export default class Graphics {
return [this.canvas.width, this.canvas.height];
}
get scale() {
return 1.0 / this.tileSize;
}
applyScale(scale: number, point: Point) {
const newTileSize = Math.min(Math.max(this.tileSize * scale, 2), this.width / 2, this.height / 2);
const realScale = newTileSize / this.tileSize;
this.tileSize = newTileSize;
set scale(value) {
this.tileSize = Math.min(Math.max(1.0 / value, 2), this.width / 2, this.height / 2);
this.offset = exp`((${this.offset} - ${point}) * ${realScale}) + ${point}`;
}
pan(amount: Point) {
this.offset = exp`${this.offset} + ${amount} / ${this.tileSize}`;
this.offset = exp`${this.offset} + ${amount}`;
}
clear() {
@ -71,10 +71,10 @@ export default class Graphics {
}
worldToScreen(point: Point): Point {
return exp`(${point} + ${this.offset}) * ${this.tileSize} + ${this.size} / ${2}`;
return exp`${point} * ${this.tileSize} + ${this.offset}`;
}
screenToWorld(point: Point): Point {
return exp`(${point} - ${this.size} / ${2}) / ${this.tileSize} - ${this.offset}`;
return exp`(${point} - ${this.offset}) / ${this.tileSize}`;
}
}