From 2bd63dc7622c0f84383fb76f7e2c4380d3f78495 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sat, 3 Jul 2021 23:07:09 +0200
Subject: viewer: register markdown item type

Extracted from b170f49 (GH PR #304)
---
 viewer/src/@types/ItemType.ts     | 1 +
 viewer/src/@types/gallery.d.ts    | 8 ++++++++
 viewer/src/services/navigation.ts | 1 +
 3 files changed, 10 insertions(+)

(limited to 'viewer/src')

diff --git a/viewer/src/@types/ItemType.ts b/viewer/src/@types/ItemType.ts
index 9974d4e..5ef38d8 100644
--- a/viewer/src/@types/ItemType.ts
+++ b/viewer/src/@types/ItemType.ts
@@ -21,6 +21,7 @@ export enum ItemType {
   OTHER = "other",
   PICTURE = "picture",
   PLAINTEXT = "plaintext",
+  MARKDOWN = "markdown",
   PDF = "pdf",
   VIDEO = "video",
   AUDIO = "audio",
diff --git a/viewer/src/@types/gallery.d.ts b/viewer/src/@types/gallery.d.ts
index 9011f19..0b4cfc4 100644
--- a/viewer/src/@types/gallery.d.ts
+++ b/viewer/src/@types/gallery.d.ts
@@ -48,6 +48,9 @@ export interface PictureItem extends Item {
 export interface PlainTextItem extends Item {
   properties: PlainTextProperties;
 }
+export interface MarkdownItem extends Item {
+  properties: MarkdownProperties;
+}
 export interface PDFItem extends Item {
   properties: PDFProperties;
 }
@@ -71,6 +74,7 @@ export interface Item {
     | OtherProperties
     | PictureProperties
     | PlainTextProperties
+    | MarkdownProperties
     | PDFProperties
     | VideoProperties
     | AudioProperties
@@ -93,6 +97,10 @@ export interface PlainTextProperties {
   type: ItemType.PLAINTEXT;
   resource: string;
 }
+export interface MarkdownProperties {
+  type: ItemType.MARKDOWN;
+  resource: string;
+}
 export interface PDFProperties {
   type: ItemType.PDF;
   resource: string;
diff --git a/viewer/src/services/navigation.ts b/viewer/src/services/navigation.ts
index 9bbd90c..5dcea88 100644
--- a/viewer/src/services/navigation.ts
+++ b/viewer/src/services/navigation.ts
@@ -25,6 +25,7 @@ export default class Navigation {
     directory: "folder",
     picture: "image",
     plaintext: "file-alt",
+    markdown: "file-alt",
     pdf: "file-pdf",
     video: "file-video",
     audio: "file-audio",
-- 
cgit v1.2.3


From 2f9e51b5cd7dfafadac90ec896edd365da12a1c8 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sat, 3 Jul 2021 23:07:09 +0200
Subject: viewer: add markdown item handler

Extracted from b170f49 (GH PR #304)
---
 .../components/item_handlers/LdMarkdownViewer.vue  | 82 ++++++++++++++++++++++
 viewer/src/views/GalleryNavigation.vue             |  1 +
 2 files changed, 83 insertions(+)
 create mode 100644 viewer/src/components/item_handlers/LdMarkdownViewer.vue

(limited to 'viewer/src')

diff --git a/viewer/src/components/item_handlers/LdMarkdownViewer.vue b/viewer/src/components/item_handlers/LdMarkdownViewer.vue
new file mode 100644
index 0000000..ecebbcf
--- /dev/null
+++ b/viewer/src/components/item_handlers/LdMarkdownViewer.vue
@@ -0,0 +1,82 @@
+<!--
+-- ldgallery - A static generator which turns a collection of tagged
+--             pictures into a searchable web gallery.
+--
+-- Copyright (C) 2021  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>
+  <b-loading v-if="isLoading" active />
+  <Markdown v-else-if="markdown" class="flex-grow-1" :markdown="markdown" />
+</template>
+
+<script lang="ts">
+import { MarkdownItem } from "@/@types/gallery";
+import { Markdown } from "@/components/async";
+import FetchWithCheck from "@/services/fetchWithCheck";
+import { Component, Prop, Vue } from "vue-property-decorator";
+
+@Component({
+  components: {
+    Markdown,
+  },
+})
+export default class LdMarkdownViewer extends Vue {
+  @Prop({ required: true }) readonly item!: MarkdownItem;
+
+  isLoading: boolean = true;
+  markdown: string | null = null;
+
+  created() {
+    this.fetchMarkdown();
+  }
+
+  get itemResourceUrl(): string {
+    return this.$galleryStore.resourceRoot + this.item.properties.resource;
+  }
+
+  fetchMarkdown() {
+    FetchWithCheck.get(this.itemResourceUrl)
+      .then(response => response.text())
+      .then(text => (this.markdown = text))
+      .finally(() => (this.isLoading = false))
+      .catch(this.displayError);
+  }
+
+  displayError(reason: any) {
+    this.$buefy.snackbar.open({
+      message: `${reason}`,
+      actionText: this.$t("snack.retry"),
+      position: "is-top",
+      type: "is-warning",
+      onAction: this.fetchMarkdown,
+    });
+  }
+}
+</script>
+
+<style lang="scss" module>
+.splashscreen {
+  display: flex;
+  flex-flow: column;
+  align-items: center;
+  padding: 32px;
+}
+.buttonOkay {
+  min-width: 310px;
+  align-self: center;
+}
+</style>
diff --git a/viewer/src/views/GalleryNavigation.vue b/viewer/src/views/GalleryNavigation.vue
index fdd3922..200637e 100644
--- a/viewer/src/views/GalleryNavigation.vue
+++ b/viewer/src/views/GalleryNavigation.vue
@@ -44,6 +44,7 @@ export default class GalleryNavigation extends Vue {
     directory: "ld-directory-viewer",
     picture: "ld-picture-viewer",
     plaintext: "ld-plain-text-viewer",
+    markdown: "ld-markdown-viewer",
     pdf: "ld-pdf-viewer",
     video: "ld-video-viewer",
     audio: "ld-audio-viewer",
-- 
cgit v1.2.3


From 581029f1b15b51f90812a47b20bce454014da32a Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Tue, 12 Apr 2022 21:35:24 +0200
Subject: viewer: add markdown item handler

Minor CSS fixes
Comment for future upgrade to Vue3
---
 viewer/src/components/item_handlers/LdMarkdownViewer.vue | 14 ++++----------
 viewer/src/views/SplashScreen.vue                        |  1 +
 2 files changed, 5 insertions(+), 10 deletions(-)

(limited to 'viewer/src')

diff --git a/viewer/src/components/item_handlers/LdMarkdownViewer.vue b/viewer/src/components/item_handlers/LdMarkdownViewer.vue
index ecebbcf..3b9a8d6 100644
--- a/viewer/src/components/item_handlers/LdMarkdownViewer.vue
+++ b/viewer/src/components/item_handlers/LdMarkdownViewer.vue
@@ -20,7 +20,7 @@
 
 <template>
   <b-loading v-if="isLoading" active />
-  <Markdown v-else-if="markdown" class="flex-grow-1" :markdown="markdown" />
+  <Markdown v-else-if="markdown" :class="$style.container" :markdown="markdown" />
 </template>
 
 <script lang="ts">
@@ -48,6 +48,7 @@ export default class LdMarkdownViewer extends Vue {
     return this.$galleryStore.resourceRoot + this.item.properties.resource;
   }
 
+  // TODO: Identical to SplashScreen.vue, use composition with Vue3.
   fetchMarkdown() {
     FetchWithCheck.get(this.itemResourceUrl)
       .then(response => response.text())
@@ -69,14 +70,7 @@ export default class LdMarkdownViewer extends Vue {
 </script>
 
 <style lang="scss" module>
-.splashscreen {
-  display: flex;
-  flex-flow: column;
-  align-items: center;
-  padding: 32px;
-}
-.buttonOkay {
-  min-width: 310px;
-  align-self: center;
+.container {
+  padding: 8px;
 }
 </style>
diff --git a/viewer/src/views/SplashScreen.vue b/viewer/src/views/SplashScreen.vue
index dcb845d..93d84a1 100644
--- a/viewer/src/views/SplashScreen.vue
+++ b/viewer/src/views/SplashScreen.vue
@@ -30,6 +30,7 @@ export default class SplashScreen extends Vue {
     this.fetchMarkdown();
   }
 
+  // TODO: Identical to LdMarkdownViewer.vue, use composition with Vue3.
   fetchMarkdown() {
     FetchWithCheck.get(`${process.env.VUE_APP_DATA_URL}${this.config.resource}?${this.config.acknowledgmentKey ?? ""}`)
       .then(response => response.text())
-- 
cgit v1.2.3