diff options
author | Zero~Informatique | 2021-07-05 19:10:20 +0200 |
---|---|---|
committer | Zero~Informatique | 2021-07-05 19:10:20 +0200 |
commit | c83f44cd69a227f873a026c01653ef434b6ae045 (patch) | |
tree | 7250db7e0bcfbae85d5d1732ce887b624e080654 /viewer | |
parent | c28b29b12810548a5927a02ca80714fcce24a61b (diff) | |
download | ldgallery-c83f44cd69a227f873a026c01653ef434b6ae045.tar.gz |
viewer: viewer: optional user-defined markdown splash screen
Code review changes
Diffstat (limited to 'viewer')
-rw-r--r-- | viewer/ldgallery-viewer.7.md | 14 | ||||
-rw-r--r-- | viewer/src/@types/splashscreen.d.ts | 2 | ||||
-rw-r--r-- | viewer/src/store/uiStore.ts | 10 | ||||
-rw-r--r-- | viewer/src/views/SplashScreen.vue | 2 |
4 files changed, 14 insertions, 14 deletions
diff --git a/viewer/ldgallery-viewer.7.md b/viewer/ldgallery-viewer.7.md index 5012e3b..1e914ff 100644 --- a/viewer/ldgallery-viewer.7.md +++ b/viewer/ldgallery-viewer.7.md | |||
@@ -92,13 +92,13 @@ initialTagDisplayLimit | |||
92 | Set to -1 to disable the limit on suggestions. | 92 | Set to -1 to disable the limit on suggestions. |
93 | Defaults to 10. | 93 | Defaults to 10. |
94 | 94 | ||
95 | splashScreen | ||
96 | : Displays an information notice before opening the gallery (see below). | ||
97 | |||
95 | An alternative viewer configuration file located in the viewer's directory can be loaded by specifying its name, | 98 | An alternative viewer configuration file located in the viewer's directory can be loaded by specifying its name, |
96 | without the ".json" extension, as a query parameter given before the page anchor; | 99 | without the ".json" extension, as a query parameter given before the page anchor; |
97 | for example, some alternative configuration named "config_2.json" can be loaded with "http://gallery/?config_2#". | 100 | for example, some alternative configuration named "config_2.json" can be loaded with "http://gallery/?config_2#". |
98 | 101 | ||
99 | splashScreen | ||
100 | : Displays an information notice before opening the gallery (see below). | ||
101 | |||
102 | 102 | ||
103 | # SPLASH SCREEN CONFIGURATION | 103 | # SPLASH SCREEN CONFIGURATION |
104 | 104 | ||
@@ -106,9 +106,10 @@ splashScreen.resource | |||
106 | : Absolute or relative path to the information notice. The user is prompted to explicitly acknowledge such notice before being allowed to browse the gallery. | 106 | : Absolute or relative path to the information notice. The user is prompted to explicitly acknowledge such notice before being allowed to browse the gallery. |
107 | Rich text formatting is possible through the use of the [GitHub Flavoured Markdown syntax][GFM]. | 107 | Rich text formatting is possible through the use of the [GitHub Flavoured Markdown syntax][GFM]. |
108 | Inline HTML and CSS are also supported. | 108 | Inline HTML and CSS are also supported. |
109 | [GFM]: https://github.github.com/gfm/ | ||
109 | 110 | ||
110 | splashScreen.dontshowagainUID | 111 | splashScreen.acknowledgmentKey |
111 | : Optional unique ID; when set, the information notice will appear only the first time it is proposed to the user. To display the notice again, change this UID. | 112 | : Optional key; when set to an arbitrary string, the information notice will appear only the first time it is proposed to the user. Once the notice acknowledged, the key is saved to the device's local storage. To display the notice again, change this key to another value. |
112 | When left empty, the notice will appear every time. | 113 | When left empty, the notice will appear every time. |
113 | 114 | ||
114 | splashScreen.buttonAcknowledgeLabel | 115 | splashScreen.buttonAcknowledgeLabel |
@@ -119,7 +120,6 @@ splashScreen.style | |||
119 | : Optional CSS attributes for the information notice's container. | 120 | : Optional CSS attributes for the information notice's container. |
120 | String or JSON formats are supported. | 121 | String or JSON formats are supported. |
121 | 122 | ||
122 | [GFM]: https://github.github.com/gfm/ | ||
123 | 123 | ||
124 | # CONFIGURATION EXAMPLE | 124 | # CONFIGURATION EXAMPLE |
125 | 125 | ||
@@ -133,7 +133,7 @@ Viewer __config.json__: | |||
133 | "initialTagDisplayLimit": 10, | 133 | "initialTagDisplayLimit": 10, |
134 | "splashScreen": { | 134 | "splashScreen": { |
135 | "resource": "./splashscreen.md", | 135 | "resource": "./splashscreen.md", |
136 | "dontshowagainUID": "v001", | 136 | "acknowledgmentKey": "v001", |
137 | "buttonAcknowledgeLabel": "I agree", | 137 | "buttonAcknowledgeLabel": "I agree", |
138 | "style": { | 138 | "style": { |
139 | "max-width": "45em", | 139 | "max-width": "45em", |
diff --git a/viewer/src/@types/splashscreen.d.ts b/viewer/src/@types/splashscreen.d.ts index bd79f80..4e03fa8 100644 --- a/viewer/src/@types/splashscreen.d.ts +++ b/viewer/src/@types/splashscreen.d.ts | |||
@@ -19,7 +19,7 @@ | |||
19 | 19 | ||
20 | export interface SplashScreenConfig { | 20 | export interface SplashScreenConfig { |
21 | resource?: string; | 21 | resource?: string; |
22 | dontshowagainUID?: string; | 22 | acknowledgmentKey?: string; |
23 | buttonAcknowledgeLabel?: string; | 23 | buttonAcknowledgeLabel?: string; |
24 | style?: any; | 24 | style?: any; |
25 | } | 25 | } |
diff --git a/viewer/src/store/uiStore.ts b/viewer/src/store/uiStore.ts index 2c45136..520fcf4 100644 --- a/viewer/src/store/uiStore.ts +++ b/viewer/src/store/uiStore.ts | |||
@@ -27,7 +27,7 @@ const VuexModule = createModule({ | |||
27 | strict: true, | 27 | strict: true, |
28 | }); | 28 | }); |
29 | 29 | ||
30 | const STORAGE_SPLASHSCREEN_VALIDATION = "splashScreenValidation"; | 30 | const STORAGE_SPLASHSCREEN_ACKNOWLEDGMENT = "splashScreenAcknowledgment"; |
31 | 31 | ||
32 | export default class UIStore extends VuexModule { | 32 | export default class UIStore extends VuexModule { |
33 | fullscreen: boolean = false; | 33 | fullscreen: boolean = false; |
@@ -74,8 +74,8 @@ export default class UIStore extends VuexModule { | |||
74 | } | 74 | } |
75 | if (config.splashScreen) { | 75 | if (config.splashScreen) { |
76 | this.setSplashScreenConfig(config.splashScreen); | 76 | this.setSplashScreenConfig(config.splashScreen); |
77 | const uid = config.splashScreen.dontshowagainUID; | 77 | const uid = config.splashScreen.acknowledgmentKey; |
78 | this.setSplashScreenEnabled(!uid || localStorage.getItem(STORAGE_SPLASHSCREEN_VALIDATION) !== uid); | 78 | this.setSplashScreenEnabled(!uid || localStorage.getItem(STORAGE_SPLASHSCREEN_ACKNOWLEDGMENT) !== uid); |
79 | } | 79 | } |
80 | } | 80 | } |
81 | 81 | ||
@@ -83,7 +83,7 @@ export default class UIStore extends VuexModule { | |||
83 | 83 | ||
84 | @action async validateSpashScreen() { | 84 | @action async validateSpashScreen() { |
85 | this.setSplashScreenEnabled(false); | 85 | this.setSplashScreenEnabled(false); |
86 | const uid = this.splashScreenConfig?.dontshowagainUID; | 86 | const uid = this.splashScreenConfig?.acknowledgmentKey; |
87 | if (uid) localStorage.setItem(STORAGE_SPLASHSCREEN_VALIDATION, String(uid)); | 87 | if (uid) localStorage.setItem(STORAGE_SPLASHSCREEN_ACKNOWLEDGMENT, String(uid)); |
88 | } | 88 | } |
89 | } | 89 | } |
diff --git a/viewer/src/views/SplashScreen.vue b/viewer/src/views/SplashScreen.vue index a2f499a..dcb845d 100644 --- a/viewer/src/views/SplashScreen.vue +++ b/viewer/src/views/SplashScreen.vue | |||
@@ -31,7 +31,7 @@ export default class SplashScreen extends Vue { | |||
31 | } | 31 | } |
32 | 32 | ||
33 | fetchMarkdown() { | 33 | fetchMarkdown() { |
34 | FetchWithCheck.get(`${process.env.VUE_APP_DATA_URL}${this.config.resource}?${this.config.dontshowagainUID ?? ""}`) | 34 | FetchWithCheck.get(`${process.env.VUE_APP_DATA_URL}${this.config.resource}?${this.config.acknowledgmentKey ?? ""}`) |
35 | .then(response => response.text()) | 35 | .then(response => response.text()) |
36 | .then(text => (this.markdown = text)) | 36 | .then(text => (this.markdown = text)) |
37 | .finally(() => (this.isLoading = false)) | 37 | .finally(() => (this.isLoading = false)) |