107 lines
8.0 KiB
HTML
107 lines
8.0 KiB
HTML
<ion-header>
|
|
<ion-navbar core-back-button>
|
|
<ion-title>{{ 'addon.messages.messages' | translate }}</ion-title>
|
|
<ion-buttons end>
|
|
<button ion-button icon-only (click)="gotoSearch()" [attr.aria-label]="'addon.messages.search' | translate">
|
|
<ion-icon name="search"></ion-icon>
|
|
</button>
|
|
<button ion-button icon-only (click)="gotoSettings($event)" [attr.aria-label]="'addon.messages.messagepreferences' | translate">
|
|
<ion-icon name="cog"></ion-icon>
|
|
</button>
|
|
<!-- Add an empty context menu so discussion page can add items in split view, otherwise the menu disappears in some cases. -->
|
|
<core-context-menu></core-context-menu>
|
|
</ion-buttons>
|
|
</ion-navbar>
|
|
</ion-header>
|
|
<core-split-view>
|
|
<ion-content class="core-expand-max">
|
|
<ion-refresher [enabled]="loaded" (ionRefresh)="refreshData($event)">
|
|
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
|
|
</ion-refresher>
|
|
|
|
<core-loading [hideUntil]="loaded" [message]="loadingMessage">
|
|
<ion-list>
|
|
<a ion-item text-wrap (click)="gotoContacts($event)" [attr.aria-label]="'addon.messages.contacts' | translate" class="addon-message-discussion">
|
|
<ion-icon name="person" item-start></ion-icon>
|
|
<h2>{{ 'addon.messages.contacts' | translate }}</h2>
|
|
<ion-badge *ngIf="contactRequestsCount > 0" item-end>{{contactRequestsCount}}</ion-badge>
|
|
</a>
|
|
<!-- Favourite conversations. -->
|
|
<ion-item-divider text-wrap *ngIf="favourites.conversations" (click)="toggle(favourites)" class="core-expandable">
|
|
<core-icon *ngIf="!favourites.expanded" name="fa-caret-right" item-start></core-icon>
|
|
<core-icon *ngIf="favourites.expanded" name="fa-caret-down" item-start></core-icon>
|
|
{{ 'core.favourites' | translate }} ({{ favourites.count }})
|
|
<ion-badge item-end *ngIf="favourites.unread">{{ favourites.unread }}</ion-badge>
|
|
</ion-item-divider>
|
|
<div *ngIf="favourites.conversations && favourites.expanded">
|
|
<ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: favourites.conversations}"></ng-container>
|
|
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
|
|
<core-infinite-loading [enabled]="favourites.canLoadMore" (action)="loadMoreConversations(favourites, $event)" [error]="favourites.loadMoreError"></core-infinite-loading>
|
|
<ion-item text-wrap *ngIf="favourites.conversations.length == 0">
|
|
<p>{{ 'addon.messages.nofavourites' | translate }}</p>
|
|
</ion-item>
|
|
</div>
|
|
|
|
<!-- Group conversations. -->
|
|
<ion-item-divider text-wrap *ngIf="group.conversations" (click)="toggle(group)" class="core-expandable">
|
|
<core-icon *ngIf="!group.expanded" name="fa-caret-right" item-start></core-icon>
|
|
<core-icon *ngIf="group.expanded" name="fa-caret-down" item-start></core-icon>
|
|
{{ 'addon.messages.groupconversations' | translate }} ({{ group.count }})
|
|
<ion-badge item-end *ngIf="group.unread">{{ group.unread }}</ion-badge>
|
|
</ion-item-divider>
|
|
<div *ngIf="group.conversations && group.expanded">
|
|
<ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: group.conversations}"></ng-container>
|
|
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
|
|
<core-infinite-loading [enabled]="group.canLoadMore" (action)="loadMoreConversations(group, $event)" [error]="group.loadMoreError"></core-infinite-loading>
|
|
<ion-item text-wrap *ngIf="group.conversations.length == 0">
|
|
<p>{{ 'addon.messages.nogroupconversations' | translate }}</p>
|
|
</ion-item>
|
|
</div>
|
|
|
|
<ion-item-divider text-wrap *ngIf="individual.conversations" (click)="toggle(individual)" class="core-expandable">
|
|
<core-icon *ngIf="!individual.expanded" name="fa-caret-right" item-start></core-icon>
|
|
<core-icon *ngIf="individual.expanded" name="fa-caret-down" item-start></core-icon>
|
|
{{ 'addon.messages.individualconversations' | translate }} ({{ individual.count }})
|
|
<ion-badge item-end *ngIf="individual.unread">{{ individual.unread }}</ion-badge>
|
|
</ion-item-divider>
|
|
<div *ngIf="individual.conversations && individual.expanded">
|
|
<ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: individual.conversations}"></ng-container>
|
|
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
|
|
<core-infinite-loading [enabled]="individual.canLoadMore" (action)="loadMoreConversations(individual, $event)" [error]="individual.loadMoreError"></core-infinite-loading>
|
|
<ion-item text-wrap *ngIf="individual.conversations.length == 0">
|
|
<p>{{ 'addon.messages.noindividualconversations' | translate }}</p>
|
|
</ion-item>
|
|
</div>
|
|
</ion-list>
|
|
</core-loading>
|
|
</ion-content>
|
|
</core-split-view>
|
|
|
|
<!-- Template to render a list of conversations. -->
|
|
<ng-template #conversationsTemplate let-conversations="conversations">
|
|
<a ion-item text-wrap *ngFor="let conversation of conversations" [title]="conversation.name" (click)="gotoConversation(conversation.id, conversation.userid)" [class.core-split-item-selected]="(conversation.id && conversation.id == selectedConversationId) || (conversation.userid && conversation.userid == selectedUserId)" class="addon-message-discussion" id="addon-message-conversation-{{ conversation.id ? conversation.id : 'user-' + conversation.userid }}">
|
|
<!-- Group conversation image. -->
|
|
<ion-avatar item-start *ngIf="conversation.type != typeIndividual">
|
|
<img [src]="conversation.imageurl" [alt]="conversation.name" core-external-content onError="this.src='assets/img/group-avatar.png'">
|
|
</ion-avatar>
|
|
|
|
<!-- Avatar for individual conversations. -->
|
|
<ion-avatar *ngIf="conversation.type == typeIndividual" core-user-avatar [user]="conversation.otherUser" [linkProfile]="false" [checkOnline]="conversation.showonlinestatus" item-start></ion-avatar>
|
|
|
|
<h2>
|
|
<core-format-text [text]="conversation.name"></core-format-text>
|
|
<core-icon name="fa-ban" *ngIf="conversation.isblocked" [attr.aria-label]="'addon.messages.contactblocked' | translate"></core-icon>
|
|
</h2>
|
|
<ion-note *ngIf="conversation.lastmessagedate > 0 || conversation.unreadcount">
|
|
<ion-badge *ngIf="conversation.unreadcount > 0">{{ conversation.unreadcount }}</ion-badge>
|
|
<span *ngIf="conversation.lastmessagedate > 0">{{conversation.lastmessagedate | coreDateDayOrTime}}</span>
|
|
</ion-note>
|
|
<p *ngIf="conversation.subname"><core-format-text [text]="conversation.subname"></core-format-text></p>
|
|
<p class="addon-message-last-message">
|
|
<span *ngIf="conversation.sentfromcurrentuser" class="addon-message-last-message-user">{{ 'addon.messages.you' | translate }}</span>
|
|
<core-format-text *ngIf="conversation.type != typeIndividual && conversation.members[0]" [text]="conversation.members[0].fullname + ':'" class="addon-message-last-message-user"></core-format-text>
|
|
<core-format-text clean="true" singleLine="true" [text]="conversation.lastmessage" class="addon-message-last-message-text"></core-format-text>
|
|
</p>
|
|
</a>
|
|
</ng-template>
|