Mercurial > code > home > repos > streamed-graph
diff src/streamed-graph.ts @ 3:a7ba8627a7b6
still trying to make imports work. add other files too
author | drewp@bigasterisk.com |
---|---|
date | Wed, 04 Dec 2019 00:09:15 -0800 |
parents | |
children | a668a774b162 |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/streamed-graph.ts Wed Dec 04 00:09:15 2019 -0800 @@ -0,0 +1,91 @@ + +// these are just for timebank- move them out +import '@polymer/polymer/lib/elements/dom-bind.js'; + + +import { PolymerElement, html } from '@polymer/polymer'; +import { customElement, property, computed } from '@polymer/decorators'; +import { render } from 'lit-html'; +// import { graphView } from '/rdf/browse/graphView.js'; +import { StreamedGraphClient } from './streamed_graph_client'; + +@customElement('streamed-graph') +class StreamedGraph extends PolymerElement { + @property({ type: String }) + url: string = ''; + + @property({ type: Object }) + graph: Object; + + @property({ type: Boolean }) + expanded: Boolean = false; + + @computed('expanded') + get expandAction() { + return this.expanded ? '-' : '+'; + } + + @property({ type: String }) + status: String = ''; + + sg: StreamedGraphClient; + graphView: Element; + graphViewDirty = true; + + static get template() { + return html` + <link rel="stylesheet" href="../src/streamed-graph.css"> + <div id="ui"> + <span class="expander"><button on-click="toggleExpand">{{expandAction}}</button></span> + StreamedGraph <a href="{{url}}">[source]</a>: + {{status}} + </div> + <div id="graphView">graph here + </div>`; + } + + ready() { + super.ready(); + this.graphView = this.shadowRoot.getElementById("graphView"); + } + + toggleExpand(ev) { + this.expanded = !this.expanded; + if (this.expanded) { + this.redrawGraph() + } else { + this.graphViewDirty = false; + render(null, this.graphView); + } + } + + redrawGraph() { + this.graphViewDirty = true; + requestAnimationFrame(this._redrawLater.bind(this)); + } + + _onUrl(url) { + // if (this.sg) { this.sg.close(); } + this.sg = new StreamedGraphClient( + url, + this.onGraphChanged.bind(this), + this.set.bind(this, 'status'), + [],//window.NS, + []); + } + + onGraphChanged() { + //this.graph = { version: this.graph.version + 1, graph: this.sg }; + if (this.expanded) { + this.redrawGraph(); + } + } + + _redrawLater() { + if (!this.graphViewDirty) return; + //render(graphView(this.graph.graph), this.graphView); + this.graphViewDirty = false; + } + + +} \ No newline at end of file