From 46af3211601ea394de69e6fd5e247a45b07f11fd Mon Sep 17 00:00:00 2001
From: Heinrich Marks <heinrich.marks@mni.thm.de>
Date: Sun, 11 Mar 2018 19:36:23 +0100
Subject: [PATCH] Add answer list & link into content detail view
---
src/app/{text-answer.ts => answer-text.ts} | 2 +-
src/app/app.module.ts | 8 +++-
src/app/content-answer.service.spec.ts | 15 +++++++
src/app/content-answer.service.ts | 43 +++++++++++++++++++
.../content-answers-list.component.html | 9 ++++
.../content-answers-list.component.scss | 0
.../content-answers-list.component.spec.ts | 25 +++++++++++
.../content-answers-list.component.ts | 26 +++++++++++
.../content-detail.component.html | 6 ++-
src/app/in-memory-data.service.ts | 35 ++++++++++++++-
10 files changed, 164 insertions(+), 5 deletions(-)
rename src/app/{text-answer.ts => answer-text.ts} (85%)
create mode 100644 src/app/content-answer.service.spec.ts
create mode 100644 src/app/content-answer.service.ts
create mode 100644 src/app/content-answers-list/content-answers-list.component.html
create mode 100644 src/app/content-answers-list/content-answers-list.component.scss
create mode 100644 src/app/content-answers-list/content-answers-list.component.spec.ts
create mode 100644 src/app/content-answers-list/content-answers-list.component.ts
diff --git a/src/app/text-answer.ts b/src/app/answer-text.ts
similarity index 85%
rename from src/app/text-answer.ts
rename to src/app/answer-text.ts
index a4232a41a..14ad44172 100644
--- a/src/app/text-answer.ts
+++ b/src/app/answer-text.ts
@@ -1,4 +1,4 @@
-export class TextAnswer {
+export class AnswerText {
id: string;
revision: string;
contendId: string;
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 21673e72b..a31d35189 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -70,6 +70,8 @@ import { CreatorRoomComponent } from './creator-room/creator-room.component';
import { ContentDetailComponent } from './content-detail/content-detail.component';
import { ContentListComponent } from './content-list/content-list.component';
import { ContentService } from './content.service';
+import { ContentAnswersListComponent } from './content-answers-list/content-answers-list.component';
+import { ContentAnswerService } from './content-answer.service';
@NgModule({
declarations: [
@@ -94,7 +96,8 @@ import { ContentService } from './content.service';
ParticipantRoomComponent,
CreatorRoomComponent,
ContentDetailComponent,
- ContentListComponent
+ ContentListComponent,
+ ContentAnswersListComponent
],
entryComponents: [
RegisterComponent,
@@ -151,7 +154,8 @@ import { ContentService } from './content.service';
DataStoreService,
RoomService,
CommentService,
- ContentService
+ ContentService,
+ ContentAnswerService
],
bootstrap: [AppComponent]
})
diff --git a/src/app/content-answer.service.spec.ts b/src/app/content-answer.service.spec.ts
new file mode 100644
index 000000000..74b335651
--- /dev/null
+++ b/src/app/content-answer.service.spec.ts
@@ -0,0 +1,15 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { ContentAnswerService } from './content-answer.service';
+
+describe('ContentAnswerService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [ContentAnswerService]
+ });
+ });
+
+ it('should be created', inject([ContentAnswerService], (service: ContentAnswerService) => {
+ expect(service).toBeTruthy();
+ }));
+});
diff --git a/src/app/content-answer.service.ts b/src/app/content-answer.service.ts
new file mode 100644
index 000000000..7bbded131
--- /dev/null
+++ b/src/app/content-answer.service.ts
@@ -0,0 +1,43 @@
+import { Injectable } from '@angular/core';
+import { AnswerText } from './answer-text';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Observable } from 'rxjs/Observable';
+import { catchError, tap } from 'rxjs/operators';
+import { ErrorHandlingService } from './error-handling.service';
+
+const httpOptions = {
+ headers: new HttpHeaders({ 'Content-Type': 'application/json' })
+};
+
+@Injectable()
+export class ContentAnswerService extends ErrorHandlingService {
+
+ private answerUrl = 'api/answerTexts';
+
+ constructor(private http: HttpClient) {
+ super();
+ }
+
+ getAnswerTexts(): Observable<AnswerText[]> {
+ return this.http.get<AnswerText[]>(this.answerUrl).pipe(
+ tap(_ => ''),
+ catchError(this.handleError('getAnswerTexts', []))
+ );
+ }
+
+ addAnswerText(answerText: AnswerText): Observable<AnswerText> {
+ return this.http.post<AnswerText>(this.answerUrl, answerText, httpOptions).pipe(
+ tap(_ => ''),
+ catchError(this.handleError<AnswerText>('addAnswerText'))
+ );
+ }
+
+ getAnswerText(id: string): Observable<AnswerText> {
+ const url = `${this.answerUrl}/${id}`;
+ return this.http.get<AnswerText>(url).pipe(
+ tap(_ => ''),
+ catchError(this.handleError<AnswerText>(`getAnswerText id=${id}`))
+ );
+ }
+
+}
diff --git a/src/app/content-answers-list/content-answers-list.component.html b/src/app/content-answers-list/content-answers-list.component.html
new file mode 100644
index 000000000..8c691ac46
--- /dev/null
+++ b/src/app/content-answers-list/content-answers-list.component.html
@@ -0,0 +1,9 @@
+<mat-list>
+ <h3 mat-subheader>Answers</h3>
+ <mat-list-item *ngFor="let textAnswer of textAnswers">
+ <button mat-button routerLink="{{textAnswer.id}}">
+ {{textAnswer.body}}
+ </button>
+ </mat-list-item>
+ </mat-list>
+
\ No newline at end of file
diff --git a/src/app/content-answers-list/content-answers-list.component.scss b/src/app/content-answers-list/content-answers-list.component.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/app/content-answers-list/content-answers-list.component.spec.ts b/src/app/content-answers-list/content-answers-list.component.spec.ts
new file mode 100644
index 000000000..feaa00d04
--- /dev/null
+++ b/src/app/content-answers-list/content-answers-list.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ContentAnswersListComponent } from './content-answers-list.component';
+
+describe('ContentAnswersListComponent', () => {
+ let component: ContentAnswersListComponent;
+ let fixture: ComponentFixture<ContentAnswersListComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ContentAnswersListComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ContentAnswersListComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/content-answers-list/content-answers-list.component.ts b/src/app/content-answers-list/content-answers-list.component.ts
new file mode 100644
index 000000000..1b9efed7c
--- /dev/null
+++ b/src/app/content-answers-list/content-answers-list.component.ts
@@ -0,0 +1,26 @@
+import { Component, OnInit } from '@angular/core';
+import { ContentAnswerService } from '../content-answer.service';
+import { AnswerText } from '../answer-text';
+
+@Component({
+ selector: 'app-content-answers-list',
+ templateUrl: './content-answers-list.component.html',
+ styleUrls: ['./content-answers-list.component.scss']
+})
+export class ContentAnswersListComponent implements OnInit {
+ textAnswers: AnswerText[];
+
+ constructor(private ContentAnswerService: ContentAnswerService ) { }
+
+ ngOnInit() {
+ this.getAnswerTexts();
+ }
+
+ getAnswerTexts(): void {
+ this.ContentAnswerService.getAnswerTexts().
+ subscribe(textAnswers => {
+ this.textAnswers = textAnswers;
+ })
+ }
+
+}
diff --git a/src/app/content-detail/content-detail.component.html b/src/app/content-detail/content-detail.component.html
index b631f32f0..1abb21f9a 100644
--- a/src/app/content-detail/content-detail.component.html
+++ b/src/app/content-detail/content-detail.component.html
@@ -12,6 +12,10 @@
<p>
{{ content.body }}
</p>
+ <mat-divider></mat-divider>
+ <div>
+ <app-content-answers-list></app-content-answers-list>
+ </div>
</mat-card-content>
<mat-divider></mat-divider>
<!-- answes list here -->
@@ -19,7 +23,7 @@
<button mat-button color="primary" matTooltip="Create new content" routerLink="/creator/room/{{content.id}}/content-creation">
Create answer
</button>
- <button mat-button color="warn" matTooltip="Delete selected room">
+ <button mat-button color="warn" matTooltip="Delete selected answer"> <!-- on click, add a 'x' on the right end of each answer to make it deletable -->
Delete answer
</button>
diff --git a/src/app/in-memory-data.service.ts b/src/app/in-memory-data.service.ts
index 0653594a3..dd0271cdf 100644
--- a/src/app/in-memory-data.service.ts
+++ b/src/app/in-memory-data.service.ts
@@ -102,6 +102,39 @@ export class InMemoryDataService implements InMemoryDbService {
format: Format.TEXT
}
];
- return { rooms, comments, contents };
+
+ const answerTexts = [
+ {
+ id: '1',
+ revision: '1',
+ contendId: '1',
+ round: '1',
+ subject: 'Textaufgabe 1',
+ body: 'gamma, delta',
+ read: 'yes',
+ creationTimestamp: Date,
+ },
+ {
+ id: '1',
+ revision: '1',
+ contendId: '1',
+ round: '1',
+ subject: 'Textaufgabe 1',
+ body: 'epsilon, phi',
+ read: 'yes',
+ creationTimestamp: Date,
+ },
+ {
+ id: '2',
+ revision: '2',
+ contendId: '2',
+ round: '3',
+ subject: 'Textaufgabe 2',
+ body: 'Der Turm ist 20m hoch',
+ read: 'yes',
+ creationTimestamp: Date,
+ }
+ ]
+ return { rooms, comments, contents, answerTexts };
}
}
--
GitLab