Use the same task form layout everywhere

1 files changed, 18 insertions, 6 deletions

diff --git a/assets/js/src/Task.js b/assets/js/src/Task.js
index e19e6b2d..3eef26c7 100644
--- a/assets/js/src/Task.js
+++ b/assets/js/src/Task.js
@@ -33,12 +33,7 @@ Kanboard.Task.prototype.onPopoverOpened = function() {
     var self = this;
     var reloadingProjectId = 0;
 
-    // Change color
-    $(document).on("click", ".color-square", function() {
-        $(".color-square-selected").removeClass("color-square-selected");
-        $(this).addClass("color-square-selected");
-        $("#form-color_id").val($(this).data("color-id"));
-    });
+    self.renderColorPicker();
 
     // Assign to me
     $(document).on("click", ".assign-me", function(e) {
@@ -75,3 +70,20 @@ Kanboard.Task.prototype.onPopoverOpened = function() {
         }
     });
 };
+
+Kanboard.Task.prototype.renderColorPicker = function() {
+    function renderColorOption(color) {
+        return $(
+            '<div class="color-picker-option">' +
+            '<div class="color-picker-square color-' + color.id + '"></div>' +
+            '<div class="color-picker-label">' + color.text + '</div>' +
+            '</div>'
+        );
+    }
+
+    $(".color-picker").select2({
+        minimumResultsForSearch: Infinity,
+        templateResult: renderColorOption,
+        templateSelection: renderColorOption
+    });
+};