Mercurial > code > home > repos > streamed-graph

annotate src/graph_view.ts @ 15:7ca4ff2088c3

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
managed to use a newer ts or something, so this includes a bunch of type fixes too
author drewp@bigasterisk.com
date Sun, 08 Dec 2019 23:32:12 -0800
parents 26d3e4860adc
children 9ec3cbc8791a
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
1 // from /my/site/homepage/www/rdf/browse/graphView.js
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
2
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
3 //reference types="./n3.d.ts">
9
26d3e4860adc working on porting graph_view to n3.js. also working on making tests run
drewp@bigasterisk.com
parents: 8
diff changeset
4
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
5 import { html, TemplateResult } from 'lit-html';
9
26d3e4860adc working on porting graph_view to n3.js. also working on making tests run
drewp@bigasterisk.com
parents: 8
diff changeset
6 import { SuffixLabels } from './suffixLabels';
26d3e4860adc working on porting graph_view to n3.js. also working on making tests run
drewp@bigasterisk.com
parents: 8
diff changeset
7
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
8 import { Quad, Term, NamedNode, N3Store } from '../node_modules/@types/n3/index';
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
9 import { DataFactory, Util } from 'n3';
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
10 const { namedNode } = DataFactory;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
11 // import ns from 'n3/src/IRIs';
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
12 // const { rdf } = ns;
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
13
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
14 type TypeToSubjs = Map<NamedNode, Set<NamedNode>>;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
15 function groupByRdfType(graph: N3Store): { byType: TypeToSubjs, untyped: Set<NamedNode> } {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
16 const rdfType = namedNode('rdf:type');
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
17 const byType: TypeToSubjs = new Map(); // type : subjs
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
18 const untyped: Set<NamedNode> = new Set(); // subjs
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
19 graph.forEach((q) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
20 let subjType: NamedNode | null = null;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
21
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
22 graph.forObjects((o: Quad) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
23 if (Util.isNamedNode(o.object)) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
24 subjType = o.object as NamedNode;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
25 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
26 }, q.subject, rdfType, null);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
27
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
28 if (subjType !== null) {
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
29 if (!byType.has(subjType)) {
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
30 byType.set(subjType, new Set());
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
31 }
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
32 (byType.get(subjType) as Set<NamedNode>).add(q.subject as NamedNode);
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
33 } else {
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
34 untyped.add(q.subject as NamedNode);
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
35 }
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
36 }, null, null, null, null);
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
37 return { byType: byType, untyped: untyped };
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
38 }
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
39
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
40
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
41 class NodeDisplay {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
42 labels: SuffixLabels;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
43 constructor(labels: SuffixLabels) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
44 this.labels = labels;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
45 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
46 getHtml(n: Term): TemplateResult {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
47 if (n.termType == "Literal") {
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
48 let dtPart: any = "";
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
49 if (n.datatype) {
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
50 dtPart = html`
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
51 ^^<span class="literalType">
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
52 ${this.getHtml(n.datatype)}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
53 </span>`;
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
54 }
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
55 return html`<span class="literal">${n.value}${dtPart}</span>`;
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
56 }
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
57
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
58 if (n.termType == "NamedNode") {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
59 let dn: string | undefined = this.labels.getLabelForNode(n.value);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
60 if (dn === undefined) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
61 throw new Error(`dn=${dn}`);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
62 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
63 if (dn!.match(/XMLSchema#.*/)) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
64 dn = dn!.replace('XMLSchema#', 'xsd:');
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
65 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
66 if (dn!.match(/rdf-schema#.*/)) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
67 dn = dn!.replace('rdf-schema#', 'rdfs:');
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
68 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
69 return html`<a class="graphUri" href="${n.value}">${dn}</a>`;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
70 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
71
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
72 return html`[${n.termType} ${n.value}]`;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
73 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
74 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
75
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
76 export class GraphView {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
77 url: string;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
78 graph: N3Store;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
79 nodeDisplay: NodeDisplay;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
80 constructor(url: string, graph: N3Store) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
81 this.url = url;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
82 this.graph = graph;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
83
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
84 const labels = new SuffixLabels();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
85 this._addLabelsForAllTerms(labels);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
86 this.nodeDisplay = new NodeDisplay(labels);
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
87 }
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
88
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
89 _addLabelsForAllTerms(labels: SuffixLabels) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
90 return this.graph.forEach((q: Quad) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
91 if (q.subject.termType === "NamedNode") { labels.planDisplayForNode(q.subject); }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
92 if (q.predicate.termType === "NamedNode") { labels.planDisplayForNode(q.predicate); }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
93 if (q.object.termType === "NamedNode") { labels.planDisplayForNode(q.object); }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
94 if (q.object.termType === "Literal" && q.object.datatype) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
95 labels.planDisplayForNode(q.object.datatype);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
96 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
97 }, null, null, null, null);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
98 }
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
99
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
100 _subjBlock(subj: NamedNode) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
101 const predsSet: Set<NamedNode> = new Set();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
102 this.graph.forEach((q: Quad) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
103 predsSet.add(q.predicate as NamedNode);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
104 }, subj, null, null, null);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
105 const preds = Array.from(predsSet.values());
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
106 preds.sort();
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
107 return html`
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
108 <div class="subject">${this.nodeDisplay.getHtml(subj)}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
109 <!-- todo: special section for uri/type-and-icon/label/comment -->
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
110 <div>
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
111 ${preds.map((p) => { return this._predBlock(subj, p); })}
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
112 </div>
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
113 </div>
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
114 `;
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
115 }
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
116
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
117 _objBlock(obj: Term) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
118 return html`
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
119 <div class="object">
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
120 ${this.nodeDisplay.getHtml(obj)} <!-- indicate what source or graph said this stmt -->
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
121 </div>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
122 `;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
123 }
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
124
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
125 _predBlock(subj: NamedNode, pred: NamedNode) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
126 const objsSet = new Set();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
127 this.graph.forEach((q: Quad) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
128 objsSet.add(q.object);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
129 }, subj, pred, null, null);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
130 const objs = Array.from(objsSet.values());
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
131 objs.sort();
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
132 return html`
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
133 <div class="predicate">${this.nodeDisplay.getHtml(pred)}
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
134 <div>
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
135 ${objs.map(this._objBlock.bind(this))}
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
136 </div>
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
137 </div>
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
138 `;
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
139 }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
140
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
141
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
142 // const byTypeBlock = (typeUri) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
143 // const subjs = Array.from(byType.get(typeUri));
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
144 // subjs.sort();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
145
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
146 // const graphCells = new Map(); // [subj, pred] : objs
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
147 // const preds = new Set();
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
148
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
149 // subjs.forEach((subj) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
150 // graph.getQuads({ subject: new NamedNode(subj) }, (q) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
151 // preds.add(q.predicate.toString());
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
152 // const cellKey = subj + '|||' + q.predicate.toString();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
153 // if (!graphCells.has(cellKey)) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
154 // graphCells.set(cellKey, new Set());
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
155 // }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
156 // graphCells.get(cellKey).add(q.object);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
157 // });
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
158 // });
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
159 // const predsList = Array.from(preds);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
160 // predsList.splice(predsList.indexOf('http://www.w3.org/1999/02/22-rdf-syntax-ns#type'), 1);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
161 // // also pull out label, which should be used on 1st column
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
162 // predsList.sort();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
163
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
164 // const thead = () => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
165 // const predColumnHead = (pred) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
166 // return html`<th>${rdfNode(new NamedNode(pred))}</th>`;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
167 // };
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
168 // return html`
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
169 // <thead>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
170 // <tr>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
171 // <th></th>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
172 // ${predsList.map(predColumnHead)}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
173 // </tr>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
174 // </thead>`;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
175 // };
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
176
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
177 // const instanceRow = (subj) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
178 // const cell = (pred) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
179 // const objs = graphCells.get(subj + '|||' + pred);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
180 // if (!objs) {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
181 // return html`<td></td>`;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
182 // }
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
183 // const objsList = Array.from(objs);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
184 // objsList.sort();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
185 // const draw = (obj) => {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
186 // return html`<div>${rdfNode(obj)}</div>`
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
187 // };
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
188 // return html`<td>${objsList.map(draw)}</td>`;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
189 // };
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
190
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
191 // return html`
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
192 // <tr>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
193 // <td>${rdfNode(new NamedNode(subj))}</td>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
194 // ${predsList.map(cell)}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
195 // </tr>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
196 // `;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
197 // };
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
198
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
199 // return html`
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
200 // <div>[icon] ${rdfNode(new NamedNode(typeUri))} resources</div>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
201 // <div class="typeBlockScroll">
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
202 // <table class="typeBlock">
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
203 // ${thead()}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
204 // ${subjs.map(instanceRow)}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
205 // </table>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
206 // </div>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
207 // `;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
208 // };
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
209
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
210 makeTemplate(): TemplateResult {
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
211
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
212 const { byType, untyped } = groupByRdfType(this.graph);
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
213 const typedSubjs = Array.from(byType.keys());
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
214 typedSubjs.sort();
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
215
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
216 const untypedSubjs = Array.from(untyped.values());
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
217 untypedSubjs.sort();
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
218
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
219 return html`
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
220 <link rel="stylesheet" href="../src/streamed-graph.css">
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
221
15
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
222 <section>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
223 <h2>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
224 Current graph (<a href="${this.url}">${this.url}</a>)
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
225 </h2>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
226 <div>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
227 <!-- todo: graphs and provenance.
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
228 These statements are all in the
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
229 <span data-bind="html: $root.createCurie(graphUri())">...</span> graph.-->
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
230 </div>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
231 {typedSubjs.map(byTypeBlock)}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
232 <div class="spoGrid">
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
233 ${untypedSubjs.map(this._subjBlock.bind(this))}
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
234 </div>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
235 </section>
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
236 `;
7ca4ff2088c3 managed to use a newer ts or something, so this includes a bunch of type fixes too
drewp@bigasterisk.com
parents: 9
diff changeset
237 }
8
6fefd287aff9 closer- element now holds a changing graph, but can't draw it yet
drewp@bigasterisk.com
parents:
diff changeset
238 }