josh/lifeEngine
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed zoomout

Browse Source
This commit is contained in:
Max Robinson
2021-01-13 16:01:46 -07:00
parent c79c3e54e5
commit b906d14c91
2 changed files with 19 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
dist/js/bundle.js vendored
View File

File diff suppressed because one or more lines are too long

31
src/Controllers/EnvironmentController.js
View File

@@ -3,7 +3,6 @@ const Organism = require('../Organism/Organism');
const Modes = require("./ControlModes"); const Modes = require("./ControlModes");
const CellStates = require("../Organism/Cell/CellStates"); const CellStates = require("../Organism/Cell/CellStates");
const Neighbors = require("../Grid/Neighbors"); const Neighbors = require("../Grid/Neighbors");
const Cell = require("../Organism/Cell/GridCell");
class EnvironmentController extends CanvasController{ class EnvironmentController extends CanvasController{
constructor(env, canvas) { constructor(env, canvas) {
@@ -21,24 +20,32 @@ class EnvironmentController extends CanvasController{
el.onwheel = function zoom(event) { el.onwheel = function zoom(event) {
event.preventDefault(); event.preventDefault();
var sign = -1*Math.sign(event.deltaY); var sign = -Math.sign(event.deltaY);
var cur_top = parseInt($('#env-canvas').css('top'));
var cur_left = parseInt($('#env-canvas').css('left'));
var diff_x = ((-cur_left/this.scale+this.canvas.width/2) - this.mouse_x)*this.scale/2*sign;
var diff_y = ((-cur_top/this.scale+this.canvas.height/2) - this.mouse_y)*this.scale/2*sign;
$('#env-canvas').css('top', (cur_top+diff_y)+'px');
$('#env-canvas').css('left', (cur_left+diff_x)+'px');
// Restrict scale // Restrict scale
scale = Math.max(0.5, this.scale+(sign*zoom_speed)); scale = Math.max(0.5, this.scale+(sign*zoom_speed));
if (scale != 0.5) {
var cur_top = parseInt($('#env-canvas').css('top'));
var cur_left = parseInt($('#env-canvas').css('left'));
if (sign == 1) {
// If we're zooming in, zoom towards wherever the mouse is
var diff_x = ((this.canvas.width/2-cur_left/this.scale) - this.mouse_x)*this.scale/1.5;
var diff_y = ((this.canvas.height/2-cur_top/this.scale) - this.mouse_y)*this.scale/1.5;
}
else {
// If we're zooming out, zoom out towards the center
var diff_x = -cur_left/scale;
var diff_y = -cur_top/scale;
}
$('#env-canvas').css('top', (cur_top+diff_y)+'px');
$('#env-canvas').css('left', (cur_left+diff_x)+'px');
}
// Apply scale transform // Apply scale transform
el.style.transform = `scale(${scale})`; el.style.transform = `scale(${scale})`;
this.scale = scale; this.scale = scale;
}.bind(this); }.bind(this);
} }
@@ -56,8 +63,6 @@ class EnvironmentController extends CanvasController{
mouseMove() { mouseMove() {
this.performModeAction(); this.performModeAction();
var cur_top = parseInt($('#env-canvas').css('top'))/this.scale;
var cur_left = parseInt($('#env-canvas').css('left'))/this.scale;
} }
mouseDown() { mouseDown() {