diff --git a/src/app/components/shared/header/header.component.html b/src/app/components/shared/header/header.component.html
index 80de200ddd216bd777d7fcbc07b4c3e517defcab..5eeb98c3985ee4b59558d8e9351f12c4e52bae02 100644
--- a/src/app/components/shared/header/header.component.html
+++ b/src/app/components/shared/header/header.component.html
@@ -11,7 +11,7 @@
<button id="back-button"
mat-icon-button
aria-labelledby="cloud"
- *ngIf="router.url !== '/home'"
+ *ngIf="router.url !== '/user' && router.url !== '/home'"
(click)="openCloudDialog()">
<mat-icon class="header-icons">cloud</mat-icon>
</button>
diff --git a/src/app/components/shared/header/header.component.ts b/src/app/components/shared/header/header.component.ts
index 84ff42aab5da6b692c8b7b93b358ae0fa1f43097..c2acd00d652bf030d70e6afbe1bad770aa2ba384 100644
--- a/src/app/components/shared/header/header.component.ts
+++ b/src/app/components/shared/header/header.component.ts
@@ -47,10 +47,8 @@ export class HeaderComponent implements OnInit {
public eventService: EventService,
private bonusTokenService: BonusTokenService,
private _r: Renderer2,
- private motdService: MotdService,
- public cloudDialog: MatDialog
- ) {
- }
+ private motdService: MotdService
+ ) {}
ngOnInit() {
this.eventService.on('userLogin').subscribe(e => {
@@ -135,11 +133,7 @@ export class HeaderComponent implements OnInit {
}
openCloudDialog() {
- const cloudDialogRef = this.cloudDialog.open(TopicCloudDialogComponent);
-
- cloudDialogRef.afterClosed().subscribe(result => {
- console.log(`Dialog result: ${result}`);
- });
+ this.dialog.open(TopicCloudDialogComponent);
}
showMotdDialog() {
diff --git a/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.html b/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.html
index 00d63c53f8f4602359965fc21b0db91298908627..26c0e33c445806bce3e1b40a2a9b742adc434c9a 100644
--- a/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.html
+++ b/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.html
@@ -11,21 +11,43 @@
{{keyword.questions.length}} Questions
</mat-panel-description>
</mat-expansion-panel-header>
- <p *ngFor="let question of keyword.questions">{{question}}</p>
+ <p *ngFor="let question of keyword.questions">{{question}}</p>
- <mat-divider></mat-divider>
+ <mat-divider></mat-divider>
- <!-- TODO: show buttons only to creator and moderators -->
- <button mat-icon-button style="align-self:flex-end;"
- (click)="editKeyword(keyword.keywordID)">
- <mat-icon class="primary">edit</mat-icon>
- </button>
+ <!-- TODO: show buttons only to creator and moderators -->
+
+ <!-- Only visible when not editing -->
+ <div *ngIf="!edit">
+ <button mat-icon-button style="align-self:flex-end;"
+ (click)="editKeyword()">
+ <mat-icon class="primary">edit</mat-icon>
+ </button>
+
+ <button mat-icon-button style="align-self:flex-end;"
+ (click)="deleteKeyword(keyword.keywordID); openConfirmDialog()">
+ <mat-icon class="warn">delete</mat-icon>
+ </button>
+ </div>
+
+ <!-- Only visible when editing -->
+ <div *ngIf="edit">
+ <mat-form-field>
+ <mat-label>New Keyword</mat-label>
+ <input matInput [(ngModel)]="newKeyword">
+ </mat-form-field>
+
+ <button mat-icon-button (click)="confirmEdit(keyword.keywordID)">
+ <mat-icon>check</mat-icon>
+ </button>
+ <button mat-icon-button (click)="cancelEdit()">
+ <mat-icon>cancel</mat-icon>
+ </button>
+ </div>
+ <!-- TODO: add automatic translation -->
- <button mat-icon-button style="align-self:flex-end;"
- (click)="deleteKeyword(keyword.keywordID)">
- <mat-icon class="warn">delete</mat-icon>
- </button>
- <!-- TODO: add automatic translation -->
</mat-expansion-panel>
</mat-accordion>
+ <!--<h1 *ngIf="keywords.length == 0">there are no keywords</h1> -->
+
</mat-dialog-content>
diff --git a/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.ts b/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.ts
index 07322e34951146521c1f65772b92b0f5c942f16d..1a8bf13e26497f3ee3f954be0bfa922bec40a8ff 100644
--- a/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.ts
+++ b/src/app/components/shared/topic-cloud-dialog/topic-cloud-dialog.component.ts
@@ -1,5 +1,8 @@
import { Component, OnInit } from '@angular/core';
import {Keyword} from './keyword';
+import { MatDialogRef } from '@angular/material/dialog';
+import { HeaderComponent } from '../header/header.component';
+import { NotificationService } from '../../../services/util/notification.service';
@Component({
selector: 'app-topic-cloud-dialog',
@@ -8,48 +11,18 @@ import {Keyword} from './keyword';
})
export class TopicCloudDialogComponent implements OnInit {
public panelOpenState = false;
- /* public keywords = [
- {
- keywordID: 1,
- keyword: "Cloud",
- questions: [
- "Wie genau ist die Cloud aufgebaut?",
- "Wieviel speicherplatz steht mir in der Cloud zur verfuegung?",
- "Sollen wir die Tag Cloud implementieren?"
- ]
- },
- {
- keywordID: 2,
- keyword: "SWT",
- questions: [
- "Muss man fuer das Modul SWT bestanden haben?"
- ]
- },
- {
- keywordID: 3,
- keyword: "Frage",
- questions: [
- "Das ist eine Lange Frage mit dem Thema 'frage'",
- "Ich habe eine Frage, sind Fragen zum thema 'Frage' auch erlaubt?",
- "Ich wollte Fragen ob sie gerne Sachen gefragt werden",
- "Langsam geht mir die Fragerei mit den ganzen Fragen auf den Geist"
- ]
- },
- {
- keywordID: 4,
- keyword: "Klausur",
- questions: [
- "Darf man in der Klausur hilfmittel verwenden?",
- "An welchem Termin findet die Klausur statt?"
- ]
- }
- ];
-*/
- constructor() { }
-
+ newKeyword: string = '';
+ edit: boolean = false;
keywords: Keyword[] = [];
+ constructor(public matdialogRef: MatDialogRef<HeaderComponent>,
+ private notificationService: NotificationService) { }
+
ngOnInit(): void {
+ if (this.keywords.length > 0){
+ this.notificationService.show("there are no keywords");
+ this.matdialogRef.close();
+ }
let questions = ["Wie genau ist die Cloud aufgebaut?",
"Wieviel speicherplatz steht mir in der Cloud zur verfuegung?",
"Sollen wir die Tag Cloud implementieren?"];
@@ -67,20 +40,42 @@ export class TopicCloudDialogComponent implements OnInit {
pushToArray(id: number, key: string, questions: string[]){
let _keyword = {
- keywordID: 1,
- keyword: "test",
+ keywordID: id,
+ keyword: key,
questions: questions
}
-
this.keywords.push(_keyword);
}
- editKeyword(id: number): void{
- console.log("keyword with ID "+id+" has been edited");
+ editKeyword(): void {
+ this.edit = true;
}
deleteKeyword(id: number): void{
+ this.keywords.map(keyword => {
+ if (keyword.keywordID == id)
+ this.keywords.splice(this.keywords.indexOf(keyword, 0), 1);
+ });
+ if (this.keywords.length == 0)
+ this.matdialogRef.close();
+ }
+
+ cancelEdit(): void {
+ console.log("edit canceled");
+ this.edit = false;
+ }
+
+ confirmEdit(id: number): void {
+ console.log("edit confirmed "+id);
+ this.keywords.map(keyword => {
+ if (keyword.keywordID == id)
+ keyword.keyword = this.newKeyword;
+ });
+ this.edit = false;
+ this.newKeyword = '';
+ }
- console.log("keyword with ID "+id+" has been deleted");
+ openConfirmDialog(): void {
+ console.log("are u sure?");
}
}