Merge branch 'task_list_refactor' into 'master'

move task_list setup and events to own class

See merge request !9016

1 files changed, 10 insertions, 33 deletions

diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 1776b3d61f6..00633e812e1 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -3,7 +3,7 @@
 
 require('./flash');
 require('vendor/jquery.waitforimages');
-require('vendor/task_list');
+require('./task_list');
 
 (function() {
   var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; };
@@ -11,10 +11,16 @@ require('vendor/task_list');
   this.Issue = (function() {
     function Issue() {
       this.submitNoteForm = bind(this.submitNoteForm, this);
-      // Prevent duplicate event bindings
-      this.disableTaskList();
       if ($('a.btn-close').length) {
-        this.initTaskList();
+        this.taskList = new gl.TaskList({
+          dataType: 'issue',
+          fieldName: 'description',
+          selector: '.detail-page-description',
+          onSuccess: (result) => {
+            document.querySelector('#task_status').innerText = result.task_status;
+            document.querySelector('#task_status_short').innerText = result.task_status_short;
+          }
+        });
         this.initIssueBtnEventListeners();
       }
       this.initMergeRequests();
@@ -22,11 +28,6 @@ require('vendor/task_list');
       this.initCanCreateBranch();
     }
 
-    Issue.prototype.initTaskList = function() {
-      $('.detail-page-description .js-task-list-container').taskList('enable');
-      return $(document).on('tasklist:changed', '.detail-page-description .js-task-list-container', this.updateTaskList);
-    };
-
     Issue.prototype.initIssueBtnEventListeners = function() {
       var _this, issueFailMessage;
       _this = this;
@@ -85,30 +86,6 @@ require('vendor/task_list');
       }
     };
 
-    Issue.prototype.disableTaskList = function() {
-      $('.detail-page-description .js-task-list-container').taskList('disable');
-      return $(document).off('tasklist:changed', '.detail-page-description .js-task-list-container');
-    };
-
-    Issue.prototype.updateTaskList = function() {
-      var patchData;
-      patchData = {};
-      patchData['issue'] = {
-        'description': $('.js-task-list-field', this).val()
-      };
-      return $.ajax({
-        type: 'PATCH',
-        url: $('form.js-issuable-update').attr('action'),
-        data: patchData,
-        success: function(issue) {
-          document.querySelector('#task_status').innerText = issue.task_status;
-          document.querySelector('#task_status_short').innerText = issue.task_status_short;
-        }
-      });
-    // TODO (rspeicher): Make the issue description inline-editable like a note so
-    // that we can re-use its form here
-    };
-
     Issue.prototype.initMergeRequests = function() {
       var $container;
       $container = $('#merge-requests');