diff --git a/src/app/components/creator/creator.module.ts b/src/app/components/creator/creator.module.ts
index 6d5670cf1401e205997d36e95f3c918beb64e785..b876aea134afe3d6bebcb146b45e339e0cf7881c 100644
--- a/src/app/components/creator/creator.module.ts
+++ b/src/app/components/creator/creator.module.ts
@@ -25,7 +25,6 @@ import { ArsModule } from '../../../../projects/ars/src/lib/ars.module';
import { MatRippleModule } from '@angular/material/core';
import { ProfanitySettingsComponent } from './_dialogs/profanity-settings/profanity-settings.component';
import { RoomDescriptionSettingsComponent } from './_dialogs/room-description-settings/room-description-settings.component';
-import { ScrollIntoViewDirective } from '../../directives/scroll-into-view.directive';
@NgModule({
imports: [
@@ -61,8 +60,7 @@ import { ScrollIntoViewDirective } from '../../directives/scroll-into-view.direc
DeleteAnswerComponent,
QuestionWallComponent,
ProfanitySettingsComponent,
- RoomDescriptionSettingsComponent,
- ScrollIntoViewDirective
+ RoomDescriptionSettingsComponent
],
exports: []
})
diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html
index 0b41ad4d82e2674ab4c4d266e588d64433f87f85..1131bf19271c45ff6d68c8f5d7366eaf24dc05e9 100644
--- a/src/app/components/shared/comment-list/comment-list.component.html
+++ b/src/app/components/shared/comment-list/comment-list.component.html
@@ -255,7 +255,7 @@
mat-icon-button
aria-labelledby="add"
class="fab_add_comment"
- (click)="this.createCommentWrapper.openCreateDialog(this.user)"
+ (click)="writeComment()"
matTooltip="{{ 'comment-list.add-comment' | translate }}">
<mat-icon>add</mat-icon>
</button>
@@ -264,6 +264,7 @@
<div *ngIf="!isLoading">
<app-comment *ngFor="let current of hideCommentsList ? filteredComments : commentsFilteredByTime; let i = index"
+ [appScrollIntoView]="current.id === newCommentId"
[usesJoyride]="i === 0"
[comment]="current"
[parseVote]="getVote(current)"
diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts
index 71d15e4a007dcf6cb8cf655e965160cf73150ce1..4fe1c215cbb08cbe9a189e86d7be2ea8c126b11f 100644
--- a/src/app/components/shared/comment-list/comment-list.component.ts
+++ b/src/app/components/shared/comment-list/comment-list.component.ts
@@ -103,6 +103,7 @@ export class CommentListComponent implements OnInit, OnDestroy {
userNumberSelection = 0;
createCommentWrapper: CreateCommentWrapper = null;
isJoyrideActive = false;
+ newCommentId = '';
private _subscriptionEventServiceTagConfig = null;
private _subscriptionEventServiceRoomData = null;
private _subscriptionRoomService = null;
@@ -153,7 +154,7 @@ export class CommentListComponent implements OnInit, OnDestroy {
});
const navigation = {};
const nav = (b, c) => navigation[b] = c;
- nav('createQuestion', () => this.createCommentWrapper.openCreateDialog(this.user));
+ nav('createQuestion', () => this.writeComment());
nav('moderator', () => {
const dialogRef = this.dialog.open(ModeratorsComponent, {
width: '400px',
@@ -560,6 +561,11 @@ export class CommentListComponent implements OnInit, OnDestroy {
this.titleService.attachTitle('(' + this.commentsFilteredByTime.length + ')');
}
+ writeComment() {
+ this.createCommentWrapper.openCreateDialog(this.user)
+ .subscribe(comment => this.newCommentId = comment && comment.id);
+ }
+
/**
* Announces a new comment receive.
*/
diff --git a/src/app/components/shared/shared.module.ts b/src/app/components/shared/shared.module.ts
index 40b9193a271a0f44d648ba93272e06a8a1b24f19..3ad727bfb1b5e0d82dfa245a3b49cff72e7dbf82 100644
--- a/src/app/components/shared/shared.module.ts
+++ b/src/app/components/shared/shared.module.ts
@@ -48,6 +48,7 @@ import { JoyrideTemplateDirective } from '../../directives/joyride-template.dire
import { MatSpinnerOverlayComponent } from './mat-spinner-overlay/mat-spinner-overlay.component';
import { WriteCommentComponent } from './write-comment/write-comment.component';
import { CustomMarkdownComponent } from './custom-markdown/custom-markdown.component';
+import { ScrollIntoViewDirective } from '../../directives/scroll-into-view.directive';
@NgModule({
imports: [
@@ -101,7 +102,8 @@ import { CustomMarkdownComponent } from './custom-markdown/custom-markdown.compo
JoyrideTemplateDirective,
MatSpinnerOverlayComponent,
WriteCommentComponent,
- CustomMarkdownComponent
+ CustomMarkdownComponent,
+ ScrollIntoViewDirective
],
exports: [
RoomJoinComponent,
@@ -123,7 +125,8 @@ import { CustomMarkdownComponent } from './custom-markdown/custom-markdown.compo
MatSpinnerOverlayComponent,
JoyrideTemplateDirective,
AutofocusDirective,
- CustomMarkdownComponent
+ CustomMarkdownComponent,
+ ScrollIntoViewDirective
]
})
export class SharedModule {
diff --git a/src/app/components/shared/tag-cloud/tag-cloud.component.html b/src/app/components/shared/tag-cloud/tag-cloud.component.html
index e8e27e6d8bfec5089f452aa426a80d8dda8640a2..d6463d1dd3a32a273ea6306f20ec7b9b823c2d4b 100644
--- a/src/app/components/shared/tag-cloud/tag-cloud.component.html
+++ b/src/app/components/shared/tag-cloud/tag-cloud.component.html
@@ -35,7 +35,7 @@
mat-icon-button
aria-labelledby="add"
class="fab_add_comment"
- (click)="createCommentWrapper.openCreateDialog(this.user)"
+ (click)="createCommentWrapper.openCreateDialog(this.user).subscribe()"
matTooltip="{{ 'comment-list.add-comment' | translate }}">
<mat-icon>add</mat-icon>
</button>
diff --git a/src/app/components/shared/tag-cloud/tag-cloud.component.ts b/src/app/components/shared/tag-cloud/tag-cloud.component.ts
index 6c78127838023a545ff36d1a6a0610923dd92171..db63d7c08b65fe1e2f7e6e38be6cbb10b2db3516 100644
--- a/src/app/components/shared/tag-cloud/tag-cloud.component.ts
+++ b/src/app/components/shared/tag-cloud/tag-cloud.component.ts
@@ -150,7 +150,7 @@ export class TagCloudComponent implements OnInit, OnDestroy, AfterContentInit {
this.updateGlobalStyles();
this.headerInterface = this.eventService.on<string>('navigate').subscribe(e => {
if (e === 'createQuestion') {
- this.createCommentWrapper.openCreateDialog(this.user);
+ this.createCommentWrapper.openCreateDialog(this.user).subscribe();
} else if (e === 'topicCloudConfig') {
if (this.drawer.opened) {
this.drawer.close();
diff --git a/src/app/directives/scroll-into-view.directive.ts b/src/app/directives/scroll-into-view.directive.ts
index 642b24a339ea6861019136102f8b3b930359a0de..915cb70bb5e3d7f474cfea117ee09402c3bb86ce 100644
--- a/src/app/directives/scroll-into-view.directive.ts
+++ b/src/app/directives/scroll-into-view.directive.ts
@@ -8,7 +8,7 @@ export class ScrollIntoViewDirective {
@Input('appScrollIntoView')
set active(value: boolean) {
if (value) {
- this.element.nativeElement.scrollIntoView({ behavior: 'smooth' });
+ setTimeout(() => this.element.nativeElement.scrollIntoView({ behavior: 'smooth' }));
}
}
diff --git a/src/app/utils/create-comment-wrapper.ts b/src/app/utils/create-comment-wrapper.ts
index 4ad3d4ce1803402515c37b7e7dcf956d3281b029..1408a49eb836e58216a0f531ab6d8b73a1b50c97 100644
--- a/src/app/utils/create-comment-wrapper.ts
+++ b/src/app/utils/create-comment-wrapper.ts
@@ -7,6 +7,9 @@ import { Room } from '../models/room';
import { Comment } from '../models/comment';
import { NotificationService } from '../services/util/notification.service';
import { CommentService } from '../services/http/comment.service';
+import { observable, Observable, of } from 'rxjs';
+import { flatMap } from 'rxjs/internal/operators';
+import { tap } from 'rxjs/operators';
export class CreateCommentWrapper {
constructor(private translateService: TranslateService,
@@ -16,7 +19,7 @@ export class CreateCommentWrapper {
private room: Room) {
}
- openCreateDialog(user: User): void {
+ openCreateDialog(user: User): Observable<Comment> {
const dialogRef = this.dialog.open(CreateCommentComponent, {
width: '900px',
maxWidth: 'calc( 100% - 50px )',
@@ -26,17 +29,12 @@ export class CreateCommentWrapper {
dialogRef.componentInstance.user = user;
dialogRef.componentInstance.roomId = this.room.id;
dialogRef.componentInstance.tags = this.room.tags || [];
- dialogRef.afterClosed()
- .subscribe(result => {
- if (result) {
- this.send(result);
- } else {
- return;
- }
- });
+ return dialogRef.afterClosed().pipe(
+ flatMap((comment: Comment) => comment ? this.send(comment) : of<Comment>(null))
+ );
}
- send(comment: Comment): void {
+ send(comment: Comment): Observable<Comment> {
let message;
if (this.room.directSend) {
this.translateService.get('comment-list.comment-sent').subscribe(msg => {
@@ -48,8 +46,8 @@ export class CreateCommentWrapper {
message = msg;
});
}
- this.commentService.addComment(comment).subscribe(() => {
- this.notificationService.show(message);
- });
+ return this.commentService.addComment(comment).pipe(
+ tap(() => this.notificationService.show(message))
+ );
}
}