Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 2x 2x 1x 1x 1x 1x | // @ts-check
import { select } from 'd3-selection';
import d from 'debug';
const debug = d('ssvg:engine');
import SSVGEngine from './SSVGEngine';
export default class SSVGCustomElement extends HTMLElement {
constructor() {
super();
this._listener = new MutationObserver(this.load.bind(this));
this._listener.observe(this, { childList: true });
/** @type {SSVGEngine|null} */
this._ssvg = null;
/** @type {ssvg.StateSelection|null} */
this._states = null;
this.load();
}
disconnect() {
this._listener.disconnect();
Eif (this._ssvg) {
this._ssvg.disconnect();
this._ssvg = null;
}
}
load() {
Iif (this._ssvg) {
this._ssvg.disconnect();
this._ssvg = null;
}
const svg = select(this).select('svg');
Eif (!svg.empty()) {
// @ts-ignore: checked on empty() call
this._ssvg = new SSVGEngine(svg.node());
this._states = svg.selectAll('state');
}
}
static register() {
debug('registering s-svg custom Elements');
window.customElements.define("s-svg", SSVGCustomElement);
}
/**
* @param {ssvg.$State} state
*/
updateState(state /*: {} */) {
Iif (!this._states) { return; }
this._states.each(function() { this.updateState(state); });
}
/**
* @param {ssvg.$State} state
*/
setState(state /*: {} */) {
Iif (!this._states) { return; }
this._states.each(function() { this.setState(state); });
}
getState() {
Iif (!this._states) { return; }
const node = this._states.node();
Eif (node) {
return node.getState();
}
return undefined;
}
}
|