Add mouse3 panning to the editor
This commit is contained in:
parent
7c9bc92627
commit
6bfb5f7896
22
js/main.js
22
js/main.js
@ -761,9 +761,14 @@ class Editor extends PrimaryView {
|
||||
// Level canvas and mouse handling
|
||||
this.root.querySelector('.level').append(this.renderer.canvas);
|
||||
this.mouse_mode = null;
|
||||
this.mouse_button = null;
|
||||
this.mouse_cell = null;
|
||||
this.renderer.canvas.addEventListener('mousedown', ev => {
|
||||
if (ev.button === 0) {
|
||||
// Left button: draw
|
||||
this.mouse_mode = 'draw';
|
||||
this.mouse_button = ev.button;
|
||||
this.mouse_coords = [ev.clientX, ev.clientY];
|
||||
|
||||
let [x, y] = this.renderer.cell_coords_from_event(ev);
|
||||
this.mouse_cell = [x, y];
|
||||
@ -791,12 +796,20 @@ class Editor extends PrimaryView {
|
||||
}
|
||||
}
|
||||
this.renderer.draw();
|
||||
}
|
||||
else if (ev.button === 1) {
|
||||
// Middle button: pan
|
||||
this.mouse_mode = 'pan';
|
||||
this.mouse_button = ev.button;
|
||||
this.mouse_coords = [ev.clientX, ev.clientY];
|
||||
ev.preventDefault();
|
||||
}
|
||||
});
|
||||
this.renderer.canvas.addEventListener('mousemove', ev => {
|
||||
if (this.mouse_mode === null)
|
||||
return;
|
||||
// TODO check for the specific button we're holding
|
||||
if (ev.buttons === 0) {
|
||||
if ((ev.buttons & (2 << this.mouse_button)) === 0) {
|
||||
this.mouse_mode = null;
|
||||
return;
|
||||
}
|
||||
@ -871,6 +884,13 @@ class Editor extends PrimaryView {
|
||||
|
||||
this.mouse_cell = [x, y];
|
||||
}
|
||||
else if (this.mouse_mode === 'pan') {
|
||||
let dx = ev.clientX - this.mouse_coords[0];
|
||||
let dy = ev.clientY - this.mouse_coords[1];
|
||||
this.renderer.canvas.parentNode.scrollLeft -= dx;
|
||||
this.renderer.canvas.parentNode.scrollTop -= dy;
|
||||
this.mouse_coords = [ev.clientX, ev.clientY];
|
||||
}
|
||||
});
|
||||
this.renderer.canvas.addEventListener('mouseup', ev => {
|
||||
this.mouse_mode = null;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user