From 8f4237ae80a1d48056c973198cd536a16f5bf2a0 Mon Sep 17 00:00:00 2001
From: Braun Patrik <bra.patrik@gmail.com>
Date: Wed, 22 Jun 2016 16:40:02 +0200
Subject: [PATCH] improving thumbnail loader

---
 .../app/gallery/grid/photo/photo.grid.gallery.component.html  | 2 +-
 .../app/gallery/grid/photo/photo.grid.gallery.component.ts    | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/app/gallery/grid/photo/photo.grid.gallery.component.html b/frontend/app/gallery/grid/photo/photo.grid.gallery.component.html
index 90004a92..980c904f 100644
--- a/frontend/app/gallery/grid/photo/photo.grid.gallery.component.html
+++ b/frontend/app/gallery/grid/photo/photo.grid.gallery.component.html
@@ -1,7 +1,7 @@
 <div class="photo-container" (mouseover)="hover()" (mouseout)="mouseOut()">
     <img #image [src]="imageSrc" [hidden]="!showImage">
 
-    <gallery-grid-photo-loading #loading *ngIf="!showImage">
+    <gallery-grid-photo-loading #loading [hidden]="!showLoading">
     </gallery-grid-photo-loading>
 
     <!--Info box -->
diff --git a/frontend/app/gallery/grid/photo/photo.grid.gallery.component.ts b/frontend/app/gallery/grid/photo/photo.grid.gallery.component.ts
index 468582d9..d78d533f 100644
--- a/frontend/app/gallery/grid/photo/photo.grid.gallery.component.ts
+++ b/frontend/app/gallery/grid/photo/photo.grid.gallery.component.ts
@@ -23,6 +23,7 @@ export class GalleryPhotoComponent implements IRenderable, AfterViewInit {
 
     imageSrc = "#";
     showImage = false;
+    showLoading = false;
     infoStyle = {
         height: 0,
         background: "rgba(0,0,0,0.0)"
@@ -42,7 +43,9 @@ export class GalleryPhotoComponent implements IRenderable, AfterViewInit {
             if (this.gridPhoto.isThumbnailAvailable()) {
                 this.imageSrc = this.gridPhoto.getThumbnailPath();
                 this.showImage = true;
+                this.showLoading = false;
             } else {
+                this.showLoading = true;
                 this.thumbnailService.loadImage(this.gridPhoto,
                     ()=> { //onLoadStarted
                         this.loading.startAnimation();
@@ -50,6 +53,7 @@ export class GalleryPhotoComponent implements IRenderable, AfterViewInit {
                     ()=> {//onLoaded
                         this.imageSrc = this.gridPhoto.getThumbnailPath();
                         this.showImage = true;
+                        this.showLoading = false;
                     },
                     ()=> {//onError
                         console.error("something bad happened");