From 79ed8c0c6d0d86ceba4c3432b2b95700ce35b20b Mon Sep 17 00:00:00 2001
From: Braun Patrik <braun.patrik@aut.bme.hu>
Date: Wed, 21 Jun 2017 11:33:21 +0200
Subject: [PATCH] fixing directory thumbnail error

---
 .../gallery/directory/directory.gallery.component.html    | 4 ++--
 .../app/gallery/directory/directory.gallery.component.ts  | 8 ++++++--
 frontend/app/gallery/gallery.component.html               | 2 +-
 frontend/app/gallery/thumnailManager.service.ts           | 2 +-
 4 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/frontend/app/gallery/directory/directory.gallery.component.html b/frontend/app/gallery/directory/directory.gallery.component.html
index 1e31d20d..5990b733 100644
--- a/frontend/app/gallery/directory/directory.gallery.component.html
+++ b/frontend/app/gallery/directory/directory.gallery.component.html
@@ -2,10 +2,10 @@
    style="display: inline-block;">
 
 
-    <div class="photo-container">
 
+    <div class="photo-container">
         <div class="photo" *ngIf="thumbnail && thumbnail.Available"
-             [style.background-image]="'url('+thumbnail.src+')'"></div>
+             [style.background-image]="getSanitizedThUrl()"></div>
 
         <span *ngIf="!thumbnail || !thumbnail.Available" class="glyphicon glyphicon-folder-open no-image"
               aria-hidden="true">
diff --git a/frontend/app/gallery/directory/directory.gallery.component.ts b/frontend/app/gallery/directory/directory.gallery.component.ts
index b0aa6ef0..0cd33c33 100644
--- a/frontend/app/gallery/directory/directory.gallery.component.ts
+++ b/frontend/app/gallery/directory/directory.gallery.component.ts
@@ -1,4 +1,5 @@
 import {Component, ElementRef, Input, OnDestroy, OnInit, ViewChild} from "@angular/core";
+import {DomSanitizer} from "@angular/platform-browser";
 import {DirectoryDTO} from "../../../../common/entities/DirectoryDTO";
 import {RouterLink} from "@angular/router";
 import {Utils} from "../../../../common/Utils";
@@ -16,16 +17,19 @@ export class GalleryDirectoryComponent implements OnInit, OnDestroy {
   @ViewChild("dirContainer") container: ElementRef;
   thumbnail: Thumbnail = null;
 
-  constructor(private thumbnailService: ThumbnailManagerService) {
+  constructor(private thumbnailService: ThumbnailManagerService, private _sanitizer: DomSanitizer) {
   }
 
   ngOnInit() {
     if (this.directory.photos.length > 0) {
       this.thumbnail = this.thumbnailService.getThumbnail(new Photo(this.directory.photos[0], 100, 100));
-
     }
   }
 
+  getSanitizedThUrl() {
+    return this._sanitizer.bypassSecurityTrustStyle('url(' + encodeURI(this.thumbnail.Src).replace(/\(/g, "%28").replace(/\)/g, "%29") + ')');
+  }
+
   //TODO: implement scroll
   isInView(): boolean {
     return document.body.scrollTop < this.container.nativeElement.offsetTop + this.container.nativeElement.clientHeight
diff --git a/frontend/app/gallery/gallery.component.html b/frontend/app/gallery/gallery.component.html
index 3f924db6..bb315ca0 100644
--- a/frontend/app/gallery/gallery.component.html
+++ b/frontend/app/gallery/gallery.component.html
@@ -36,4 +36,4 @@
         </div>
         <gallery-grid [photos]="_galleryService.content.searchResult.photos" [lightbox]="lightbox"></gallery-grid>
     </div>
-</app-frame>
\ No newline at end of file
+</app-frame>
diff --git a/frontend/app/gallery/thumnailManager.service.ts b/frontend/app/gallery/thumnailManager.service.ts
index d728736c..61edf880 100644
--- a/frontend/app/gallery/thumnailManager.service.ts
+++ b/frontend/app/gallery/thumnailManager.service.ts
@@ -14,7 +14,7 @@ export class ThumbnailManagerService {
   constructor(private thumbnailLoader: ThumbnailLoaderService) {
   }
 
-  public getThumbnail(photo: Photo) {
+  public getThumbnail(photo: Photo): Thumbnail {
     return new Thumbnail(photo, this.thumbnailLoader);
   }