From 89bcb2dbe5b5e6eb8e8ba13ceecee2770dfe4cd4 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Thu, 9 Jan 2020 02:10:35 +0100
Subject: viewer: Changed "image" type to "picture". Adapted the code to the
 current compiler output format. The currentItem and currentPath are
 calculated in the store for easier multi-component access. Breadcrumb for
 current's position and navigation.

---
 viewer/src/views/PanelTop.vue | 67 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 67 insertions(+)
 create mode 100644 viewer/src/views/PanelTop.vue

(limited to 'viewer/src/views/PanelTop.vue')

diff --git a/viewer/src/views/PanelTop.vue b/viewer/src/views/PanelTop.vue
new file mode 100644
index 0000000..eb8e6ed
--- /dev/null
+++ b/viewer/src/views/PanelTop.vue
@@ -0,0 +1,67 @@
+<template>
+  <div v-if="isReady">
+    <b-steps
+      v-model="activeStep"
+      class="pathBreadcrumb"
+      type="is-info"
+      :has-navigation="false"
+      :animated="false"
+      @input="onStepClick"
+    >
+      <b-step-item
+        v-for="item in $galleryStore.currentItemPath"
+        :key="item.path"
+        :label="item.title"
+        :icon="getIcon(item)"
+        :to="item.path"
+      />
+    </b-steps>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Prop, Watch } from "vue-property-decorator";
+import Gallery from "./Gallery.vue";
+
+@Component
+export default class PanelTop extends Vue {
+  activeStep: number = -1;
+
+  mounted() {
+    this.currentItemPathChanged();
+  }
+
+  get isReady() {
+    return this.activeStep >= 0;
+  }
+
+  @Watch("$galleryStore.currentItemPath")
+  currentItemPathChanged() {
+    this.activeStep = -1;
+    this.$nextTick(() => (this.activeStep = this.$galleryStore.currentItemPath.length - 1));
+  }
+
+  getIcon(item: Gallery.Item) {
+    switch (item.properties.type) {
+      case "picture":
+        return "image";
+      case "directory":
+        return "folder";
+    }
+  }
+
+  onStepClick(index: number) {
+    const item = this.$galleryStore.currentItemPath[index];
+    if (item) this.$router.push(item.path);
+  }
+}
+</script>
+
+<style lang="scss">
+.pathBreadcrumb {
+  margin: 3px;
+}
+.step-title {
+  color: white;
+}
+</style>
-- 
cgit v1.2.3


From 27b51018525dbb7a6edb3073819d82245387ddd3 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Fri, 10 Jan 2020 22:22:22 +0100
Subject: viewer: license headers

---
 viewer/src/views/PanelTop.vue | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

(limited to 'viewer/src/views/PanelTop.vue')

diff --git a/viewer/src/views/PanelTop.vue b/viewer/src/views/PanelTop.vue
index eb8e6ed..0efc9b6 100644
--- a/viewer/src/views/PanelTop.vue
+++ b/viewer/src/views/PanelTop.vue
@@ -1,3 +1,22 @@
+<!-- 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 v-if="isReady">
     <b-steps
-- 
cgit v1.2.3

