From 97fdb7cd5c972584c8ccffa6a3503a204da37130 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Tue, 3 Aug 2021 15:30:58 +0200
Subject: [PATCH] Refactor pageParams

---
 webapp/components/LoginForm/LoginForm.vue     |   2 +-
 webapp/components/PageFooter/PageFooter.vue   |   2 +
 .../Registration/RegistrationSlider.vue       |   4 +-
 .../features/InternalPage/InternalPage.vue    |  93 +++++-----
 webapp/components/utils/InternalPages.js      | 165 ++++++++++++++++++
 webapp/constants/links.js                     |  48 +++--
 webapp/locales/html/en/organization.html      |   2 +-
 7 files changed, 249 insertions(+), 67 deletions(-)

diff --git a/webapp/components/LoginForm/LoginForm.vue b/webapp/components/LoginForm/LoginForm.vue
index 57429baa3..d9e218a2b 100644
--- a/webapp/components/LoginForm/LoginForm.vue
+++ b/webapp/components/LoginForm/LoginForm.vue
@@ -6,7 +6,7 @@
     </blockquote>
     <base-card>
       <template #imageColumn>
-        <a :href="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)" target="_blank">
+        <a :href="links.ORGANIZATION.link" :title="$t('login.moreInfo', metadata)" target="_blank">
           <logo logoType="welcome" />
         </a>
       </template>
diff --git a/webapp/components/PageFooter/PageFooter.vue b/webapp/components/PageFooter/PageFooter.vue
index d4b563167..cb8c2a424 100644
--- a/webapp/components/PageFooter/PageFooter.vue
+++ b/webapp/components/PageFooter/PageFooter.vue
@@ -7,9 +7,11 @@
         :to="pageParams.internalLink"
         :data-test="pageParams.name + '-nuxt-link'"
       >
+        {{ pageParams.link }}
         {{ $t(pageParams.internalPage.footerIdent) }}
       </nuxt-link>
       <a v-else :href="pageParams.externalLink" target="_blank" :data-test="pageParams.name + '-link'">
+        {{ pageParams.link }}
         {{ $t(pageParams.internalPage.footerIdent) }}
       </a>
       <span class="division-line">-</span>
diff --git a/webapp/components/Registration/RegistrationSlider.vue b/webapp/components/Registration/RegistrationSlider.vue
index 818f6c5e9..b860bf2a2 100644
--- a/webapp/components/Registration/RegistrationSlider.vue
+++ b/webapp/components/Registration/RegistrationSlider.vue
@@ -2,7 +2,7 @@
   <section class="login-form">
     <base-card>
       <template #imageColumn>
-        <a :href="pageLink(links.ORGANIZATION)" :title="$t('login.moreInfo', metadata)" target="_blank">
+        <a :href="links.ORGANIZATION.link" :title="$t('login.moreInfo', metadata)" target="_blank">
           <logo logoType="signup" />
         </a>
       </template>
@@ -45,7 +45,6 @@
 <script>
 import links from '~/constants/links.js'
 import metadata from '~/constants/metadata.js'
-import { pageLink } from '~/components/utils/InternalPages.js'
 import ComponentSlider from '~/components/ComponentSlider/ComponentSlider'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
 import Logo from '~/components/Logo/Logo'
