54 lines
1.5 KiB
HTML
54 lines
1.5 KiB
HTML
<script>
|
|
class LDPDisplayMember extends LDPWidget {
|
|
get template() {
|
|
return `
|
|
<div name="${this.name}">
|
|
<img src="${this.value.avatar}"/>
|
|
<span>${this.value.firstname} ${this.value.lastname}</span>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
render() {
|
|
store.get(this.value).then( (value) => {
|
|
this._value = value;
|
|
this.innerHTML = this.template;
|
|
});
|
|
}
|
|
}
|
|
customElements.define("ldp-display-member", LDPDisplayMember);
|
|
</script>
|
|
|
|
<div id="channel" class="view-with-vertical-menu" style="display: none">
|
|
<ldp-router id="channel-page-router" class="vertical-menu border-left" default-route="channel-chat">
|
|
<ldp-route name="channel-chat">
|
|
<i class="fa fa-comment" aria-hidden="true"></i>
|
|
</ldp-route>
|
|
<ldp-route name="channel-detail">
|
|
<i class="fa fa-user" aria-hidden="true"></i>
|
|
</ldp-route>
|
|
</ldp-router>
|
|
|
|
|
|
<div id="channel-detail" style="display: none">
|
|
<ldp-display
|
|
id="channel-info"
|
|
data-fields="name, description, admin, owner"
|
|
value-admin="Administrateur"
|
|
widget-owner="ldp-display-member"
|
|
bind-resources
|
|
></ldp-display>
|
|
|
|
<h2 class="section skills">Participants</h2>
|
|
<ldp-display
|
|
id="chat-members"
|
|
id-suffix="members"
|
|
set-name="firstname, name-separator, lastname"
|
|
value-name-separator=" "
|
|
data-fields="avatar, name"
|
|
widget-avatar="ldp-display-img"
|
|
bind-resources
|
|
></ldp-display>
|
|
</div>
|
|
</div>
|