tildefriends/apps/cory/ssb/tf-connections.js

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);