Link content creation & list to their buttons in room view

src/app/app-routing.module.ts

@@ -10,6 +10,9 @@ import { UserRole } from './user-roles.enum';
 import { ParticipantRoomComponent } from './participant-room/participant-room.component';
 import { CreatorRoomComponent } from './creator-room/creator-room.component';
 import { CommentListComponent } from './comment-list/comment-list.component';
+import { ContentListComponent } from './content-list/content-list.component';
+import { ContentCreationComponent } from './content-creation/content-creation.component';
+import { ContentDetailComponent } from './content-detail/content-detail.component';
 
 const routes: Routes = [
   { path: '', redirectTo: '/home', pathMatch: 'full' },
@@ -42,6 +45,24 @@ const routes: Routes = [
     canActivate: [AuthenticationGuard],
     data: { roles: [UserRole.CREATOR] }
   },
+  {
+    path: 'creator/room/:roomId/content-creation',
+    component: ContentCreationComponent,
+    canActivate: [AuthenticationGuard],
+    data: { roles: [UserRole.CREATOR] }
+  },
+  {
+    path: 'creator/room/:roomId/content-list',
+    component: ContentListComponent,
+    canActivate: [AuthenticationGuard],
+    data: { roles: [UserRole.CREATOR] }
+  },
+  {
+    path: 'creator/room/:roomId/content-list/:id',
+    component: ContentDetailComponent,
+    canActivate: [AuthenticationGuard],
+    data: { roles: [UserRole.CREATOR] }
+  },
   { path: 'participant/room/:roomId/create-comment',
     component: CreateCommentComponent,
     canActivate: [AuthenticationGuard],

src/app/content-creation/content-creation.component.scss

 .content-card {
     max-width: 400px;
-    margin-bottom: 5%;
+    margin: 5%;
 }

src/app/content-detail/content-detail.component.ts

@@ -4,15 +4,15 @@ import { ContentService } from '../content.service';
 import { ActivatedRoute } from '@angular/router';
 
 @Component({
-  selector: 'app-content',
-  templateUrl: './content.component.html',
-  styleUrls: ['./content.component.scss']
+  selector: 'app-content-detail',
+  templateUrl: './content-detail.component.html',
+  styleUrls: ['./content-detail.component.scss']
 })
 export class ContentDetailComponent implements OnInit {
   content: Content = null;
 
   constructor(
-    private contentCreationService: ContentService,
+    private contentService: ContentService,
     private route: ActivatedRoute
   ) { }
 
@@ -23,7 +23,7 @@ export class ContentDetailComponent implements OnInit {
   }
 
   getContent(id: string): void {
-    this.contentCreationService.getContent(id)
+    this.contentService.getContent(id)
       .subscribe(content => this.content = content);
   }
 }

src/app/content.ts

-enum Format {
+export enum Format {
   CHOICE,
   BINARY,
   SCALE,

src/app/creator-room/creator-room.component.html

@@ -19,10 +19,10 @@
       </mat-card-content>
       <mat-divider></mat-divider>
       <mat-card-actions>
-        <button mat-button color="primary" matTooltip="Create new content">
+        <button mat-button color="primary" matTooltip="Create new content" routerLink="/creator/room/{{room.id}}/content-creation">
           Create content
         </button>
-        <button mat-button color="primary" matTooltip="See contents">
+        <button mat-button color="primary" matTooltip="See contents" routerLink="/creator/room/{{room.id}}/content-list">
           Contents
         </button>
         <button mat-button color="primary" matTooltip="See room comments"

src/app/in-memory-data.service.ts

 import { InMemoryDbService } from 'angular-in-memory-web-api';
+import { Format } from './content';
 
 export class InMemoryDataService implements InMemoryDbService {
   /**
@@ -80,6 +81,27 @@ export class InMemoryDataService implements InMemoryDbService {
         creationTimestamp: new Date(Date.now()),
       }
     ];
-    return { rooms, comments };
+
+    const contents = [
+      {
+        id: '11',
+        revision: '1',
+        roomId: '1',
+        subject: 'bla',
+        body: 'testcontent alpha beta',
+        round: 1,
+        format: Format.TEXT
+      },
+      {
+        id: '12',
+        revision: '2',
+        roomId: '3',
+        subject: 'blub',
+        body: 'testcontenttttt',
+        round: 5,
+        format: Format.TEXT
+      }
+    ];
+    return { rooms, comments, contents };
   }
 }