mirror of
https://bitbucket.org/wisemapping/wisemapping-open-source.git
synced 2024-11-22 14:17:57 +01:00
Baseline alignment
This commit is contained in:
parent
99d7a1faaf
commit
cc0e6c3e45
@ -320,7 +320,6 @@ mindplot.Designer = new Class({
|
||||
},
|
||||
|
||||
createChildForSelectedNode : function() {
|
||||
console.log("createChildForSelectedNode"); //TODO(gb): Remove trace!!!
|
||||
var nodes = this.getModel().filterSelectedTopics();
|
||||
if (nodes.length <= 0) {
|
||||
// If there are more than one node selected,
|
||||
|
@ -174,12 +174,6 @@ mindplot.layout.Node = new Class({
|
||||
return this._sorter;
|
||||
},
|
||||
|
||||
getVertex: function() {
|
||||
var a = {x: this.getPosition().x - this.getSize().width / 2, y:this.getPosition().y - this.getSize().height / 2};
|
||||
var b = {x: this.getPosition().x + this.getSize().width / 2, y:this.getPosition().y + this.getSize().height / 2};
|
||||
return {a:a, b:b};
|
||||
},
|
||||
|
||||
toString: function() {
|
||||
return "[id:" + this.getId() + ", order:" + this.getOrder() + ", position: {" + this.getPosition().x + "," + this.getPosition().y + "}, size: {" + this.getSize().width + "," + this.getSize().height + "}, shrink:" + this.areChildrenShrunken() + "]";
|
||||
}
|
||||
|
@ -144,28 +144,34 @@ mindplot.layout.OriginalLayout = new Class({
|
||||
var nodeHeight = node.getSize().height;
|
||||
var childHeight = child.getSize().height;
|
||||
|
||||
var children = this._treeSet.getChildren(child);
|
||||
|
||||
if (children.length == 1 && children[0].getSize().height > childHeight) { // A
|
||||
offset = children[0].getSize().height/2 - childHeight/2;
|
||||
} else if (children.length == 1 && childHeight > children[0].getSize().height) { // B
|
||||
offset = 0;
|
||||
} else if (children.length == 1 && nodeHeight > childHeight) {
|
||||
offset = nodeHeight/2 - childHeight/2;
|
||||
if (this._treeSet.isStartOfSubBranch(child) && this._branchIsTaller(child, heightById)) {
|
||||
if (this._treeSet.hasSinglePathToSingleLeaf(child)) {
|
||||
offset = heightById[child.getId()]/2 - (childHeight + child.getSorter()._getVerticalPadding()*2)/2;
|
||||
} else {
|
||||
offset = this._treeSet.isLeaf(child) ? 0 : -(childHeight - nodeHeight)/2;
|
||||
}
|
||||
} else if (nodeHeight > childHeight) {
|
||||
if (this._treeSet.getSiblings(child).length > 0) {
|
||||
offset = 0;
|
||||
} else {
|
||||
offset = nodeHeight/2 - childHeight/2;
|
||||
}
|
||||
}
|
||||
else if (children.length == 0 && childHeight <= nodeHeight) {
|
||||
offset = nodeHeight/2 - childHeight/2;
|
||||
}
|
||||
else if (childHeight > nodeHeight && children.length > 0) {
|
||||
offset = nodeHeight/2 - childHeight/2;
|
||||
}
|
||||
else {
|
||||
offset = 0;
|
||||
else if (childHeight > nodeHeight) {
|
||||
if (this._treeSet.getSiblings(child).length > 0) {
|
||||
offset = 0;
|
||||
} else {
|
||||
offset = -(childHeight / 2 - nodeHeight / 2);
|
||||
}
|
||||
}
|
||||
|
||||
return offset;
|
||||
},
|
||||
|
||||
_branchIsTaller: function(node, heightById) {
|
||||
return heightById[node.getId()] > (node.getSize().height + node.getSorter()._getVerticalPadding()*2);
|
||||
},
|
||||
|
||||
_fixOverlapping: function(node, heightById) {
|
||||
var children = this._treeSet.getChildren(node);
|
||||
|
||||
|
@ -147,6 +147,30 @@ mindplot.layout.RootedTreeSet = new Class({
|
||||
return siblings;
|
||||
},
|
||||
|
||||
hasSinglePathToSingleLeaf: function(node) {
|
||||
$assert(node, 'node cannot be null');
|
||||
return this._hasSinglePathToSingleLeaf(node);
|
||||
},
|
||||
|
||||
_hasSinglePathToSingleLeaf: function(node) {
|
||||
var children = this.getChildren(node);
|
||||
|
||||
if (children.length == 1) {
|
||||
return this._hasSinglePathToSingleLeaf(children[0]);
|
||||
}
|
||||
|
||||
return children.length == 0;
|
||||
},
|
||||
|
||||
isStartOfSubBranch: function(node) {
|
||||
return this.getSiblings(node).length > 0 && this.getChildren(node).length == 1;
|
||||
},
|
||||
|
||||
isLeaf: function(node) {
|
||||
$assert(node, 'node cannot be null');
|
||||
return this.getChildren(node).length == 0;
|
||||
},
|
||||
|
||||
getParent:function(node) {
|
||||
$assert(node, 'node cannot be null');
|
||||
return node._parent;
|
||||
|
@ -55,6 +55,10 @@
|
||||
<h3>testAligned:</h3>
|
||||
<div id="testAligned"></div>
|
||||
|
||||
<h3>testBaselineAligned:</h3>
|
||||
<div id="testBaselineAligned1"></div>
|
||||
<div id="testBaselineAligned2"></div>
|
||||
|
||||
<h3>testEvents:</h3>
|
||||
<div id="testEvents1" class="col"></div>
|
||||
<div id="testEvents2" class="col last"></div>
|
||||
|
@ -64,8 +64,8 @@ mindplot.layout.SymmetricTestSuite = new Class({
|
||||
manager.plot("testSymmetry",{width:1600, height:400});
|
||||
|
||||
// All nodes should be positioned symmetrically with respect to their common ancestors
|
||||
$assert(manager.find(14).getPosition().y == -manager.find(13).getPosition().y, "Symmetry is not respected");
|
||||
$assert(manager.find(5).getPosition().y == -manager.find(11).getPosition().y, "Symmetry is not respected");
|
||||
$assert(manager.find(14).getPosition().y == manager.find(13).getPosition().y, "Symmetry is not respected");
|
||||
$assert(manager.find(5).getPosition().y == manager.find(10).getPosition().y, "Symmetry is not respected");
|
||||
$assert(manager.find(11).getPosition().y - manager.find(6).getPosition().y ==
|
||||
-(manager.find(12).getPosition().y - manager.find(6).getPosition().y), "Symmetry is not respected");
|
||||
$assert(manager.find(8).getPosition().y - manager.find(1).getPosition().y ==
|
||||
|
@ -21,7 +21,9 @@ mindplot.layout.TestSuite = new Class({
|
||||
initialize:function() {
|
||||
$("basicTest").setStyle("display","block");
|
||||
|
||||
this.testAligned();
|
||||
// this.testAligned();
|
||||
this.testBaselineAligned1();
|
||||
this.testBaselineAligned2();
|
||||
this.testEvents();
|
||||
this.testEventsComplex();
|
||||
this.testDisconnect();
|
||||
@ -60,6 +62,71 @@ mindplot.layout.TestSuite = new Class({
|
||||
console.log("OK!\n\n");
|
||||
},
|
||||
|
||||
testBaselineAligned1: function() {
|
||||
console.log("testBaselineAligned1:");
|
||||
var position = {x:0,y:0};
|
||||
var manager = new mindplot.layout.LayoutManager(0, mindplot.layout.TestSuite.ROOT_NODE_SIZE);
|
||||
|
||||
manager.addNode(1, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(0, 1, 0);
|
||||
manager.addNode(3, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(1, 3, 0);
|
||||
manager.addNode(5, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(3, 5, 0);
|
||||
manager.addNode(6, {width:140, height:130}, position).connectNode(3, 6, 1);
|
||||
manager.addNode(7, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(6, 7, 0);
|
||||
manager.addNode(8, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 8, 0);
|
||||
manager.addNode(9, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 9, 1);
|
||||
manager.addNode(10, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 10, 2);
|
||||
manager.addNode(11, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 11, 3);
|
||||
manager.addNode(12, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 12, 4);
|
||||
manager.addNode(13, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 13, 5);
|
||||
manager.addNode(14, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 14, 6);
|
||||
manager.addNode(15, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 15, 7);
|
||||
manager.addNode(16, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 16, 8);
|
||||
manager.addNode(17, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(7, 17, 9);
|
||||
manager.addNode(29, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(6, 29, 1);
|
||||
manager.addNode(30, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(6, 30, 2);
|
||||
manager.addNode(31, {width:100, height:50}, position).connectNode(6, 31, 3);
|
||||
|
||||
manager.addNode(4, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(1, 4, 1);
|
||||
manager.addNode(18, {width:80, height:70}, position).connectNode(4, 18, 0);
|
||||
manager.addNode(19, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(18, 19, 0);
|
||||
manager.addNode(20, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(19, 20, 0);
|
||||
manager.addNode(21, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(20, 21, 0);
|
||||
|
||||
manager.addNode(2, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(0, 2, 1);
|
||||
manager.addNode(22, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(2, 22, 0);
|
||||
manager.addNode(24, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(22, 24, 0);
|
||||
|
||||
manager.addNode(23, {width:80, height:50}, position).connectNode(2, 23, 1);
|
||||
manager.addNode(25, {width:80, height:40}, position).connectNode(23, 25, 0);
|
||||
manager.addNode(26, {width:80, height:80}, position).connectNode(25, 26, 0);
|
||||
manager.addNode(27, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(26, 27, 0);
|
||||
manager.addNode(28, {width:80, height:80}, position).connectNode(27, 28, 0);
|
||||
|
||||
// manager.layout();
|
||||
// manager.plot("testBaselineAligned1", {width:1600,height:800});
|
||||
|
||||
console.log("OK!\n\n");
|
||||
},
|
||||
|
||||
testBaselineAligned2: function() {
|
||||
console.log("testBaselineAligned2:");
|
||||
var position = {x:0,y:0};
|
||||
var manager = new mindplot.layout.LayoutManager(0, mindplot.layout.TestSuite.ROOT_NODE_SIZE);
|
||||
|
||||
manager.addNode(1, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(0, 1, 0);
|
||||
manager.addNode(2, {width: 130, height:200}, position).connectNode(1, 2, 0);
|
||||
manager.addNode(3, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(2, 3, 0);
|
||||
manager.addNode(4, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(2, 4, 1);
|
||||
manager.addNode(5, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(2, 5, 2);
|
||||
manager.addNode(6, mindplot.layout.TestSuite.NODE_SIZE, position).connectNode(2, 6, 3);
|
||||
|
||||
|
||||
manager.layout();
|
||||
manager.plot("testBaselineAligned2", {width:1600,height:800});
|
||||
|
||||
console.log("OK!\n\n");
|
||||
},
|
||||
|
||||
testEvents: function() {
|
||||
console.log("testEvents:");
|
||||
var position = {x:0,y:0};
|
||||
|
Loading…
Reference in New Issue
Block a user