changeset 39:f551a089a98f

add back type-block rendering. untested.
author drewp@bigasterisk.com
date Sun, 29 Dec 2019 19:59:08 -0800
parents d4036715028b
children 648bd89f9d47
files src/graph_view.ts
diffstat 1 files changed, 67 insertions(+), 62 deletions(-) [+]
line wrap: on
line diff
--- a/src/graph_view.ts	Sun Dec 29 19:43:25 2019 -0800
+++ b/src/graph_view.ts	Sun Dec 29 19:59:08 2019 -0800
@@ -161,73 +161,78 @@
   }
 
 
-  //   const byTypeBlock = (typeUri) => {
-  //     const subjs = Array.from(byType.get(typeUri));
-  //     subjs.sort();
+  byTypeBlock(byType: TypeToSubjs, typeUri: NamedNode) {
+    const subjSet = byType.get(typeUri);
+      const subjs: Array<NamedNode> = subjSet ? Array.from(subjSet) : [];
+      subjs.sort();
 
-  //     const graphCells = new Map(); // [subj, pred] : objs
-  //     const preds = new Set();
+      const graphCells = new Map<string, Set<Term>>(); // [subj, pred] : objs
+      const makeCellKey = (subj: NamedNode, pred: NamedNode) => subj.value + '|||' + pred.value;
+      const preds = new Set<NamedNode>();
 
-  //     subjs.forEach((subj) => {
-  //       graph.getQuads({ subject: new NamedNode(subj) }, (q) => {
-  //         preds.add(q.predicate.toString());
-  //         const cellKey = subj + '|||' + q.predicate.toString();
-  //         if (!graphCells.has(cellKey)) {
-  //           graphCells.set(cellKey, new Set());
-  //         }
-  //         graphCells.get(cellKey).add(q.object);
-  //       });
-  //     });
-  //     const predsList = Array.from(preds);
-  //     predsList.splice(predsList.indexOf('http://www.w3.org/1999/02/22-rdf-syntax-ns#type'), 1);
-  //     // also pull out label, which should be used on 1st column
-  //     predsList.sort();
+      subjs.forEach((subj: NamedNode) => {
+        this.graph.forEach((q: Quad) => {
+          if (!Util.isNamedNode(q.predicate)) {
+            throw new Error();
+          }
+          preds.add(q.predicate as NamedNode);
+          const cellKey = makeCellKey(subj, q.predicate as NamedNode);
+          if (!graphCells.has(cellKey)) {
+            graphCells.set(cellKey, new Set<Term>());
+          }
+          graphCells.get(cellKey)!.add(q.object);
+        }, subj, null, null, null);
+      });
+      const predsList = Array.from(preds);
+      predsList.splice(predsList.indexOf(new NamedNode('http://www.w3.org/1999/02/22-rdf-syntax-ns#type')), 1);
+      // also pull out label, which should be used on 1st column
+      predsList.sort();
 
-  //     const thead = () => {
-  //       const predColumnHead = (pred) => {
-  //         return html`<th>${rdfNode(new NamedNode(pred))}</th>`;
-  //       };
-  //       return html`
-  //               <thead>
-  //                 <tr>
-  //                   <th></th>
-  //                   ${predsList.map(predColumnHead)}
-  //                 </tr>
-  //               </thead>`;
-  //     };
+      const thead = () => {
+        const predColumnHead = (pred: NamedNode) => {
+          return html`<th>${this.nodeDisplay.getHtml(pred)}</th>`;
+        };
+        return html`
+                <thead>
+                  <tr>
+                    <th></th>
+                    ${predsList.map(predColumnHead)}
+                  </tr>
+                </thead>`;
+      };
 
-  //     const instanceRow = (subj) => {
-  //       const cell = (pred) => {
-  //         const objs = graphCells.get(subj + '|||' + pred);
-  //         if (!objs) {
-  //           return html`<td></td>`;
-  //         }
-  //         const objsList = Array.from(objs);
-  //         objsList.sort();
-  //         const draw = (obj) => {
-  //           return html`<div>${rdfNode(obj)}</div>`
-  //         };
-  //         return html`<td>${objsList.map(draw)}</td>`;
-  //       };
+      const instanceRow = (subj: NamedNode) => {
+        const cell = (pred: NamedNode) => {
+          const objs = graphCells.get(subj + '|||' + pred);
+          if (!objs) {
+            return html`<td></td>`;
+          }
+          const objsList = Array.from(objs);
+          objsList.sort();
+          const draw = (obj: Term) => {
+            return html`<div>${this.nodeDisplay.getHtml(obj)}</div>`
+          };
+          return html`<td>${objsList.map(draw)}</td>`;
+        };
 
-  //       return html`
-  //               <tr>
-  //                 <td>${rdfNode(new NamedNode(subj))}</td>
-  //                 ${predsList.map(cell)}
-  //               </tr>
-  //             `;
-  //     };
+        return html`
+                <tr>
+                  <td>${this.nodeDisplay.getHtml(subj)}</td>
+                  ${predsList.map(cell)}
+                </tr>
+              `;
+      };
 
-  //     return html`
-  //           <div>[icon] ${rdfNode(new NamedNode(typeUri))} resources</div>
-  // <div class="typeBlockScroll">
-  //           <table class="typeBlock">
-  //             ${thead()}
-  //             ${subjs.map(instanceRow)}
-  //           </table>
-  // </div>
-  //         `;
-  //   };
+      return html`
+            <div>[icon] ${this.nodeDisplay.getHtml(typeUri)} resources</div>
+            <div class="typeBlockScroll">
+            <table class="typeBlock">
+              ${thead()}
+              ${subjs.map(instanceRow)}
+            </table>
+            </div>
+          `;
+    };
 
   makeTemplate(): TemplateResult {
 
@@ -250,7 +255,7 @@
             These statements are all in the
             <span data-bind="html: $root.createCurie(graphUri())">...</span> graph.-->
           </div>
-          {typedSubjs.map(byTypeBlock)}
+          ${typedSubjs.map((t: NamedNode) => this.byTypeBlock(byType, t))}
           <div class="spoGrid">
             ${untypedSubjs.map(this._subjBlock.bind(this))}
           </div>