Comment textarea focus on init

diff --git a/client/src/app/videos/+video-watch/comment/video-comment-add.component.html b/client/src/app/videos/+video-watch/comment/video-comment-add.component.html
index 7920536147b796f1a0e8145451c47904ad46860e..365fc8f6c1dca3f650e871754a8d3b1fbfbb4306 100644 (file)
--- a/client/src/app/videos/+video-watch/comment/video-comment-add.component.html
+++ b/client/src/app/videos/+video-watch/comment/video-comment-add.component.html
@@ -1,6 +1,6 @@
 <form novalidate [formGroup]="form" (ngSubmit)="formValidated()">
   <div class="form-group">
-    <textarea placeholder="Add comment..." formControlName="text" [ngClass]="{ 'input-error': formErrors['text'] }">
+    <textarea placeholder="Add comment..." formControlName="text" [ngClass]="{ 'input-error': formErrors['text'] }" #textarea>
     </textarea>
     <div *ngIf="formErrors.text" class="form-error">
       {{ formErrors.text }}

diff --git a/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts b/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts
index d05232202e32a5b756050870080f8483f2bc96a0..a6525987eee084d437c18d86a1fb691e6bcbe2b4 100644 (file)
--- a/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts
+++ b/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
 import { FormBuilder, FormGroup } from '@angular/forms'
 import { NotificationsService } from 'angular2-notifications'
 import { Observable } from 'rxjs/Observable'
@@ -17,6 +17,7 @@ import { VideoCommentService } from './video-comment.service'
 export class VideoCommentAddComponent extends FormReactive implements OnInit {
   @Input() video: Video
   @Input() parentComment: VideoComment
+  @Input() focusOnInit = false
 
   @Output() commentCreated = new EventEmitter<VideoCommentCreate>()
 
@@ -28,6 +29,8 @@ export class VideoCommentAddComponent extends FormReactive implements OnInit {
     'text': VIDEO_COMMENT_TEXT.MESSAGES
   }
 
+  @ViewChild('textarea') private textareaElement: ElementRef
+
   constructor (
     private formBuilder: FormBuilder,
     private notificationsService: NotificationsService,
@@ -46,6 +49,10 @@ export class VideoCommentAddComponent extends FormReactive implements OnInit {
 
   ngOnInit () {
     this.buildForm()
+
+    if (this.focusOnInit === true) {
+      this.textareaElement.nativeElement.focus()
+    }
   }
 
   formValidated () {

diff --git a/client/src/app/videos/+video-watch/comment/video-comment.component.html b/client/src/app/videos/+video-watch/comment/video-comment.component.html
index 9608a10336a53a0b2a1418b55d459f181889b60d..ffaf722cd3ff360b4842fe4ae04a6cfec3cde41a 100644 (file)
--- a/client/src/app/videos/+video-watch/comment/video-comment.component.html
+++ b/client/src/app/videos/+video-watch/comment/video-comment.component.html
@@ -10,7 +10,7 @@
   </div>
 
   <my-video-comment-add
-    *ngIf="isUserLoggedIn() && inReplyToCommentId === comment.id" [video]="video" [parentComment]="comment"
+    *ngIf="isUserLoggedIn() && inReplyToCommentId === comment.id" [video]="video" [parentComment]="comment" [focusOnInit]="true"
     (commentCreated)="onCommentReplyCreated($event)"
   ></my-video-comment-add>