para/puzzle
1
1
Fork 0
Code Issues 8 Pull requests Releases Wiki Activity

zoom to mouse instead of screen center

Browse source
This commit is contained in:
Zutatensuppe 2021-04-15 10:01:27 +02:00
parent 43db4daa11
commit 38bef17010
2 changed files with 22 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

23
game/Camera.js
View file

@ -28,27 +28,32 @@ export default class Camera {
this.y += y / this.zoom this.y += y / this.zoom
} }
setZoom(newzoom) { setZoom(newzoom, centerCoordViewport) {
const zoom = Math.min(Math.max(newzoom, this.minZoom), this.maxZoom) const zoom = Math.min(Math.max(newzoom, this.minZoom), this.maxZoom)
if (zoom == this.zoom) { if (zoom == this.zoom) {
return false return false
} }
// centered zoom const zoomToCoord = center || {
// TODO: mouse-centered-zoom x: this.width / 2,
this.x -= Math.round(((this.width / this.zoom) - (this.width / zoom)) / 2) y: this.height / 2
this.y -= Math.round(((this.height / this.zoom) - (this.height / zoom)) / 2) }
const zoomFactor = (1 / this.zoom) - (1 / zoom)
this.x -= Math.round(zoomToCoord.x * zoomFactor)
this.y -= Math.round(zoomToCoord.y * zoomFactor)
this.zoom = zoom this.zoom = zoom
return true return true
} }
zoomOut() { zoomOut(centerCoordViewport) {
return this.setZoom(this.zoom - this.zoomStep * this.zoom) return this.setZoom(this.zoom - this.zoomStep * this.zoom, centerCoordViewport)
} }
zoomIn() { zoomIn(centerCoordViewport) {
return this.setZoom(this.zoom + this.zoomStep * this.zoom) return this.setZoom(this.zoom + this.zoomStep * this.zoom, centerCoordViewport)
} }
/** /**

14
game/game.js
View file

@ -564,14 +564,14 @@ async function main() {
} else if (type === Protocol.INPUT_EV_MOUSE_UP) { } else if (type === Protocol.INPUT_EV_MOUSE_UP) {
_last_mouse_down = null _last_mouse_down = null
} else if (type === Protocol.INPUT_EV_ZOOM_IN) { } else if (type === Protocol.INPUT_EV_ZOOM_IN) {
if (viewport.zoomIn()) { const pos = { x: evt[1], y: evt[2] }
const pos = { x: evt[1], y: evt[2] } if (viewport.zoomIn(viewport.worldToViewport(pos))) {
RERENDER = true RERENDER = true
Game.changePlayer(gameId, CLIENT_ID, pos) Game.changePlayer(gameId, CLIENT_ID, pos)
} }
} else if (type === Protocol.INPUT_EV_ZOOM_OUT) { } else if (type === Protocol.INPUT_EV_ZOOM_OUT) {
if (viewport.zoomOut()) { const pos = { x: evt[1], y: evt[2] }
const pos = { x: evt[1], y: evt[2] } if (viewport.zoomOut(viewport.worldToViewport(pos))) {
RERENDER = true RERENDER = true
Game.changePlayer(gameId, CLIENT_ID, pos) Game.changePlayer(gameId, CLIENT_ID, pos)
} }
@ -607,10 +607,12 @@ async function main() {
} else if (type === Protocol.INPUT_EV_MOUSE_UP) { } else if (type === Protocol.INPUT_EV_MOUSE_UP) {
_last_mouse_down = null _last_mouse_down = null
} else if (type === Protocol.INPUT_EV_ZOOM_IN) { } else if (type === Protocol.INPUT_EV_ZOOM_IN) {
viewport.zoomIn() const pos = { x: evt[1], y: evt[2] }
viewport.zoomIn(viewport.worldToViewport(pos))
RERENDER = true RERENDER = true
} else if (type === Protocol.INPUT_EV_ZOOM_OUT) { } else if (type === Protocol.INPUT_EV_ZOOM_OUT) {
viewport.zoomOut() const pos = { x: evt[1], y: evt[2] }
viewport.zoomOut(viewport.worldToViewport(pos))
RERENDER = true RERENDER = true
} }
} }