From e6708ffa3bd088cf948cdd8537cb3a9d33d8f3ce Mon Sep 17 00:00:00 2001
From: Marco Herzog <marco.herzog@mni.thm.de>
Date: Fri, 6 Sep 2019 15:21:32 +0200
Subject: [PATCH] Add 'link' to data protection in cookie dialog
---
src/app/app-routing.module.ts | 6 +++---
src/app/app.module.ts | 6 +++---
.../home/_dialogs/cookies/cookies.component.html | 6 +++++-
.../home/_dialogs/cookies/cookies.component.scss | 9 +++++++++
.../home/_dialogs/cookies/cookies.component.ts | 13 ++++++++++++-
.../data-protection/data-protection.component.html | 0
.../data-protection/data-protection.component.scss | 0
.../data-protection.component.spec.ts | 0
.../data-protection/data-protection.component.ts | 0
.../_dialogs}/imprint/imprint.component.html | 0
.../_dialogs}/imprint/imprint.component.scss | 0
.../_dialogs}/imprint/imprint.component.spec.ts | 0
.../_dialogs}/imprint/imprint.component.ts | 0
.../help-page/help-page.component.html | 2 +-
.../help-page/help-page.component.scss | 0
.../help-page/help-page.component.spec.ts | 0
.../{ => _dialogs}/help-page/help-page.component.ts | 0
.../components/shared/footer/footer.component.html | 2 +-
.../components/shared/footer/footer.component.ts | 9 +++++----
.../components/shared/header/header.component.html | 4 ++--
src/assets/i18n/home/de.json | 1 +
src/assets/i18n/home/en.json | 2 +-
22 files changed, 43 insertions(+), 17 deletions(-)
rename src/app/components/{shared => home/_dialogs}/data-protection/data-protection.component.html (100%)
rename src/app/components/{shared => home/_dialogs}/data-protection/data-protection.component.scss (100%)
rename src/app/components/{shared => home/_dialogs}/data-protection/data-protection.component.spec.ts (100%)
rename src/app/components/{shared => home/_dialogs}/data-protection/data-protection.component.ts (100%)
rename src/app/components/{shared => home/_dialogs}/imprint/imprint.component.html (100%)
rename src/app/components/{shared => home/_dialogs}/imprint/imprint.component.scss (100%)
rename src/app/components/{shared => home/_dialogs}/imprint/imprint.component.spec.ts (100%)
rename src/app/components/{shared => home/_dialogs}/imprint/imprint.component.ts (100%)
rename src/app/components/shared/{ => _dialogs}/help-page/help-page.component.html (87%)
rename src/app/components/shared/{ => _dialogs}/help-page/help-page.component.scss (100%)
rename src/app/components/shared/{ => _dialogs}/help-page/help-page.component.spec.ts (100%)
rename src/app/components/shared/{ => _dialogs}/help-page/help-page.component.ts (100%)
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index f9db5d461..5d0598d28 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -3,9 +3,9 @@ import { RouterModule, Routes } from '@angular/router';
import { PageNotFoundComponent } from './components/shared/page-not-found/page-not-found.component';
import { HomePageComponent } from './components/home/home-page/home-page.component';
import { UserHomeComponent } from './components/home/user-home/user-home.component';
-import { ImprintComponent } from './components/shared/imprint/imprint.component';
-import { DataProtectionComponent } from './components/shared/data-protection/data-protection.component';
-import { HelpPageComponent } from './components/shared/help-page/help-page.component';
+import { ImprintComponent } from './components/home/_dialogs/imprint/imprint.component';
+import { DataProtectionComponent } from './components/home/_dialogs/data-protection/data-protection.component';
+import { HelpPageComponent } from './components/shared/_dialogs/help-page/help-page.component';
const routes: Routes = [
{
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 6b9ff2003..e185cc062 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -42,9 +42,9 @@ import { HomeCreatorPageComponent } from './components/home/home-creator-page/ho
import { HomeParticipantPageComponent } from './components/home/home-participant-page/home-participant-page.component';
import { CommentSettingsService } from './services/http/comment-settings.service';
import { ModeratorModule } from './components/moderator/moderator.module';
-import { ImprintComponent } from './components/shared/imprint/imprint.component';
-import { DataProtectionComponent } from './components/shared/data-protection/data-protection.component';
-import { HelpPageComponent } from './components/shared/help-page/help-page.component';
+import { ImprintComponent } from './components/home/_dialogs/imprint/imprint.component';
+import { DataProtectionComponent } from './components/home/_dialogs/data-protection/data-protection.component';
+import { HelpPageComponent } from './components/shared/_dialogs/help-page/help-page.component';
import { CookiesComponent } from './components/home/_dialogs/cookies/cookies.component';
import { DataProtectionEnComponent } from '../assets/i18n/data-protection/data-protection-en';
import { DataProtectionDeComponent } from 'assets/i18n/data-protection/data-protection-de';
diff --git a/src/app/components/home/_dialogs/cookies/cookies.component.html b/src/app/components/home/_dialogs/cookies/cookies.component.html
index 9ace0baf6..fd04369d7 100644
--- a/src/app/components/home/_dialogs/cookies/cookies.component.html
+++ b/src/app/components/home/_dialogs/cookies/cookies.component.html
@@ -1,5 +1,8 @@
<div>
- <h1 mat-dialog-title>Cookies</h1>
+ <h1 mat-dialog-title>Cookies
+ <button mat-icon-button aria-labelledby="info-label" class="info" (click)="openDataProtection()">
+ <mat-icon class="info-icon">help</mat-icon>
+ </button></h1>
<mat-divider></mat-divider>
<app-cookies-de *ngIf="currentLang=='de'"></app-cookies-de>
@@ -21,4 +24,5 @@
<div class="visually-hidden">
<div id="accept-label">{{'cookies.accept-label' | translate }}</div>
<div id="decline-label">{{'cookies.decline-label' | translate }}</div>
+ <div id="info-label">{{'cookies.info-label' | translate }}</div>
</div>
diff --git a/src/app/components/home/_dialogs/cookies/cookies.component.scss b/src/app/components/home/_dialogs/cookies/cookies.component.scss
index 16c5e2d3d..95ae40435 100644
--- a/src/app/components/home/_dialogs/cookies/cookies.component.scss
+++ b/src/app/components/home/_dialogs/cookies/cookies.component.scss
@@ -10,3 +10,12 @@
div {
color: var(--on-surface);
}
+
+.info{
+ vertical-align: bottom;
+ margin-left: -5px;
+}
+
+.info-icon{
+ font-size: 19px;
+}
diff --git a/src/app/components/home/_dialogs/cookies/cookies.component.ts b/src/app/components/home/_dialogs/cookies/cookies.component.ts
index 6ddad8e22..aa81a26c5 100644
--- a/src/app/components/home/_dialogs/cookies/cookies.component.ts
+++ b/src/app/components/home/_dialogs/cookies/cookies.component.ts
@@ -1,4 +1,6 @@
import { Component, OnInit } from '@angular/core';
+import { DataProtectionComponent } from '../data-protection/data-protection.component';
+import { MatDialog } from '@angular/material';
@Component({
selector: 'app-cookies',
@@ -10,7 +12,7 @@ export class CookiesComponent implements OnInit {
deviceType: string;
currentLang: string;
- constructor() { }
+ constructor(private dialog: MatDialog) { }
ngOnInit() {
this.currentLang = localStorage.getItem('currentLang');
@@ -21,6 +23,15 @@ export class CookiesComponent implements OnInit {
}
exitApp() {
+ localStorage.setItem('cookieAccepted', 'false');
// TODO somehow exit the app, since the user didn't accept cookie usage
}
+
+ openDataProtection() {
+ const dialogRef = this.dialog.open(DataProtectionComponent, {
+ height: '95%',
+ width: '75%'
+ });
+ dialogRef.componentInstance.deviceType = this.deviceType;
+}
}
diff --git a/src/app/components/shared/data-protection/data-protection.component.html b/src/app/components/home/_dialogs/data-protection/data-protection.component.html
similarity index 100%
rename from src/app/components/shared/data-protection/data-protection.component.html
rename to src/app/components/home/_dialogs/data-protection/data-protection.component.html
diff --git a/src/app/components/shared/data-protection/data-protection.component.scss b/src/app/components/home/_dialogs/data-protection/data-protection.component.scss
similarity index 100%
rename from src/app/components/shared/data-protection/data-protection.component.scss
rename to src/app/components/home/_dialogs/data-protection/data-protection.component.scss
diff --git a/src/app/components/shared/data-protection/data-protection.component.spec.ts b/src/app/components/home/_dialogs/data-protection/data-protection.component.spec.ts
similarity index 100%
rename from src/app/components/shared/data-protection/data-protection.component.spec.ts
rename to src/app/components/home/_dialogs/data-protection/data-protection.component.spec.ts
diff --git a/src/app/components/shared/data-protection/data-protection.component.ts b/src/app/components/home/_dialogs/data-protection/data-protection.component.ts
similarity index 100%
rename from src/app/components/shared/data-protection/data-protection.component.ts
rename to src/app/components/home/_dialogs/data-protection/data-protection.component.ts
diff --git a/src/app/components/shared/imprint/imprint.component.html b/src/app/components/home/_dialogs/imprint/imprint.component.html
similarity index 100%
rename from src/app/components/shared/imprint/imprint.component.html
rename to src/app/components/home/_dialogs/imprint/imprint.component.html
diff --git a/src/app/components/shared/imprint/imprint.component.scss b/src/app/components/home/_dialogs/imprint/imprint.component.scss
similarity index 100%
rename from src/app/components/shared/imprint/imprint.component.scss
rename to src/app/components/home/_dialogs/imprint/imprint.component.scss
diff --git a/src/app/components/shared/imprint/imprint.component.spec.ts b/src/app/components/home/_dialogs/imprint/imprint.component.spec.ts
similarity index 100%
rename from src/app/components/shared/imprint/imprint.component.spec.ts
rename to src/app/components/home/_dialogs/imprint/imprint.component.spec.ts
diff --git a/src/app/components/shared/imprint/imprint.component.ts b/src/app/components/home/_dialogs/imprint/imprint.component.ts
similarity index 100%
rename from src/app/components/shared/imprint/imprint.component.ts
rename to src/app/components/home/_dialogs/imprint/imprint.component.ts
diff --git a/src/app/components/shared/help-page/help-page.component.html b/src/app/components/shared/_dialogs/help-page/help-page.component.html
similarity index 87%
rename from src/app/components/shared/help-page/help-page.component.html
rename to src/app/components/shared/_dialogs/help-page/help-page.component.html
index f13dae74f..7e60377f8 100644
--- a/src/app/components/shared/help-page/help-page.component.html
+++ b/src/app/components/shared/_dialogs/help-page/help-page.component.html
@@ -15,7 +15,7 @@
</div>
<div class="visually-hidden">
- <div id="consent-label">{{ 'help.close-label' | translate }}</div>
+ <div id="help-label">{{ 'help.close-label' | translate }}</div>
</div>
</div>
diff --git a/src/app/components/shared/help-page/help-page.component.scss b/src/app/components/shared/_dialogs/help-page/help-page.component.scss
similarity index 100%
rename from src/app/components/shared/help-page/help-page.component.scss
rename to src/app/components/shared/_dialogs/help-page/help-page.component.scss
diff --git a/src/app/components/shared/help-page/help-page.component.spec.ts b/src/app/components/shared/_dialogs/help-page/help-page.component.spec.ts
similarity index 100%
rename from src/app/components/shared/help-page/help-page.component.spec.ts
rename to src/app/components/shared/_dialogs/help-page/help-page.component.spec.ts
diff --git a/src/app/components/shared/help-page/help-page.component.ts b/src/app/components/shared/_dialogs/help-page/help-page.component.ts
similarity index 100%
rename from src/app/components/shared/help-page/help-page.component.ts
rename to src/app/components/shared/_dialogs/help-page/help-page.component.ts
diff --git a/src/app/components/shared/footer/footer.component.html b/src/app/components/shared/footer/footer.component.html
index 888b3d8bb..14612c640 100644
--- a/src/app/components/shared/footer/footer.component.html
+++ b/src/app/components/shared/footer/footer.component.html
@@ -1,7 +1,7 @@
<div>
<mat-toolbar id="footer-toolbar">
<button mat-button (click)="showHelp()" *ngIf="router.url !== '/home'" aria-labelledby="help-label">
- <mat-icon>help_outline</mat-icon>
+ <mat-icon>help</mat-icon>
<span *ngIf="deviceType === 'desktop'">
{{ 'footer.help' | translate }}
</span>
diff --git a/src/app/components/shared/footer/footer.component.ts b/src/app/components/shared/footer/footer.component.ts
index f4122ead7..de4c8a55a 100644
--- a/src/app/components/shared/footer/footer.component.ts
+++ b/src/app/components/shared/footer/footer.component.ts
@@ -10,9 +10,9 @@ import { Room } from '../../../models/room';
import { DemoVideoComponent } from '../../home/_dialogs/demo-video/demo-video.component';
import { ThemeService } from '../../../../theme/theme.service';
import { CookiesComponent } from '../../home/_dialogs/cookies/cookies.component';
-import { ImprintComponent } from '../imprint/imprint.component';
-import { HelpPageComponent } from '../help-page/help-page.component';
-import { DataProtectionComponent } from '../data-protection/data-protection.component';
+import { ImprintComponent } from '../../home/_dialogs/imprint/imprint.component';
+import { HelpPageComponent } from '../_dialogs/help-page/help-page.component';
+import { DataProtectionComponent } from '../../home/_dialogs/data-protection/data-protection.component';
@Component({
selector: 'app-footer',
@@ -69,7 +69,8 @@ export class FooterComponent implements OnInit {
showCookieModal() {
const dialogRef = this.dialog.open(CookiesComponent, {
height: '95%',
- width: '60%'
+ width: '60%',
+ autoFocus: false
});
dialogRef.disableClose = true;
dialogRef.componentInstance.deviceType = this.deviceType;
diff --git a/src/app/components/shared/header/header.component.html b/src/app/components/shared/header/header.component.html
index d53c7eb8e..3e5549f1b 100644
--- a/src/app/components/shared/header/header.component.html
+++ b/src/app/components/shared/header/header.component.html
@@ -1,8 +1,8 @@
<mat-toolbar class="mat-elevation-z4">
<mat-toolbar-row>
- <button mat-icon-button *ngIf="router.url !== '/home'" (click)="goBack()"
+ <button mat-icon-button aria-labelledby="back-label" *ngIf="router.url !== '/home'" (click)="goBack()"
matTooltip="{{'header.back' | translate}}">
- <mat-icon class="header-icons" aria-labelledby="back-label">keyboard_arrow_left</mat-icon>
+ <mat-icon class="header-icons">keyboard_arrow_left</mat-icon>
</button>
<span class="fill-remaining-space"></span>
<h3 *ngIf="router.url.includes('comments') && user.role === 3 && deviceType === 'desktop'"
diff --git a/src/assets/i18n/home/de.json b/src/assets/i18n/home/de.json
index e5cf765c1..03f6cc9b3 100644
--- a/src/assets/i18n/home/de.json
+++ b/src/assets/i18n/home/de.json
@@ -121,6 +121,7 @@
"style-blue": "Wähle das blaue Thema aus"
},
"cookies": {
+ "info-label": "Öffnet ein Dialogfenster mit der frag.jetzt Datenschutzerklärung",
"accept": "Bestätigen",
"accept-label": "Bestätigt die Verwendung von Cookies und fährt zur Hauptanwendung fort",
"decline": "Ablehnen",
diff --git a/src/assets/i18n/home/en.json b/src/assets/i18n/home/en.json
index 86f5acd78..5b2297c18 100644
--- a/src/assets/i18n/home/en.json
+++ b/src/assets/i18n/home/en.json
@@ -98,7 +98,6 @@
"demo": "Demo",
"accessibility-demo": "Shows demo version of frag.jetzt",
"dsgvo": "Data Protection",
- "accessibility-data-protection": "Opens data protection document in a new dialog",
"imprint": "Imprint",
"accessibility-imprint": "Opens the imprint in a new dialog",
"will-open": " will be opened in a new tab...",
@@ -122,6 +121,7 @@
"style-blue": "Select the blue style theme"
},
"cookies": {
+ "info-label": "Opens a dialog with the frag.jetzt privacy statement",
"accept": "Accept",
"accept-label": "Accepts the use of cookies and proceeds to the app",
"decline": "Decline",
--
GitLab