Task comment editing complete

src/api/controllers/Comments.php

@@ -123,6 +123,9 @@ class Comments extends BaseController {
         $this->apiJson->setSuccess();
         $this->apiJson->addAlert('success', 'Comment updated.');
 
+        $task = R::load('task', $comment->task_id);
+        $this->apiJson->addData(R::exportAll($task));
+
         return $this->jsonResponse($response);
     }
 

src/api/helpers/BeanLoader.php

@@ -127,6 +127,7 @@ class BeanLoader {
         $comment->user_id = isset($data->user_id) ? $data->user_id : -1;
         $comment->task_id = isset($data->task_id) ? $data->task_id : -1;
         $comment->timestamp = isset($data->timestamp) ? $data->timestamp : -1;
+        $comment->is_edited = isset($data->is_edited) ? $data->is_edited : false;
 
         if (!isset($data->text) || !isset($data->user_id) ||
             !isset($data->task_id) || !isset($data->timestamp)) {

src/app/board/board.service.ts

@@ -9,8 +9,9 @@ import 'rxjs/add/operator/catch';
 
 import {
     ApiResponse,
-    Column,
     Board,
+    Column,
+    Comment,
     Task,
     User
 } from '../shared/index';
@@ -72,6 +73,12 @@ export class BoardService {
             .catch(this.errorHandler);
     }
 
+    updateComment(comment: Comment): Observable<ApiResponse> {
+        return this.http.post('api/comments/' + comment.id, comment)
+            .map(this.toApiResponse)
+            .catch(this.errorHandler);
+    }
+
     removeComment(commentId: number): Observable<ApiResponse> {
         return this.http.delete('api/comments/' + commentId)
             .map(this.toApiResponse)

src/app/board/column/column.component.html

@@ -165,17 +165,29 @@
         <h3>{{ strings['boards_taskComments'] }}</h3>
         <div class="comment"
             *ngFor="let comment of viewModalProps.comments">
-            <div [innerHTML]="getComment(comment.text)"></div>
+            <div [innerHTML]="getComment(comment.text)"
+                *ngIf="!comment.isEdit"></div>
+
+            <textarea *ngIf="comment.isEdit"
+                [(ngModel)]="comment.text"
+                (keyup.enter)="$event.stopPropagation()"></textarea>
 
             <div class="byline">
-                Posted by {{ getUserName(comment.user_id) }} on
+                {{ comment.is_edited ? strings['boards_editedBy']
+                                     : strings['boards_postedBy'] }}
+                {{ getUserName(comment.user_id) }} &mdash;
                 {{ comment.timestamp | date:'medium' }}
             </div>
 
-            <div class="actions">
+            <div class="actions" *ngIf="canAdminComment(comment)">
+                <i class="icon icon-floppy color-primary"
+                    [title]="strings['save']"
+                    *ngIf="comment.isEdit"
+                    (click)="comment.isEdit = false;editComment(comment)"></i>
                 <i class="icon icon-edit color-primary"
                     [title]="strings['boards_taskEditComment']"
-                    (click)="editComment(comment)"></i>
+                    *ngIf="!comment.isEdit"
+                    (click)="comment.isEdit = true"></i>
                 <i class="icon icon-trash-empty color-secondary"
                     [title]="strings['boards_taskRemoveComment']"
                     (click)="commentToRemove=comment;

src/app/board/column/column.component.ts

@@ -214,52 +214,6 @@ export class ColumnDisplay implements OnInit {
             });
     }
 
-    addComment() {
-        if (this.viewModalProps.id < 1) {
-            return;
-        }
-
-        this.viewModalProps.comments.push(
-            new Comment(0, this.newComment, this.activeUser.id,
-                        this.viewModalProps.id));
-
-        this.newComment = '';
-
-        this.boardService.updateTask(this.viewModalProps)
-            .subscribe((response: ApiResponse) => {
-                if (response.status !== 'success') {
-                    return;
-                }
-
-                let updatedTask = response.data[1][0];
-                this.replaceUpdatedTask(updatedTask);
-            });
-    }
-
-    editComment() {
-        // TODO
-    }
-
-    removeComment() {
-        for (let i = this.viewModalProps.comments.length - 1; i >= 0; --i) {
-            if (this.viewModalProps.comments[i].id === this.commentToRemove.id) {
-                this.viewModalProps.comments.splice(i, 1);
-            }
-        }
-
-        this.boardService.removeComment(this.commentToRemove.id)
-            .subscribe((response: ApiResponse) => {
-                response.alerts.forEach(note => this.notes.add(note));
-
-                if (response.status !== 'success') {
-                    return;
-                }
-
-                let updatedTask = response.data[1][0];
-                this.replaceUpdatedTask(updatedTask);
-            });
-    }
-
     updateTask() {
         this.saving = true;
 
@@ -298,6 +252,73 @@ export class ColumnDisplay implements OnInit {
             });
     }
 
