Hawkin
/
arangodb
mirror of https://gitee.com/bigwinds/arangodb
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

GraphViewer: Fixed all tests for CommunityNode and added placeholders for Dissolve and Collapse buttons

This commit is contained in:
Michael Hackstein 2013-07-22 08:56:58 +02:00
parent 9937736929
commit b02e8c2ecb
3 changed files with 189 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
html/admin/js/graphViewer/graph/communityNode.js
View File

@ -44,7 +44,9 @@ function CommunityNode(parent, initial) {
// Private variables //
////////////////////////////////////
self = this,
boundingBox,
bBox,
bBoxBorder,
bBoxTitle,
nodes = {},
observer,
nodeArray = [],
@ -72,13 +74,45 @@ function CommunityNode(parent, initial) {
return def;
},
getSourcePosition = function(e) {
if (self._expanded) {
var p = self.position,
diff = e._source,
x = p.x + diff.x,
y = p.y + diff.y,
z = p.z + diff.z;
return {
x: x,
y: y,
z: z
};
}
return self.position;
},
getTargetPosition = function(e) {
if (self._expanded) {
var p = self.position,
diff = e._target,
x = p.x + diff.x,
y = p.y + diff.y,
z = p.z + diff.z;
return {
x: x,
y: y,
z: z
};
}
return self.position;
},
updateBoundingBox = function() {
var bbox = document.getElementById(self._id).getBBox();
boundingBox.attr("width", bbox.width + 10)
.attr("height", bbox.height + 10)
.attr("x", bbox.x - 5)
.attr("y", bbox.y - 5);
var boundingBox = document.getElementById(self._id).getBBox();
bBox.attr("transform", "translate(" + (boundingBox.x - 5) + "," + (boundingBox.y - 25) + ")");
bBoxBorder.attr("width", boundingBox.width + 10)
.attr("height", boundingBox.height + 30);
bBoxTitle.attr("width", boundingBox.width + 10);
},
getObserver = function() {
@ -326,11 +360,43 @@ function CommunityNode(parent, initial) {
},
addBoundingBox = function(g) {
boundingBox = g.append("rect")
bBox = g.append("g");
bBoxBorder = bBox.append("rect")
.attr("rx", "8")
.attr("ry", "8")
.attr("fill", "none")
.attr("stroke", "black");
bBoxTitle = bBox.append("rect")
.attr("rx", "8")
.attr("ry", "8")
.attr("height", "20")
.attr("fill", "#686766")
.attr("stroke", "none");
var dissolveBtn = bBox.append("rect")
.attr("fill", "red") // TODO
.attr("width", "16")
.attr("height", "16")
.attr("x", "5")
.attr("y", "2")
.attr("style", "cursor:pointer")
.on("click", dissolve),
collapseBtn = bBox.append("rect")
.attr("fill", "red") // TODO
.attr("width", "16")
.attr("height", "16")
.attr("x", "25")
.attr("y", "2")
.attr("style", "cursor:pointer")
.on("click", collapse),
title = bBox.append("text")
.attr("x", "45")
.attr("y", "15")
.attr("fill", "white")
.attr("stroke", "none")
.attr("text-anchor", "left");
if (self._reason) {
title.text(self._reason.text);
}
getObserver().observe(document.getElementById(self._id), {
subtree:true,
attributes:true
@ -413,36 +479,8 @@ function CommunityNode(parent, initial) {
this.shape = shapeAll;
// TMP
this.getSourcePosition = function(e) {
if (self._expanded) {
var p = self.position;
var diff = e._source;
var x = p.x + diff.x;
var y = p.y + diff.y;
var z = p.z + diff.z;
return {
x: x,
y: y,
z: z
}
}
return self.position;
};
// TODO TMP
this.getSourcePosition = getSourcePosition;
this.getTargetPosition = function(e) {
if (self._expanded) {
var p = self.position;
var diff = e._target;
var x = p.x + diff.x;
var y = p.y + diff.y;
var z = p.z + diff.z;
return {
x: x,
y: y,
z: z
}
}
return self.position;
};
this.getTargetPosition = getTargetPosition;
}

11
html/admin/js/graphViewer/graph/nodeReducer.js
View File

@ -114,7 +114,8 @@ function NodeReducer(nodes, edges, prioList) {
_.each(list, function(list, value) {
var reason = {
key: key,
value: value
value: value,
text: key + ": " + value
};
resArray.push({
reason: reason,
@ -132,7 +133,10 @@ function NodeReducer(nodes, edges, prioList) {
if (toSort.length <= numBuckets) {
res = _.map(toSort, function(n) {
return {
reason: {type: "single"},
reason: {
type: "single",
text: "One node"
},
nodes: [n]
};
});
@ -148,7 +152,8 @@ function NodeReducer(nodes, edges, prioList) {
for (i = 0; i < numBuckets; i++) {
res[i] = res[i] || {
reason: {
type: "similar"
type: "similar",
text: "Similar Nodes"
},
nodes: []
};

116
html/admin/js/graphViewer/jasmine_test/specCommunityNode/communityNodeSpec.js
View File

@ -363,8 +363,8 @@
describe('shaping functionality', function() {
var tSpan1, tSpan2, tSpan3, text, g, shaper, colourMapper, box, boxRect,
parent, c, width;
var tSpan1, tSpan2, tSpan3, text, g, shaper, colourMapper, box, boxGroup, boxRect,
parent, c, width, titleBG, disBtn, titleText, colBtn;
beforeEach(function() {
parent = {
@ -407,6 +407,56 @@
return this;
}
};
titleBG = {
attr: function() {
return this;
}
};
disBtn = {
attr: function() {
return this;
},
on: function() {
return this;
}
};
colBtn = {
attr: function() {
return this;
},
on: function() {
return this;
}
};
titleText = {
attr: function() {
return this;
}
};
boxGroup = {
appendCounter: 0,
append: function(name) {
if (name === "rect") {
this.appendCounter++;
switch (this.appendCounter) {
case 1:
return boxRect;
case 2:
return titleBG;
case 3:
return disBtn;
case 4:
return colBtn;
}
}
if (name === "text") {
return titleText;
}
},
attr: function() {
return this;
}
};
text = {
attr: function() {
return this;
@ -440,8 +490,8 @@
if (type === "text") {
return text;
}
if (type === "rect") {
return boxRect;
if (type === "g") {
return boxGroup;
}
}
};
@ -632,20 +682,64 @@
it('should print the bounding box correctly', function() {
spyOn(g, "append").andCallThrough();
spyOn(boxGroup, "append").andCallThrough();
spyOn(boxRect, "attr").andCallThrough();
spyOn(titleBG, "attr").andCallThrough();
spyOn(disBtn, "attr").andCallThrough();
spyOn(disBtn, "on").andCallThrough();
spyOn(colBtn, "attr").andCallThrough();
spyOn(colBtn, "on").andCallThrough();
spyOn(titleText, "attr").andCallThrough();
c.shape(g, shaper.shapeFunc, colourMapper);
expect(g.append).wasCalledWith("rect");
expect(g.append).wasCalledWith("g");
expect(boxGroup.append).wasCalledWith("rect");
expect(boxGroup.append).wasCalledWith("text");
expect(boxGroup.append.calls.length).toEqual(5);
expect(boxRect.attr).wasCalledWith("rx", "8");
expect(boxRect.attr).wasCalledWith("ry", "8");
expect(boxRect.attr).wasCalledWith("fill", "none");
expect(boxRect.attr).wasCalledWith("stroke", "black");
expect(titleBG.attr).wasCalledWith("height", "20");
expect(titleBG.attr).wasCalledWith("rx", "8");
expect(titleBG.attr).wasCalledWith("ry", "8");
expect(titleBG.attr).wasCalledWith("fill", "#686766");
expect(titleBG.attr).wasCalledWith("stroke", "none");
// TODO RECT->Image
expect(disBtn.attr).wasCalledWith("fill", "red"); // TODO
expect(disBtn.attr).wasCalledWith("height", "16");
expect(disBtn.attr).wasCalledWith("width", "16");
expect(disBtn.attr).wasCalledWith("x", "5");
expect(disBtn.attr).wasCalledWith("y", "2");
expect(disBtn.attr).wasCalledWith("style", "cursor:pointer");
expect(disBtn.on).wasCalledWith("click", jasmine.any(Function));
// TODO RECT->Image
expect(colBtn.attr).wasCalledWith("fill", "red"); // TODO
expect(colBtn.attr).wasCalledWith("height", "16");
expect(colBtn.attr).wasCalledWith("width", "16");
expect(colBtn.attr).wasCalledWith("x", "25");
expect(colBtn.attr).wasCalledWith("y", "2");
expect(colBtn.attr).wasCalledWith("style", "cursor:pointer");
expect(colBtn.on).wasCalledWith("click", jasmine.any(Function));
expect(titleText.attr).wasCalledWith("fill", "white");
expect(titleText.attr).wasCalledWith("stroke", "none");
expect(titleText.attr).wasCalledWith("x", "45");
expect(titleText.attr).wasCalledWith("y", "15");
expect(titleText.attr).wasCalledWith("text-anchor", "left");
});
it('should update the box as soon as the dom is ready', function() {
spyOn(boxGroup, "attr").andCallThrough();
spyOn(boxRect, "attr").andCallThrough();
spyOn(titleBG, "attr").andCallThrough();
spyOn(observer, "observe").andCallThrough();
spyOn(observer, "disconnect").andCallThrough();
@ -659,14 +753,14 @@
attributes:true
}
);
observerCB([{attributeName: "transform"}]);
expect(boxGroup.attr).wasCalledWith(
"transform", "translate(" + (box.x - 5) + "," + (box.y - 25) + ")"
);
expect(boxRect.attr).wasCalledWith("width", box.width + 10);
expect(boxRect.attr).wasCalledWith("height", box.height + 10);
expect(boxRect.attr).wasCalledWith("x", box.x - 5);
expect(boxRect.attr).wasCalledWith("y", box.y - 5);
expect(boxRect.attr).wasCalledWith("height", box.height + 30);
expect(titleBG.attr).wasCalledWith("width", box.width + 10);
expect(observer.disconnect).wasCalled();
});