This commit is contained in:
marlon-erler
2026-09-24 16:15:46 +02:00
parent 49da609b5a
commit e6e5b65778
2 changed files with 32 additions and 34 deletions
+31 -33
View File
@@ -1156,17 +1156,14 @@
function localeCompare(a, b) { function localeCompare(a, b) {
return a.localeCompare(b); return a.localeCompare(b);
} }
function implementPinchZoom(canvas) { function implementPinchZoom(canvas, data) {
let pinching = false; let pinching = false;
let dragging = false; let dragging = false;
let lastElement = void 0; let lastElement = void 0;
let initialDistance, currentZoom, initialZoom, currentX, currentY, initialX, initialY, initialTouchX, initialTouchY; let initialDistance, initialZoom, initialX, initialY, initialTouchX, initialTouchY;
function reset() { function reset() {
initialDistance = 0; initialDistance = 0;
currentZoom = 1;
initialZoom = 1; initialZoom = 1;
currentX = 0;
currentY = 0;
initialX = 0; initialX = 0;
initialY = 0; initialY = 0;
initialTouchX = 0; initialTouchX = 0;
@@ -1182,36 +1179,36 @@
); );
const point = (e, direction, i) => e.touches[i][direction == "x" ? "clientX" : "clientY"]; const point = (e, direction, i) => e.touches[i][direction == "x" ? "clientX" : "clientY"];
const midpoint = (e, direction) => (point(e, direction, 0) + point(e, direction, 1)) / 2; const midpoint = (e, direction) => (point(e, direction, 0) + point(e, direction, 1)) / 2;
function apply(factor, _offset) { function apply(zoom, _offset) {
if (zoom < MIN) return apply(MIN, _offset);
if (zoom > MAX) return apply(5, _offset);
let { x, y } = data.value;
if (_offset) [x, y] = _offset;
data.value = {
zoom,
x,
y
};
}
data.subscribe((data2) => {
const el = element(); const el = element();
if (!el) return; if (!el) return;
if (factor < MIN) return apply(MIN, _offset); el.style.transform = `scale(${data2.zoom.toString()}) translate(${data2.x}px, ${data2.y}px)`;
if (factor > MAX) return apply(5, _offset); });
let x, y;
if (_offset) [x, y] = _offset;
else {
x = currentX;
y = currentY;
}
el.style.transform = `scale(${factor.toString()}) translate(${x}px, ${y}px)`;
currentX = x;
currentY = y;
currentZoom = factor;
}
canvas.addEventListener("wheel", (event) => { canvas.addEventListener("wheel", (event) => {
event.preventDefault(); event.preventDefault();
initialZoom = currentZoom; initialZoom = data.value.zoom;
initialX = currentX; initialX = data.value.x;
initialY = currentY; initialY = data.value.y;
apply(currentZoom - event.deltaY * 5e-3); apply(data.value.zoom - event.deltaY * 5e-3);
}); });
canvas.addEventListener("scroll", (event) => { canvas.addEventListener("scroll", (event) => {
event.preventDefault(); event.preventDefault();
}); });
canvas.addEventListener("mousedown", (event) => { canvas.addEventListener("mousedown", (event) => {
initialZoom = currentZoom; initialZoom = data.value.zoom;
initialX = currentX; initialX = data.value.x;
initialY = currentY; initialY = data.value.y;
initialTouchX = event.clientX; initialTouchX = event.clientX;
initialTouchY = event.clientY; initialTouchY = event.clientY;
dragging = true; dragging = true;
@@ -1221,7 +1218,7 @@
}); });
canvas.addEventListener("mousemove", (event) => { canvas.addEventListener("mousemove", (event) => {
if (!dragging) return; if (!dragging) return;
apply(currentZoom, [ apply(data.value.zoom, [
initialX + (event.clientX - initialTouchX) / initialZoom, initialX + (event.clientX - initialTouchX) / initialZoom,
initialY + (event.clientY - initialTouchY) / initialZoom initialY + (event.clientY - initialTouchY) / initialZoom
]); ]);
@@ -1232,9 +1229,9 @@
if (!el) return; if (!el) return;
if (lastElement != void 0 && lastElement != el) reset(); if (lastElement != void 0 && lastElement != el) reset();
lastElement = el; lastElement = el;
initialZoom = currentZoom; initialZoom = data.value.zoom;
initialX = currentX; initialX = data.value.x;
initialY = currentY; initialY = data.value.y;
if (event.touches.length != 2) { if (event.touches.length != 2) {
pinching = false; pinching = false;
initialTouchX = event.touches[0].clientX; initialTouchX = event.touches[0].clientX;
@@ -1248,7 +1245,7 @@
}); });
canvas.addEventListener("touchmove", (event) => { canvas.addEventListener("touchmove", (event) => {
if (!pinching) { if (!pinching) {
apply(currentZoom, [ apply(data.value.zoom, [
initialX + (event.touches[0].clientX - initialTouchX) / initialZoom, initialX + (event.touches[0].clientX - initialTouchX) / initialZoom,
initialY + (event.touches[0].clientY - initialTouchY) / initialZoom initialY + (event.touches[0].clientY - initialTouchY) / initialZoom
]); ]);
@@ -1317,7 +1314,7 @@
this.connectionModel = connectionModel2; this.connectionModel = connectionModel2;
this.chatListModel = chatListModel2; this.chatListModel = chatListModel2;
this.fileTransferModel = fileTransferModel2; this.fileTransferModel = fileTransferModel2;
this.BUILD = "Build 26.09.24.C"; this.BUILD = "Build 26.09.24.D";
// CONTEXT // CONTEXT
this.contextStack = /* @__PURE__ */ new Map(); this.contextStack = /* @__PURE__ */ new Map();
this.closeContext = (contextId, fromHistoryEvent = false) => { this.closeContext = (contextId, fromHistoryEvent = false) => {
@@ -3153,6 +3150,7 @@
this.isPresentingFilterModal = new State(false); this.isPresentingFilterModal = new State(false);
this.searchSuggestions = new ListState(); this.searchSuggestions = new ListState();
this.filteredTaskViewModels = new ListState(); this.filteredTaskViewModels = new ListState();
this.pinchToZoomData = new State({ zoom: 1, x: 0, y: 0 });
// paths // paths
this.getBasePath = () => { this.getBasePath = () => {
return [ return [
@@ -5879,7 +5877,7 @@
}) })
); );
const wrapper = /* @__PURE__ */ createElement("div", { class: "content main-content", "children:set": pages }); const wrapper = /* @__PURE__ */ createElement("div", { class: "content main-content", "children:set": pages });
implementPinchZoom(wrapper); implementPinchZoom(wrapper, boardViewModel.pinchToZoomData);
const taskSettingsModal = createProxyState( const taskSettingsModal = createProxyState(
[boardViewModel.selectedTaskViewModel], [boardViewModel.selectedTaskViewModel],
() => { () => {
+1 -1
View File
@@ -9,7 +9,7 @@ import ConnectionModel from "../../Model/Global/connectionModel";
import ChatListModel from "../../Model/Chat/chatListModel"; import ChatListModel from "../../Model/Chat/chatListModel";
export default class CoreViewModel { export default class CoreViewModel {
readonly BUILD = "Build 26.09.24.C"; readonly BUILD = "Build 26.09.24.D";
translations: Translations; translations: Translations;