diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 1d63c142089aaaebecc4857211c9e9d3d86ad64f..28f49635d2ff65b1603e81ce398bd992cc03c2d9 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -8,6 +8,7 @@ import { CreateCommentComponent } from './create-comment/create-comment.componen
import { ParticipantHomeScreenComponent } from './participant-home-screen/participant-home-screen.component';
import { AuthenticationGuard } from './authentication.guard';
import { UserRole } from './user-roles.enum';
+import { ParticipantRoomComponent } from './participant-room/participant-room.component';
const routes: Routes = [
{ path: '', redirectTo: '/home', pathMatch: 'full' },
@@ -34,6 +35,12 @@ const routes: Routes = [
canActivate: [AuthenticationGuard],
data: { roles: [UserRole.PARTICIPANT] }
},
+ {
+ path: 'participant/room/:roomId',
+ component: ParticipantRoomComponent,
+ canActivate: [AuthenticationGuard],
+ data: { roles: [UserRole.PARTICIPANT] }
+ },
{ path: '**', component: PageNotFoundComponent }
];
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 65a8b8ed332afaf11163b9d605d78298421eb768..0cab4d5af7e70c731fe529d53bebd9511046f9ac 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -64,6 +64,7 @@ import { CreatorHomeScreenComponent } from './creator-home-screen/creator-home-s
import { CreateCommentComponent } from './create-comment/create-comment.component';
import { CommentService } from './comment.service';
import { ParticipantHomeScreenComponent } from './participant-home-screen/participant-home-screen.component';
+import { ParticipantRoomComponent } from './participant-room/participant-room.component';
import { DataStoreService } from './data-store.service';
@NgModule({
@@ -85,7 +86,8 @@ import { DataStoreService } from './data-store.service';
CreateCommentComponent,
ParticipantHomeScreenComponent,
CommentComponent,
- ContentAnswersComponent
+ ContentAnswersComponent,
+ ParticipantRoomComponent
],
entryComponents: [
RegisterComponent,
diff --git a/src/app/participant-room/participant-room.component.html b/src/app/participant-room/participant-room.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..a77376131d5a7ca67ac8a929fbaa5c32d34526f1
--- /dev/null
+++ b/src/app/participant-room/participant-room.component.html
@@ -0,0 +1,34 @@
+<div fxLayout="column" fxLayoutAlign="start" fxLayoutGap="20px" fxFill>
+ <div fxLayout="row" fxLayoutAlign="center">
+ <mat-card>
+ <mat-card-header>
+ <mat-card-title><h3 class="subheading-2">{{ roomName }}</h3></mat-card-title>
+ <mat-card-subtitle>{{ roomId }}</mat-card-subtitle>
+ </mat-card-header>
+ <mat-divider></mat-divider>
+ <mat-card-content>
+ <p>
+ {{ roomDescription }}
+ </p>
+ </mat-card-content>
+ <mat-divider></mat-divider>
+ <mat-card-actions>
+ <button mat-icon-button color="primary" matTooltip="Ask something" routerLink="/room/{{roomId}}/create-comment">
+ <mat-icon>question_answer</mat-icon>
+ </button>
+ <button mat-icon-button color="primary" matTooltip="Give feedback">
+ <mat-icon>feedback</mat-icon>
+ </button>
+ <button mat-button color="primary" matTooltip="Join question round">
+ Questions
+ </button>
+ <button mat-button color="primary" matTooltip="See room comments">
+ Comments
+ </button>
+ <button mat-button color="primary" matTooltip="Start personal question round">
+ Learn
+ </button>
+ </mat-card-actions>
+ </mat-card>
+ </div>
+</div>
diff --git a/src/app/participant-room/participant-room.component.scss b/src/app/participant-room/participant-room.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..edaeaf744fc3fb135465a6e113293ebbffab2266
--- /dev/null
+++ b/src/app/participant-room/participant-room.component.scss
@@ -0,0 +1,7 @@
+mat-card {
+ max-width: 800px;
+}
+
+mat-card-content>:first-child {
+ margin-top: 16px;
+}
diff --git a/src/app/participant-room/participant-room.component.spec.ts b/src/app/participant-room/participant-room.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..37811a7fbe4e4e2f3b30d9b43e7d698880c5850f
--- /dev/null
+++ b/src/app/participant-room/participant-room.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ParticipantRoomComponent } from './participant-room.component';
+
+describe('ParticipantRoomComponent', () => {
+ let component: ParticipantRoomComponent;
+ let fixture: ComponentFixture<ParticipantRoomComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ParticipantRoomComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ParticipantRoomComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/participant-room/participant-room.component.ts b/src/app/participant-room/participant-room.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1409939fd29038d92bbb1906a6c14ef0b811e1c3
--- /dev/null
+++ b/src/app/participant-room/participant-room.component.ts
@@ -0,0 +1,24 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-participant-room',
+ templateUrl: './participant-room.component.html',
+ styleUrls: ['./participant-room.component.scss']
+})
+export class ParticipantRoomComponent implements OnInit {
+
+ roomId = '12 34 56 78';
+ roomName = 'Test Room';
+ roomDescription = 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore ' +
+ 'magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea ' +
+ 'takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod ' +
+ 'tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea ' +
+ 'rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.';
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/room-list/room-list.component.html b/src/app/room-list/room-list.component.html
index 3e2cbb1f4f38a6be1d03dde3f4c32c03206e3466..5c96b0160fa03bc126ea52648f8037ae6535a916 100644
--- a/src/app/room-list/room-list.component.html
+++ b/src/app/room-list/room-list.component.html
@@ -1,6 +1,6 @@
<mat-list>
<mat-list-item *ngFor="let room of rooms">
- <button mat-button routerLink="/room/{{room.id}}">
+ <button mat-button routerLink="room/{{room.id}}">
{{room.name}}
</button>
</mat-list-item>