+    addComment() {
+        if (this.viewModalProps.id < 1) {
+            return;
+        }
+
+        this.viewModalProps.comments.push(
+            new Comment(0, this.newComment, this.activeUser.id,
+                        this.viewModalProps.id));
+
+        this.newComment = '';
+
+        this.boardService.updateTask(this.viewModalProps)
+            .subscribe((response: ApiResponse) => {
+                if (response.status !== 'success') {
+                    return;
+                }
+
+                let updatedTask = response.data[1][0];
+                this.replaceUpdatedTask(updatedTask);
+            });
+    }
+
+    editComment(comment: Comment) {
+        comment.is_edited = true;
+        comment.user_id = this.activeUser.id;
+
+        this.boardService.updateComment(comment)
+            .subscribe((response: ApiResponse) => {
+                response.alerts.forEach(note => this.notes.add(note));
+
+                if (response.status !== 'success') {
+                    return;
+                }
+
+                let updatedTask = response.data[1][0];
+                this.replaceUpdatedTask(updatedTask);
+            });
+    }
+
+    removeComment() {
+        for (let i = this.viewModalProps.comments.length - 1; i >= 0; --i) {
+            if (this.viewModalProps.comments[i].id === this.commentToRemove.id) {
+                this.viewModalProps.comments.splice(i, 1);
+            }
+        }
+
+        this.boardService.removeComment(this.commentToRemove.id)
+            .subscribe((response: ApiResponse) => {
+                response.alerts.forEach(note => this.notes.add(note));
+
+                if (response.status !== 'success') {
+                    return;
+                }
+
+                let updatedTask = response.data[1][0];
+                this.replaceUpdatedTask(updatedTask);
+            });
+    }
+
+    canAdminComment(comment: Comment) {
+        if (this.activeUser.id === comment.user_id) {
+            return true;
+        }
+
+        return this.activeUser.isAnyAdmin();
+    }
+
     beginLimitEdit() {
         this.taskLimit = this.columnData.task_limit;
         this.showLimitEditor = true;

src/app/shared/inline-edit/inline-edit.component.ts

@@ -13,6 +13,7 @@ export class InlineEdit {
     private isDisplay = true;
 
     @Input() text: string;
+    @Input() isTextarea: boolean;
     @Output() edit = new EventEmitter<string>();
 
     beginEdit(el: HTMLElement): void {

src/app/shared/models/comment.model.ts

@@ -3,7 +3,8 @@ export class Comment {
                 public text: string = '',
                 public user_id: number = 0, // tslint:disable-line
                 public task_id: number = 0, // tslint:disable-line
-                public timestamp: number = Date.now()) {
+                public timestamp: number = Date.now(),
+                public is_edited: boolean = false) { // tslint:disable-line
     }
 }
 

src/app/shared/models/task.model.ts

@@ -34,7 +34,8 @@ export class Task {
                                            comment.text,
                                            +comment.user_id,
                                            +comment.task_id,
-                                           +comment.timestamp));
+                                           +comment.timestamp,
+                                           +comment.is_edited === 1));
         });
 
         attachmentArray.forEach((attachment: any) => {

src/json/en.json

@@ -191,6 +191,8 @@
     "boards_taskAddComment": "Add Comment",
     "boards_taskEditComment": "Edit Comment",
     "boards_taskRemoveComment": "Remove Comment",
+    "boards_postedBy": "Posted by",
+    "boards_editedBy": "Edited by",
 
     "boards_taskAttachments": "Attachments",
     "boards_taskAddAttachment": "Add Attachment",

src/json/es.json

@@ -191,6 +191,8 @@
     "boards_taskAddComment": "Agregar Comentario",
     "boards_taskEditComment": "Editar Comentario",
     "boards_taskRemoveComment": "Eliminar Comentario",
+    "boards_postedBy": "Publicado por",
+    "boards_editedBy": "Editado por",
 
     "boards_taskAttachments": "Archivos Adjuntos",
     "boards_taskAddAttachment": "Agregar Archivos Adjuntos",