@@ -162,7 +161,6 @@ export default {
     }
 
     return {
-      pageLink,
       links,
       metadata,
       sliderData: {
diff --git a/webapp/components/_new/features/InternalPage/InternalPage.vue b/webapp/components/_new/features/InternalPage/InternalPage.vue
index 389ecc01c..ab47d90f7 100644
--- a/webapp/components/_new/features/InternalPage/InternalPage.vue
+++ b/webapp/components/_new/features/InternalPage/InternalPage.vue
@@ -1,29 +1,34 @@
 <template>
   <div>
     <ds-space margin="small">
-      <ds-heading v-if="pageParams.internalPage.headlineIdent !== null" tag="h2">{{ $t(pageParams.internalPage.headlineIdent === '' ? pageValues.defaultHeadlineIdent : pageParams.internalPage.headlineIdent) }}</ds-heading>
+      <!-- Wolle <ds-heading v-if="pageParams.internalPage.headlineIdent !== null" tag="h2">{{ $t(pageParams.internalPage.headlineIdent === '' ? pageValues.defaultHeadlineIdent : pageParams.internalPage.headlineIdent) }}</ds-heading> -->
+      <ds-heading v-if="pageParams.internalPage.headlineIdent !== null" tag="h2">{{ $t(pageParams.internalPage.headlineIdent === '' ? pageParams.internalPage.defaultHeadlineIdent : pageParams.internalPage.headlineIdent) }}</ds-heading>
     </ds-space>
     <ds-container v-if="pageParams.internalPage.hasContainer">
       <div v-if="!pageParams.internalPage.hasBaseCard">
         <br>
-        <div v-html="$t(pageValues.htmlIdent)" />
+        <!-- Wolle <div v-html="$t(pageValues.htmlIdent)" /> -->
+        <div v-html="$t(pageParams.internalPage.htmlIdent)" />
       </div>
       <base-card v-else>
-        <div v-html="$t(pageValues.htmlIdent)" />
+        <!-- Wolle <div v-html="$t(pageValues.htmlIdent)" /> -->
+        <div v-html="$t(pageParams.internalPage.htmlIdent)" />
       </base-card>
     </ds-container>
     <div v-else-if="!pageParams.internalPage.hasBaseCard">
       <br>
-      <div v-html="$t(pageValues.htmlIdent)" />
+      <!-- Wolle <div v-html="$t(pageValues.htmlIdent)" /> -->
+      <div v-html="$t(pageParams.internalPage.htmlIdent)" />
     </div>
     <base-card v-else>
-      <div v-html="$t(pageValues.htmlIdent)" />
+      <!-- Wolle <div v-html="$t(pageValues.htmlIdent)" /> -->
+      <div v-html="$t(pageParams.internalPage.htmlIdent)" />
     </base-card>
   </div>
 </template>
 
 <script>
-// import links from '~/constants/links.js'
+// Wolle import links from '~/constants/links.js'
 // import { pageLink } from '~/components/utils/InternalPages.js'
 // import Logo from '~/components/Logo/Logo'
 
@@ -34,50 +39,50 @@ export default {
       title: this.$t(this.pageParams.internalPage.headTitleIdent),
     }
   },
-  // components: {
+  // Wolle components: {
   //   Logo,
   // },
   props: {
     pageParams: { type: Object, required: true },
   },
-  // data() {
+  // Wolle data() {
   //   return { links, pageLink }
   // },
-  computed: {
-    pageValues() {
-      let values = {}
-      switch (this.pageParams.name) {
-        case 'organization':
-          values.defaultHeadlineIdent = 'site.made'
-          values.htmlIdent = 'html.organization'
-          break;
-        case 'donate':
-          values.defaultHeadlineIdent = 'site.donate'
-          values.htmlIdent = 'html.donate'
-          break;
-        case 'imprint':
-          values.defaultHeadlineIdent = 'site.imprint'
-          values.htmlIdent = 'html.imprint'
-          break;
-        case 'terms-and-conditions':
-          values.defaultHeadlineIdent = 'site.termsAndConditions'
-          values.htmlIdent = 'html.termsAndConditions'
-          break;
-        case 'code-of-conduct':
-          values.defaultHeadlineIdent = 'site.code-of-conduct'
-          values.htmlIdent = 'html.codeOfConduct'
-          break;
-        case 'data-privacy':
-          values.defaultHeadlineIdent = 'site.data-privacy'
-          values.htmlIdent = 'html.dataPrivacy'
-          break;
-        case 'faq':
-          values.defaultHeadlineIdent = 'site.faq'
-          values.htmlIdent = 'html.faq'
-          break;
-      }
-      return values
-    },
-  },
+  // computed: {
+  //   pageValues() {
+  //     let values = {}
+  //     switch (this.pageParams.name) {
+  //       case 'organization':
+  //         values.defaultHeadlineIdent = 'site.made'
+  //         values.htmlIdent = 'html.organization'
+  //         break;
+  //       case 'donate':
+  //         values.defaultHeadlineIdent = 'site.donate'
+  //         values.htmlIdent = 'html.donate'
+  //         break;
+  //       case 'imprint':
+          // values.defaultHeadlineIdent = 'site.imprint'
+          // values.htmlIdent = 'html.imprint'
+  //         break;
+  //       case 'terms-and-conditions':
+  //         values.defaultHeadlineIdent = 'site.termsAndConditions'
+  //         values.htmlIdent = 'html.termsAndConditions'
+  //         break;
+  //       case 'code-of-conduct':
+  //         values.defaultHeadlineIdent = 'site.code-of-conduct'
+  //         values.htmlIdent = 'html.codeOfConduct'
+  //         break;
+  //       case 'data-privacy':
+  //         values.defaultHeadlineIdent = 'site.data-privacy'
+  //         values.htmlIdent = 'html.dataPrivacy'
+  //         break;
+  //       case 'faq':
+  //         values.defaultHeadlineIdent = 'site.faq'
+  //         values.htmlIdent = 'html.faq'
+  //         break;
+  //     }
+  //     return values
+  //   },
+  // },
 }
 </script>
