public/mailtrain
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

This is snapshot of custom node renderer for react-sortable-tree.

Browse source 
It likely won't be needed however.
This commit is contained in:
Tomas Bures 2017-08-16 16:10:30 +02:00
parent 6a7dab52eb
commit baf9f61465
8 changed files with 715 additions and 193 deletions
Download patch file Download diff file Expand all files Collapse all files

42
client/src/lib/tree.css
View file

@ -1,20 +1,3 @@
.mt-treetable-container .fancytree-container span.fancytree-node.mt-tree-end-drop {
height: 10px;
margin-top: 0px;
margin-bottom: -10px;
overflow: hidden;
min-height: 0px;
}
.mt-treetable-container .fancytree-container span.fancytree-node.mt-tree-end-drop span.fancytree-title {
width: 15px;
margin-left: 28px;
}
.mt-treetable-container .fancytree-container span.fancytree-node.mt-tree-end-drop.mt-tree-end-drop-wide span.fancytree-title {
width: 100%;
}
.mt-treetable-container .fancytree-container {
border: none;
}
@ -71,31 +54,6 @@
.mt-treetable-container span.fancytree-node.fancytree-drag-source {
background-color: transparent !important;
}
.mt-treetable-container #fancytree-drop-marker {
background-image: url("../../public/fancytree/skin-bootstrap/icons.gif");
height: 12px;
}
.mt-treetable-container #fancytree-drop-marker.fancytree-drop-over {
background-position: 0px -130px;
width: 22px;
}
.mt-treetable-container #fancytree-drop-marker.fancytree-drop-after, .mt-treetable-container #fancytree-drop-marker.fancytree-drop-before {
background-position: 0px -145px;
width: 64px;
}
.mt-treetable-container span.fancytree-node.fancytree-drop-accept fancytree-expander {
visibility: hidden;
}
.form-group .mt-treetable-container {
border: 1px solid #cccccc;
border-radius: 4px;

28
client/src/lib/tree.js
View file

@ -71,7 +71,6 @@ class TreeTable extends Component {
withHeader: PropTypes.bool,
withDescription: PropTypes.bool,
noTable: PropTypes.bool,
withDnd: PropTypes.bool,
withIcons: PropTypes.bool
}
@ -176,33 +175,6 @@ class TreeTable extends Component {
};
}
if (this.props.withDnd) {
treeOpts.extensions.push('dnd');
treeOpts.dnd = {
autoExpandMS: 400,
focusOnClick: true,
preventVoidMoves: true,
preventRecursiveMoves: true,
dropMarkerOffsetX: -46, // -22
dropMarkerInsertOffsetX: 0,
dragStart: (node, data) => {
return node.key !== '__mt-tree-end-drop__';
},
dragEnter: (node, data) => {
if (node.folder) {
return ['before', 'over'];
} else {
return ['before'];
}
},
dragDrop: (node, data) => {
console.log(node);
console.log(data);
data.otherNode.moveTo(node, data.hitMode);
}
};
}
this.tree = jQuery(this.domTable).fancytree(treeOpts).fancytree("getTree");
this.updateSelection();