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

center button changed to "reset pan & zoom"

Browse Source
This commit is contained in:
azivner 2018-11-19 11:14:55 +01:00
parent 568c2c997f
commit fef4705e2f
2 changed files with 12 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/public/javascripts/services/note_detail_relation_map.js
View File

@ -15,7 +15,7 @@ const $relationMapContainer = $("#relation-map-container");
const $createChildNote = $("#relation-map-create-child-note");
const $zoomInButton = $("#relation-map-zoom-in");
const $zoomOutButton = $("#relation-map-zoom-out");
const $centerButton = $("#relation-map-center");
const $resetPanZoomButton = $("#relation-map-reset-pan-zoom");
let mapData;
let jsPlumbInstance;
@ -240,6 +240,10 @@ function initPanZoom() {
pzInstance.moveTo(mapData.transform.x, mapData.transform.y);
}
else {
// set to initial coordinates
pzInstance.moveTo(0, 0);
}
$zoomInButton.click(() => pzInstance.zoomTo(0, 0, 1.2));
$zoomOutButton.click(() => pzInstance.zoomTo(0, 0, 0.8));
@ -571,40 +575,10 @@ function getMousePosition(evt) {
};
}
$centerButton.click(() => {
if (mapData.notes.length === 0) {
return; // nothing to recenter on
}
let totalX = 0, totalY = 0;
for (const note of mapData.notes) {
totalX += note.x;
totalY += note.y;
}
let averageX = totalX / mapData.notes.length;
let averageY = totalY / mapData.notes.length;
// find note with smallest X, Y difference from the average (most central note)
const {noteId} = mapData.notes.map(note => {
return {
noteId: note.noteId,
diff: Math.abs(note.x - averageX) + Math.abs(note.y - averageY)
}
}).reduce((min, val) => min.diff <= val.min ? min : val, { diff: 9999999999 });
const $noteBox = $("#" + noteIdToId(noteId));
const clientRect = $noteBox[0].getBoundingClientRect();
const cx = clientRect.left + clientRect.width / 2;
const cy = clientRect.top + clientRect.height / 2;
const container = $component[0].getBoundingClientRect();
const dx = container.width / 2 - cx;
const dy = container.height / 2 - cy;
pzInstance.moveBy(dx, dy, true);
$resetPanZoomButton.click(() => {
// reset to initial pan & zoom state
pzInstance.zoomTo(0, 0, 1 / getZoom());
pzInstance.moveTo(0, 0);
});
$component.on("drop", dropNoteOntoRelationMapHandler);

6
src/views/details/relation_map.ejs
View File

@ -7,9 +7,9 @@
</button>
<button type="button"
class="btn icon-button floating-button jam jam-align-center"
title="Re-center view on notes"
id="relation-map-center" style="right: 100px;"></button>
class="btn icon-button floating-button jam jam-crop"
title="Reset pan & zoom to initial coordinates and magnification"
id="relation-map-reset-pan-zoom" style="right: 100px;"></button>
<div class="btn-group floating-button" style="right: 20px;">
<button type="button"