Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Comparing changes

Choose two branches to see what's changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
base fork: arcusfelis/relatio
base: 6b636c910b
...
head fork: arcusfelis/relatio
compare: 6ebd40615d
Checking mergeability… Don't worry, you can still create the pull request.
  • 2 commits
  • 4 files changed
  • 0 commit comments
  • 1 contributor
View
24 priv/css_src/relatio.css
@@ -180,22 +180,29 @@ a {
margin-left: 14pt;
}
+.cb-block ul {
+ /* Cancel margin for a content block with a header checkbox. */
+ margin-left: 0px;
+}
+
+.cb-block {
+ /* Specify margin for a whole block with a header checkbox. */
+ margin-left: 20px;
+}
+
/* http://stackoverflow.com/questions/8573574/cancelling-text-align-justify-for-certain-parts-of-text */
.active-block .header-closed {
display: none;
}
-.header-closed {
+.active-block .header-opened,
+.header-closed,
+.header-group {
/* cancel justify */
text-justify: none;
display: inline-block;
}
-.active-block .header-opened {
- /* cancel justify */
- text-justify: none;
- display: inline-block;
-}
.header-opened {
display: none;
}
@@ -422,7 +429,6 @@ body.world li {
.checkbox:before {
font-size: 16pt;
position: relative;
- left: -6pt;
content: "\2610"; // ☐
}
.checkbox.selected:before {
@@ -433,6 +439,10 @@ body.world li {
color: white;
}
+.hovered-group-cb .checkbox {
+ color: white;
+}
+
body.shift-pressed .checkbox.will-be-selected {
color: white;
}
View
51 priv/html/index.html
@@ -88,30 +88,39 @@
Application <span class="application-name">ApplicationName</span>
</div>
- <div id="modules" class="sub-block active-block">
+ <div id="modules" class="sub-block active-block cb-block">
<div class="sub-block-header">
+ <span class="header-group">
+ <span class="checkbox group-checkbox"></span>
<a tabindex="0" class="header-closed">Modules&hellip;</a>
<a tabindex="0" class="header-opened">Modules:</a>
- <span class="module-count header-count-info"
- title="Total module count">
- </span>
+ </span>
+ <span class="module-count header-count-info"
+ title="Total module count">
+ </span>
</div>
<div id="module-list" class="content-block"></div>
</div>
- <div id="directions-out" class="sub-block active-block">
+ <div id="directions-out" class="sub-block active-block cb-block">
<div class="sub-block-header">
+ <span class="header-group">
+ <span class="checkbox group-checkbox"></span>
<a tabindex="0" class="header-closed">Calls to&hellip;</a>
<a tabindex="0" class="header-opened">Calls to:</a>
- <span class="direction-out-count header-count-info"></span>
+ </span>
+ <span class="direction-out-count header-count-info"></span>
</div>
<div id="directions-list-out" class="content-block"></div>
</div>
- <div id="directions-in" class="sub-block active-block">
+ <div id="directions-in" class="sub-block active-block cb-block">
<div class="sub-block-header">
- <a tabindex="0" class="header-closed">Called from&hellip;</a>
- <a tabindex="0" class="header-opened">Called from:</a>
+ <span class="header-group">
+ <span class="checkbox group-checkbox"></span>
+ <a tabindex="0" class="header-closed">Called from&hellip;</a>
+ <a tabindex="0" class="header-opened">Called from:</a>
+ </span>
<span class="direction-in-count header-count-info"></span>
</div>
<div id="directions-list-in" class="content-block"></div>
@@ -121,20 +130,26 @@
<input type="text" id="search-field" />
<div id="search-pane" class="pane">
<div id="search-results">
- <div id="applications" class="sub-block active-block">
- <div class="sub-block-header">
- <a tabindex="0" class="header-closed">Applications&hellip;</a>
- <a tabindex="0" class="header-opened">Applications:</a>
- <span class="application-count header-count-info"></span>
- </div>
- <div id="application-list" class="content-block"></div>
+ <div id="applications" class="sub-block active-block cb-block">
+ <div class="sub-block-header">
+ <span class="header-group">
+ <span class="checkbox group-checkbox"></span>
+ <a tabindex="0" class="header-closed">Applications&hellip;</a>
+ <a tabindex="0" class="header-opened">Applications:</a>
+ </span>
+ <span class="application-count header-count-info"></span>
+ </div>
+ <div id="application-list" class="content-block"></div>
</div>
- <div id="modules" class="sub-block active-block">
+ <div id="modules" class="sub-block active-block cb-block">
<div class="sub-block-header">
+ <span class="header-group">
+ <span class="checkbox group-checkbox"></span>
<a tabindex="0" class="header-closed">Modules&hellip;</a>
<a tabindex="0" class="header-opened">Modules:</a>
- <span class="module-count header-count-info"></span>
+ </span>
+ <span class="module-count header-count-info"></span>
</div>
<div id="module-list" class="content-block"></div>
</div>
View
19 priv/js_src/relatio.js
@@ -34,12 +34,18 @@ sigma.publicPrototype.borderNodes = function(onlyVisibleNodes) {
return {"top": topNode, "bottom": bottomNode, "left": leftNode, "right": rightNode};
}
-
sigma.publicPrototype.getNodeById = function(nid) {
var nodes = this.getNodes([nid]);
return nodes[0];
}
+sigma.publicPrototype.forAllNodes = function(fun, nids) {
+ var graph = this._core.graph;
+ return nids.every(function(nid) {
+ return fun(graph.nodesIndex[nid]);
+ });
+}
+
sigma.publicPrototype.function2moduleNode = function(functionNode) {
var moduleNode;
var fid = functionNode.id;
@@ -348,6 +354,7 @@ sigma.publicPrototype.optimalScale = function(rightPanelSize) {
sigma.publicPrototype.saveCurrentPosition = function() {
+ var si = this;
var n0 = si.getNodeById('zero');
var n1 = si.getNodeById('one');
var m = si._core.mousecaptor;
@@ -368,6 +375,7 @@ sigma.publicPrototype.saveCurrentPosition = function() {
sigma.publicPrototype.setPosition = function(pos) {
+ var si = this;
n0 = si.getNodeById('zero');
n1 = si.getNodeById('one');
@@ -658,6 +666,15 @@ var Tip = function(si)
};
};
+$.fn.dataArray = function(key) {
+ var arr = [];
+ for (var i = 0; i < this.length; i++) {
+ var val = $(this[i]).data(key);
+ if (val)
+ arr.push(val);
+ }
+ return arr;
+}
/* JSP (scrollbars) EXTENSIONS FOR jQuery */
$.fn.activateAutoResizeMonitor = function() {
View
153 priv/js_src/relatio.world.js
@@ -1,3 +1,60 @@
+sigma.publicPrototype.applicationIds2modulesIds = function(app_ids) {
+ var mod_node_ids = [];
+ this.iterEdges(function(e) {
+ if (e.attr.edge_type == "am" && ~app_ids.indexOf(e.target)) {
+ mod_node_ids.push(e.source);
+ }
+ });
+ return mod_node_ids;
+}
+
+sigma.publicPrototype.moduleIds2moduleIds = function(ids) {
+ var module_node_ids = [];
+ this.iterEdges(function(e) {
+ if (!e.attr.edge_type) // call edge
+ {
+ if (~ids.indexOf(e.target))
+ module_node_ids.push(e.source);
+ else if (~ids.indexOf(e.source))
+ module_node_ids.push(e.target);
+ }
+ });
+ return module_node_ids;
+}
+
+sigma.publicPrototype.moduleIds2applicationIds = function(module_ids) {
+ var app_ids = [];
+ this.iterEdges(function(e) {
+ if (e.attr.edge_type == "am" && ~module_ids.indexOf(e.source))
+ app_ids.push(e.target);
+ });
+ return app_ids;
+}
+
+sigma.publicPrototype.selectNodes = function(nids, is_selected) {
+ var si = this;
+ si.iterNodes(function(n) {
+ n.attr.is_selected = is_selected;
+ if (n.attr.node_type == "app")
+ si.selectNodes(si.applicationIds2modulesIds([n.id]), is_selected);
+ }, nids);
+}
+
+sigma.publicPrototype.isSelectedNode = function(n) {
+ var si = this;
+ switch (n.attr.node_type) {
+ case "app":
+ var module_nids = si.applicationIds2modulesIds([n.id]);
+ return si.forAllNodes(function(n) { return n.attr.is_selected; },
+ module_nids);
+ break;
+ default:
+ return n.attr.is_selected;
+ }
+}
+
+
+
relatio.initWorld = function() {
var keyCodes = relatio.keyBoard.keyCodes,
charCodes = relatio.keyBoard.charCodes;
@@ -130,7 +187,10 @@ relatio.initWorld = function() {
if (add_cb)
{
var cb = $("<span class='checkbox'></span>");
- elem.append(cb);
+ cb.data("node_id", nid);
+ if (si.isSelectedNode(node))
+ cb.addClass("selected");
+ elem.append(cb, " ");
}
elem.append(a);
return elem;
@@ -158,25 +218,40 @@ relatio.initWorld = function() {
var last1 = 0; // older
var last2 = 0; // newer
+ cbs.mousedown(function(e) {
+ // This fucuses are neaded to make chromium happy!
+ // This browser tries to select text beetween the two elements.
+ $(this).next().focus();
+ });
+
cbs.click(function(e) {
+ // Set a focus on a link.
+ var t = $(this);
+ t.next().focus();
var cur = cbs.index(this);
if (last2 != cur) {
last1 = last2;
last2 = cur;
}
+ var is_selected = !t.hasClass("selected");
+ var node_ids;
if (e.shiftKey) {
var min = Math.min(last1, cur);
var max = Math.max(last1, cur);
var sel = cbs.slice(min, max+1);
- if ($(this).hasClass("selected"))
- sel.removeClass("selected");
- else
+ if (is_selected)
sel.addClass("selected");
+ else
+ sel.removeClass("selected");
+ node_ids = sel.dataArray("node_id");
}
else
{
- $(this).toggleClass("selected");
+ t.toggleClass("selected");
+ node_ids = [t.data("node_id")];
}
+ // Change `is_selected` attribute for each node.
+ si.selectNodes(node_ids, is_selected);
return false;
});
@@ -197,38 +272,6 @@ relatio.initWorld = function() {
return ul;
}
- var applicationIds2modulesIds = function(si, app_ids) {
- var mod_node_ids = [];
- si.iterEdges(function(e) {
- if (e.attr.edge_type == "am" && ~app_ids.indexOf(e.target)) {
- mod_node_ids.push(e.source);
- }
- });
- return mod_node_ids;
- }
-
- var moduleIds2moduleIds = function(si, ids) {
- var module_node_ids = [];
- si.iterEdges(function(e) {
- if (!e.attr.edge_type) // call edge
- {
- if (~ids.indexOf(e.target))
- module_node_ids.push(e.source);
- else if (~ids.indexOf(e.source))
- module_node_ids.push(e.target);
- }
- });
- return module_node_ids;
- }
-
- var moduleIds2applicationIds = function(si, module_ids) {
- var app_ids = [];
- si.iterEdges(function(e) {
- if (e.attr.edge_type == "am" && ~module_ids.indexOf(e.source))
- app_ids.push(e.target);
- });
- return app_ids;
- }
// This function will be called, if a node was clicked.
var activateNode = function(event) {
@@ -267,7 +310,7 @@ relatio.initWorld = function() {
// Change a current set of nodes
current_node_id = node.id;
// Get brothers of the function node.
- current_node_ids = applicationIds2modulesIds(si, [parent_node.id]);
+ current_node_ids = si.applicationIds2modulesIds([parent_node.id]);
break;
case "app":
@@ -309,7 +352,7 @@ relatio.initWorld = function() {
var application_node_ids = ids.concat(donor_node_ids)
.concat(rcpnt_node_ids);
visible_node_ids = module_node_ids.concat(application_node_ids)
- .concat(moduleIds2moduleIds(si, module_node_ids));
+ .concat(si.moduleIds2moduleIds(module_node_ids));
break;
@@ -328,7 +371,7 @@ relatio.initWorld = function() {
});
var module_ids = ids.concat(donor_node_ids).concat(rcpnt_node_ids);
visible_node_ids = module_ids
- .concat(moduleIds2applicationIds(si, module_ids));
+ .concat(si.moduleIds2applicationIds(module_ids));
}
// Pane root element
@@ -1013,6 +1056,36 @@ relatio.initWorld = function() {
// - directly redraw labels (2)
si.draw(-1, 1, 2);
+ $(".group-checkbox").click(function(e) {
+ var cur = $(this);
+ var block = cur.parents(".sub-block:first");
+ var cbs = $(".checkbox", block);
+ var is_selected = !cur.hasClass("selected");
+ if (is_selected)
+ cbs.addClass("selected");
+ else
+ cbs.removeClass("selected");
+ si.selectNodes(cbs.dataArray("node_id"), is_selected);
+ return false;
+ });
+
+ $(".group-checkbox").on("mouseover mouseout", function(e) {
+ var cur = $(this);
+ var blk = cur.parents(".sub-block:first");
+
+ switch (e.type) {
+ case "mouseover":
+ blk.addClass("hovered-group-cb");
+ break;
+
+ case "mouseout":
+ blk.removeClass("hovered-group-cb");
+ break;
+ }
+ return false;
+ });
+
+
$(document).on("keydown keyup", function(e) {
if (e.keyCode == keyCodes.SHIFT) {
switch (e.type) {

No commit comments for this range

Something went wrong with that request. Please try again.