mirror of
https://bitbucket.org/wisemapping/wisemapping-open-source.git
synced 2024-11-29 09:04:54 +01:00
Predict for Symmetric Sorter
This commit is contained in:
parent
b8e8038b39
commit
af6358259a
@ -90,7 +90,7 @@ mindplot.nlayout.LayoutManager = new Class({
|
|||||||
|
|
||||||
var parent = this._treeSet.find(parentId);
|
var parent = this._treeSet.find(parentId);
|
||||||
var sorter = parent.getSorter();
|
var sorter = parent.getSorter();
|
||||||
return sorter.predict(parent, this._treeSet, position);
|
return sorter.predict(parent, this._treeSet, position);
|
||||||
},
|
},
|
||||||
|
|
||||||
dump: function() {
|
dump: function() {
|
||||||
@ -104,6 +104,8 @@ mindplot.nlayout.LayoutManager = new Class({
|
|||||||
var canvas = Raphael(containerId, size.width, size.height);
|
var canvas = Raphael(containerId, size.width, size.height);
|
||||||
canvas.drawGrid(0, 0, size.width, size.height, size.width / squaresize, size.height / squaresize);
|
canvas.drawGrid(0, 0, size.width, size.height, size.width / squaresize, size.height / squaresize);
|
||||||
this._treeSet.plot(canvas);
|
this._treeSet.plot(canvas);
|
||||||
|
|
||||||
|
return canvas;
|
||||||
},
|
},
|
||||||
|
|
||||||
layout: function(fireEvents) {
|
layout: function(fireEvents) {
|
||||||
|
@ -25,31 +25,37 @@ mindplot.nlayout.SymmetricSorter = new Class({
|
|||||||
|
|
||||||
// No children...
|
// No children...
|
||||||
var children = graph.getChildren(parent);
|
var children = graph.getChildren(parent);
|
||||||
|
var direction = parent.getPosition().x > 0 ? 1 : -1;
|
||||||
if (children.length == 0) {
|
if (children.length == 0) {
|
||||||
return [0,parent.getPosition()]; // @Todo:Change x ...
|
var position = {
|
||||||
|
x: parent.getPosition().x + direction * (parent.getSize().width + mindplot.nlayout.SymmetricSorter.INTERNODE_HORIZONTAL_PADDING),
|
||||||
|
y:parent.getPosition().y
|
||||||
|
}
|
||||||
|
return [0, position];
|
||||||
}
|
}
|
||||||
|
|
||||||
// Try to fit within ...
|
// Try to fit within ...
|
||||||
//
|
|
||||||
// - Order is change if the position top position is changed ...
|
|
||||||
// - Suggested position is the middle between the two topics...
|
|
||||||
//
|
|
||||||
var result = null;
|
var result = null;
|
||||||
children.forEach(function(child) {
|
var last = children.getLast();
|
||||||
|
children.each(function(child, index) {
|
||||||
var cpos = child.getPosition();
|
var cpos = child.getPosition();
|
||||||
if (position.y > cpos.y) {
|
if (position.y > cpos.y) {
|
||||||
result = [child.getOrder(),{x:cpos.x,y:cpos.y + child.getSize().height}];
|
yOffset = child == last ?
|
||||||
|
child.getSize().height + mindplot.nlayout.SymmetricSorter.INTERNODE_VERTICAL_PADDING * 2 :
|
||||||
|
(children[index + 1].getPosition().y - child.getPosition().y)/2;
|
||||||
|
result = [child.getOrder() + 1,{x:cpos.x, y:cpos.y + yOffset}];
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// Ok, no overlap. Suggest a new order.
|
// Position wasn't below any node, so it must be inserted above
|
||||||
if (result) {
|
if (!result) {
|
||||||
var last = children.getLast();
|
var first = children[0];
|
||||||
result = [last.getOrder() + 1,{x:cpos.x,y:cpos.y - (mindplot.nlayout.SymmetricSorter.INTERNODE_VERTICAL_PADDING * 4)}];
|
result = [0, {
|
||||||
|
x:first.getPosition().x,
|
||||||
|
y:first.getPosition().y - first.getSize().height - mindplot.nlayout.SymmetricSorter.INTERNODE_VERTICAL_PADDING * 2
|
||||||
|
}];
|
||||||
}
|
}
|
||||||
|
|
||||||
//TODO(gb): also return order!
|
|
||||||
|
|
||||||
return result;
|
return result;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -27,7 +27,7 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
this.testDisconnect();
|
this.testDisconnect();
|
||||||
this.testReconnect();
|
this.testReconnect();
|
||||||
this.testRemoveNode();
|
this.testRemoveNode();
|
||||||
this.testFreePosition();
|
this.testSymmetricPredict();
|
||||||
},
|
},
|
||||||
|
|
||||||
testAligned: function() {
|
testAligned: function() {
|
||||||
@ -391,7 +391,8 @@ mindplot.nlayout.TestSuite = new Class({
|
|||||||
console.log("\n");
|
console.log("\n");
|
||||||
},
|
},
|
||||||
|
|
||||||
testFreePosition: function() {
|
testSymmetricPredict: function() {
|
||||||
|
console.log("testSymmetricPredict:");
|
||||||
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);
|
||||||
|
|
||||||
@ -400,16 +401,63 @@ 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.addNode(8, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
manager.addNode(9, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
manager.addNode(10, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
manager.addNode(11, mindplot.nlayout.TestSuite.NODE_SIZE, position);
|
||||||
|
|
||||||
manager.connectNode(0, 4, 0);
|
manager.connectNode(0, 1, 0);
|
||||||
manager.connectNode(4, 1, 0);
|
manager.connectNode(0, 2, 1);
|
||||||
manager.connectNode(4, 2, 1);
|
manager.connectNode(0, 3, 2);
|
||||||
manager.connectNode(4, 3, 2);
|
manager.connectNode(3, 4, 0);
|
||||||
|
manager.connectNode(3, 5, 1);
|
||||||
|
manager.connectNode(3, 6, 2);
|
||||||
|
manager.connectNode(5, 7, 0);
|
||||||
|
manager.connectNode(5, 8, 1);
|
||||||
|
manager.connectNode(5, 11, 2);
|
||||||
|
manager.connectNode(2, 9, 0);
|
||||||
|
manager.connectNode(2, 10, 1);
|
||||||
|
|
||||||
manager.layout();
|
manager.layout();
|
||||||
manager.plot("testFreePosition", {width:800, height:400});
|
|
||||||
|
|
||||||
//TODO(gb): make asserts
|
console.log("\tPredict where would a node be if tried to add as children of node 9 and dropped at (-280, 45):");
|
||||||
|
var predict1 = manager.plot("testPredict1", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict1, manager.predict(9, {x:-280, y:45}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 1 and dropped at (155, -90):");
|
||||||
|
var predict2 = manager.plot("testPredict2", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict2, manager.predict(1, {x:-155, y:-90}));
|
||||||
|
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 5 and dropped at (375, 15):");
|
||||||
|
var predict3 = manager.plot("testPredict3", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict3, manager.predict(5, {x:375, y:15}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 5 and dropped at (375, 45):");
|
||||||
|
var predict4 = manager.plot("testPredict4", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict4, manager.predict(5, {x:375, y:45}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 5 and dropped at (375, 45):");
|
||||||
|
var predict5 = manager.plot("testPredict5", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict5, manager.predict(5, {x:375, y:65}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 3 and dropped at (280, 45):");
|
||||||
|
var predict6 = manager.plot("testPredict6", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict6, manager.predict(3, {x:280, y:45}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 3 and dropped at (255, 110):");
|
||||||
|
var predict7 = manager.plot("testPredict7", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict7, manager.predict(3, {x:255, y:110}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 2 and dropped at (-260, 0):");
|
||||||
|
var predict8 = manager.plot("testPredict8", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict8, manager.predict(2, {x:-260, y:0}));
|
||||||
|
console.log("\tPredict where would a node be if tried to add as children of node 5 and dropped at (380, -30):");
|
||||||
|
var predict9 = manager.plot("testPredict9", {width:1000, height:400});
|
||||||
|
this._plotPrediction(predict9, manager.predict(5, {x:380, y:-30}));
|
||||||
|
},
|
||||||
|
|
||||||
|
_plotPrediction: function(canvas, prediction) {
|
||||||
|
console.log("\t\tprediction {order:" + prediction[0] + ", position: (" + prediction.getLast().x + "," + prediction.getLast().y + ")}");
|
||||||
|
var cx = prediction.getLast().x + canvas.width / 2 - mindplot.nlayout.TestSuite.NODE_SIZE.width / 2;
|
||||||
|
var cy = prediction.getLast().y + canvas.height / 2 - mindplot.nlayout.TestSuite.NODE_SIZE.height / 2;
|
||||||
|
canvas.rect(cx, cy, mindplot.nlayout.TestSuite.NODE_SIZE.width, mindplot.nlayout.TestSuite.NODE_SIZE.height);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -81,8 +81,16 @@
|
|||||||
<div id="testRemoveNode1" class="col"></div>
|
<div id="testRemoveNode1" class="col"></div>
|
||||||
<div id="testRemoveNode2" class="col last"></div>
|
<div id="testRemoveNode2" class="col last"></div>
|
||||||
|
|
||||||
<h2>testFreePosition:</h2>
|
<h2>testSymmetricPredict:</h2>
|
||||||
<div id="testFreePosition"></div>
|
<div id="testPredict1"></div>
|
||||||
|
<div id="testPredict2"></div>
|
||||||
|
<div id="testPredict3"></div>
|
||||||
|
<div id="testPredict4"></div>
|
||||||
|
<div id="testPredict5"></div>
|
||||||
|
<div id="testPredict6"></div>
|
||||||
|
<div id="testPredict7"></div>
|
||||||
|
<div id="testPredict8"></div>
|
||||||
|
<div id="testPredict9"></div>
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
Loading…
Reference in New Issue
Block a user