From cf9bdee1c4b7e739877b8f908c74b232955c23c9 Mon Sep 17 00:00:00 2001 From: Gonzalo Bellver Date: Thu, 12 Jan 2012 15:51:50 -0300 Subject: [PATCH] Disconnect node in layout --- .../main/javascript/nlayout/OriginalLayout.js | 8 ++- .../main/javascript/nlayout/RootedTreeSet.js | 4 +- .../javascript/nlayout/SymmetricSorter.js | 5 +- .../src/test/javascript/static/TestSuite.js | 56 ++++++++++--------- 4 files changed, 43 insertions(+), 30 deletions(-) diff --git a/mindplot/src/main/javascript/nlayout/OriginalLayout.js b/mindplot/src/main/javascript/nlayout/OriginalLayout.js index e4bf91e3..c21e22f4 100644 --- a/mindplot/src/main/javascript/nlayout/OriginalLayout.js +++ b/mindplot/src/main/javascript/nlayout/OriginalLayout.js @@ -81,6 +81,7 @@ mindplot.nlayout.OriginalLayout = new Class({ var nodeId = node.getId(); var children = this._treeSet.getChildren(node); + var parent = this._treeSet.getParent(node); var childrenOrderMoved = children.some(function(child) { 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 // the same, children nodes must be repositioned .... 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 offsetById = sorter.computeOffsets(this._treeSet, node); var parentPosition = node.getPosition(); diff --git a/mindplot/src/main/javascript/nlayout/RootedTreeSet.js b/mindplot/src/main/javascript/nlayout/RootedTreeSet.js index 11f98431..51ba656f 100644 --- a/mindplot/src/main/javascript/nlayout/RootedTreeSet.js +++ b/mindplot/src/main/javascript/nlayout/RootedTreeSet.js @@ -158,10 +158,10 @@ mindplot.nlayout.RootedTreeSet = new Class({ rect.attr('fill', fillColor); 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() { - 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++) { diff --git a/mindplot/src/main/javascript/nlayout/SymmetricSorter.js b/mindplot/src/main/javascript/nlayout/SymmetricSorter.js index 116cb65a..08b78231 100644 --- a/mindplot/src/main/javascript/nlayout/SymmetricSorter.js +++ b/mindplot/src/main/javascript/nlayout/SymmetricSorter.js @@ -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)}]; } + //TODO(gb): also return order! + return result; }, @@ -100,8 +102,9 @@ mindplot.nlayout.SymmetricSorter = new Class({ var result = {}; for (var i = 0; i < heights.length; i++) { ysum = ysum - heights[i].height; - 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 yOffset = ysum + heights[i].height / 2; diff --git a/mindplot/src/test/javascript/static/TestSuite.js b/mindplot/src/test/javascript/static/TestSuite.js index e243f7bc..a65e7280 100644 --- a/mindplot/src/test/javascript/static/TestSuite.js +++ b/mindplot/src/test/javascript/static/TestSuite.js @@ -88,14 +88,14 @@ mindplot.nlayout.TestSuite = new Class({ manager.connectNode(6, 12, 1); manager.layout(); - manager.plot("testSymmetry",{width:1200, height:400}); + manager.plot("testSymmetry",{width:1600, height:400}); //TODO(gb): make asserts }, testBalanced: function() { 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); manager.addNode(1, mindplot.nlayout.TestSuite.NODE_SIZE, position); @@ -150,7 +150,7 @@ mindplot.nlayout.TestSuite = new Class({ }, testEvents: function() { - console.log("testEvents:"); //TODO(gb): Remove trace!!! + console.log("testEvents:"); var position = {x:0,y:0}; 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); }); 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 ... console.log("\t---- Layout without changes should not affect the tree ---"); events.empty(); manager.layout(true); - manager.plot("testEvents2", {width:800, height:400}); + manager.plot("testEvents2", {width:800, height:200}); $assert(events.length == 0, "Unnecessary tree updated."); //TODO(gb): make asserts - console.log("\n"); //TODO(gb): Remove trace!!! + console.log("\n"); }, testEventsComplex: function() { - console.log("testEventsComplex:"); //TODO(gb): Remove trace!!! + console.log("testEventsComplex:"); var position = {x:0,y:0}; var manager = new mindplot.nlayout.LayoutManager(0, mindplot.nlayout.TestSuite.ROOT_NODE_SIZE); @@ -211,7 +211,7 @@ mindplot.nlayout.TestSuite = new Class({ // Reposition ... 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. console.log("\t---- Connect a new node ---"); @@ -219,17 +219,17 @@ mindplot.nlayout.TestSuite = new Class({ events.empty(); manager.connectNode(1, 4, 2); manager.layout(true); - manager.plot("testEventsComplex2", {width:800, height:400}); + manager.plot("testEventsComplex2", {width:800, height:200}); // @todo: This seems no to be ok... $assert(events.length == 4, "Only 3 nodes should be repositioned."); //TODO(gb): make asserts - console.log("\n"); //TODO(gb): Remove trace!!! + console.log("\n"); }, testDisconnect: function() { - console.log("testDisconnect:"); //TODO(gb): Remove trace!!! + console.log("testDisconnect:"); var position = {x:0,y:0}; 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(3, 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(1, 2, 0); 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 = []; manager.addEvent('change', function(event) { @@ -254,25 +260,25 @@ mindplot.nlayout.TestSuite = new Class({ events.push(event); }); manager.layout(true); - manager.plot("testDisconnect1", {width:800, height:400}); + manager.plot("testDisconnect1", {width:1200, height:400}); // Now, disconnect one node ... - console.log("\t--- Disconnect a single node ---"); + console.log("--- Disconnect a single node ---"); events.empty(); manager.disconnectNode(2); manager.layout(true); - manager.plot("testDisconnect2", {width:800, height:400}); + manager.plot("testDisconnect2", {width:1200, height:400}); $assert(events.some( function(event) { return event.getId() == 2; }), "Event for disconnected node seems not to be propagated"); - // Great, let's disconnect a not with children. - console.log("\t--- Disconnect a node with children ---"); +// Great, let's disconnect a not with children. + console.log("--- Disconnect a node with children ---"); manager.disconnectNode(3); manager.layout(true); - manager.plot("testDisconnect3", {width:800, height:400}); + manager.plot("testDisconnect3", {width:1200, height:400}); $assert(events.some( function(event) { @@ -280,7 +286,7 @@ mindplot.nlayout.TestSuite = new Class({ }), "Event for disconnected node seems not to be propagated"); //TODO(gb): make asserts - console.log("\n"); //TODO(gb): Remove trace!!! + console.log("\n"); }, testReconnect: function() { @@ -313,19 +319,19 @@ mindplot.nlayout.TestSuite = new Class({ manager.connectNode(6, 12, 1); manager.layout(); - manager.plot("testReconnect1",{width:1000, height:400}); + manager.plot("testReconnect1",{width:1200, height:400}); // Reconnect node 6 to node 4 manager.disconnectNode(6); manager.connectNode(4,6,0); manager.layout(); - manager.plot("testReconnect2",{width:1000, height:400}); + manager.plot("testReconnect2",{width:1200, height:400}); //TODO(gb): make asserts }, testRemoveNode: function() { - console.log("testRemoveNode:"); //TODO(gb): Remove trace!!! + console.log("testRemoveNode:"); var position = {x:0,y:0}; 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); }); manager.layout(true); - manager.plot("testRemoveNode1", {width:800, height:200}); + manager.plot("testRemoveNode1", {width:1000, height:200}); // Test removal of a connected node ... console.log("\t--- Remove node 3 ---"); manager.removeNode(3); manager.layout(true); - manager.plot("testRemoveNode2", {width:800, height:200}); + manager.plot("testRemoveNode2", {width:1000, height:200}); //TODO(gb): make asserts - console.log("\n"); //TODO(gb): Remove trace!!! + console.log("\n"); }, testFreePosition: function() {