Use vue-meta to set the page title to the name on the theme and to se…

…t the favicon accordingly
backoffice-plus · Aug 5, 2019 · 09715a6 · 09715a6
1 parent 5adf66a
commit 09715a6
Show file tree

Hide file tree

Showing 8 changed files with 35 additions and 31 deletions.
diff --git a/index.html b/index.html
@@ -2,7 +2,6 @@
 <html lang="en">
 <head>
 	<meta charset="UTF-8">
-	<title>ownCloud Phoenix</title>
 	<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
 	<meta name="theme-color" content="#375f7E"/>
 	<meta http-equiv="x-ua-compatible" content="IE=11">

diff --git a/package.json b/package.json
@@ -84,6 +84,7 @@
     "vue-events": "^3.1.0",
     "vue-gettext": "^2.1.5",
     "vue-loader": "^15.7.1",
+    "vue-meta": "^2.2.1",
     "vue-router": "^3.0.7",
     "vue-scrollto": "^2.15.0",
     "vue-template-compiler": "^2.6.10",

diff --git a/src/Phoenix.vue b/src/Phoenix.vue
@@ -23,6 +23,17 @@ export default {
     'side-menu': Menu,
     TopBar
   },
+  metaInfo () {
+    const metaInfo = {
+      title: this.configuration.theme.general.name
+    }
+    if (this.favicon) {
+      metaInfo.link = [
+        { rel: 'icon', href: this.favicon }
+      ]
+    }
+    return metaInfo
+  },
   beforeMount () {
     this.initAuth()
   },
@@ -31,6 +42,9 @@ export default {
     ...mapGetters(['configuration']),
     showHeader () {
       return this.$route.meta.hideHeadbar !== true
+    },
+    favicon () {
+      return this.configuration.theme.logo.favicon
     }
   },
   methods: {

diff --git a/src/phoenix.js b/src/phoenix.js
@@ -25,6 +25,7 @@ import VueEvents from 'vue-events'
 import VueRouter from 'vue-router'
 import Clipboard from 'v-clipboard'
 import VueScrollTo from 'vue-scrollto'
+import VueMeta from 'vue-meta'
 
 // --- Gettext ----
 
@@ -56,6 +57,10 @@ Vue.use(Clipboard)
 Vue.use(VueScrollTo)
 Vue.use(MediaSource)
 Vue.use(PhoenixPlugin)
+Vue.use(VueMeta, {
+  // optional pluginOptions
+  refreshOnceOnNavigation: true
+})
 
 Vue.component('drag', Drag)
 Vue.component('drop', Drop)

diff --git a/src/store/config.js b/src/store/config.js
@@ -18,20 +18,8 @@ const state = {
       name: '',
       slogan: ''
     },
-    colors: {
-      primary: '',
-      secondary: '',
-      accent: '',
-      info: '',
-      success: '',
-      warning: '',
-      error: ''
-    },
     logo: {
-      mini: '',
-      small: '',
-      big: '',
-      background: ''
+      favicon: ''
     }
   }
 }

diff --git a/themes/owncloud.json b/themes/owncloud.json
@@ -2,5 +2,8 @@
   "general": {
     "name": "ownCloud",
     "slogan": "ownCloud – A safe home for all your data"
+  },
+  "logo": {
+    "favicon": "themes/owncloud/favicon.jpg"
   }
 }
diff --git a/webpack.common.js b/webpack.common.js
@@ -13,19 +13,14 @@ const gitDirty = execa.sync('git', ['status', '-s', '-uall']).stdout.length > 0
 
 const appFolder = path.resolve(__dirname, 'apps')
 const apps = []
-let favicon = './themes/owncloud/favicon.jpg'
-var config
+let config
 
 if (fs.existsSync('config.json')) {
   config = require('./config.json')
 } else {
   config = require('./tests/drone/config.json')
 }
 
-if (fs.existsSync(`./themes/${config.theme}/favicon.jpg`)) {
-  favicon = `./themes/${config.theme}/favicon.jpg`
-}
-
 config.apps
   .forEach(function (mod) {
     if (fs.existsSync(path.resolve(appFolder, mod))) {
@@ -61,8 +56,7 @@ module.exports = {
       }
     }), new WebpackCopyPlugin(apps),
     new HtmlWebpackPlugin({
-      template: 'index.html',
-      favicon: favicon
+      template: 'index.html'
     }),
     new VueLoaderPlugin(),
     new MiniCssExtractPlugin({

diff --git a/yarn.lock b/yarn.lock
@@ -2543,13 +2543,13 @@ cucumber@cucumber/cucumber-js#issue-727-retry:
     cucumber-expressions "^7.0.0"
     cucumber-tag-expressions "^1.1.1"
     duration "^0.2.1"
-    escape-string-regexp "^2.0.0"
-    figures "^3.0.0"
-    gherkin "5.0.0"
+    escape-string-regexp "^1.0.5"
+    figures "2.0.0"
+    gherkin "^5.0.0"
     glob "^7.1.3"
-    indent-string "^4.0.0"
+    indent-string "^3.1.0"
     is-generator "^1.0.2"
-    is-stream "^2.0.0"
+    is-stream "^1.1.0"
     knuth-shuffle-seeded "^1.0.6"
     lodash "^4.17.11"
     mz "^2.4.0"
@@ -2558,7 +2558,7 @@ cucumber@cucumber/cucumber-js#issue-727-retry:
     serialize-error "^4.1.0"
     stack-chain "^2.0.0"
     stacktrace-js "^2.0.0"
-    string-argv "^0.3.0"
+    string-argv "0.1.1"
     title-case "^2.1.1"
     util-arity "^1.0.2"
     verror "^1.9.0"
@@ -2605,9 +2605,9 @@ date-now@^0.1.4:
   resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"
   integrity sha1-6vQ5/U1ISK105cx9vvIAZyueNFs=
 
-"davclient.js@git+https://github.com/owncloud/davclient.js.git":
+"davclient.js@https://github.com/owncloud/davclient.js.git":
   version "0.1.3"
-  resolved "git+https://github.com/owncloud/davclient.js.git#07237a4bb813eb19e19e322e2457ce216721d529"
+  resolved "https://github.com/owncloud/davclient.js.git#07237a4bb813eb19e19e322e2457ce216721d529"
 
 de-indent@^1.0.2:
   version "1.0.2"
@@ -8981,7 +8981,7 @@ vue-lodash@^2.0.2:
   dependencies:
     lodash "^4.17.11"
 
-vue-meta@^2.0.4:
+vue-meta@^2.0.4, vue-meta@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/vue-meta/-/vue-meta-2.2.1.tgz#30c2ff8b806f67eb2079734883c586295761b086"
   integrity sha512-S0setu909L+jQNI4wa/WUMMJQSHIOU13eQZVIIBT1sCEH7g91AWwNA347//5lbWoNvyr3EQPk/kPMuPnhEbL1w==