aboutsummaryrefslogtreecommitdiff
path: root/viewer/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'viewer/src/components')
-rw-r--r--viewer/src/components/LdBreadcrumb.vue4
-rw-r--r--viewer/src/components/LdCommand.vue17
-rw-r--r--viewer/src/components/LdCommandSearch.vue4
-rw-r--r--viewer/src/components/LdCommandSort.vue55
-rw-r--r--viewer/src/components/LdError.vue58
-rw-r--r--viewer/src/components/LdGallery.vue16
-rw-r--r--viewer/src/components/LdInformation.vue84
-rw-r--r--viewer/src/components/LdProposition.vue52
-rw-r--r--viewer/src/components/LdTagInput.vue4
-rw-r--r--viewer/src/components/LdThumbnail.vue18
-rw-r--r--viewer/src/components/index.ts17
-rw-r--r--viewer/src/components/item_handlers/LdAudioViewer.vue55
-rw-r--r--viewer/src/components/item_handlers/LdDirectory.vue42
-rw-r--r--viewer/src/components/item_handlers/LdDownload.vue57
-rw-r--r--viewer/src/components/item_handlers/LdPdfViewer.vue45
-rw-r--r--viewer/src/components/item_handlers/LdPicture.vue (renamed from viewer/src/components/LdPicture.vue)20
-rw-r--r--viewer/src/components/item_handlers/LdPlainTextViewer.vue55
-rw-r--r--viewer/src/components/item_handlers/LdVideoViewer.vue47
18 files changed, 599 insertions, 51 deletions
diff --git a/viewer/src/components/LdBreadcrumb.vue b/viewer/src/components/LdBreadcrumb.vue
index a8d8dcb..618b15a 100644
--- a/viewer/src/components/LdBreadcrumb.vue
+++ b/viewer/src/components/LdBreadcrumb.vue
@@ -29,11 +29,11 @@
29 > 29 >
30 <div v-show="overflowMask" class="ld-breadcrumb-overflow-mask"></div> 30 <div v-show="overflowMask" class="ld-breadcrumb-overflow-mask"></div>
31 <ul class="ld-breadcrumb"> 31 <ul class="ld-breadcrumb">
32 <li v-for="(item,idx) in currentItemPath" :key="item.path"> 32 <li v-for="(item, idx) in currentItemPath" :key="item.path">
33 <fa-icon v-if="idx > 0" icon="angle-right" class="disabled" /> 33 <fa-icon v-if="idx > 0" icon="angle-right" class="disabled" />
34 <router-link :to="item.path" class="link"> 34 <router-link :to="item.path" class="link">
35 <fa-icon :icon="getIcon(item)" size="lg" /> 35 <fa-icon :icon="getIcon(item)" size="lg" />
36 {{item.title}} 36 {{ item.title }}
37 </router-link> 37 </router-link>
38 </li> 38 </li>
39 <li v-if="searchMode"> 39 <li v-if="searchMode">
diff --git a/viewer/src/components/LdCommand.vue b/viewer/src/components/LdCommand.vue
index d961519..6059162 100644
--- a/viewer/src/components/LdCommand.vue
+++ b/viewer/src/components/LdCommand.vue
@@ -21,17 +21,18 @@
21<template> 21<template>
22 <div class="flex command-btns"> 22 <div class="flex command-btns">
23 <a class="link" :title="$t('command.search')" @click="$uiStore.toggleFullWidth()"> 23 <a class="link" :title="$t('command.search')" @click="$uiStore.toggleFullWidth()">
24 <fa-icon :icon="commandToggleSearchPanelIcon()" size="lg" /> 24 <fa-icon :icon="commandToggleSearchPanelIcon" size="lg" />
25 </a> 25 </a>
26 <ld-command-sort />
26 <a 27 <a
27 :class="{'disabled': isEntryPoint()}" 28 :class="{ disabled: isEntryPoint }"
28 class="link command-secondary" 29 class="link command-secondary"
29 :title="$t('command.back')" 30 :title="$t('command.back')"
30 @click="isEntryPoint() || $router.back()" 31 @click="isEntryPoint || $router.back()"
31 > 32 >
32 <fa-icon icon="arrow-left" size="lg" /> 33 <fa-icon icon="arrow-left" size="lg" />
33 </a> 34 </a>
34 <router-link :class="{'disabled': isRoot()}" :title="$t('command.parent')" :to="parent()"> 35 <router-link :class="{ disabled: isRoot }" :title="$t('command.parent')" :to="parent">
35 <fa-icon icon="folder" size="xs" /> 36 <fa-icon icon="folder" size="xs" />
36 <fa-icon icon="level-up-alt" size="lg" /> 37 <fa-icon icon="level-up-alt" size="lg" />
37 </router-link> 38 </router-link>
@@ -46,19 +47,19 @@ import { RawLocation } from "vue-router";
46export default class LdCommand extends Vue { 47export default class LdCommand extends Vue {
47 @Prop({ type: Array, required: true }) readonly currentItemPath!: Gallery.Item[]; 48 @Prop({ type: Array, required: true }) readonly currentItemPath!: Gallery.Item[];
48 49
49 commandToggleSearchPanelIcon(): string { 50 get commandToggleSearchPanelIcon(): string {
50 return this.$uiStore.fullWidth ? "search" : "angle-double-left"; 51 return this.$uiStore.fullWidth ? "search" : "angle-double-left";
51 } 52 }
52 53
53 isRoot(): boolean { 54 get isRoot(): boolean {
54 return this.currentItemPath.length <= 1 && !this.$uiStore.searchMode; 55 return this.currentItemPath.length <= 1 && !this.$uiStore.searchMode;
55 } 56 }
56 57
57 isEntryPoint(): boolean { 58 get isEntryPoint(): boolean {
58 return history.state?.ldgallery === "ENTRYPOINT"; // Set by MainLayout.vue 59 return history.state?.ldgallery === "ENTRYPOINT"; // Set by MainLayout.vue
59 } 60 }
60 61
61 parent(): RawLocation { 62 get parent(): RawLocation {
62 if (this.$uiStore.searchMode) return this.$route.path; 63 if (this.$uiStore.searchMode) return this.$route.path;
63 if (this.currentItemPath.length > 1) return this.currentItemPath[this.currentItemPath.length - 2]; 64 if (this.currentItemPath.length > 1) return this.currentItemPath[this.currentItemPath.length - 2];
64 return ""; 65 return "";
diff --git a/viewer/src/components/LdCommandSearch.vue b/viewer/src/components/LdCommandSearch.vue
index ef158ff..33ab804 100644
--- a/viewer/src/components/LdCommandSearch.vue
+++ b/viewer/src/components/LdCommandSearch.vue
@@ -21,11 +21,11 @@
21 <div class="flex webkit-flex-shrink-fix"> 21 <div class="flex webkit-flex-shrink-fix">
22 <b-button @click="clear"> 22 <b-button @click="clear">
23 <fa-icon icon="eraser" /> 23 <fa-icon icon="eraser" />
24 <span>{{$t('command.search.clear')}}</span> 24 <span>{{ $t("command.search.clear") }}</span>
25 </b-button> 25 </b-button>
26 <b-button expanded @click="search"> 26 <b-button expanded @click="search">
27 <fa-icon icon="search" /> 27 <fa-icon icon="search" />
28 <span>{{$t('command.search.search')}}</span> 28 <span>{{ $t("command.search.search") }}</span>
29 </b-button> 29 </b-button>
30 </div> 30 </div>
31</template> 31</template>
diff --git a/viewer/src/components/LdCommandSort.vue b/viewer/src/components/LdCommandSort.vue
new file mode 100644
index 0000000..cfaa5c1
--- /dev/null
+++ b/viewer/src/components/LdCommandSort.vue
@@ -0,0 +1,55 @@
1<!-- ldgallery - A static generator which turns a collection of tagged
2-- pictures into a searchable web gallery.
3--
4-- Copyright (C) 2019-2020 Guillaume FOUET
5-- 2020 Pacien TRAN-GIRARD
6--
7-- This program is free software: you can redistribute it and/or modify
8-- it under the terms of the GNU Affero General Public License as
9-- published by the Free Software Foundation, either version 3 of the
10-- License, or (at your option) any later version.
11--
12-- This program is distributed in the hope that it will be useful,
13-- but WITHOUT ANY WARRANTY; without even the implied warranty of
14-- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
15-- GNU Affero General Public License for more details.
16--
17-- You should have received a copy of the GNU Affero General Public License
18-- along with this program. If not, see <https://www.gnu.org/licenses/>.
19-->
20
21<template>
22 <b-dropdown v-model="selectedSort" :mobile-modal="false" append-to-body>
23 <a slot="trigger" class="link">
24 <fa-icon icon="sort-amount-down" size="lg" />
25 </a>
26 <b-dropdown-item v-for="(sort, idx) in ITEM_SORTS" :key="idx" :value="sort">
27 <fa-icon :icon="['far', sort === selectedSort ? 'dot-circle' : 'circle']" />
28 <span :class="$style.dropdownLabel">{{ sort.text }}</span>
29 </b-dropdown-item>
30 </b-dropdown>
31</template>
32
33<script lang="ts">
34import { Component, Vue, Prop } from "vue-property-decorator";
35import ItemComparators, { ItemSort } from "@/services/itemComparators";
36
37@Component
38export default class LdCommandSort extends Vue {
39 readonly ITEM_SORTS = ItemComparators.ITEM_SORTS;
40
41 get selectedSort() {
42 return this.$uiStore.sort;
43 }
44
45 set selectedSort(newValue: ItemSort) {
46 this.$uiStore.setSort(newValue);
47 }
48}
49</script>
50
51<style lang="scss" module>
52.dropdownLabel {
53 margin-left: 0.5em;
54}
55</style>
diff --git a/viewer/src/components/LdError.vue b/viewer/src/components/LdError.vue
new file mode 100644
index 0000000..c71e2ad
--- /dev/null
+++ b/viewer/src/components/LdError.vue
@@ -0,0 +1,58 @@
1<!--
2-- ldgallery - A static generator which turns a collection of tagged
3-- pictures into a searchable web gallery.
4--
5-- Copyright (C) 2020 Pacien TRAN-GIRARD
6--
7-- This program is free software: you can redistribute it and/or modify
8-- it under the terms of the GNU Affero General Public License as
9-- published by the Free Software Foundation, either version 3 of the
10-- License, or (at your option) any later version.
11--
12-- This program is distributed in the hope that it will be useful,
13-- but WITHOUT ANY WARRANTY; without even the implied warranty of
14-- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
15-- GNU Affero General Public License for more details.
16--
17-- You should have received a copy of the GNU Affero General Public License
18-- along with this program. If not, see <https://www.gnu.org/licenses/>.
19-->
20
21<template>
22 <div class="container-vh-centering">
23 <div :class="$style.content">
24 <fa-icon :class="$style.icon" :icon="icon" size="6x" />
25 <div :class="$style.message" v-html="message"></div>
26 </div>
27 </div>
28</template>
29
30<script lang="ts">
31import { Component, Prop, Vue } from "vue-property-decorator";
32
33@Component
34export default class LdError extends Vue {
35 @Prop({ required: true, type: String }) readonly icon!: string;
36 @Prop({ required: true, type: String }) readonly message!: string;
37}
38</script>