39 lines
1006 B
JavaScript
39 lines
1006 B
JavaScript
|
import {LitElement, html} from './lit-all.min.js';
|
||
|
|
import * as tfrpc from '/static/tfrpc.js';
|
||
|
|
import {styles} from './tf-styles.js';
|
||
|
|
|
||
|
|
class TfUserElement extends LitElement {
|
||
|
|
static get properties() {
|
||
|
|
return {
|
||
|
|
id: {type: String},
|
||
|
|
users: {type: Object},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
static styles = styles;
|
||
|
|
|
||
|
|
constructor() {
|
||
|
|
super();
|
||
|
|
this.id = null;
|
||
|
|
this.users = {};
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
if (this.users[this.id]) {
|
||
|
|
let image = this.users[this.id].image;
|
||
|
|
image = typeof(image) == 'string' ? image : image?.link;
|
||
|
|
return html`
|
||
|
|
<div style="display: inline-block; font-weight: bold">
|
||
|
|
<img style="width: 2em; height: 2em; vertical-align: middle; border-radius: 50%" src="${'/' + image + '/view'}">
|
||
|
|
<a target="_top" href=${'#' + this.id}>${this.users[this.id].name}</a>
|
||
|
|
</div>`;
|
||
|
|
} else {
|
||
|
|
return html`
|
||
|
|
<div style="display: inline-block; font-weight: bold">
|
||
|
|
<a target="_top" href=${'#' + this.id}>${this.id}</a>
|
||
|
|
</div>`;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
customElements.define('tf-user', TfUserElement);
|