gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-11 08:58:58 +01:00
Code Issues Actions 11 Packages Projects Releases Wiki Activity

chore(type_widgets): bring back relation map zoom controls

Browse Source
This commit is contained in:
Elian Doran 2025-09-29 20:16:45 +03:00
parent 2cd3e3f9c8
commit 3571023685
No known key found for this signature in database
2 changed files with 20 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
apps/client/src/widgets/type_widgets/RelationMap.tsx
View File

@ -1,7 +1,7 @@
import { useCallback, useEffect, useRef, useState } from "preact/hooks";
import { TypeWidgetProps } from "./type_widget";
import { Defaults, jsPlumb, jsPlumbInstance, OverlaySpec } from "jsplumb";
import { useEditorSpacedUpdate, useNoteBlob, useTriliumEvent } from "../react/hooks";
import { useEditorSpacedUpdate, useNoteBlob, useTriliumEvent, useTriliumEvents } from "../react/hooks";
import FNote from "../../entities/fnote";
import { ComponentChildren, RefObject } from "preact";
import froca from "../../services/froca";
@ -106,6 +106,7 @@ export default function RelationMap({ note, ntxId }: TypeWidgetProps) {
});
usePanZoom({
ntxId,
containerRef,
options: {
maxZoom: 2,
@ -145,8 +146,9 @@ export default function RelationMap({ note, ntxId }: TypeWidgetProps) {
)
}
function usePanZoom({ containerRef, options, transformData, onTransform }: {
containerRef: RefObject<HTMLElement>;
function usePanZoom({ ntxId, containerRef, options, transformData, onTransform }: {
ntxId: string | null | undefined;
containerRef: RefObject<HTMLDivElement>;
options: PanZoomOptions;
transformData: MapData["transform"] | undefined;
onTransform: (pzInstance: PanZoom) => void
@ -172,6 +174,21 @@ function usePanZoom({ containerRef, options, transformData, onTransform }: {
return () => pzInstance.dispose();
}, [ containerRef, onTransform ]);
useTriliumEvents([ "relationMapResetPanZoom", "relationMapResetZoomIn", "relationMapResetZoomOut" ], ({ ntxId: eventNtxId }, eventName) => {
const pzInstance = apiRef.current;
if (eventNtxId !== ntxId || !pzInstance) return;
if (eventName === "relationMapResetPanZoom" && containerRef.current) {
const zoom = getZoom(containerRef.current);
pzInstance.zoomTo(0, 0, 1 / zoom);
pzInstance.moveTo(0, 0);
} else if (eventName === "relationMapResetZoomIn") {
pzInstance.zoomTo(0, 0, 1.2);
} else if (eventName === "relationMapResetZoomOut") {
pzInstance.zoomTo(0, 0, 0.8);
}
});
}
function useNoteCreation({ ntxId, note, containerRef, onCreate }: {

25
apps/client/src/widgets/type_widgets_old/relation_map.ts
View File

@ -527,29 +527,4 @@ export default class RelationMapTypeWidget extends TypeWidget {
this.loadNotesAndRelations();
}
relationMapResetPanZoomEvent({ ntxId }: EventData<"relationMapResetPanZoom">) {
if (!this.isNoteContext(ntxId)) {
return;
}
// reset to initial pan & zoom state
this.pzInstance?.zoomTo(0, 0, 1 / this.getZoom());
this.pzInstance?.moveTo(0, 0);
}
relationMapResetZoomInEvent({ ntxId }: EventData<"relationMapResetZoomIn">) {
if (!this.isNoteContext(ntxId)) {
return;
}
this.pzInstance?.zoomTo(0, 0, 1.2);
}
relationMapResetZoomOutEvent({ ntxId }: EventData<"relationMapResetZoomOut">) {
if (!this.isNoteContext(ntxId)) {
return;
}
this.pzInstance?.zoomTo(0, 0, 0.8);
}
}