Eubopen: add metadata for all pages

pages/accessibility.vue

@@ -8,7 +8,44 @@
 </template>
 
 <script>
-export default {}
+export default {
+  head() {
+    const titleText = `Accessibility`
+    const descriptionText =
+      'Read the accessibility statement for the EUbOPEN Portal.'
+
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
+}
 </script>
 
 <style></style>

pages/acknowledgement.vue

 <template>
   <div>
-    <h1 class="font-weight-light">Acknoledgement</h1>
+    <h1 class="font-weight-light">Acknowledgement</h1>
     <v-divider />
     <br />
     <p class="text-justify">
@@ -72,6 +72,42 @@ export default {
       ],
     }
   },
+  head() {
+    const titleText = `Acknowledgement`
+    const descriptionText =
+      'Read the acknowledgement statement for the EUbOPEN Portal.'
+
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
 }
 </script>
 

pages/compound/browse/_state.vue

@@ -4,6 +4,7 @@
 
 <script>
 import EBCompoundsBrowser from '~/web-components-submodule/components/common/Browsers/specific_browsers/compound/eubopen/EBCompoundsBrowser.vue'
+import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
 
 export default {
   components: {
@@ -15,6 +16,42 @@ export default {
       isEmbedded: false,
     }
   },
+  head() {
+    const titleText = `Explore all ${EntityNames.EubopenCompound.pluralEntityName}.`
+    const descriptionText =
+      'The EUbOPEN consortium is an Innovative Medicines Initiative (IMI) funded project to enable and unlock biology in the open.'
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      title: titleText,
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
 }
 </script>
 

pages/cookie_notice.vue

 <template>
   <div>
-    <h1 class="font-weight-light">Cookie statement</h1>
+    <h1 class="font-weight-light">Cookie Statement</h1>
     <v-divider />
     <br />
     <p class="text-justify">
@@ -52,7 +52,43 @@
 </template>
 
 <script>
-export default {}
+export default {
+  head() {
+    const titleText = `Cookie Statement`
+    const descriptionText = 'Read the cookie statement for the EUbOPEN Portal.'
+
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
+}
 </script>
 
 <style></style>

pages/disclaimer.vue

@@ -12,7 +12,44 @@
 </template>
 
 <script>
-export default {}
+export default {
+  head() {
+    const titleText = `Disclaimer`
+    const descriptionText =
+      'Read the disclaimer statement for the EUbOPEN Portal.'
+
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
+}
 </script>
 
 <style></style>

pages/index.vue

@@ -52,6 +52,37 @@ export default {
     Sponsors,
   },
   layout: 'default',
+
+  head() {
+    const titleText = `Welcome to the EUbOPEN Portal`
+    const descriptionText =
+      'The EUbOPEN consortium is an Innovative Medicines Initiative (IMI) funded project to enable and unlock biology in the open.'
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      meta: [
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
   computed: {
     esProxyBaseUrl() {
       return process.env.esProxyBaseUrl

pages/privacy_notice.vue

@@ -17,7 +17,43 @@
 </template>
 
 <script>
-export default {}
+export default {
+  head() {
+    const titleText = `Privacy Notice`
+    const descriptionText = 'Read the privacy notice for the EUbOPEN Portal.'
+
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
+}
 </script>
 
 <style></style>

pages/target/browse/_state.vue

@@ -3,6 +3,7 @@
 </template>
 
 <script>
+import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
 import EBTargetsBrowser from '~/web-components-submodule/components/common/Browsers/specific_browsers/compound/eubopen/EBTargetsBrowser.vue'
 export default {
   components: {
@@ -14,6 +15,42 @@ export default {
       isEmbedded: false,
     }
   },
+  head() {
+    const titleText = `Explore all ${EntityNames.EubopenTarget.pluralEntityName}.`
+    const descriptionText =
+      'The EUbOPEN consortium is an Innovative Medicines Initiative (IMI) funded project to enable and unlock biology in the open.'
+    const canonicalURL =
+      `https://${process.env.primaryDomain}` + this.$route.path
+
+    const imgURL = `https://${
+      process.env.primaryDomain
+    }${require('~/static/img/logo.png')}`
+    return {
+      title: titleText,
+      meta: [
+        {
+          hid: 'description',
+          name: 'description',
+          content: descriptionText,
+        },
+        { hid: 'og:title', name: 'og:title', content: titleText },
+        {
+          hid: 'og:description',
+          name: 'og:description',
+          content: descriptionText,
+        },
+        { hid: 'og:type', name: 'og:type', content: 'object' },
+        { hid: 'og:url', name: 'og:url', content: canonicalURL },
+        { hid: 'og:image', name: 'og:image', content: imgURL },
+      ],
+      link: [
+        {
+          rel: 'canonical',
+          href: canonicalURL,
+        },
+      ],
+    }
+  },
   computed: {
     state() {
       return this.$route.params.state