From bdf7393ca45bb53e22a6243a9ce5d1e3b763172b Mon Sep 17 00:00:00 2001
From: kiswa <kiswa.com@gmail.com>
Date: Tue, 23 May 2017 21:53:08 +0000
Subject: [PATCH] Initial edit task modal work

---
 src/app/board/column/column.component.html      |  8 +++++---
 src/app/board/column/column.component.ts        | 17 ++++++++++++-----
 src/app/board/task/task.component.ts            |  3 ++-
 .../context-menu/context-menu.component.ts      |  4 +++-
 4 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/src/app/board/column/column.component.html b/src/app/board/column/column.component.html
index 7a8626e..a920855 100644
--- a/src/app/board/column/column.component.html
+++ b/src/app/board/column/column.component.html
@@ -29,9 +29,10 @@
 </div>
 
 <div class="tasks">
-    <tb-task class="task-container" *ngFor="let task of columnData.ownTask"
+    <tb-task class="task-container" *ngFor="let task of columnData.tasks"
         [task]="task" [boards]="boards"
-        [add-task]="getShowModalFunction(task.id)"
+        [add-task]="getShowModalFunction()"
+        [edit-task]="getShowModalFunction(task.id)"
         [remove-task]="getRemoveTaskFunction(task.id)"></tb-task>
 </div>
 
@@ -48,7 +49,8 @@
     </div>
 </tb-modal>
 
-<tb-modal *ngIf="activeBoard" modal-title="Add Task"
+<tb-modal *ngIf="activeBoard"
+    modal-title="{{ modalProps.id === 0 ? 'Add' : 'Edit' }} Task"
     modal-id="{{ MODAL_ID + columnData.id }}">
     <label>
         Title
diff --git a/src/app/board/column/column.component.ts b/src/app/board/column/column.component.ts
index 0e6490c..160a694 100644
--- a/src/app/board/column/column.component.ts
+++ b/src/app/board/column/column.component.ts
@@ -187,8 +187,8 @@ export class ColumnDisplay implements OnInit {
         };
     }
 
-    private getShowModalFunction(): Function {
-        return () => { this.showModal(); };
+    private getShowModalFunction(taskId: number = 0): Function {
+        return () => { this.showModal(taskId); };
     }
 
     private quickAddClicked() {
@@ -203,10 +203,17 @@ export class ColumnDisplay implements OnInit {
         this.quickAdd = new Task();
     }
 
-    private showModal() {
-        this.modalProps = new Task();
-        this.modalProps.column_id = this.columnData.id;
+    private showModal(taskId: number = 0) {
+        if (taskId === 0) {
+            this.modalProps = new Task();
+            this.modalProps.column_id = this.columnData.id;
 
+            this.modal.open(this.MODAL_ID + this.columnData.id);
+            return;
+        }
+
+        this.modalProps = this.columnData.tasks
+            .filter(task => task.id === taskId)[0];
         this.modal.open(this.MODAL_ID + this.columnData.id);
     }
 
diff --git a/src/app/board/task/task.component.ts b/src/app/board/task/task.component.ts
index c9bd648..02f4027 100644
--- a/src/app/board/task/task.component.ts
+++ b/src/app/board/task/task.component.ts
@@ -37,6 +37,7 @@ export class TaskDisplay implements OnInit {
 
     @Input('task') taskData: Task;
     @Input('add-task') addTask: Function;
+    @Input('edit-task') editTask: Function;
     @Input('remove-task') removeTask: Function;
 
     @Input('boards')
@@ -93,7 +94,7 @@ export class TaskDisplay implements OnInit {
     private generateContextMenuItems() {
         this.contextMenuItems = [
             new ContextMenuItem('View Task'),
-            new ContextMenuItem('Edit Task'),
+            new ContextMenuItem('Edit Task', this.editTask),
             new ContextMenuItem('Remove Task', this.removeTask),
             new ContextMenuItem('', null, true),
             this.selectMenuItem,
diff --git a/src/app/shared/context-menu/context-menu.component.ts b/src/app/shared/context-menu/context-menu.component.ts
index b1b0d41..e19752f 100644
--- a/src/app/shared/context-menu/context-menu.component.ts
+++ b/src/app/shared/context-menu/context-menu.component.ts
@@ -25,7 +25,9 @@ export class ContextMenu {
 
         let parentElement = el.nativeElement.parentElement;
 
-        parentElement.oncontextmenu = this.eventHandler;
+        parentElement.oncontextmenu = (event: MouseEvent) => {
+            this.eventHandler(event);
+        };
     }
 
     getText(item: ContextMenuItem): SafeHtml {