mirror of
https://bitbucket.org/wisemapping/wisemapping-open-source.git
synced 2024-11-26 15:54:55 +01:00
Disconnect node in layout
This commit is contained in:
parent
eca97f6a72
commit
cf9bdee1c4
@ -81,6 +81,7 @@ mindplot.nlayout.OriginalLayout = new Class({
|
|||||||
|
|
||||||
var nodeId = node.getId();
|
var nodeId = node.getId();
|
||||||
var children = this._treeSet.getChildren(node);
|
var children = this._treeSet.getChildren(node);
|
||||||
|
var parent = this._treeSet.getParent(node);
|
||||||
var childrenOrderMoved = children.some(function(child) {
|
var childrenOrderMoved = children.some(function(child) {
|
||||||
return child.hasOrderChanged();
|
return child.hasOrderChanged();
|
||||||
});
|
});
|
||||||
@ -88,9 +89,12 @@ mindplot.nlayout.OriginalLayout = new Class({
|
|||||||
// If ether any of the nodes has been changed of position or the height of the children is not
|
// If ether any of the nodes has been changed of position or the height of the children is not
|
||||||
// the same, children nodes must be repositioned ....
|
// the same, children nodes must be repositioned ....
|
||||||
var newBranchHeight = heightById[nodeId];
|
var newBranchHeight = heightById[nodeId];
|
||||||
var heightChanged = node._branchHeight != newBranchHeight;
|
|
||||||
if (childrenOrderMoved || heightChanged) {
|
|
||||||
|
|
||||||
|
var parentHeightChanged = $defined(parent) ? parent._heightChanged : false;
|
||||||
|
var heightChanged = node._branchHeight != newBranchHeight;
|
||||||
|
node._heightChanged = heightChanged || parentHeightChanged;
|
||||||
|
|
||||||
|
if (childrenOrderMoved || heightChanged || parentHeightChanged) {
|
||||||
var sorter = node.getSorter();
|
var sorter = node.getSorter();
|
||||||
var offsetById = sorter.computeOffsets(this._treeSet, node);
|
var offsetById = sorter.computeOffsets(this._treeSet, node);
|
||||||
var parentPosition = node.getPosition();
|
var parentPosition = node.getPosition();
|
||||||
|
@ -158,10 +158,10 @@ mindplot.nlayout.RootedTreeSet = new Class({
|
|||||||
rect.attr('fill', fillColor);
|
rect.attr('fill', fillColor);
|
||||||
|
|
||||||
rect.click(function() {
|
rect.click(function() {
|
||||||
console.log("[id:" + node.getId() + ", order:" + node.getOrder() + ", position: {" + node.getPosition().x + "," + node.getPosition().y + "}, size: {" + node.getSize().width + "," + node.getSize().height + "}");
|
console.log("[id:" + node.getId() + ", order:" + node.getOrder() + ", position:(" + node.getPosition().x + "," + node.getPosition().y + "), size:" + node.getSize().width + "x" + node.getSize().height + ", sorter:" + node.getSorter() +"]");
|
||||||
});
|
});
|
||||||
text.click(function() {
|
text.click(function() {
|
||||||
console.log("[id:" + node.getId() + ", order:" + node.getOrder() + ", position: {" + node.getPosition().x + "," + node.getPosition().y + "}, size: {" + node.getSize().width + "," + node.getSize().height + "}");
|
console.log("[id:" + node.getId() + ", order:" + node.getOrder() + ", position:(" + node.getPosition().x + "," + node.getPosition().y + "), size:" + node.getSize().width + "x" + node.getSize().height + ", sorter:" + node.getSorter() +"]");
|
||||||
});
|
});
|
||||||
|
|
||||||
for (var i = 0; i < children.length; i++) {
|
for (var i = 0; i < children.length; i++) {
|
||||||
|
@ -48,6 +48,8 @@ mindplot.nlayout.SymmetricSorter = new Class({
|
|||||||
result = [last.getOrder() + 1,{x:cpos.x,y:cpos.y - (mindplot.nlayout.SymmetricSorter.INTERNODE_VERTICAL_PADDING * 4)}];
|
result = [last.getOrder() + 1,{x:cpos.x,y:cpos.y - (mindplot.nlayout.SymmetricSorter.INTERNODE_VERTICAL_PADDING * 4)}];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//TODO(gb): also return order!
|
||||||
|
|
||||||
return result;
|
return result;
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -100,8 +102,9 @@ mindplot.nlayout.SymmetricSorter = new Class({
|
|||||||
var result = {};
|
var result = {};
|
||||||
for (var i = 0; i < heights.length; i++) {
|
for (var i = 0; i < heights.length; i++) {
|
||||||
ysum = ysum - heights[i].height;
|
ysum = ysum - heights[i].height;
|
||||||
|
|
||||||
var parent = treeSet.getParent(treeSet.find(heights[i].id));
|
var parent = treeSet.getParent(treeSet.find(heights[i].id));
|
||||||
|
|
||||||
|
//TODO(gb): actually compare to branch's root node position
|
||||||
var direction = parent.getPosition().x > 0 ? 1 : -1;
|
var direction = parent.getPosition().x > 0 ? 1 : -1;
|
||||||
|
|
||||||
var yOffset = ysum + heights[i].height / 2;
|
var yOffset = ysum + heights[i].height / 2;
|
||||||
|
@ -88,14 +88,14 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
manager.connectNode(6, 12, 1);
|
manager.connectNode(6, 12, 1);
|
||||||
|
|
||||||
manager.layout();
|
manager.layout();
|
||||||
manager.plot("testSymmetry",{width:1200, height:400});
|
manager.plot("testSymmetry",{width:1600, height:400});
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
//TODO(gb): make asserts
|
||||||
},
|
},
|
||||||
|
|
||||||
testBalanced: function() {
|
testBalanced: function() {
|
||||||
var position = {x:0, y:0};
|
var position = {x:0, y:0};
|
||||||
var plotsize = {width:800, height:400};
|
var plotsize = {width:1000, height:200};
|
||||||
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
||||||
|
|
||||||
manager.addNode(1, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
manager.addNode(1, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
@ -150,7 +150,7 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
},
|
},
|
||||||
|
|
||||||
testEvents: function() {
|
testEvents: function() {
|
||||||
console.log("testEvents:"); //TODO(gb): Remove trace!!!
|
console.log("testEvents:");
|
||||||
var position = {x:0,y:0};
|
var position = {x:0,y:0};
|
||||||
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
||||||
|
|
||||||
@ -173,22 +173,22 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
events.push(event);
|
events.push(event);
|
||||||
});
|
});
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testEvents1", {width:800, height:400});
|
manager.plot("testEvents1", {width:800, height:200});
|
||||||
|
|
||||||
// Ok, if a new node is added, this an event should be fired ...
|
// Ok, if a new node is added, this an event should be fired ...
|
||||||
console.log("\t---- Layout without changes should not affect the tree ---");
|
console.log("\t---- Layout without changes should not affect the tree ---");
|
||||||
events.empty();
|
events.empty();
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testEvents2", {width:800, height:400});
|
manager.plot("testEvents2", {width:800, height:200});
|
||||||
|
|
||||||
$assert(events.length == 0, "Unnecessary tree updated.");
|
$assert(events.length == 0, "Unnecessary tree updated.");
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
//TODO(gb): make asserts
|
||||||
console.log("\n"); //TODO(gb): Remove trace!!!
|
console.log("\n");
|
||||||
},
|
},
|
||||||
|
|
||||||
testEventsComplex: function() {
|
testEventsComplex: function() {
|
||||||
console.log("testEventsComplex:"); //TODO(gb): Remove trace!!!
|
console.log("testEventsComplex:");
|
||||||
var position = {x:0,y:0};
|
var position = {x:0,y:0};
|
||||||
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
||||||
|
|
||||||
@ -211,7 +211,7 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
|
|
||||||
// Reposition ...
|
// Reposition ...
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testEventsComplex1", {width:800, height:400});
|
manager.plot("testEventsComplex1", {width:800, height:200});
|
||||||
|
|
||||||
// Add a new node and connect. Only children nodes should be affected.
|
// Add a new node and connect. Only children nodes should be affected.
|
||||||
console.log("\t---- Connect a new node ---");
|
console.log("\t---- Connect a new node ---");
|
||||||
@ -219,17 +219,17 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
events.empty();
|
events.empty();
|
||||||
manager.connectNode(1, 4, 2);
|
manager.connectNode(1, 4, 2);
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testEventsComplex2", {width:800, height:400});
|
manager.plot("testEventsComplex2", {width:800, height:200});
|
||||||
|
|
||||||
// @todo: This seems no to be ok...
|
// @todo: This seems no to be ok...
|
||||||
$assert(events.length == 4, "Only 3 nodes should be repositioned.");
|
$assert(events.length == 4, "Only 3 nodes should be repositioned.");
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
//TODO(gb): make asserts
|
||||||
console.log("\n"); //TODO(gb): Remove trace!!!
|
console.log("\n");
|
||||||
},
|
},
|
||||||
|
|
||||||
testDisconnect: function() {
|
testDisconnect: function() {
|
||||||
console.log("testDisconnect:"); //TODO(gb): Remove trace!!!
|
console.log("testDisconnect:");
|
||||||
var position = {x:0,y:0};
|
var position = {x:0,y:0};
|
||||||
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
||||||
|
|
||||||
@ -238,11 +238,17 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
manager.addNode(2, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
manager.addNode(2, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
manager.addNode(3, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
manager.addNode(3, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
manager.addNode(4, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
manager.addNode(4, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
manager.addNode(5, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
manager.addNode(6, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
manager.addNode(7, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
|
||||||
manager.connectNode(0, 1, 0);
|
manager.connectNode(0, 1, 0);
|
||||||
manager.connectNode(1, 2, 0);
|
manager.connectNode(1, 2, 0);
|
||||||
manager.connectNode(1, 3, 1);
|
manager.connectNode(1, 3, 1);
|
||||||
manager.connectNode(3, 4, 0);
|
manager.connectNode(1, 4, 2);
|
||||||
|
manager.connectNode(4, 5, 0);
|
||||||
|
manager.connectNode(5, 6, 0);
|
||||||
|
manager.connectNode(5, 7, 1);
|
||||||
|
|
||||||
var events = [];
|
var events = [];
|
||||||
manager.addEvent('change', function(event) {
|
manager.addEvent('change', function(event) {
|
||||||
@ -254,14 +260,14 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
events.push(event);
|
events.push(event);
|
||||||
});
|
});
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testDisconnect1", {width:800, height:400});
|
manager.plot("testDisconnect1", {width:1200, height:400});
|
||||||
|
|
||||||
// Now, disconnect one node ...
|
// Now, disconnect one node ...
|
||||||
console.log("\t--- Disconnect a single node ---");
|
console.log("--- Disconnect a single node ---");
|
||||||
events.empty();
|
events.empty();
|
||||||
manager.disconnectNode(2);
|
manager.disconnectNode(2);
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testDisconnect2", {width:800, height:400});
|
manager.plot("testDisconnect2", {width:1200, height:400});
|
||||||
|
|
||||||
$assert(events.some(
|
$assert(events.some(
|
||||||
function(event) {
|
function(event) {
|
||||||
@ -269,10 +275,10 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
}), "Event for disconnected node seems not to be propagated");
|
}), "Event for disconnected node seems not to be propagated");
|
||||||
|
|
||||||
// Great, let's disconnect a not with children.
|
// Great, let's disconnect a not with children.
|
||||||
console.log("\t--- Disconnect a node with children ---");
|
console.log("--- Disconnect a node with children ---");
|
||||||
manager.disconnectNode(3);
|
manager.disconnectNode(3);
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testDisconnect3", {width:800, height:400});
|
manager.plot("testDisconnect3", {width:1200, height:400});
|
||||||
|
|
||||||
$assert(events.some(
|
$assert(events.some(
|
||||||
function(event) {
|
function(event) {
|
||||||
@ -280,7 +286,7 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
}), "Event for disconnected node seems not to be propagated");
|
}), "Event for disconnected node seems not to be propagated");
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
//TODO(gb): make asserts
|
||||||
console.log("\n"); //TODO(gb): Remove trace!!!
|
console.log("\n");
|
||||||
},
|
},
|
||||||
|
|
||||||
testReconnect: function() {
|
testReconnect: function() {
|
||||||
@ -313,19 +319,19 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
manager.connectNode(6, 12, 1);
|
manager.connectNode(6, 12, 1);
|
||||||
|
|
||||||
manager.layout();
|
manager.layout();
|
||||||
manager.plot("testReconnect1",{width:1000, height:400});
|
manager.plot("testReconnect1",{width:1200, height:400});
|
||||||
|
|
||||||
// Reconnect node 6 to node 4
|
// Reconnect node 6 to node 4
|
||||||
manager.disconnectNode(6);
|
manager.disconnectNode(6);
|
||||||
manager.connectNode(4,6,0);
|
manager.connectNode(4,6,0);
|
||||||
manager.layout();
|
manager.layout();
|
||||||
manager.plot("testReconnect2",{width:1000, height:400});
|
manager.plot("testReconnect2",{width:1200, height:400});
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
//TODO(gb): make asserts
|
||||||
},
|
},
|
||||||
|
|
||||||
testRemoveNode: function() {
|
testRemoveNode: function() {
|
||||||
console.log("testRemoveNode:"); //TODO(gb): Remove trace!!!
|
console.log("testRemoveNode:");
|
||||||
var position = {x:0,y:0};
|
var position = {x:0,y:0};
|
||||||
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE);
|
||||||
|
|
||||||
@ -348,16 +354,16 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
events.push(event);
|
events.push(event);
|
||||||
});
|
});
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testRemoveNode1", {width:800, height:200});
|
manager.plot("testRemoveNode1", {width:1000, height:200});
|
||||||
|
|
||||||
// Test removal of a connected node ...
|
// Test removal of a connected node ...
|
||||||
console.log("\t--- Remove node 3 ---");
|
console.log("\t--- Remove node 3 ---");
|
||||||
manager.removeNode(3);
|
manager.removeNode(3);
|
||||||
manager.layout(true);
|
manager.layout(true);
|
||||||
manager.plot("testRemoveNode2", {width:800, height:200});
|
manager.plot("testRemoveNode2", {width:1000, height:200});
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
//TODO(gb): make asserts
|
||||||
console.log("\n"); //TODO(gb): Remove trace!!!
|
console.log("\n");
|
||||||
},
|
},
|
||||||
|
|
||||||
testFreePosition: function() {
|
testFreePosition: function() {
|
||||||
|
Loading…
Reference in New Issue
Block a user