Adds meta content to app

2019-04-08 08:04:25 +02:00 · 2019-04-08 08:04:25 +02:00 · e24134dfc0
parent 2b105745a5
commit e24134dfc0
7 changed files with 81 additions and 63 deletions
--- a/public/admin/config.yml
+++ b/public/admin/config.yml
@ -255,8 +255,8 @@ collections:
        hint: "The footer navigation for the website."
        widget: "object"
        fields:
-          - {label: "Imprint", name: "imprint", widget: "string"}
-          - {label: "Data privacy", name: "privacy", widget: "string"}
+          - {label: "[Label] Imprint", name: "imprint", widget: "string"}
+          - {label: "[Label] Data privacy", name: "privacy", widget: "string"}
      - label: "Social Media Share Text"
        name: "socialMedia"
        hint: "These are the default texts which get used to share."
@ -265,4 +265,12 @@ collections:
          - {label: "Twitter", name: "twitter", widget: "string"}
          - {label: "Facebook", name: "facebook", widget: "string"}
          - {label: "Clipboard", name: "clipboard", widget: "string"}
+      - label: "Cookie Consent Layer"
+        name: "cookieConsent"
+        hint: "The text which is shown in the cookie consent layer."
+        widget: "object"
+        fields:
+          - {label: "Text", name: "text", widget: "text"}
+          - {label: "[Button] Decline", name: "btnDecline", widget: "string"}
+          - {label: "[Button] Accept", name: "btnAccept", widget: "string"}

--- a/src/app/app.vue
+++ b/src/app/app.vue
@ -22,13 +22,13 @@

    <section v-if="showConsentLayer" id="analytics-consent">
      <div class="consent-content">
-        <p>Let's track a bit?</p>
+        <p>{{ $t('meta.cookieConsent.text') }}</p>
        <div class="consent-actions">
          <button @click="updateConsent(false)">
-            Decline
+            {{ $t('meta.cookieConsent.decline') }}
          </button>
          <button @click="updateConsent(true)">
-            Allow
+            {{ $t('meta.cookieConsent.accept') }}
          </button>
        </div>
      </div>
