aboutsummaryrefslogtreecommitdiff
path: root/viewer
diff options
context:
space:
mode:
Diffstat (limited to 'viewer')
-rw-r--r--viewer/ldgallery-viewer.7.md6
-rw-r--r--viewer/package.json1
-rw-r--r--viewer/src/@types/gallery.ts6
-rw-r--r--viewer/src/@types/itemType.ts1
-rw-r--r--viewer/src/assets/scss/theme.scss3
-rw-r--r--viewer/src/locales/en.yml3
-rw-r--r--viewer/src/services/navigation.ts14
-rw-r--r--viewer/src/views/GalleryNavigation.vue2
-rw-r--r--viewer/src/views/item_handlers/async/AsyncEpubViewer.vue180
-rw-r--r--viewer/src/views/item_handlers/async/index.ts23
-rw-r--r--viewer/yarn.lock301
11 files changed, 534 insertions, 6 deletions
diff --git a/viewer/ldgallery-viewer.7.md b/viewer/ldgallery-viewer.7.md
index 46509fb..afdaec5 100644
--- a/viewer/ldgallery-viewer.7.md
+++ b/viewer/ldgallery-viewer.7.md
@@ -2,7 +2,7 @@
2pagetitle: Viewer user manual - ldgallery 2pagetitle: Viewer user manual - ldgallery
3title: LDGALLERY-VIEWER(7) ldgallery 3title: LDGALLERY-VIEWER(7) ldgallery
4author: Pacien TRAN-GIRARD, Guillaume FOUET 4author: Pacien TRAN-GIRARD, Guillaume FOUET
5date: 2022-10-26 (v2.1-SNAPSHOT) 5date: 2022-10-30 (v2.1-SNAPSHOT)
6--- 6---
7 7
8 8
@@ -37,8 +37,8 @@ Items of the following formats can be opened and visualised within the web appli
37* Pictures (Bitmap, JPEG, PNG, TIFF, HDR, GIF) 37* Pictures (Bitmap, JPEG, PNG, TIFF, HDR, GIF)
38* Videos (OGV, WebM, Matroska, MPEG-4) 38* Videos (OGV, WebM, Matroska, MPEG-4)
39* Audio files (WAV, Opus, FLAC, MP3, MPEG-4) 39* Audio files (WAV, Opus, FLAC, MP3, MPEG-4)
40* Plain text files (`.txt`) 40* Text files (TXT, Markdown)
41* PDFs 41* Ebooks (PDF, EPUB)
42 42
43Formats which are not listed above or which are not supported by the user's web browser are offered for download instead of being directly displayed in the same window. 43Formats which are not listed above or which are not supported by the user's web browser are offered for download instead of being directly displayed in the same window.
44The item being visualised can be downloaded using the download button at the top-left corner. 44The item being visualised can be downloaded using the download button at the top-left corner.
diff --git a/viewer/package.json b/viewer/package.json
index f5ac5e3..61ea287 100644
--- a/viewer/package.json
+++ b/viewer/package.json
@@ -14,6 +14,7 @@
14 "@fortawesome/vue-fontawesome": "3.0.1", 14 "@fortawesome/vue-fontawesome": "3.0.1",
15 "@vueuse/core": "9.3.1", 15 "@vueuse/core": "9.3.1",
16 "core-js": "3.25.0", 16 "core-js": "3.25.0",
17 "epubjs": "0.3.93",
17 "hammerjs": "2.0.8", 18 "hammerjs": "2.0.8",
18 "marked": "4.1.1", 19 "marked": "4.1.1",
19 "mosha-vue-toastify": "1.0.23", 20 "mosha-vue-toastify": "1.0.23",
diff --git a/viewer/src/@types/gallery.ts b/viewer/src/@types/gallery.ts
index 8c0f177..6960de2 100644
--- a/viewer/src/@types/gallery.ts
+++ b/viewer/src/@types/gallery.ts
@@ -64,6 +64,9 @@ export interface MarkdownProperties extends Downloadable {
64export interface PDFProperties extends Downloadable { 64export interface PDFProperties extends Downloadable {
65 type: ItemType.PDF; 65 type: ItemType.PDF;
66} 66}
67export interface EPUBProperties extends Downloadable {
68 type: ItemType.EPUB;
69}
67export interface VideoProperties extends Downloadable { 70export interface VideoProperties extends Downloadable {
68 type: ItemType.VIDEO; 71 type: ItemType.VIDEO;
69} 72}
@@ -107,6 +110,9 @@ export interface MarkdownItem extends Item {
107export interface PDFItem extends Item { 110export interface PDFItem extends Item {
108 properties: PDFProperties; 111 properties: PDFProperties;
109} 112}
113export interface EPUBItem extends Item {
114 properties: EPUBProperties;
115}
110export interface VideoItem extends Item { 116export interface VideoItem extends Item {
111 properties: VideoProperties; 117 properties: VideoProperties;
112} 118}
diff --git a/viewer/src/@types/itemType.ts b/viewer/src/@types/itemType.ts
index ecab05c..8528728 100644
--- a/viewer/src/@types/itemType.ts
+++ b/viewer/src/@types/itemType.ts
@@ -23,6 +23,7 @@ export enum ItemType {
23 PLAINTEXT = 'plaintext', 23 PLAINTEXT = 'plaintext',
24 MARKDOWN = 'markdown', 24 MARKDOWN = 'markdown',
25 PDF = 'pdf', 25 PDF = 'pdf',
26 EPUB = 'epub',
26 VIDEO = 'video', 27 VIDEO = 'video',
27 AUDIO = 'audio', 28 AUDIO = 'audio',
28 DIRECTORY = 'directory', 29 DIRECTORY = 'directory',
diff --git a/viewer/src/assets/scss/theme.scss b/viewer/src/assets/scss/theme.scss
index 63febbf..6622fa5 100644
--- a/viewer/src/assets/scss/theme.scss
+++ b/viewer/src/assets/scss/theme.scss
@@ -41,6 +41,8 @@ $dropdown-item-color: $palette-600;
41$dropdown-item-hover-color: $palette-500; 41$dropdown-item-hover-color: $palette-500;
42$panel-top-bgcolor: $palette-800; 42$panel-top-bgcolor: $palette-800;
43$panel-top-txtcolor: $primary; 43$panel-top-txtcolor: $primary;
44$panel-bottom-bgcolor: $palette-800;
45$panel-bottom-txtcolor: $primary;
44$panel-left-bgcolor: $palette-800; 46$panel-left-bgcolor: $palette-800;
45$panel-left-txtcolor: $primary; 47$panel-left-txtcolor: $primary;
46$command-buttons-bgcolor: $palette-700; 48$command-buttons-bgcolor: $palette-700;
@@ -55,6 +57,7 @@ $thumbnail-other-size: $body-line-height * 7em;
55$proposed-category-bgcolor: $palette-700; 57$proposed-category-bgcolor: $palette-700;
56$viewer-text: $palette-000; 58$viewer-text: $palette-000;
57$viewer-text-background: $palette-900; 59$viewer-text-background: $palette-900;
60$viewer-epub-background: $palette-000;
58 61
59// Layout 62// Layout
60 63
diff --git a/viewer/src/locales/en.yml b/viewer/src/locales/en.yml
index 86ecd49..280f18b 100644
--- a/viewer/src/locales/en.yml
+++ b/viewer/src/locales/en.yml
@@ -15,6 +15,9 @@ directory:
15 no-results: Empty directory 15 no-results: Empty directory
16download: 16download:
17 download-file-fmt: Download {0} 17 download-file-fmt: Download {0}
18epubViewer:
19 previousSection: Previous section
20 nextSection: Next section
18gallery: 21gallery:
19 resource-loading-error: Error loading resource 22 resource-loading-error: Error loading resource
20 unknown-resource: Resource not found 23 unknown-resource: Resource not found
diff --git a/viewer/src/services/navigation.ts b/viewer/src/services/navigation.ts
index b2e807b..fb01169 100644
--- a/viewer/src/services/navigation.ts
+++ b/viewer/src/services/navigation.ts
@@ -19,7 +19,18 @@
19 19
20import { DirectoryItem, DownloadableItem, Item } from '@/@types/gallery'; 20import { DirectoryItem, DownloadableItem, Item } from '@/@types/gallery';
21import { ItemType } from '@/@types/itemType'; 21import { ItemType } from '@/@types/itemType';
22import { faFile, faFileAlt, faFileAudio, faFilePdf, faFileVideo, faFolder, faHome, faImage, IconDefinition } from '@fortawesome/free-solid-svg-icons'; 22import {
23 faFile,
24 faFileAlt,
25 faFileAudio,
26 faFilePdf,
27 faBook,
28 faFileVideo,
29 faFolder,
30 faHome,
31 faImage,
32 IconDefinition,
33} from '@fortawesome/free-solid-svg-icons';
23import { isDirectory } from './itemGuards'; 34import { isDirectory } from './itemGuards';
24 35
25const ICON_BY_TYPE: Record<ItemType, IconDefinition> = { 36const ICON_BY_TYPE: Record<ItemType, IconDefinition> = {
@@ -28,6 +39,7 @@ const ICON_BY_TYPE: Record<ItemType, IconDefinition> = {
28 plaintext: faFileAlt, 39 plaintext: faFileAlt,
29 markdown: faFileAlt, 40 markdown: faFileAlt,
30 pdf: faFilePdf, 41 pdf: faFilePdf,
42 epub: faBook,
31 video: faFileVideo, 43 video: faFileVideo,
32 audio: faFileAudio, 44 audio: faFileAudio,
33 other: faFile, 45 other: faFile,
diff --git a/viewer/src/views/GalleryNavigation.vue b/viewer/src/views/GalleryNavigation.vue
index 0869aaf..b342c52 100644
--- a/viewer/src/views/GalleryNavigation.vue
+++ b/viewer/src/views/GalleryNavigation.vue
@@ -44,6 +44,7 @@ import { computedEager } from '@vueuse/shared';
44import { computed, watchEffect } from 'vue'; 44import { computed, watchEffect } from 'vue';
45import { useI18n } from 'vue-i18n'; 45import { useI18n } from 'vue-i18n';
46import GallerySearch from './GallerySearch.vue'; 46import GallerySearch from './GallerySearch.vue';
47import { EpubViewer } from './item_handlers/async';
47import AudioViewer from './item_handlers/AudioViewer.vue'; 48import AudioViewer from './item_handlers/AudioViewer.vue';
48import DirectoryViewer from './item_handlers/DirectoryViewer.vue'; 49import DirectoryViewer from './item_handlers/DirectoryViewer.vue';
49import DownloadViewer from './item_handlers/DownloadViewer.vue'; 50import DownloadViewer from './item_handlers/DownloadViewer.vue';
@@ -67,6 +68,7 @@ const COMPONENT_BY_TYPE: Record<ItemType, unknown> = {
67 plaintext: PlainTextViewer, 68 plaintext: PlainTextViewer,
68 markdown: MarkdownViewer, 69 markdown: MarkdownViewer,
69 pdf: PdfViewer, 70 pdf: PdfViewer,
71 epub: EpubViewer,
70 video: VideoViewer, 72 video: VideoViewer,
71 audio: AudioViewer, 73 audio: AudioViewer,
72 other: DownloadViewer, 74 other: DownloadViewer,
diff --git a/viewer/src/views/item_handlers/async/AsyncEpubViewer.vue b/viewer/src/views/item_handlers/async/AsyncEpubViewer.vue
new file mode 100644
index 0000000..b5c0cb4
--- /dev/null
+++ b/viewer/src/views/item_handlers/async/AsyncEpubViewer.vue
@@ -0,0 +1,180 @@
1<!--
2-- ldgallery - A static generator which turns a collection of tagged
3-- pictures into a searchable web gallery.
4--
5-- Copyright (C) 2022 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="$style.container">
23 <div
24 ref="view"
25 :class="$style.epubView"
26 class="scrollbar"
27 />
28
29 <ul
30 v-if="prevSection || nextSection"
31 :class="$style.navBar"
32 >
33 <li>
34 <LdLink
35 v-if="prevSection"
36 @click="goToPrevSection"
37 >
38 <fa-icon
39 :icon="faSquareCaretLeft"
40 size="lg"
41 alt="«"
42 />
43 {{ prevSectionLabel }}