From 468a2dd68fbd645dee960d9b9157f577e083b8a9 Mon Sep 17 00:00:00 2001
From: Sebastian Wittek <sebastian.wittek@mni.thm.de>
Date: Thu, 21 Mar 2019 11:57:26 +0100
Subject: [PATCH] add component presend-comment in shared/_dialogs
---
.../present-comment.component.html | 8 ++++
.../present-comment.component.scss | 38 +++++++++++++++++++
.../present-comment.component.spec.ts | 25 ++++++++++++
.../present-comment.component.ts | 32 ++++++++++++++++
.../shared/comment/comment.component.html | 2 +-
.../shared/comment/comment.component.ts | 23 +++++++++++
src/app/components/shared/shared.module.ts | 10 +++--
7 files changed, 134 insertions(+), 4 deletions(-)
create mode 100644 src/app/components/shared/_dialogs/present-comment/present-comment.component.html
create mode 100644 src/app/components/shared/_dialogs/present-comment/present-comment.component.scss
create mode 100644 src/app/components/shared/_dialogs/present-comment/present-comment.component.spec.ts
create mode 100644 src/app/components/shared/_dialogs/present-comment/present-comment.component.ts
diff --git a/src/app/components/shared/_dialogs/present-comment/present-comment.component.html b/src/app/components/shared/_dialogs/present-comment/present-comment.component.html
new file mode 100644
index 000000000..2e56acb91
--- /dev/null
+++ b/src/app/components/shared/_dialogs/present-comment/present-comment.component.html
@@ -0,0 +1,8 @@
+<mat-slider min="2.1" max="6" step="0.2" value="1.2" thumbLabel tickInterval="auto"
+ [(ngModel)]="sliderValue" (change)="updateFontSize()" id="slider"></mat-slider>
+<button id="exitButton" mat-raised-button color="warn" (click)="onCloseClick()">
+ <mat-icon >exit_to_app</mat-icon>
+</button>
+<div id="comment">
+ {{body}}
+</div>
diff --git a/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss b/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss
new file mode 100644
index 000000000..0de9fbbf4
--- /dev/null
+++ b/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss
@@ -0,0 +1,38 @@
+/*
+#comment {
+ position: absolute;
+ top:0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+ width: 100px;
+ height: 100px;
+ background-color: blue;
+ font-size: 1em;
+}
+*/
+
+#comment {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ min-height: 90vh;
+ font-size: 2.1em;
+ margin: 0.5em 0.5em;
+}
+
+
+#exitButton {
+ position:absolute;
+ top:2em;
+ right:2em;
+}
+
+#slider {
+ position:absolute;
+ top:2em;
+ left:2em;
+}
diff --git a/src/app/components/shared/_dialogs/present-comment/present-comment.component.spec.ts b/src/app/components/shared/_dialogs/present-comment/present-comment.component.spec.ts
new file mode 100644
index 000000000..b682f6a46
--- /dev/null
+++ b/src/app/components/shared/_dialogs/present-comment/present-comment.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PresentCommentComponent } from './present-comment.component';
+
+describe('PresentCommentComponent', () => {
+ let component: PresentCommentComponent;
+ let fixture: ComponentFixture<PresentCommentComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ PresentCommentComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(PresentCommentComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/shared/_dialogs/present-comment/present-comment.component.ts b/src/app/components/shared/_dialogs/present-comment/present-comment.component.ts
new file mode 100644
index 000000000..bb7c65488
--- /dev/null
+++ b/src/app/components/shared/_dialogs/present-comment/present-comment.component.ts
@@ -0,0 +1,32 @@
+import { Component, OnInit } from '@angular/core';
+import { MatDialog, MatDialogRef} from '@angular/material';
+import { TranslateService} from '@ngx-translate/core';
+
+@Component({
+ selector: 'app-present-comment',
+ templateUrl: './present-comment.component.html',
+ styleUrls: ['./present-comment.component.scss']
+})
+export class PresentCommentComponent implements OnInit {
+ public body: string;
+ sliderValue = 0;
+
+ constructor(
+ public dialogRef: MatDialogRef<PresentCommentComponent>,
+ private translateService: TranslateService,
+ public dialog: MatDialog
+ ) { }
+
+ ngOnInit() {
+ this.translateService.use(localStorage.getItem('currentLang'));
+ }
+
+ onCloseClick(): void {
+ this.dialogRef.close('close');
+ }
+
+ private updateFontSize(): void {
+ console.log(this.sliderValue);
+ document.getElementById('comment').style.fontSize = this.sliderValue + 'em';
+ }
+}
diff --git a/src/app/components/shared/comment/comment.component.html b/src/app/components/shared/comment/comment.component.html
index e5f7b77cf..2e95afd47 100644
--- a/src/app/components/shared/comment/comment.component.html
+++ b/src/app/components/shared/comment/comment.component.html
@@ -2,7 +2,7 @@
<div fxLayout="row" fxLayoutAlign="center center">
<div *ngIf="comment.createdFromLecturer !== false" mat-card-avatar class="proffesor-icon" matTooltip="created from lecturer"><mat-icon>record_voice_over</mat-icon></div>
<mat-card-content>
- <p>{{comment.body}}</p>
+ <p (click)="openPresentDialog(comment.body)">{{comment.body}}</p>
</mat-card-content>
<span class="fill-remaining-space"></span>
<button mat-icon-button [disabled]="isCreator" (click)="setCorrect(comment)" [matTooltip]="comment.correct ? 'Unmark as correct' : 'Mark as correct'">
diff --git a/src/app/components/shared/comment/comment.component.ts b/src/app/components/shared/comment/comment.component.ts
index 614ba1967..b6290b6d0 100644
--- a/src/app/components/shared/comment/comment.component.ts
+++ b/src/app/components/shared/comment/comment.component.ts
@@ -8,6 +8,8 @@ import { NotificationService } from '../../../services/util/notification.service
import { TranslateService } from '@ngx-translate/core';
import { LanguageService } from '../../../services/util/language.service';
import { WsCommentServiceService } from '../../../services/websockets/ws-comment-service.service';
+import { PresentCommentComponent } from '../_dialogs/present-comment/present-comment.component';
+import { MatDialog } from '@angular/material';
@Component({
selector: 'app-comment',
@@ -25,6 +27,7 @@ export class CommentComponent implements OnInit {
private commentService: CommentService,
private notification: NotificationService,
private translateService: TranslateService,
+ public dialog: MatDialog,
protected langService: LanguageService,
private wsCommentService: WsCommentServiceService) {
langService.langEmitter.subscribe(lang => translateService.use(lang)); }
@@ -53,4 +56,24 @@ export class CommentComponent implements OnInit {
this.notification.show(`Comment '${comment.body}' successfully deleted.`);
});
}
+
+ openPresentDialog(body: string): void {
+ const dialogRef = this.dialog.open(PresentCommentComponent, {
+ position: {
+ left: '10px',
+ right: '10px'
+ },
+ maxWidth: '100vw',
+ maxHeight: '100vh',
+ height: '100%',
+ width: '100%'
+ });
+ dialogRef.componentInstance.body = body;
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ if (result === 'close') {
+ return;
+ }
+ });
+ }
}
diff --git a/src/app/components/shared/shared.module.ts b/src/app/components/shared/shared.module.ts
index a392ad54b..91443e5ae 100644
--- a/src/app/components/shared/shared.module.ts
+++ b/src/app/components/shared/shared.module.ts
@@ -23,6 +23,7 @@ import { LoginComponent } from './login/login.component';
import { StatisticHelpComponent } from './_dialogs/statistic-help/statistic-help.component';
import { CommentComponent } from './comment/comment.component';
import { SubmitCommentComponent } from './_dialogs/submit-comment/submit-comment.component';
+import {PresentCommentComponent} from "./_dialogs/present-comment/present-comment.component";
@NgModule({
imports: [
@@ -52,7 +53,8 @@ import { SubmitCommentComponent } from './_dialogs/submit-comment/submit-comment
LoginComponent,
StatisticHelpComponent,
CommentComponent,
- SubmitCommentComponent
+ SubmitCommentComponent,
+ PresentCommentComponent
],
exports: [
RoomJoinComponent,
@@ -69,13 +71,15 @@ import { SubmitCommentComponent } from './_dialogs/submit-comment/submit-comment
CommentPageComponent,
CommentListComponent,
StatisticsPageComponent,
- SubmitCommentComponent
+ SubmitCommentComponent,
+ PresentCommentComponent
],
entryComponents: [
RoomCreateComponent,
LoginComponent,
StatisticHelpComponent,
- SubmitCommentComponent
+ SubmitCommentComponent,
+ PresentCommentComponent
]
})
export class SharedModule {
--
GitLab