Mercurial > code > home > repos > streamed-graph

comparison src/index.ts @ 80:7c93e17b1111

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
more fixes, more original code uncommented
author drewp@bigasterisk.com
date Wed, 17 Nov 2021 15:00:17 -0800
parents 0c188ed3bcd8
children b973d7f95fdf
comparison
equal deleted inserted replaced
79:0c188ed3bcd8 80:7c93e17b1111
3 3
4 // import { Store } from 'n3'; 4 // import { Store } from 'n3';
5 5
6 6
7 // import { GraphView } from './graph_view'; 7 // import { GraphView } from './graph_view';
8 // import { StreamedGraphClient } from './streamed_graph_client'; 8 import { StreamedGraphClient } from './streamed_graph_client';
9 // import style from './style.styl'; 9 // import style from './style.styl';
10 10
11 // export * from "./graph_queries"; 11 // export * from "./graph_queries";
12 12
13 // export interface VersionedGraph { 13 // export interface VersionedGraph {
15 // store: Store; 15 // store: Store;
16 // } 16 // }
17 17
18 @customElement("streamed-graph") 18 @customElement("streamed-graph")
19 export class StreamedGraph extends LitElement { 19 export class StreamedGraph extends LitElement {
20 // @property({ type: String }) 20
21 // url: string = ""; 21 @property({ type: String })
22 url: string = "";
22 23
23 // @property({ type: Object }) 24 // @property({ type: Object })
24 // graph!: VersionedGraph; 25 // graph!: VersionedGraph;
25 26
26 // @property({ type: Boolean }) 27 @property({ type: Boolean })
27 // expanded: boolean = false; 28 expanded: boolean = false;
28 29
29 // // @computed("expanded")
30 // // get expandAction() {
31 // // return this.expanded ? "-" : "+";
32 // // }
33 30
34 // @property({ type: String }) 31 @property({ type: String })
35 // status: string = ""; 32 status: string = "";
36 33
37 // sg!: StreamedGraphClient; 34 sg!: StreamedGraphClient;
38 // graphViewEl!: Element; 35 // graphViewEl!: Element;
39 // graphViewDirty = true; 36 // graphViewDirty = true;
40 37
41 // static get template() { 38 render() {
42 // return html` 39 const expandAction = this.expanded ? '-' : '+';
43 // <div id="ui"> 40 return html`
44 // <span class="expander" 41 <div id="ui">
45 // ><button on-click="toggleExpand">{{expandAction}}</button></span 42 <span class="expander"
46 // > 43 ><button @click="${this.toggleExpand}">${expandAction}</button></span
47 // StreamedGraph <a href="{{url}}">[source]</a>: {{status}} 44 >
48 // </div> 45 StreamedGraph <a href="${this.url}">[source]</a>: ${this.status}
49 // <div id="graphView"></div> 46 </div>
50 // ` 47 <div id="graphView"></div>
51 // ; 48 `
52 // } 49 ;
50 }
53 51
54 // connectedCallback() { 52 connectedCallback() {
55 // super.connectedCallback(); 53 super.connectedCallback();
56 // const emptyStore = new Store(); 54 // const emptyStore = new Store();
57 // this.graph = { version: -1, store: emptyStore }; 55 // this.graph = { version: -1, store: emptyStore };
58 // this.graphViewEl = (this.shadowRoot as ShadowRoot).getElementById( 56 // this.graphViewEl = (this.shadowRoot as ShadowRoot).getElementById(
59 // "graphView" 57 // "graphView"
60 // ) as Element; 58 // ) as Element;
61 59
62 // this._onUrl(this.url); // todo: watch for changes and rebuild 60 this._onUrl(this.url); // todo: watch for changes and rebuild
63 // if (this.expanded) { 61 if (this.expanded) {
64 // this.redrawGraph(); 62 // this.redrawGraph();
65 // } 63 }
66 // } 64 }
67 65
68 // toggleExpand() { 66 toggleExpand() {
69 // this.expanded = !this.expanded; 67 this.expanded = !this.expanded;
70 // if (this.expanded) { 68 // if (this.expanded) {
71 // this.redrawGraph(); 69 // this.redrawGraph();
72 // } else { 70 // } else {
73 // this.graphViewDirty = false; 71 // this.graphViewDirty = false;
74 // this._graphAreaClose(); 72 // this._graphAreaClose();
75 // } 73 // }
76 // } 74 }
77 75
78 // redrawGraph() { 76 // redrawGraph() {
79 // this.graphViewDirty = true; 77 // this.graphViewDirty = true;
80 // requestAnimationFrame(this._redrawLater.bind(this)); 78 // requestAnimationFrame(this._redrawLater.bind(this));
81 // } 79 // }
82 80
83 // _onUrl(url: string) { 81 _onUrl(url: string) {
84 // if (this.sg) { 82 if (this.sg) {
85 // this.sg.close(); 83 this.sg.close();
86 // } 84 }
87 // this.sg = new StreamedGraphClient( 85 this.sg = new StreamedGraphClient(
88 // url, 86 url,
89 // this.onGraphChanged.bind(this), 87 this.onGraphChanged.bind(this),
90 // function(st){},//this.set.bind(this, "status"), 88 (st) => {this.status = st},
91 // [], //window.NS, 89 [], //window.NS,
92 // [] 90 []
93 // ); 91 );
94 // } 92 }
95 93
96 // onGraphChanged() { 94 onGraphChanged() {
97 // this.graph = { 95 // this.graph = {
98 // version: this.graph.version + 1, 96 // version: this.graph.version + 1,
99 // store: this.sg.store 97 // store: this.sg.store
100 // }; 98 // };
101 // if (this.expanded) { 99 // if (this.expanded) {
102 // this.redrawGraph(); 100 // this.redrawGraph();
103 // } 101 // }
104 // this.dispatchEvent( 102 // this.dispatchEvent(
105 // new CustomEvent("graph-changed", { detail: { graph: this.graph } }) 103 // new CustomEvent("graph-changed", { detail: { graph: this.graph } })
106 // ); 104 // );
107 // } 105 }
108 106
109 // _redrawLater() { 107 // _redrawLater() {
110 // if (!this.graphViewDirty) return; 108 // if (!this.graphViewDirty) return;
111 109
112 // if ((this.graph as VersionedGraph).store && this.graph.store) { 110 // if ((this.graph as VersionedGraph).store && this.graph.store) {