diff --git a/webapp/components/utils/InternalPages.js b/webapp/components/utils/InternalPages.js
index 78bb4527f..e508d4af9 100644
--- a/webapp/components/utils/InternalPages.js
+++ b/webapp/components/utils/InternalPages.js
@@ -9,3 +9,168 @@ export function noStringDefined(string) {
 export function pageLink(pageParams) {
   return isInternalPage(pageParams) ? pageParams.internalLink : pageParams.externalLink
 }
+
+export const defaultInternalPagesSettings = {
+  ORGANIZATION: {
+    name: 'organization',
+
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/organization', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.made', // localized string identifier
+      headTitleIdent: 'site.made', // localized string identifier
+      headlineIdent: 'site.made', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.made',
+      htmlIdent: 'html.organization',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+  DONATE: {
+    name: 'donate',
+
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/donate', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.donate', // localized string identifier
+      headTitleIdent: 'site.donate', // localized string identifier
+      headlineIdent: 'site.donate', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.donate',
+      htmlIdent: 'html.donate',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+  IMPRINT: {
+    name: 'imprint',
+
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/imprint', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.imprint', // localized string identifier
+      headTitleIdent: 'site.imprint', // localized string identifier
+      headlineIdent: 'site.imprint', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.imprint',
+      htmlIdent: 'html.imprint',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+  TERMS_AND_CONDITIONS: {
+    name: 'terms-and-conditions',
+
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.termsAndConditions', // localized string identifier
+      headTitleIdent: 'site.termsAndConditions', // localized string identifier
+      headlineIdent: 'site.termsAndConditions', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.termsAndConditions',
+      htmlIdent: 'html.termsAndConditions',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+  CODE_OF_CONDUCT: {
+    name: 'code-of-conduct',
+
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/code-of-conduct', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.code-of-conduct', // localized string identifier
+      headTitleIdent: 'site.code-of-conduct', // localized string identifier
+      headlineIdent: 'site.code-of-conduct', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.code-of-conduct',
+      htmlIdent: 'html.codeOfConduct',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+  DATA_PRIVACY: {
+    name: 'data-privacy',
+
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/data-privacy', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.data-privacy', // localized string identifier
+      headTitleIdent: 'site.data-privacy', // localized string identifier
+      headlineIdent: 'site.data-privacy', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.data-privacy',
+      htmlIdent: 'html.dataPrivacy',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+  FAQ: {
+    name: 'faq',
+
+    // Wolle externalLink: 'https://ocelot.social',
+    externalLink: null, // if string is defined and not empty it's dominating
+
+    // in case internal page content is here 'webapp/locales/html/'
+    internalLink: '/faq', // static, don't change! internal page in case no external is defined
+    internalPage: {
+      footerIdent: 'site.faq', // localized string identifier
+      headTitleIdent: 'site.faq', // localized string identifier
+      headlineIdent: 'site.faq', // localized string identifier. on null it's hidden, on empty string default is used
+      hasContainer: true,
+      hasBaseCard: true,
+      hasLoginInHeader: true,
+
+      defaultHeadlineIdent: 'site.faq',
+      htmlIdent: 'html.faq',
+    },
+
+    get link() {
+      return pageLink(this)
+    },
+  },
+}
diff --git a/webapp/constants/links.js b/webapp/constants/links.js
index a0191b70b..32c6fc5e2 100644
--- a/webapp/constants/links.js
+++ b/webapp/constants/links.js
@@ -1,31 +1,38 @@
 // this file is duplicated in `backend/src/config/links.js` and `webapp/constants/links.js` and replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/constants/
 
-const ORGANIZATION = {
-  name: 'organization',
+import { defaultInternalPagesSettings } from '~/components/utils/InternalPages.js'
 
-  // Wolle externalLink: 'https://ocelot.social',
-  externalLink: null, // if string is defined and not empty it's dominating
+const ORGANIZATION = {
+  ...defaultInternalPagesSettings.ORGANIZATION,
+  // Wolle name: 'organization',
+
+  // Wolle 
+  externalLink: 'https://ocelot.social',
+  // externalLink: null, // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/organization', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/organization', // static, don't change! internal page in case no external is defined
   internalPage: {
+    ...defaultInternalPagesSettings.ORGANIZATION.internalPage,
+
     footerIdent: 'site.made', // localized string identifier
     headTitleIdent: 'site.made', // localized string identifier
     // Wolle headlineIdent: 'site.made', // localized string identifier. on null it's hidden, on empty string default is used
     headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
     hasContainer: true,
-    hasBaseCard: true, // no baseCard without a container
+    hasBaseCard: true,
     hasLoginInHeader: true,
   },
 }
 const DONATE = {
-  name: 'donate',
+  ...defaultInternalPagesSettings.DONATE,
+  // Wolle name: 'donate',
 
   // Wolle externalLink: 'https://ocelot-social.herokuapp.com/donations', // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
   externalLink: '', // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/donate', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/donate', // static, don't change! internal page in case no external is defined
   internalPage: {
     footerIdent: 'site.donate', // localized string identifier
     headTitleIdent: 'site.donate', // localized string identifier
@@ -35,13 +42,14 @@ const DONATE = {
   },
 }
 const IMPRINT = {
-  name: 'imprint',
+  ...defaultInternalPagesSettings.IMPRINT,
+  // Wolle name: 'imprint',
 
   // Wolle externalLink: 'https://ocelot-social.herokuapp.com/imprint', // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
   externalLink: '', // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/imprint', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/imprint', // static, don't change! internal page in case no external is defined
   internalPage: {
     footerIdent: 'site.imprint', // localized string identifier
     headTitleIdent: 'site.imprint', // localized string identifier
@@ -51,12 +59,13 @@ const IMPRINT = {
   },
 }
 const TERMS_AND_CONDITIONS = {
-  name: 'terms-and-conditions',
+  ...defaultInternalPagesSettings.TERMS_AND_CONDITIONS,
+  // Wolle name: 'terms-and-conditions',
 
   externalLink: null, // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
   internalPage: {
     footerIdent: 'site.termsAndConditions', // localized string identifier
     headTitleIdent: 'site.termsAndConditions', // localized string identifier
@@ -66,12 +75,13 @@ const TERMS_AND_CONDITIONS = {
   },
 }
 const CODE_OF_CONDUCT = {
-  name: 'code-of-conduct',
+  ...defaultInternalPagesSettings.CODE_OF_CONDUCT,
+  // Wolle name: 'code-of-conduct',
 
   externalLink: null, // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/code-of-conduct', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/code-of-conduct', // static, don't change! internal page in case no external is defined
   internalPage: {
     footerIdent: 'site.code-of-conduct', // localized string identifier
     headTitleIdent: 'site.code-of-conduct', // localized string identifier
@@ -81,12 +91,13 @@ const CODE_OF_CONDUCT = {
   },
 }
 const DATA_PRIVACY = {
-  name: 'data-privacy',
+  ...defaultInternalPagesSettings.DATA_PRIVACY,
+  // Wolle name: 'data-privacy',
 
   externalLink: null, // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/data-privacy', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/data-privacy', // static, don't change! internal page in case no external is defined
   internalPage: {
     footerIdent: 'site.data-privacy', // localized string identifier
     headTitleIdent: 'site.data-privacy', // localized string identifier
@@ -96,13 +107,14 @@ const DATA_PRIVACY = {
   },
 }
 const FAQ = {
-  name: 'faq',
+  ...defaultInternalPagesSettings.FAQ,
+  // Wolle name: 'faq',
 
   // Wolle externalLink: 'https://ocelot.social',
   externalLink: null, // if string is defined and not empty it's dominating
 
   // in case internal page content is here 'webapp/locales/html/'
-  internalLink: '/faq', // static, don't change! internal page in case no external is defined
+  // Wolle internalLink: '/faq', // static, don't change! internal page in case no external is defined
   internalPage: {
     footerIdent: 'site.faq', // localized string identifier
     headTitleIdent: 'site.faq', // localized string identifier
diff --git a/webapp/locales/html/en/organization.html b/webapp/locales/html/en/organization.html
index 7a3316eb2..61172ba8e 100644
--- a/webapp/locales/html/en/organization.html
+++ b/webapp/locales/html/en/organization.html
@@ -20,7 +20,7 @@
 </h1>
 <br>
 <!-- <iframe id="embed_player" frameborder="0" width="280" height="216" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=1"></iframe> -->
-<iframe class="player" id="embed_player" frameborder="0" width="350" height="396" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=2"></iframe>
+<iframe class="player" id="embed_player" frameborder="0" width="510px" height="396px" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=2"></iframe>
 <br>
 <h3 class="h3-headline">
   Radio Weekly Plan