forked from cory/tildefriends
57 lines
1.3 KiB
JavaScript
57 lines
1.3 KiB
JavaScript
|
import {LitElement, html} from './lit-all.min.js';
|
||
|
|
import * as tfrpc from '/static/tfrpc.js';
|
||
|
|
|
||
|
|
class TfConnectionsElement extends LitElement {
|
||
|
|
static get properties() {
|
||
|
|
return {
|
||
|
|
broadcasts: {type: Array},
|
||
|
|
identities: {type: Array},
|
||
|
|
connections: {type: Array},
|
||
|
|
users: {type: Object},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
constructor() {
|
||
|
|
super();
|
||
|
|
let self = this;
|
||
|
|
this.broadcasts = [];
|
||
|
|
this.identities = [];
|
||
|
|
this.connections = [];
|
||
|
|
this.users = {};
|
||
|
|
tfrpc.rpc.getAllIdentities().then(function(identities) {
|
||
|
|
self.identities = identities || [];
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
_emit_change() {
|
||
|
|
let changed_event = new Event('change', {
|
||
|
|
srcElement: this,
|
||
|
|
});
|
||
|
|
this.dispatchEvent(changed_event);
|
||
|
|
}
|
||
|
|
|
||
|
|
changed(event) {
|
||
|
|
this.selected = event.srcElement.value;
|
||
|
|
tfrpc.rpc.localStorageSet('whoami', this.selected);
|
||
|
|
this._emit_change();
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
return html`
|
||
|
|
<h2>Broadcasts</h2>
|
||
|
|
<ul>
|
||
|
|
${this.broadcasts.map(x => html`<li><tf-user id=${x.pubkey} .users=${this.users}></tf-user></li>`)}
|
||
|
|
</ul>
|
||
|
|
<h2>Connections</h2>
|
||
|
|
<ul>
|
||
|
|
${this.connections.map(x => html`<li><tf-user id=${x} .users=${this.users}></tf-user></li>`)}
|
||
|
|
</ul>
|
||
|
|
<h2>Local Accounts</h2>
|
||
|
|
<ul>
|
||
|
|
${this.identities.map(x => html`<li><tf-user id=${x} .users=${this.users}></tf-user></li>`)}
|
||
|
|
</ul>
|
||
|
|
`;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
customElements.define('tf-connections', TfConnectionsElement);
|