From cff6e2bb2f1e88bec168bb647f2200cea96e2d19 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lukas=20Mau=C3=9F?= <lukas.mauss@mni.thm.de>
Date: Mon, 15 Oct 2018 12:45:18 +0200
Subject: [PATCH] Fix content-list view
---
src/app/app-routing.module.ts | 10 +++----
.../content-groups.component.ts | 4 +--
.../content-list/content-list.component.html | 29 +++++++++++++++----
.../content-list.component.html.save | 15 ++++++++++
.../content-list/content-list.component.scss | 11 +++++++
.../content-list/content-list.component.ts | 4 ++-
.../content-text-creator.component.html | 2 +-
.../content-text-creator.component.ts | 2 ++
8 files changed, 62 insertions(+), 15 deletions(-)
create mode 100644 src/app/components/fragments/content-list/content-list.component.html.save
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index f3934198f..ef545c05d 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -58,14 +58,14 @@ const routes: Routes = [
data: { roles: [UserRole.CREATOR] }
},
{
- path: 'creator/room/:roomId/:contentGroup',
- component: ContentListComponent,
+ path: 'creator/room/:roomId/feedback-barometer',
+ component: FeedbackBarometerPageComponent,
canActivate: [AuthenticationGuard],
data: { roles: [UserRole.CREATOR] }
},
{
- path: 'creator/room/:roomId/feedback-barometer',
- component: FeedbackBarometerPageComponent,
+ path: 'creator/room/:roomId/:contentGroup',
+ component: ContentListComponent,
canActivate: [AuthenticationGuard],
data: { roles: [UserRole.CREATOR] }
},
@@ -88,7 +88,7 @@ const routes: Routes = [
data: { roles: [UserRole.PARTICIPANT] }
},
{
- path: 'participant/room/:roomId/:contentGroup',
+ path: 'participant/room/:roomId/contents',
component: ContentCarouselPageComponent,
canActivate: [AuthenticationGuard],
data: { roles: [UserRole.PARTICIPANT] }
diff --git a/src/app/components/fragments/content-groups/content-groups.component.ts b/src/app/components/fragments/content-groups/content-groups.component.ts
index e4ea34f24..25f6c9c64 100644
--- a/src/app/components/fragments/content-groups/content-groups.component.ts
+++ b/src/app/components/fragments/content-groups/content-groups.component.ts
@@ -1,6 +1,5 @@
import { Component, Input, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
-import { Content } from '../../../models/content';
import { AuthenticationService } from '../../../services/http/authentication.service';
import { UserRole } from '../../../models/user-roles.enum';
@@ -16,6 +15,7 @@ class ContentGroup {
}
}
+
@Component({
selector: 'app-content-groups',
templateUrl: './content-groups.component.html',
@@ -23,7 +23,7 @@ class ContentGroup {
})
export class ContentGroupsComponent implements OnInit {
- @Input() public contentGroups: {[key: string]: [string]};
+ @Input() public contentGroups: ContentGroup[];
displayedContentGroups: ContentGroup[] = [];
roomShortId: string;
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 aee7145dc..b718bce9f 100644
--- a/src/app/components/fragments/content-list/content-list.component.html
+++ b/src/app/components/fragments/content-list/content-list.component.html
@@ -1,6 +1,23 @@
-<mat-list>
- <mat-list-item *ngFor="let content of contents" (click)="editContent(content.subject)">
- {{content.subject}}
- <mat-divider></mat-divider>
- </mat-list-item>
-</mat-list>
+<div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px" fxFill>
+ <div fxLayout="row" fxLayoutAlign="center">
+ <mat-card>
+ <mat-card-actions>
+ <button mat-fab color="primary" matTooltip="Create new content"
+ routerLink="/creator/room/{{ room.shortId }}/create-content">
+ <mat-icon>note_add</mat-icon>
+ </button>
+ </mat-card-actions>
+ <h4>Klicken Sie auf einen Inhalt, um diesen zu editieren <mat-icon>create</mat-icon></h4>
+ <mat-divider></mat-divider>
+ <mat-list>
+ <mat-list-item *ngFor="let content of contents" (click)="editContent(content.subject)">
+ <h3 mat-line>{{content.subject}}</h3>
+ <p mat-line>
+ <span>{{content.body}}</span>
+ </p>
+ <mat-divider></mat-divider>
+ </mat-list-item>
+ </mat-list>
+ </mat-card>
+ </div>
+</div>
diff --git a/src/app/components/fragments/content-list/content-list.component.html.save b/src/app/components/fragments/content-list/content-list.component.html.save
new file mode 100644
index 000000000..c4808ff31
--- /dev/null
+++ b/src/app/components/fragments/content-list/content-list.component.html.save
@@ -0,0 +1,15 @@
+<div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px" fxFill>
+ <div fxLayout="row" fxLayoutAlign="center">
+ <mat-card>
+ <mat-list>
+ <mat-list-item *ngFor="let content of contents" (click)="editContent(content.subject)">
+ <h3 mat-line>{{content.subject}}</h3>
+ <p mat-line>
+ <span>{{content.body}}</span>
+ </p>
+ <mat-divider></mat-divider>
+ </mat-list-item>
+ </mat-list>
+ </mat-card>
+ </div>
+</div>
diff --git a/src/app/components/fragments/content-list/content-list.component.scss b/src/app/components/fragments/content-list/content-list.component.scss
index e69de29bb..9cea4b7f1 100644
--- a/src/app/components/fragments/content-list/content-list.component.scss
+++ b/src/app/components/fragments/content-list/content-list.component.scss
@@ -0,0 +1,11 @@
+mat-card {
+ max-width: 800px;
+}
+
+mat-card-content > :first-child {
+ margin-top: 16px;
+}
+
+h3 {
+ color: #42A5F5;
+}
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 dda115925..b90691fe0 100644
--- a/src/app/components/fragments/content-list/content-list.component.ts
+++ b/src/app/components/fragments/content-list/content-list.component.ts
@@ -63,7 +63,9 @@ export class ContentListComponent implements OnInit {
this.contentService.getContentsByIds(this.contentGroup.contentIds).subscribe( contents => {
this.contents = contents;
});
- console.log(this.contents);
+ this.route.params.subscribe(params => {
+ sessionStorage.setItem('collection', params['contentGroup']);
+ });
}
findIndexOfSubject(subject: string): number {
diff --git a/src/app/components/fragments/content-text-creator/content-text-creator.component.html b/src/app/components/fragments/content-text-creator/content-text-creator.component.html
index 47b0b0c8e..6733345e9 100644
--- a/src/app/components/fragments/content-text-creator/content-text-creator.component.html
+++ b/src/app/components/fragments/content-text-creator/content-text-creator.component.html
@@ -10,7 +10,7 @@
<markdown [data]="content.body"></markdown>
<mat-form-field>
<input matInput #group type="text" matInput [formControl]="myControl" [matAutocomplete]="auto"
- placeholder="Collection"/>
+ placeholder={{lastCollection}}/>
<mat-autocomplete #auto="matAutocomplete">
<mat-option *ngFor="let collection of filteredOptions | async" [value]="collection">
{{collection}}
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 99d4cc22b..ffa9ca3e3 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
@@ -34,6 +34,7 @@ export class ContentTextCreatorComponent implements OnInit {
collections: string[] = ['ARSnova', 'Angular', 'HTML', 'TypeScript' ];
myControl = new FormControl();
filteredOptions: Observable<string[]>;
+ lastCollection: string;
editDialogMode = false;
@@ -49,6 +50,7 @@ export class ContentTextCreatorComponent implements OnInit {
ngOnInit() {
this.roomId = localStorage.getItem(`roomId`);
this.roomShortId = this.route.snapshot.paramMap.get('roomId');
+ this.lastCollection = sessionStorage.getItem('collection');
this.filteredOptions = this.myControl.valueChanges
.pipe(
startWith(''),
--
GitLab