zadam/trilium
1
1
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-02-20 21:13:11 +08:00
Code Issues Projects Releases Packages Wiki Activity

use HTML5 for Drag & Drop instead of jquery UI draggable for fancytree, #203

Browse source
This commit is contained in:
azivner 2018-11-05 21:42:29 +01:00
parent 19cb29cdca
commit 20baa47d26
2 changed files with 4 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
src/public/javascripts/services/drag_and_drop.js
View file

@ -3,16 +3,6 @@ import treeChangesService from './branches.js';
const dragAndDropSetup = {
autoExpandMS: 600,
draggable: { // modify default jQuery draggable options
zIndex: 1000,
scroll: false,
containment: "parent",
revert: "invalid"
},
focusOnClick: true,
preventRecursiveMoves: true, // Prevent dropping nodes on own descendants
preventVoidMoves: true, // Prevent dropping nodes 'before self', etc.
dragStart: (node, data) => {
if (node.data.noteId === 'root') {
return false;
@ -22,31 +12,7 @@ const dragAndDropSetup = {
// Return false to cancel dragging of node.
return true;
},
dragEnter: (node, data) => {
/* data.otherNode may be null for non-fancytree droppables.
* Return false to disallow dropping on node. In this case
* dragOver and dragLeave are not called.
* Return 'over', 'before, or 'after' to force a hitMode.
* Return ['before', 'after'] to restrict available hitModes.
* Any other return value will calc the hitMode from the cursor position.
*/
// Prevent dropping a parent below another parent (only sort
// nodes under the same parent):
// if(node.parent !== data.otherNode.parent){
// return false;
// }
// Don't allow dropping *over* a node (would create a child). Just
// allow changing the order:
// return ["before", "after"];
// Accept everything:
return true;
},
dragExpand: (node, data) => {
// return false to prevent auto-expanding data.node on hover
},
dragOver: (node, data) => {},
dragLeave: (node, data) => {},
dragStop: (node, data) => {},
dragEnter: (node, data) => true, // allow drop on any node
dragDrop: (node, data) => {
// This function MUST be defined to enable dropping of items on the tree.
// data.hitMode is 'before', 'after', or 'over'.
@ -66,7 +32,7 @@ const dragAndDropSetup = {
treeChangesService.moveToNode(selectedNodes, node);
}
else {
throw new Exception("Unknown hitMode=" + data.hitMode);
throw new Error("Unknown hitMode=" + data.hitMode);
}
}
};

4
src/public/javascripts/services/tree.js
View file

@ -317,7 +317,7 @@ function initFancyTree(tree) {
$tree.fancytree({
autoScroll: true,
keyboard: false, // we takover keyboard handling in the hotkeys plugin
extensions: ["hotkeys", "filter", "dnd", "clones"],
extensions: ["hotkeys", "filter", "dnd5", "clones"],
source: tree,
scrollParent: $tree,
minExpandLevel: 2, // root can't be collapsed
@ -367,7 +367,7 @@ function initFancyTree(tree) {
nodata: true, // Display a 'no data' status node if result is empty
mode: "hide" // Grayout unmatched nodes (pass "hide" to remove unmatched node instead)
},
dnd: dragAndDropSetup,
dnd5: dragAndDropSetup,
lazyLoad: function(event, data) {
const noteId = data.node.data.noteId;