39 lines
1.1 KiB
HTML
39 lines
1.1 KiB
HTML
<mat-progress-spinner *ngIf="images === null"></mat-progress-spinner>
|
|
|
|
<h2 class="text-center" *ngIf="images !== null && images.length <= 0">
|
|
There are no images to display
|
|
</h2>
|
|
|
|
<ng-container *ngIf="images !== null && images.length > 0">
|
|
<masonry [columns]="columns">
|
|
<div *ngFor="let image of images" class="m-2" masonry-item>
|
|
<mat-card>
|
|
<mat-card-header>
|
|
<mat-card-title>{{ image.file_name | truncate }}</mat-card-title>
|
|
<mat-card-subtitle>
|
|
Uploaded {{ image.created | amTimeAgo }}
|
|
</mat-card-subtitle>
|
|
</mat-card-header>
|
|
<picsur-img
|
|
mat-card-image
|
|
[src]="getThumbnailUrl(image)"
|
|
alt="Image uploaded by you"
|
|
>
|
|
</picsur-img>
|
|
<mat-card-actions>
|
|
<button mat-stroked-button (click)="viewImage(image)">VIEW</button>
|
|
<button mat-button color="warn" (click)="deleteImage(image)">
|
|
DELETE
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|
|
</div>
|
|
</masonry>
|
|
|
|
<paginator
|
|
[total-pages]="pages"
|
|
[page]="page"
|
|
(page)="gotoPage($event)"
|
|
></paginator>
|
|
</ng-container>
|