diff options
Diffstat (limited to 'src/App.vue')
-rw-r--r-- | src/App.vue | 57 |
1 files changed, 36 insertions, 21 deletions
diff --git a/src/App.vue b/src/App.vue index 486ef03..1f4f509 100644 --- a/src/App.vue +++ b/src/App.vue | |||
@@ -13,7 +13,9 @@ | |||
13 | <section v-if="config.header" class="first-line"> | 13 | <section v-if="config.header" class="first-line"> |
14 | <div v-cloak class="container"> | 14 | <div v-cloak class="container"> |
15 | <div class="logo"> | 15 | <div class="logo"> |
16 | <img v-if="config.logo" :src="config.logo" alt="dashboard logo" /> | 16 | <a href="#"> |
17 | <img v-if="config.logo" :src="config.logo" alt="dashboard logo" /> | ||
18 | </a> | ||
17 | <i v-if="config.icon" :class="config.icon"></i> | 19 | <i v-if="config.icon" :class="config.icon"></i> |
18 | </div> | 20 | </div> |
19 | <div class="dashboard-title"> | 21 | <div class="dashboard-title"> |
@@ -159,28 +161,41 @@ export default { | |||
159 | }; | 161 | }; |
160 | }, | 162 | }, |
161 | created: async function () { | 163 | created: async function () { |
162 | const defaults = jsyaml.load(defaultConfig); | 164 | this.buildDashboard(); |
163 | let config; | 165 | window.onhashchange = this.buildDashboard; |
164 | try { | ||
165 | config = await this.getConfig(); | ||
166 | } catch (error) { | ||
167 | console.log(error); | ||
168 | config = this.handleErrors("⚠️ Error loading configuration", error); | ||
169 | } | ||
170 | this.config = merge(defaults, config); | ||
171 | this.services = this.config.services; | ||
172 | document.title = | ||
173 | this.config.documentTitle || | ||
174 | `${this.config.title} | ${this.config.subtitle}`; | ||
175 | if (this.config.stylesheet) { | ||
176 | let stylesheet = ""; | ||
177 | for (const file of this.config.stylesheet) { | ||
178 | stylesheet += `@import "${file}";`; | ||
179 | } | ||
180 | this.createStylesheet(stylesheet); | ||
181 | } | ||
182 | }, | 166 | }, |
183 | methods: { | 167 | methods: { |
168 | buildDashboard: async function () { | ||
169 | const defaults = jsyaml.load(defaultConfig); | ||
170 | let config; | ||
171 | try { | ||
172 | config = await this.getConfig(); | ||
173 | const path = | ||
174 | window.location.hash.substring(1) != "" | ||
175 | ? window.location.hash.substring(1) | ||
176 | : null; | ||
177 | |||
178 | if (path) { | ||
179 | let pathConfig = await this.getConfig(`assets/${path}.yml`); // the slash (/) is included in the pathname | ||
180 | config = Object.assign(config, pathConfig); | ||
181 | } | ||
182 | } catch (error) { | ||
183 | console.log(error); | ||
184 | config = this.handleErrors("⚠️ Error loading configuration", error); | ||
185 | } | ||
186 | this.config = merge(defaults, config); | ||
187 | this.services = this.config.services; | ||
188 | document.title = | ||
189 | this.config.documentTitle || | ||
190 | `${this.config.title} | ${this.config.subtitle}`; | ||
191 | if (this.config.stylesheet) { | ||
192 | let stylesheet = ""; | ||
193 | for (const file of this.config.stylesheet) { | ||
194 | stylesheet += `@import "${file}";`; | ||
195 | } | ||
196 | this.createStylesheet(stylesheet); | ||
197 | } | ||
198 | }, | ||
184 | getConfig: function (path = "assets/config.yml") { | 199 | getConfig: function (path = "assets/config.yml") { |
185 | return fetch(path).then((response) => { | 200 | return fetch(path).then((response) => { |
186 | if (response.redirected) { | 201 | if (response.redirected) { |