From 170da2d55fec0359cbac780786383710b734eda7 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 31 Jan 2020 09:17:57 +0100
Subject: viewer: code cleaning, moved some views to components

---
 viewer/src/components/LdThumbnail.vue | 81 +++++++++++++++++++++++++++++++++++
 1 file changed, 81 insertions(+)
 create mode 100644 viewer/src/components/LdThumbnail.vue

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
new file mode 100644
index 0000000..44a4c00
--- /dev/null
+++ b/viewer/src/components/LdThumbnail.vue
@@ -0,0 +1,81 @@
+<!-- ldgallery - A static generator which turns a collection of tagged
+--             pictures into a searchable web gallery.
+--
+-- Copyright (C) 2019-2020  Guillaume FOUET
+--
+-- This program is free software: you can redistribute it and/or modify
+-- it under the terms of the GNU Affero General Public License as
+-- published by the Free Software Foundation, either version 3 of the
+-- License, or (at your option) any later version.
+--
+-- This program is distributed in the hope that it will be useful,
+-- but WITHOUT ANY WARRANTY; without even the implied warranty of
+-- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+-- GNU Affero General Public License for more details.
+--
+-- You should have received a copy of the GNU Affero General Public License
+-- along with this program.  If not, see <https://www.gnu.org/licenses/>.
+-->
+
+<template>
+  <div class="forcedsize" :class="{'preload': loading}">
+    <v-lazy-image
+      v-if="item.thumbnail"
+      class="thumbnail"
+      :src="pictureSrc()"
+      :title="item.path"
+      @intersect="loading=true"
+      @load="loading=false"
+    />
+    <div v-else class="flex-column flex-center">
+      <fa-icon :icon="getIcon()" size="4x" />
+      {{item.title}}
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Prop } from "vue-property-decorator";
+import Tools from "@/tools";
+
+@Component
+export default class LdThumbnail extends Vue {
+  @Prop({ required: true }) readonly item!: Gallery.Item;
+
+  loading: boolean = false;
+
+  pictureSrc() {
+    return `${process.env.VUE_APP_DATA_URL}${this.item.thumbnail}`;
+  }
+
+  getIcon() {
+    return Tools.getIcon(this.item);
+  }
+}
+</script>
+
+<style lang="scss">
+@import "@/assets/scss/theme.scss";
+
+.thumbnail {
+  max-width: 250px;
+  max-height: 250px;
+}
+.preload {
+  animation: preloadAnimation 1s infinite ease-in-out alternate;
+}
+@keyframes preloadAnimation {
+  from {
+    background-color: $content-bgcolor;
+  }
+  to {
+    background-color: $loader-color;
+  }
+}
+// Temporary size until we get the true thumbnail size
+.forcedsize {
+  width: 250px;
+  height: 250px;
+  text-align: center;
+}
+</style>
-- 
cgit v1.2.3


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/LdThumbnail.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 44a4c00..d9343dd 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -45,7 +45,7 @@ export default class LdThumbnail extends Vue {
   loading: boolean = false;
 
   pictureSrc() {
-    return `${process.env.VUE_APP_DATA_URL}${this.item.thumbnail}`;
+    if (this.item.thumbnail) return `${process.env.VUE_APP_DATA_URL}${this.item.thumbnail.resource}`;
   }
 
   getIcon() {
-- 
cgit v1.2.3


From 73e2dc5b39a5cd12c52b99ee076c1a1ad86a2ace Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sun, 2 Feb 2020 19:29:12 +0100
Subject: viewer: implemented thumbnail size usage

---
 viewer/src/components/LdThumbnail.vue | 24 ++++++++++--------------
 1 file changed, 10 insertions(+), 14 deletions(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index d9343dd..d5c0b3c 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -18,12 +18,12 @@
 -->
 
 <template>
-  <div class="forcedsize" :class="{'preload': loading}">
+  <div :class="{'preload': loading}">
     <v-lazy-image
       v-if="item.thumbnail"
-      class="thumbnail"
       :src="pictureSrc()"
-      :title="item.path"
+      :style="pictureStyle()"
+      :title="item.title"
       @intersect="loading=true"
       @load="loading=false"
     />
@@ -45,7 +45,13 @@ export default class LdThumbnail extends Vue {
   loading: boolean = false;
 
   pictureSrc() {
-    if (this.item.thumbnail) return `${process.env.VUE_APP_DATA_URL}${this.item.thumbnail.resource}`;
+    const resource = this.item.thumbnail!.resource;
+    return `${process.env.VUE_APP_DATA_URL}${resource}`;
+  }
+
+  pictureStyle() {
+    const resolution = this.item.thumbnail!.resolution;
+    return { width: `${resolution.width}px`, height: `${resolution.height}px` };
   }
 
   getIcon() {
@@ -57,10 +63,6 @@ export default class LdThumbnail extends Vue {
 <style lang="scss">
 @import "@/assets/scss/theme.scss";
 
-.thumbnail {
-  max-width: 250px;
-  max-height: 250px;
-}
 .preload {
   animation: preloadAnimation 1s infinite ease-in-out alternate;
 }
@@ -72,10 +74,4 @@ export default class LdThumbnail extends Vue {
     background-color: $loader-color;
   }
 }
-// Temporary size until we get the true thumbnail size
-.forcedsize {
-  width: 250px;
-  height: 250px;
-  text-align: center;
-}
 </style>
-- 
cgit v1.2.3


From abcd10f8ac944f29a77d756558b1773551ee0877 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Tue, 11 Feb 2020 02:06:49 +0100
Subject: viewer: thumbnail others fixed sizes for better layout

---
 viewer/src/components/LdThumbnail.vue | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index d5c0b3c..17c7659 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -27,7 +27,7 @@
       @intersect="loading=true"
       @load="loading=false"
     />
-    <div v-else class="flex-column flex-center">
+    <div v-else class="thumbnail-other flex-column flex-center">
       <fa-icon :icon="getIcon()" size="4x" />
       {{item.title}}
     </div>
@@ -63,6 +63,12 @@ export default class LdThumbnail extends Vue {
 <style lang="scss">
 @import "@/assets/scss/theme.scss";
 
+.thumbnail-other {
+  width: $thumbnail-other-size;
+  height: $thumbnail-other-size;
+  text-align: center;
+}
+
 .preload {
   animation: preloadAnimation 1s infinite ease-in-out alternate;
 }
-- 
cgit v1.2.3


From 19d40a5ee98fb1f244612155acc559ff2f21bf6b Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Wed, 12 Feb 2020 00:09:34 +0100
Subject: viewer: implemented config.json

Note: The DevServer needs to know when the file is from the App, or from the FileSystem.
We use a tilde to make this separation. The tilde URL is declared in '.env.development'
GitHub: Resolves #32
---
 viewer/src/components/LdThumbnail.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 17c7659..13468e1 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -21,7 +21,7 @@
   <div :class="{'preload': loading}">
     <v-lazy-image
       v-if="item.thumbnail"
-      :src="pictureSrc()"
+      :src="pictureSrc(item.thumbnail.resource)"
       :style="pictureStyle()"
       :title="item.title"
       @intersect="loading=true"
@@ -44,9 +44,8 @@ export default class LdThumbnail extends Vue {
 
   loading: boolean = false;
 
-  pictureSrc() {
-    const resource = this.item.thumbnail!.resource;
-    return `${process.env.VUE_APP_DATA_URL}${resource}`;
+  pictureSrc(resource: string) {
+    return `${process.env.VUE_APP_DATA_URL}${this.$galleryStore.config!.galleryRoot}${resource}`;
   }
 
   pictureStyle() {
-- 
cgit v1.2.3


From 370e3db3455f548699ff5e046e0f8dcc304991ac Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 14 Feb 2020 09:19:53 +0100
Subject: viewer: major code and search mode overhaul

Updated libraries to the lastest version
SCSS Formatter as suggested VSC extensions
Renamed toolbar-color by scrollbar-color
LD components use Props in favor of touching the stores directly (when possible)
Moved most common algorithms to a "services" folder
Complete search overhaul (lots of code change)
---
 viewer/src/components/LdThumbnail.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 13468e1..3ef7fa8 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -36,7 +36,7 @@
 
 <script lang="ts">
 import { Component, Vue, Prop } from "vue-property-decorator";
-import Tools from "@/tools";
+import Navigation from "@/services/navigation";
 
 @Component
 export default class LdThumbnail extends Vue {
@@ -54,7 +54,7 @@ export default class LdThumbnail extends Vue {
   }
 
   getIcon() {
-    return Tools.getIcon(this.item);
+    return Navigation.getIcon(this.item);
   }
 }
 </script>
-- 
cgit v1.2.3


From caf68fd92912f9ffc2291ba823cc194c1cc1c61a Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 3 Apr 2020 05:43:07 +0200
Subject: viewer: items with long titles overflow

GitHub: Resolves #137
---
 viewer/src/components/LdThumbnail.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 3ef7fa8..5166834 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -29,7 +29,7 @@
     />
     <div v-else class="thumbnail-other flex-column flex-center">
       <fa-icon :icon="getIcon()" size="4x" />
-      {{item.title}}
+      {{item.title | underscore-to-space}}
     </div>
   </div>
 </template>
@@ -66,6 +66,8 @@ export default class LdThumbnail extends Vue {
   width: $thumbnail-other-size;
   height: $thumbnail-other-size;
   text-align: center;
+  word-break: break-all;
+  overflow: hidden;
 }
 
 .preload {
-- 
cgit v1.2.3


From 44ada3fc6f092b9ee15de2f4ebbc269d4b354f64 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sat, 4 Apr 2020 00:41:35 +0200
Subject: viewer: items with long titles overflow

code review changes

GitHub: Resolves #137
---
 viewer/src/components/LdThumbnail.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 5166834..9805873 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -29,7 +29,7 @@
     />
     <div v-else class="thumbnail-other flex-column flex-center">
       <fa-icon :icon="getIcon()" size="4x" />
-      {{item.title | underscore-to-space}}
+      {{item.title}}
     </div>
   </div>
 </template>
@@ -65,8 +65,9 @@ export default class LdThumbnail extends Vue {
 .thumbnail-other {
   width: $thumbnail-other-size;
   height: $thumbnail-other-size;
+  padding-top: 1em;
   text-align: center;
-  word-break: break-all;
+  word-break: break-word;
   overflow: hidden;
 }
 
-- 
cgit v1.2.3


From f391a682dbd725c1d8aba9c571472bd390bb6a8d Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sat, 4 Apr 2020 03:33:25 +0200
Subject: viewer: items with long titles overflow

fixed line-height issue on filenames and icon heights

GitHub: Resolves #137
---
 viewer/src/components/LdThumbnail.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 9805873..f8343eb 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -28,7 +28,9 @@
       @load="loading=false"
     />
     <div v-else class="thumbnail-other flex-column flex-center">
-      <fa-icon :icon="getIcon()" size="4x" />
+      <div>
+        <fa-icon :icon="getIcon()" size="4x" />
+      </div>
       {{item.title}}
     </div>
   </div>
@@ -65,10 +67,13 @@ export default class LdThumbnail extends Vue {
 .thumbnail-other {
   width: $thumbnail-other-size;
   height: $thumbnail-other-size;
-  padding-top: 1em;
+  padding-top: $body-line-height * 2em;
   text-align: center;
   word-break: break-word;
   overflow: hidden;
+  > div {
+    min-height: $body-line-height * 3em;
+  }
 }
 
 .preload {
-- 
cgit v1.2.3


From a196acf14daf613e931e39dd0daa927ebc89099d Mon Sep 17 00:00:00 2001
From: pacien
Date: Sat, 11 Apr 2020 03:57:44 +0200
Subject: viewer: ldthumbnail: reduce non-picture element size

They were too big and not dense enough on small screens
---
 viewer/src/components/LdThumbnail.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index f8343eb..4ab6446 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -67,7 +67,7 @@ export default class LdThumbnail extends Vue {
 .thumbnail-other {
   width: $thumbnail-other-size;
   height: $thumbnail-other-size;
-  padding-top: $body-line-height * 2em;
+  padding-top: $body-line-height * 1em;
   text-align: center;
   word-break: break-word;
   overflow: hidden;
-- 
cgit v1.2.3


From 525bde063c7c17f292199c75eae398388933f868 Mon Sep 17 00:00:00 2001
From: pacien
Date: Sun, 26 Apr 2020 00:18:57 +0200
Subject: viewer: tell webpack to import scss from module

---
 viewer/src/components/LdThumbnail.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'viewer/src/components/LdThumbnail.vue')

diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue
index 4ab6446..e774f00 100644
--- a/viewer/src/components/LdThumbnail.vue
+++ b/viewer/src/components/LdThumbnail.vue
@@ -62,7 +62,7 @@ export default class LdThumbnail extends Vue {
 </script>
 
 <style lang="scss">
-@import "@/assets/scss/theme.scss";
+@import "~@/assets/scss/theme.scss";
 
 .thumbnail-other {
   width: $thumbnail-other-size;
-- 
cgit v1.2.3