implemented validity check;

frontend/src/app/component/images/images.component.html

@@ -3,7 +3,7 @@
 <div style="font-weight: bolder; font-size: 20px">
   <span style="width: 22.5em; display: inline-block; margin-left: 1.15em">Name</span>
   <span style="width: 22.5em; display: inline-block">Date</span>
-  <span style="width: 22.5em; display: inline-block">File valid</span>
+  <span style="width: 22.5em; display: inline-block">File valid | available</span>
 </div>
 <mat-expansion-panel
   *ngFor="let image of filterOnlyNewestImageVersion() | slice:paginationGetStart():paginationGetEnd(); let i = index"
@@ -17,9 +17,13 @@
     >{{image.name}}</h4>
     <h4 style="width: 25em"
     >{{image.datetime}}</h4>
-    <h4 style="width: 25em; color: red">
-      ✓ | X (TO BE DONE)
+    <h4 style="width: 25em; margin-left: 4em;" *ngIf="image.valid !== undefined || image.available !== undefined;
+    else loadingValidity">
+      {{image.valid ? '✓' : 'X' }} | {{image.available ? '✓' : 'X' }}
     </h4>
+    <ng-template #loadingValidity>
+      <h4 style="width: 25em; margin-left: 5em;">...</h4>
+    </ng-template>
     <span style="float: right; margin-left: auto; margin-right: 1em;">
       <button mat-raised-button color="warn"
               (click)="deleteImage(image); $event.stopPropagation()">
@@ -62,7 +66,7 @@
     <app-file-uploader [mode]="'put'"
                        [filename]="image.filename.split('.')[0]"
                        [meta]=image
-                       (reload)="reload.emit()"
+                       (reload)="reload.emit(); checkValidity()"
     ></app-file-uploader>
     <!--    (reload)="image.image_b64 = undefined; this.loadImage(getImageIndex(image), image.identifier)"-->
 
@@ -124,12 +128,12 @@
                [length]="filterOnlyNewestImageVersion().length"
                [pageSize]="pageSizeOptions[0]"
                [pageSizeOptions]="pageSizeOptions"
-               (page)="lastPageEvent = $event; openImageExpansion = ALL_CLOSED_DEFAULT"
+               (page)="lastPageEvent = $event; openImageExpansion = ALL_CLOSED_DEFAULT; checkValidity()"
                showFirstLastButtons
                hidePageSize
 ></mat-paginator>
 
 <mat-divider style="margin-top: 2em"></mat-divider>
 <h3>Upload New Image</h3>
-<app-file-uploader [mode]="'post'" (reload)="reload.emit()"></app-file-uploader>
+<app-file-uploader [mode]="'post'" (reload)="reload.emit(); checkValidity()"></app-file-uploader>
 <mat-divider style="margin-top: 2em"></mat-divider>