@ -44,51 +44,6 @@
  export default {
    name: 'App',

-    i18n: {
-      messages: {
-        de: {
-          topMenu: {
-            index: 'Startseite',
-            faq: 'FAQ',
-            about: 'Über uns',
-            press: 'Presse'
-          },
-          subMenu: {
-            imprint: 'Impressum',
-            privacy: 'Datenschutz'
-          },
-          socialMedia: {
-            twitter: {
-              text: 'Cool! BTW17 kann jetzt auch Sterne. Neugierig was die Parteien zur EU sagen? Mach den EUROMAT & finde heraus mit wem du übereinstimmst!',
-              hashtags: 'BTW17,EUROMAT'
-            },
-            facebook: 'Cool! #BTW17 kann jetzt auch Sterne. Neugierig was die Parteien zur EU sagen? Mach den #EUROMAT & finde heraus mit wem du übereinstimmst!',
-            clipboard: 'In Zwischenablage kopiert'
-          }
-        },
-        en: {
-          topMenu: {
-            index: 'Landing page',
-            faq: 'FAQ',
-            about: 'About us',
-            press: 'Press'
-          },
-          subMenu: {
-            imprint: 'Imprint',
-            privacy: 'Data privacy'
-          },
-          socialMedia: {
-            twitter: {
-              text: 'Great! German election is star-spangled. Curious what parties say about EU? Compare views & see your match:',
-              hashtags: 'BTW17,EUROMAT'
-            },
-            facebook: 'Great! #GermanElections are now star-spangled. Curious what parties say about EU? Compare your views w/#EUROMAT & see who you match up with!',
-            clipboard: 'Copied to clipboard'
-          }
-        }
-      }
-    },
-
    data () {
      return {
        showConsentLayer: getCookie(GA_COOKIE_NAME) === null,
@ -108,19 +63,19 @@
      topMenu () {
        return [
          {
-            label: this.$t('topMenu.index'),
+            label: this.$t('meta.topMenu.index'),
            route: { path: '/' }
          },
          {
-            label: this.$t('topMenu.faq'),
+            label: this.$t('meta.topMenu.faq'),
            route: { path: '/faq' }
          },
          {
-            label: this.$t('topMenu.about'),
+            label: this.$t('meta.topMenu.about'),
            route: { path: this.isGermanLocale ? '/uber-uns' : '/about-us' }
          },
          {
-            label: this.$t('topMenu.press'),
+            label: this.$t('meta.topMenu.press'),
            route: { path: this.isGermanLocale ? '/presse' : '/press' }
          }
        ]
@ -128,11 +83,11 @@
      subMenu () {
        return [
          {
-            label: this.$t('subMenu.imprint'),
+            label: this.$t('meta.footerMenu.imprint'),
            route: { path: this.isGermanLocale ? '/impressum' : '/imprint' }
          },
          {
-            label: this.$t('subMenu.privacy'),
+            label: this.$t('meta.footerMenu.privacy'),
            route: { path: this.isGermanLocale ? '/datenschutz' : '/privacy' }
          }
        ]
@ -143,19 +98,19 @@
            label: 'twitter',
            icon: 'twitter',
            message: {
-              text: this.$t('socialMedia.twitter.text'),
-              hashtags: this.$t('socialMedia.twitter.hashtags')
+              text: this.$t('meta.socialMedia.twitter'),
+              hashtags: 'BTW17,EUROMAT'
            }
          },
          {
            label: 'facebook',
            icon: 'facebook',
-            message: this.$t('socialMedia.facebook')
+            message: this.$t('meta.socialMedia.facebook')
          },
          {
            label: 'clipboard',
            icon: 'clipboard',
-            message: this.$t('socialMedia.clipboard')
+            message: this.$t('meta.socialMedia.clipboard')
          }
        ]
      }
--- a/src/data/index.js
+++ b/src/data/index.js
@ -1,11 +1,18 @@
+import { loadContent } from '@/helper/content'
 import options from './options'
 import theses from './theses'
 import terminology from './terminology'
 import parties from './parties'

+const i18n = loadContent(
+  'meta',
+  require.context('./meta', false, /\.json$/)
+)
+
 export {
  options,
  theses,
  terminology,
-  parties
+  parties,
+  i18n
 }
--- a/src/data/meta/de.json
+++ b/src/data/meta/de.json
@ -1,3 +1,23 @@
 {
-  "language": "de"
+  "language": "de",
+  "topMenu": {
+    "index": "Startseite",
+    "faq": "FAQ",
+    "about": "Über uns",
+    "press": "Presse"
+  },
+  "socialMedia": {
+    "twitter": "Cool! BTW17 kann jetzt auch Sterne. Neugierig was die Parteien zur EU sagen? Mach den EUROMAT & finde heraus mit wem du übereinstimmst! ",
+    "facebook": "Cool! #BTW17 kann jetzt auch Sterne. Neugierig was die Parteien zur EU sagen? Mach den #EUROMAT & finde heraus mit wem du übereinstimmst!",
+    "clipboard": "In Zwischenablage kopiert"
+  },
+  "cookieConsent": {
+    "text": "This website uses cookies to ensure you get the best experience on our website.",
+    "btnDecline": "Decline",
+    "btnAccept": "Accept"
+  },
+  "footerMenu": {
+    "imprint": "Impressum",
+    "privacy": "Datenschutz"
+  }
 }
--- a/src/data/meta/en.json
+++ b/src/data/meta/en.json
@ -0,0 +1,23 @@
+{
+  "language": "de",
+  "topMenu": {
+    "index": "Landing page",
+    "faq": "FAQ",
+    "about": "About us",
+    "press": "Press"
+  },
+  "socialMedia": {
+    "twitter": "Great! German election is star-spangled. Curious what parties say about EU? Compare views & see your match:",
+    "facebook": "Great! #GermanElections are now star-spangled. Curious what parties say about EU? Compare your views w/#EUROMAT & see who you match up with!",
+    "clipboard": "Copied to clipboard"
+  },
+  "cookieConsent": {
+    "text": "This website uses cookies to ensure you get the best experience on our website.",
+    "btnDecline": "Decline",
+    "btnAccept": "Accept"
+  },
+  "footerMenu": {
+    "imprint": "Imprint",
+    "privacy": "Data privacy"
+  }
+}
--- a/src/i18n/index.js
+++ b/src/i18n/index.js
@ -10,12 +10,14 @@ import { i18n as faq } from '@/app/faq'
 import { i18n as press } from '@/app/press'
 import { i18n as imprint } from '@/app/imprint'
 import { i18n as privacy } from '@/app/privacy'
+import { i18n as meta } from '@/data'

 import { DEFAULT_LOCALE, LOCALES } from '@/config'

 Vue.use(VueI18n)

 const messages = [
+  meta,
  intro, euromat, party,
  about, fourzerofour, faq,
  press, imprint, privacy
--- a/src/main.js
+++ b/src/main.js
@ -18,7 +18,10 @@ Vue.use(storage)
 Vue.use(VueAnalytics, {
  id: GA_KEY,
  disabled: getCookie(GA_COOKIE_NAME) !== 'true',
-  router
+  router,
+  debug: {
+    sendHitTask: process.env.NODE_ENV === 'production'
+  }
 })

 new Vue({