From 461defd4606dd2f4a68c0133e1dd528c164f09a5 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Tue, 15 Oct 2019 15:43:31 +0200
Subject: [PATCH] WITH CHECKBOXES

---
 webapp/components/Registration/Signup.vue | 36 ++++++++++++++++-------
 webapp/locales/de.json                    |  6 ++--
 webapp/locales/en.json                    |  6 ++--
 3 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/webapp/components/Registration/Signup.vue b/webapp/components/Registration/Signup.vue
index cbed5b9f8..18750b300 100644
--- a/webapp/components/Registration/Signup.vue
+++ b/webapp/components/Registration/Signup.vue
@@ -30,15 +30,24 @@
         name="email"
         icon="envelope"
       />
-      <ds-list size="base">
-        <ds-list-item>
-          <ds-text v-html="$t('components.registration.signup.form.terms-and-condition')"></ds-text>
-        </ds-list-item>
-        <ds-list-item>
-          <ds-text v-html="$t('components.registration.signup.form.data-privacy')"></ds-text>
-        </ds-list-item>
-        <ds-list-item>{{ $t('components.registration.signup.form.minimum-age') }}</ds-list-item>
-      </ds-list>
+      <p>
+        <label class="add-checkbox">
+          <input @change="handleInputValid" type="checkbox" v-model="checkbox1" />
+          <span v-html="$t('components.registration.signup.form.terms-and-condition')"></span>
+        </label>
+      </p>
+      <p>
+        <label class="add-checkbox">
+          <input@change="handleInputValid" type="checkbox" v-model="checkbox2"/>
+          <span v-html="$t('components.registration.signup.form.data-privacy')"></span>
+        </label>
+      </p>
+      <p>
+        <label class="add-checkbox">
+          <input @change="handleInputValid" type="checkbox" v-model="checkbox3" />
+          <span v-html="$t('components.registration.signup.form.minimum-age')"></span>
+        </label>
+      </p>
 
       <ds-button
         :disabled="disabled"
@@ -112,6 +121,9 @@ export default {
       disabled: true,
       success: false,
       error: null,
+      checkbox1: false,
+      checkbox2: false,
+      checkbox3: false,
     }
   },
   computed: {
@@ -125,7 +137,11 @@ export default {
       this.disabled = true
     },
     handleInputValid() {
-      this.disabled = false
+      if (this.checkbox1 && this.checkbox2 && this.checkbox3) {
+        this.disabled = false
+      } else {
+        this.disabled = true
+      }
     },
     async handleSubmit() {
       const mutation = this.token ? SignupByInvitationMutation : SignupMutation
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 36d99ace3..39549a6a2 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -30,9 +30,9 @@
         "title": "Mach mit bei Human Connection!",
         "form": {
           "description": "Um loszulegen, gib deine E-Mail Adresse ein:",
-          "terms-and-condition": "Es gelten unsere <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen!</ds-text></a>",
-          "data-privacy": "Es gelten unsere <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Datenschutzerklärungen!",
-          "minimum-age": "Du musst das 18 Lebensjahr abgeschlossen haben!",
+          "terms-and-condition": "Ich stimme den <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Nutzungsbedingungen!</ds-text></a>zu.",
+          "data-privacy": "Ich habe die  <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Datenschutzerklärungen!</ds-text></a> gelesen und verstanden",
+          "minimum-age": "Ich bin 18 Jahre oder älter.",
           "invitation-code": "Dein Einladungscode lautet: <b>{code}</b>",
           "errors": {
             "email-exists": "Es gibt schon ein Benutzerkonto mit dieser E-Mail Adresse!",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index a22f7a4a4..a97a84a73 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -31,9 +31,9 @@
         "title": "Join Human Connection!",
         "form": {
           "description": "To get started, enter your email address:",
-          "terms-and-condition": "Our <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > terms of conditions!</ds-text></a> apply!",
-          "data-privacy": "Our <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" > Data privacy </ds-text></a> apply!",
-          "minimum-age": "You must be at least 18 years old!",
+          "terms-and-condition": "I confirm to the <a href=\"/terms-and-conditions\"><ds-text bold color=\"primary\" > Terms and conditions</ds-text></a>.",
+          "data-privacy": " I have read and understood the <a href=\"https://human-connection.org/datenschutz/\" target=\"_blank\"><ds-text bold color=\"primary\" >Privacy Statement</ds-text></a> ",
+          "minimum-age": "I'm 18 years or older.",
           "invitation-code": "Your invitation code is: <b>{code}</b>",
           "errors": {
             "email-exists": "There is already a user account with this email address!",