matrix-dimension/web/app/widget-wrappers/sticker-picker/sticker-picker.component.html
Travis Ralston 109bceb924 Make ngbtooltip happier and not remount
When we use detectChanges(), ngbTooltip gets annoyed at us and stops working correctly. This commit also cleans up some of the attributes on the sticker button.

Fixes https://github.com/turt2live/matrix-dimension/issues/276
2019-04-17 22:58:18 -06:00

34 lines
1.8 KiB
HTML

<div class="wrapper">
<div class="control-page" *ngIf="isLoading || authError">
<div class="loading-badge" *ngIf="isLoading">
<my-spinner></my-spinner>
</div>
<div class="auth-error" *ngIf="!isLoading && authError">
There was a problem authenticating your use of this sticker picker. Please make sure you're using a client
that has Dimension enabled and correctly set up.
</div>
</div>
<div class="no-stickers" *ngIf="!isLoading && !authError && (!packs || packs.length === 0)">
<img src="/img/no_stickers.png" />
<span class="message">You have no sticker packs.</span>
<button class="btn btn-link btn-sm" (click)="openIntegrationManager()">Add some stickers</button>
</div>
<div class="sticker-picker" *ngIf="!isLoading && !authError">
<div class="sticker-pack" *ngFor="let pack of packs trackById">
<div class="header">
<span class="title">{{ pack.displayName }}</span>
<span class="license"><a [href]="pack.license.urlPath" target="_blank">{{ pack.license.name }}</a></span>
<span class="author" *ngIf="pack.author.type !== 'none'">
<a [href]="pack.author.reference" target="_blank">{{ pack.author.name }}</a>
</span>
</div>
<div class="stickers">
<div class="sticker" *ngFor="let sticker of pack.stickers trackById" (click)="sendSticker(sticker, pack)">
<img [src]="getThumbnailUrl(sticker.thumbnail.mxc, 48, 48)" width="48" height="48" class="image"
[alt]="sticker.name" [ngbTooltip]="sticker.name" placement="bottom" />
</div>
</div>
</div>
</div>
</div>