-
-
-
- ![]()
-
-
-
-
+
+
+
+
+ ![]()
+
+
+
+
-
+
+
+
-
diff --git a/frontend/app/gallery/map/lightbox/lightbox.map.gallery.component.ts b/frontend/app/gallery/map/lightbox/lightbox.map.gallery.component.ts
index 33e1dee0..ecd9a80c 100644
--- a/frontend/app/gallery/map/lightbox/lightbox.map.gallery.component.ts
+++ b/frontend/app/gallery/map/lightbox/lightbox.map.gallery.component.ts
@@ -3,7 +3,7 @@ import {PhotoDTO} from "../../../../../common/entities/PhotoDTO";
import {Dimension} from "../../../model/IRenderable";
import {FullScreenService} from "../../fullscreen.service";
import {AgmMap} from "@agm/core";
-import {IconThumbnail, ThumbnailManagerService} from "../../thumnailManager.service";
+import {IconThumbnail, Thumbnail, ThumbnailManagerService} from "../../thumnailManager.service";
import {IconPhoto} from "../../IconPhoto";
import {Photo} from "../../Photo";
@@ -28,7 +28,8 @@ export class GalleryMapLightboxComponent implements OnChanges {
@ViewChild(AgmMap) map: AgmMap;
- constructor(public fullScreenService: FullScreenService, private thumbnailService: ThumbnailManagerService) {
+ constructor(public fullScreenService: FullScreenService,
+ private thumbnailService: ThumbnailManagerService) {
}
@@ -85,8 +86,6 @@ export class GalleryMapLightboxComponent implements OnChanges {
this.visible = false;
this.hideImages();
}, 500);
-
-
}
showImages() {
@@ -103,6 +102,7 @@ export class GalleryMapLightboxComponent implements OnChanges {
width = height * (p.metadata.size.width / p.metadata.size.height);
}
const iconTh = this.thumbnailService.getIcon(new IconPhoto(p));
+ iconTh.Visible = true;
const obj: MapPhoto = {
latitude: p.metadata.positionData.GPSData.latitude,
longitude: p.metadata.positionData.GPSData.longitude,
@@ -110,7 +110,7 @@ export class GalleryMapLightboxComponent implements OnChanges {
preview: {
width: width,
height: height,
- url: (new Photo(p, width, height)).getThumbnailPath()
+ thumbnail: this.thumbnailService.getLazyThumbnail(new Photo(p, width, height))
}
};
@@ -129,8 +129,15 @@ export class GalleryMapLightboxComponent implements OnChanges {
}
}
+ public loadPreview(mp: MapPhoto) {
+ mp.preview.thumbnail.load();
+ }
+
hideImages() {
- this.mapPhotos.forEach((mp) => mp.iconThumbnail.destroy());
+ this.mapPhotos.forEach((mp) => {
+ mp.iconThumbnail.destroy();
+ mp.preview.thumbnail.destroy();
+ });
this.mapPhotos = [];
}
@@ -176,7 +183,7 @@ export interface MapPhoto {
preview: {
width: number;
height: number;
- url: string;
+ thumbnail: Thumbnail;
}
}
diff --git a/frontend/app/gallery/thumnailManager.service.ts b/frontend/app/gallery/thumnailManager.service.ts
index 8fb1fea4..71b41566 100644
--- a/frontend/app/gallery/thumnailManager.service.ts
+++ b/frontend/app/gallery/thumnailManager.service.ts
@@ -18,6 +18,10 @@ export class ThumbnailManagerService {
return new Thumbnail(photo, this.thumbnailLoader);
}
+ public getLazyThumbnail(photo: Photo): Thumbnail {
+ return new Thumbnail(photo, this.thumbnailLoader, false);
+ }
+
public getIcon(photo: IconPhoto) {
return new IconThumbnail(photo, this.thumbnailLoader);
@@ -32,7 +36,7 @@ export abstract class ThumbnailBase {
protected loading: boolean = false;
protected error: boolean = false;
protected onLoad: Function = null;
- protected thumbnailTask: ThumbnailTaskEntity;
+ protected thumbnailTask: ThumbnailTaskEntity = null;
constructor(protected thumbnailService: ThumbnailLoaderService) {
@@ -126,7 +130,7 @@ export class IconThumbnail extends ThumbnailBase {
export class Thumbnail extends ThumbnailBase {
- constructor(private photo: Photo, thumbnailService: ThumbnailLoaderService) {
+ constructor(private photo: Photo, thumbnailService: ThumbnailLoaderService, autoLoad: boolean = true) {
super(thumbnailService);
if (this.photo.isThumbnailAvailable()) {
this.src = this.photo.getThumbnailPath();
@@ -136,10 +140,14 @@ export class Thumbnail extends ThumbnailBase {
this.src = this.photo.getReplacementThumbnailPath();
this.available = true;
}
+ if (autoLoad) {
+ this.load();
+ }
+ }
- if (!this.photo.isThumbnailAvailable()) {
+ public load() {
+ if (!this.photo.isThumbnailAvailable() && this.thumbnailTask == null) {
setTimeout(() => {
-
let listener: ThumbnailLoadingListener = {
onStartedLoading: () => { //onLoadStarted
this.loading = true;
@@ -162,11 +170,8 @@ export class Thumbnail extends ThumbnailBase {
} else {
this.thumbnailTask = this.thumbnailService.loadImage(this.photo, ThumbnailLoadingPriority.high, listener);
}
-
-
}, 0);
}
-
}
set Visible(visible: boolean) {
+
+
+
+
-
+
-
+
-
-