Add (optional) properties to edges

README.md

@@ -339,7 +339,7 @@ graph "mygraph" [
 	preview fetch 'person ø
 ]
 ```
-
+ 
 (If you run the `sample4` in the *examples* folder, you'll be a minimal movie database. Running the command `preview` will open up the Desktop app with the image you see above ;-))
 
 ### More complex queries

sql/filters/edgePropertyWithValue.sql

@@ -0,0 +1 @@
+(json_extract(edges.properties, ?)|collate| |symb| |val|)

sql/filters/edgeWithAny.sql

@@ -1 +1 @@
-(edges.tag=? AND (edges.target=? OR edges.source=?))
+(edges.tag=? AND (edges.target=? OR edges.source=?) |searchForProperties|)

sql/filters/edgeWithProperties.sql

@@ -0,0 +1 @@
+(edges.tag=? AND |searchForProperties|)

sql/filters/edgeWithSource.sql

@@ -1 +1 @@
-(edges.tag=? AND edges.source=?)
+(edges.tag=? AND edges.source=? |searchForProperties|)

sql/filters/edgeWithTarget.sql

@@ -1 +1 @@
-(edges.tag=? AND edges.target=?)
+(edges.tag=? AND edges.target=? |searchForProperties|)

sql/procs/createEdge.sql

@@ -1,2 +1,2 @@
-INSERT INTO edges (tag, source, target) 
-VALUES (?, ?, ?)
+INSERT INTO edges (tag, properties, source, target) 
+VALUES (?, ?, ?, ?)

sql/procs/getRelatedNodes.sql

@@ -1,4 +1,4 @@
-SELECT nodes.id, nodes.tag, nodes.properties, source, target, edges.tag, edges.id AS label
+SELECT nodes.id, nodes.tag, nodes.properties, source, target, edges.tag, edges.id AS label, edges.properties
 FROM edges 
 INNER JOIN nodes
 ON nodes.id=edges.source OR nodes.id=edges.target

sql/schema.sql

@@ -14,6 +14,7 @@ DROP TABLE IF EXISTS edges;
 CREATE TABLE edges (
     id          INTEGER PRIMARY KEY,
     tag         TEXT,
+    properties  JSON NOT NULL,
     source      INTEGER,
     target      INTEGER,
     FOREIGN KEY (source) REFERENCES nodes(id),

ui/index.html

@@ -540,12 +540,17 @@
                                             </li>
                                         </template>
                                         <template v-else-if="graph.hovered.edge != null">
-                                            <li class="is-active edged">
+                                            <li class="is-active" v-for="(value, key) in graph.hovered.edge.properties">
+                                                <a>
+                                                    <b>{{key}}:</b>{{value}}
+                                                </a>
+                                            </li>
+                                            <!-- <li class="is-active edged">
                                                 <a><b>{{graph.data.nodes.get(graph.hovered.edge.from).tag}}:</b>{{graph.data.nodes.get(graph.hovered.edge.from).fullLabel}}</a>
                                             </li>
                                             <li class="is-active edged">
                                                 <a><b>{{graph.data.nodes.get(graph.hovered.edge.to).tag}}:</b>{{graph.data.nodes.get(graph.hovered.edge.to).fullLabel}}</a>
-                                            </li>
+                                            </li> -->
                                         </template>
                                         <template v-else>
                                             <li class="is-active">
@@ -561,12 +566,17 @@
                                         </li>
                                     </template>
                                     <template v-else-if="graph.selected.node.length==0 && graph.selected.edge.length==1">
-                                        <li class="is-active edged">
+                                        <li class="is-active" v-for="(value, key) in graph.selected.edge[0].properties">
+                                            <a>
+                                                <b>{{key}}:</b>{{value}}
+                                            </a>
+                                        </li>
+                                        <!-- <li class="is-active edged">
                                             <a><b>{{graph.data.nodes.get(graph.selected.edge[0].from).tag}}:</b>{{graph.data.nodes.get(graph.selected.edge[0].from).fullLabel}}</a>
                                         </li>
                                         <li class="is-active edged">
                                             <a><b>{{graph.data.nodes.get(graph.selected.edge[0].to).tag}}:</b>{{graph.data.nodes.get(graph.selected.edge[0].to).fullLabel}}</a>
-                                        </li>
+                                        </li> -->
                                     </template>
                                     <template v-else>
                                         <li class="is-active">