hopefully fix chrome, and handle resizes

This commit is contained in:
Ruben van de Ven 2022-01-19 13:32:06 +01:00
parent e831066297
commit a83b05daaa
2 changed files with 13 additions and 3 deletions

View file

@ -59,10 +59,13 @@
width: 100%;
margin: 0;
font-family: sans-serif;
/* prevent reload on scroll in chrome */
position: fixed;
overscroll-behavior: contain;
overflow-y: hidden;
/* prevent capture of poienter event: https://stackoverflow.com/a/48254578 */
touch-action: none;
}
#interface {

View file

@ -24,7 +24,7 @@ class Canvas {
this.resize();
window.addEventListener('resize', this.requestResize);
window.addEventListener('resize', (ev) => this.requestResize());
this.paths = [];
@ -38,6 +38,8 @@ class Canvas {
this.isMoving = false;
document.body.addEventListener('pointermove', (ev) => {
ev.stopPropagation();
ev.preventDefault();
if (ev.pointerType == "touch" || ev.buttons & 4) { // 4: middle mouse button
this.moveCanvas(ev);
} else { // pointerType == pen or mouse
@ -45,6 +47,8 @@ class Canvas {
}
});
document.body.addEventListener('pointerup', (ev) => {
ev.stopPropagation();
ev.preventDefault();
if (ev.pointerType == "touch" || ev.buttons & 4 || this.isMoving) { // buttons is 0 on pointerup
this.endMoveCanvas(ev);
this.isMoving = false;
@ -53,6 +57,8 @@ class Canvas {
}
});
this.svgEl.addEventListener('pointerdown', (ev) => {
ev.stopPropagation();
ev.preventDefault();
if (ev.pointerType == "touch" || ev.buttons & 4) { // 4: middle mouse button
this.isMoving = true;
this.startMoveCanvas(ev);
@ -185,7 +191,8 @@ class Canvas {
}
requestResize() {
alert('Resize not implemented yet. Please reloade the page');
this.resize();
// alert('Resize not implemented yet. Please reloade the page');
}