comparison src/graph_view.ts @ 93:955cde1550c3

start the View work: parse view document
author drewp@bigasterisk.com
date Wed, 12 Jan 2022 20:26:57 -0800
parents ac7ad087d474
children a5f53d397526
comparison
equal deleted inserted replaced
92:8db5ba7e12b9 93:955cde1550c3
5 groupByRdfType, 5 groupByRdfType,
6 MultiSubjsTypeBlockLayout, 6 MultiSubjsTypeBlockLayout,
7 predsForSubj, 7 predsForSubj,
8 TypeToSubjs, 8 TypeToSubjs,
9 } from "./tabulate"; 9 } from "./tabulate";
10 import { View } from "./view_loader";
10 11
11 const { namedNode } = DataFactory; 12 const { namedNode } = DataFactory;
12 13
13 // https://github.com/rdfjs/N3.js/issues/265 14 // https://github.com/rdfjs/N3.js/issues/265
14 if ((Literal.prototype as any).hashCode === undefined) { 15 if ((Literal.prototype as any).hashCode === undefined) {
70 } 71 }
71 } 72 }
72 73
73 export class GraphView { 74 export class GraphView {
74 url: string; 75 url: string;
76 view: View;
75 graph: Store; 77 graph: Store;
76 nodeDisplay: NodeDisplay; 78 nodeDisplay: NodeDisplay;
77 constructor(url: string, graph: Store) { 79 constructor(url: string, viewUrl: string, graph: Store) {
78 this.url = url; 80 this.url = url;
81 this.view = new View(viewUrl);
79 this.graph = graph; 82 this.graph = graph;
80 83
81 const labels = new SuffixLabels(); 84 const labels = new SuffixLabels();
82 this._addLabelsForAllTerms(labels); 85 this._addLabelsForAllTerms(labels);
83 this.nodeDisplay = new NodeDisplay(labels); 86 this.nodeDisplay = new NodeDisplay(labels);
204 </table> 207 </table>
205 </div> 208 </div>
206 `; 209 `;
207 } 210 }
208 211
209 makeTemplate(): TemplateResult { 212 async makeTemplate(): Promise<TemplateResult> {
213 await this.view.ready;
210 const { byType, typedSubjs, untypedSubjs } = groupByRdfType(this.graph); 214 const { byType, typedSubjs, untypedSubjs } = groupByRdfType(this.graph);
211 215 let viewTitle = html` (no view)`;
216 if (this.view.url) {
217 viewTitle = html` using view <a href="${this.view.url}">${this.view.label()}</a>`;
218 }
212 return html` 219 return html`
213 <section> 220 <section>
214 <h2>Current graph (<a href="${this.url}">${this.url}</a>)</h2> 221 <h2>
222 Current graph (<a href="${this.url}">${this.url}</a>)${viewTitle}
223 </h2>
215 <div> 224 <div>
216 <!-- todo: graphs and provenance. 225 <!-- todo: graphs and provenance.
217 These statements are all in the 226 These statements are all in the
218 <span data-bind="html: $root.createCurie(graphUri())">...</span> graph.--> 227 <span data-bind="html: $root.createCurie(graphUri())">...</span> graph.-->
219 </div> 228 </div>