From 0697693934c700f50bcc45ad58ab0b8f0370561c Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sun, 2 Feb 2020 05:01:17 +0100
Subject: viewer: adaptation to the thumbnail's new structure
---
viewer/src/components/LdPicture.vue | 18 +++++++++++-------
1 file changed, 11 insertions(+), 7 deletions(-)
(limited to 'viewer/src/components/LdPicture.vue')
diff --git a/viewer/src/components/LdPicture.vue b/viewer/src/components/LdPicture.vue
index 5425a00..154c4bd 100644
--- a/viewer/src/components/LdPicture.vue
+++ b/viewer/src/components/LdPicture.vue
@@ -29,9 +29,9 @@
:src="pictureSrc()"
:class="{'slow-loading': Boolean(slowLoadingStyle)}"
:style="slowLoadingStyle"
- @load="clearTimer"
+ @load="clearSlowLoading"
/>
-
+
@@ -46,20 +46,22 @@ export default class LdPicture extends Vue {
dragging: boolean = false;
slowLoadingStyle: string | null = null;
+ loader: boolean = false;
timer: NodeJS.Timeout | null = null;
mounted() {
- if (this.picture.thumbnail) this.timer = setTimeout(this.generateSlowLoadingStyle, this.SLOW_LOADING_TIMEOUT_MS);
+ this.timer = setTimeout(this.generateSlowLoadingStyle, this.SLOW_LOADING_TIMEOUT_MS);
}
destroyed() {
- this.clearTimer();
+ this.clearSlowLoading();
}
- clearTimer() {
+ clearSlowLoading() {
if (this.timer) clearTimeout(this.timer);
this.timer = null;
this.slowLoadingStyle = null;
+ this.loader = false;
}
pictureSrc() {
@@ -67,8 +69,10 @@ export default class LdPicture extends Vue {
}
generateSlowLoadingStyle() {
- this.clearTimer();
- this.slowLoadingStyle = `background-image: url('${process.env.VUE_APP_DATA_URL}${this.picture.thumbnail}');`;
+ this.clearSlowLoading();
+ this.loader = true;
+ if (this.picture.thumbnail)
+ this.slowLoadingStyle = `background-image: url('${process.env.VUE_APP_DATA_URL}${this.picture.thumbnail.resource}');`;
}
onClick() {
--
cgit v1.2.3