From 39d65823048043ad77ea23d63aa5898a5301b8cc Mon Sep 17 00:00:00 2001
From: Thomas Lenz <Thomas.Lenz@mni.thm.de>
Date: Sun, 8 Apr 2018 10:41:40 +0200
Subject: [PATCH] Add dialogs and selection logic
---
src/app/app.module.ts | 6 +-
.../content-choice-creator.component.ts | 11 +-
.../content-likert-creator.component.ts | 10 +-
.../content-list/content-list.component.html | 7 +-
.../content-list/content-list.component.ts | 104 +++++++++++++++++-
.../content-text-creator.component.ts | 10 +-
.../content-yes-no-creator.component.ts | 10 +-
7 files changed, 143 insertions(+), 15 deletions(-)
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index f1834cbec..b0a0ab0d0 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -124,7 +124,11 @@ import { AnswerEditComponent } from './components/dialogs/answer-edit/answer-edi
RoomCreateComponent,
RoomDeleteComponent,
RoomEditComponent,
- AnswerEditComponent
+ AnswerEditComponent,
+ ContentChoiceCreatorComponent,
+ ContentLikertCreatorComponent,
+ ContentTextCreatorComponent,
+ ContentYesNoCreatorComponent
],
imports: [
AppRoutingModule,
diff --git a/src/app/components/fragments/content-choice-creator/content-choice-creator.component.ts b/src/app/components/fragments/content-choice-creator/content-choice-creator.component.ts
index e2daa4607..95825f915 100644
--- a/src/app/components/fragments/content-choice-creator/content-choice-creator.component.ts
+++ b/src/app/components/fragments/content-choice-creator/content-choice-creator.component.ts
@@ -1,12 +1,13 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
import { AnswerOption } from '../../../models/answer-option';
import { ContentChoice } from '../../../models/content-choice';
import { ContentService } from '../../../services/http/content.service';
import { NotificationService } from '../../../services/util/notification.service';
-import { MatDialog } from '@angular/material';
+import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material';
import { AnswerEditComponent } from '../../dialogs/answer-edit/answer-edit.component';
import { ContentType } from '../../../models/content-type.enum';
import { ActivatedRoute } from '@angular/router';
+import { ContentListComponent } from '../content-list/content-list.component';
export class DisplayAnswer {
answerOption: AnswerOption;
@@ -49,10 +50,14 @@ export class ContentChoiceCreatorComponent implements OnInit {
editDisplayAnswer: DisplayAnswer;
originalDisplayAnswer: DisplayAnswer;
+ editDialogMode = false;
+
constructor(private contentService: ContentService,
private notificationService: NotificationService,
private route: ActivatedRoute,
- public dialog: MatDialog) {
+ public dialog: MatDialog,
+ public dialogRef: MatDialogRef<ContentListComponent>,
+ @Inject(MAT_DIALOG_DATA) public data: any) {
}
ngOnInit() {
diff --git a/src/app/components/fragments/content-likert-creator/content-likert-creator.component.ts b/src/app/components/fragments/content-likert-creator/content-likert-creator.component.ts
index e8add519e..4c103a98c 100644
--- a/src/app/components/fragments/content-likert-creator/content-likert-creator.component.ts
+++ b/src/app/components/fragments/content-likert-creator/content-likert-creator.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
import { DisplayAnswer } from '../content-choice-creator/content-choice-creator.component';
import { ContentChoice } from '../../../models/content-choice';
import { AnswerOption } from '../../../models/answer-option';
@@ -6,6 +6,8 @@ import { ContentType } from '../../../models/content-type.enum';
import { ContentService } from '../../../services/http/content.service';
import { NotificationService } from '../../../services/util/notification.service';
import { ActivatedRoute } from '@angular/router';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
+import { ContentListComponent } from '../content-list/content-list.component';
@Component({
selector: 'app-content-likert-creator',
@@ -37,9 +39,13 @@ export class ContentLikertCreatorComponent implements OnInit {
displayAnswers: DisplayAnswer[] = [];
newAnswerOptionPoints = '0';
+ editDialogMode = false;
+
constructor(private contentService: ContentService,
private notificationService: NotificationService,
- private route: ActivatedRoute) {
+ private route: ActivatedRoute,
+ public dialogRef: MatDialogRef<ContentListComponent>,
+ @Inject(MAT_DIALOG_DATA) public data: any) {
}
fillCorrectAnswers() {
diff --git a/src/app/components/fragments/content-list/content-list.component.html b/src/app/components/fragments/content-list/content-list.component.html
index fd966e2ad..9bb3fda15 100644
--- a/src/app/components/fragments/content-list/content-list.component.html
+++ b/src/app/components/fragments/content-list/content-list.component.html
@@ -1,7 +1,10 @@
<mat-list>
<mat-list-item *ngFor="let content of contents">
- <button mat-button routerLink="content/{{content.contentId}}">
- Content {{content.contentId}}: {{content.subject}}
+<!-- <button mat-button routerLink="content/{{content.contentId}}">
+ Content {{content.contentId}}: {{content.subject}} Type: {{content.format}}
+ </button> -->
+ <button mat-button (click)="editContent(content.subject)">
+ {{content.subject}}
</button>
</mat-list-item>
</mat-list>
diff --git a/src/app/components/fragments/content-list/content-list.component.ts b/src/app/components/fragments/content-list/content-list.component.ts
index 929dbe0da..0239b2906 100644
--- a/src/app/components/fragments/content-list/content-list.component.ts
+++ b/src/app/components/fragments/content-list/content-list.component.ts
@@ -6,6 +6,10 @@ import { ContentChoice } from '../../../models/content-choice';
import { ContentText } from '../../../models/content-text';
import { AnswerOption } from '../../../models/answer-option';
import { ContentType } from '../../../models/content-type.enum';
+import { MatDialog } from '@angular/material';
+import { ContentChoiceCreatorComponent } from '../content-choice-creator/content-choice-creator.component';
+import { ContentLikertCreatorComponent } from '../content-likert-creator/content-likert-creator.component';
+import { ContentTextCreatorComponent } from '../content-text-creator/content-text-creator.component';
@Component({
selector: 'app-content-list',
@@ -51,15 +55,18 @@ export class ContentListComponent implements OnInit {
new AnswerOption('Strongly agree', '0'),
new AnswerOption('Agree', '0'),
new AnswerOption('Neither agree nor disagree', '0'),
- new AnswerOption('Disagree', '0' ),
- new AnswerOption('Strongly disagree', '0') ],
+ new AnswerOption('Disagree', '0'),
+ new AnswerOption('Strongly disagree', '0')],
[],
false,
ContentType.SCALE)
];
+ ContentType: typeof ContentType = ContentType;
+
constructor(private contentService: ContentService,
- private route: ActivatedRoute) {
+ private route: ActivatedRoute,
+ public dialog: MatDialog) {
}
ngOnInit() {
@@ -74,4 +81,95 @@ export class ContentListComponent implements OnInit {
this.contents = contents;
});
}
+
+ findIndexOfSubject(subject: string): number {
+ let index = -1;
+ for (let i = 0; i < this.contents.length; i++) {
+ if (this.contents[i].subject.valueOf() === subject.valueOf()) {
+ index = i;
+ break;
+ }
+ }
+ return index;
+ }
+
+ editContent(subject: string) {
+ const index = this.findIndexOfSubject(subject);
+ const format = this.contents[index].format;
+
+ switch (format) {
+ case this.ContentType.CHOICE:
+ this.editChoiceContentDialog(index, this.contents[index] as ContentChoice);
+ break;
+ case this.ContentType.BINARY:
+ this.editBinaryContentDialog(index, this.contents[index] as ContentChoice);
+ break;
+ case this.ContentType.SCALE:
+ this.editLikertContentDialog(index, this.contents[index] as ContentChoice);
+ break;
+ case this.ContentType.TEXT:
+ this.editTextContentDialog(index, this.contents[index] as ContentText);
+ break;
+ default:
+ return;
+ }
+ }
+
+ editChoiceContentDialog(index: number, content: ContentChoice) {
+ const dialogRef = this.dialog.open(ContentChoiceCreatorComponent, {
+ width: '400px'
+ });
+ // TODO unterscheidung zwischen single / multiple
+ if (content.multiple) {
+ dialogRef.componentInstance.singleChoice = false;
+ dialogRef.componentInstance.multipleChoice = true;
+ } else {
+ dialogRef.componentInstance.multipleChoice = false;
+ dialogRef.componentInstance.singleChoice = true;
+ }
+ dialogRef.componentInstance.editDialogMode = true;
+ dialogRef.componentInstance.content = content;
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ console.log(result);
+ });
+ }
+
+ editBinaryContentDialog(index: number, content: ContentChoice) {
+ const dialogRef = this.dialog.open(ContentChoiceCreatorComponent, {
+ width: '400px'
+ });
+ dialogRef.componentInstance.editDialogMode = true;
+ dialogRef.componentInstance.multipleChoice = false;
+ dialogRef.componentInstance.singleChoice = true;
+ dialogRef.componentInstance.content = content;
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ console.log(result);
+ });
+ }
+
+ editLikertContentDialog(index: number, content: ContentChoice) {
+ const dialogRef = this.dialog.open(ContentLikertCreatorComponent, {
+ width: '400px'
+ });
+ dialogRef.componentInstance.editDialogMode = true;
+ dialogRef.componentInstance.content = content;
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ console.log(result);
+ });
+ }
+
+ editTextContentDialog(index: number, content: ContentText) {
+ const dialogRef = this.dialog.open(ContentTextCreatorComponent, {
+ width: '400px'
+ });
+ dialogRef.componentInstance.editDialogMode = true;
+ dialogRef.componentInstance.content = content;
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ console.log(result);
+ });
+ }
}
diff --git a/src/app/components/fragments/content-text-creator/content-text-creator.component.ts b/src/app/components/fragments/content-text-creator/content-text-creator.component.ts
index 7bcf89874..7d3feac8e 100644
--- a/src/app/components/fragments/content-text-creator/content-text-creator.component.ts
+++ b/src/app/components/fragments/content-text-creator/content-text-creator.component.ts
@@ -1,8 +1,10 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
import { ContentText } from '../../../models/content-text';
import { ContentService } from '../../../services/http/content.service';
import { ActivatedRoute } from '@angular/router';
import { NotificationService } from '../../../services/util/notification.service';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
+import { ContentListComponent } from '../content-list/content-list.component';
@Component({
selector: 'app-content-text-creator',
@@ -18,9 +20,13 @@ export class ContentTextCreatorComponent implements OnInit {
'',
1);
+ editDialogMode = false;
+
constructor(private contentService: ContentService,
private notificationService: NotificationService,
- private route: ActivatedRoute) {
+ private route: ActivatedRoute,
+ public dialogRef: MatDialogRef<ContentListComponent>,
+ @Inject(MAT_DIALOG_DATA) public data: any) {
}
ngOnInit() {
diff --git a/src/app/components/fragments/content-yes-no-creator/content-yes-no-creator.component.ts b/src/app/components/fragments/content-yes-no-creator/content-yes-no-creator.component.ts
index 5008de09b..37a863db7 100644
--- a/src/app/components/fragments/content-yes-no-creator/content-yes-no-creator.component.ts
+++ b/src/app/components/fragments/content-yes-no-creator/content-yes-no-creator.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
import { ContentChoice } from '../../../models/content-choice';
import { DisplayAnswer } from '../content-choice-creator/content-choice-creator.component';
import { AnswerOption } from '../../../models/answer-option';
@@ -6,6 +6,8 @@ import { NotificationService } from '../../../services/util/notification.service
import { ContentType } from '../../../models/content-type.enum';
import { ContentService } from '../../../services/http/content.service';
import { ActivatedRoute } from '@angular/router';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
+import { ContentListComponent } from '../content-list/content-list.component';
@Component({
selector: 'app-content-yes-no-creator',
@@ -34,9 +36,13 @@ export class ContentYesNoCreatorComponent implements OnInit {
displayAnswers: DisplayAnswer[] = [];
newAnswerOptionPoints = '';
+ editDialogMode = false;
+
constructor(private contentService: ContentService,
private route: ActivatedRoute,
- private notificationService: NotificationService) {
+ private notificationService: NotificationService,
+ public dialogRef: MatDialogRef<ContentListComponent>,
+ @Inject(MAT_DIALOG_DATA) public data: any) {
}
ngOnInit() {
--
GitLab