diff --git a/package.json b/package.json
index 698370b..a1754dd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "iknow-entity-browser",
- "version": "0.5.12",
+ "version": "0.6.0",
"description": "Visualizer for iKnow entities",
"main": "gulpfile.babel.js",
"scripts": {
diff --git a/src/static/fonts/iknowentitybrowsericons.eot b/src/static/fonts/iknowentitybrowsericons.eot
index 6c162f1..37cef04 100644
Binary files a/src/static/fonts/iknowentitybrowsericons.eot and b/src/static/fonts/iknowentitybrowsericons.eot differ
diff --git a/src/static/fonts/iknowentitybrowsericons.svg b/src/static/fonts/iknowentitybrowsericons.svg
index 6df0a74..5c9aa6d 100644
--- a/src/static/fonts/iknowentitybrowsericons.svg
+++ b/src/static/fonts/iknowentitybrowsericons.svg
@@ -27,4 +27,5 @@
+
diff --git a/src/static/fonts/iknowentitybrowsericons.ttf b/src/static/fonts/iknowentitybrowsericons.ttf
index 9af7921..0650f6b 100644
Binary files a/src/static/fonts/iknowentitybrowsericons.ttf and b/src/static/fonts/iknowentitybrowsericons.ttf differ
diff --git a/src/static/fonts/iknowentitybrowsericons.woff b/src/static/fonts/iknowentitybrowsericons.woff
index 51f6956..ab7334c 100644
Binary files a/src/static/fonts/iknowentitybrowsericons.woff and b/src/static/fonts/iknowentitybrowsericons.woff differ
diff --git a/src/static/index.html b/src/static/index.html
index 831f27c..cb40d72 100644
--- a/src/static/index.html
+++ b/src/static/index.html
@@ -96,6 +96,7 @@
| Spread |
Relation |
Parent |
+ |
diff --git a/src/static/js/graph/index.js b/src/static/js/graph/index.js
index ff4a433..f9d07f1 100644
--- a/src/static/js/graph/index.js
+++ b/src/static/js/graph/index.js
@@ -221,7 +221,7 @@ export function update (g = lastGraph, reset = false) {
node = nodes.selectAll(".node").data(graph.nodes, function (d) { return this._id || d.id; });
node.exit().remove();
let nodeEnter = node.enter().append("g")
- .each(function (d) { this._id = d.id; })
+ .each(function (d) { this._id = d.id; d.element = this; })
.attr("class", d => `node${ d.id === 0 ? " root" : "" } ${ d.type || "unknown" }`)
.classed("selected", (p) => p.selected)
.call(dragger)
diff --git a/src/static/js/tabular/index.js b/src/static/js/tabular/index.js
index aa6d6d0..c7f70eb 100644
--- a/src/static/js/tabular/index.js
+++ b/src/static/js/tabular/index.js
@@ -14,6 +14,16 @@ let sorter = (a, b) => {
return a > b ? sorting.order : a === b ? 0 : -sorting.order;
};
+/**
+ * this: node
+ */
+function switchSelected () {
+ if (!this.element)
+ return;
+ d3.select(this.element).classed("selected", this.selected = !this.selected);
+ updateSelection();
+}
+
function updateSelected () {
let data = getSelection().filter(node => node.type === "entity").sort(sorter),
table = document.querySelector("#tabular-selected");
@@ -30,6 +40,10 @@ function updateSelected () {
(c = row.insertCell(5)).textContent = node.edgeType || "";
c.className = `${ node.edgeType }Item`;
row.insertCell(6).textContent = (node.parent || { label: "root" }).label || "?";
+ let ee = document.createElement("i");
+ ee.className = "icon-close";
+ ee.addEventListener("click", switchSelected.bind(node));
+ row.insertCell(7).appendChild(ee);
}
}
@@ -49,6 +63,10 @@ function updateOthers () {
(c = row.insertCell(5)).textContent = node.edgeType || "";
c.className = `${ node.edgeType }Item`;
row.insertCell(6).textContent = (node.parent || { label: "root" }).label || "?";
+ let ee = document.createElement("i");
+ ee.className = "icon-add";
+ ee.addEventListener("click", switchSelected.bind(node));
+ row.insertCell(7).appendChild(ee);
}
}
@@ -96,7 +114,8 @@ export function init () {
d.tabularToggled = !d.tabularToggled;
d3.select(this).classed("toggled", d.tabularToggled);
d3.select("#table").classed("active", d.tabularToggled);
- updateSelection();
+ if (d.tabularToggled)
+ updateAll();
});
d3.select("#exportCSV").on("click", () => {
diff --git a/src/static/scss/basic.scss b/src/static/scss/basic.scss
index 1a79948..2416cdb 100644
--- a/src/static/scss/basic.scss
+++ b/src/static/scss/basic.scss
@@ -9,7 +9,7 @@ table {
box-shadow: $defaultShadow;
td, th {
- padding: 3px;
+ padding: 1px 2px;
}
td:not(:last-child), th:not(:last-child) {
diff --git a/src/static/scss/icons.scss b/src/static/scss/icons.scss
index 88477a8..c15434f 100644
--- a/src/static/scss/icons.scss
+++ b/src/static/scss/icons.scss
@@ -100,3 +100,6 @@
.icon-undo:before {
content: "\75";
}
+.icon-add:before {
+ content: "\62";
+}
\ No newline at end of file
diff --git a/src/static/scss/tabular.scss b/src/static/scss/tabular.scss
index 0875231..79d2c34 100644
--- a/src/static/scss/tabular.scss
+++ b/src/static/scss/tabular.scss
@@ -55,6 +55,14 @@ $headerHeight: 36px;
content: " ▲";
}
+ &:last-child {
+ border-left: none;
+ }
+
+ &:nth-last-child(2) {
+ border-right: none;
+ }
+
}
#tabular td {
@@ -64,6 +72,46 @@ $headerHeight: 36px;
text-overflow: ellipsis;
}
+#tabular {
+
+ td:last-child {
+
+ width: 15px;
+ border-left: none;
+
+ }
+
+ tr td:last-child {
+ overflow: visible;
+ text-overflow: clip;
+ & i {
+ position: relative;
+ top: 2px;
+ font-size: 13px;
+ height: 13px;
+ display: none;
+ @include transition(none);
+ }
+ }
+
+ tr:hover td:last-child i {
+ display: inline-block;
+ }
+
+ td:nth-last-child(2) {
+ border-right: none;
+ }
+
+}
+
+#tabular-selected {
+
+ tr td:last-child {
+ color: red;
+ }
+
+}
+
#tabular-others {
opacity: 0.6;
@@ -72,4 +120,8 @@ $headerHeight: 36px;
border-top: 1px solid black;
}
+ tr td:last-child {
+ color: green;
+ }
+
}
\ No newline at end of file