From 4027c5dd7c11c1256094e202be591ec1b86a011e Mon Sep 17 00:00:00 2001
From: Lanre Adelowo <yo@lanre.wtf>
Date: Mon, 17 Aug 2020 04:07:38 +0100
Subject: Kanban board (#8346)

Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: jaqra <48099350+jaqra@users.noreply.github.com>
Co-authored-by: Kerry <flatline-studios@users.noreply.github.com>
Co-authored-by: Jaqra <jaqra@hotmail.com>
Co-authored-by: Kyle Evans <kevans91@users.noreply.github.com>
Co-authored-by: Tsakiridis Ilias <TsakiDev@users.noreply.github.com>
Co-authored-by: Ilias Tsakiridis <ilias.tsakiridis@outlook.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
---
 web_src/js/features/projects.js | 99 +++++++++++++++++++++++++++++++++++++++++
 web_src/js/index.js             |  9 +++-
 2 files changed, 107 insertions(+), 1 deletion(-)
 create mode 100644 web_src/js/features/projects.js

(limited to 'web_src/js')

diff --git a/web_src/js/features/projects.js b/web_src/js/features/projects.js
new file mode 100644
index 0000000000..13318c9f89
--- /dev/null
+++ b/web_src/js/features/projects.js
@@ -0,0 +1,99 @@
+const {csrf} = window.config;
+
+export default async function initProject() {
+  if (!window.config || !window.config.PageIsProjects) {
+    return;
+  }
+
+  const {Sortable} = await import(/* webpackChunkName: "sortable" */'sortablejs');
+  const boardColumns = document.getElementsByClassName('board-column');
+
+  for (const column of boardColumns) {
+    new Sortable(
+      column.getElementsByClassName('board')[0],
+      {
+        group: 'shared',
+        animation: 150,
+        onAdd: (e) => {
+          $.ajax(`${e.to.dataset.url}/${e.item.dataset.issue}`, {
+            headers: {
+              'X-Csrf-Token': csrf,
+              'X-Remote': true,
+            },
+            contentType: 'application/json',
+            type: 'POST',
+            error: () => {
+              e.from.insertBefore(e.item, e.from.children[e.oldIndex]);
+            },
+          });
+        },
+      }
+    );
+  }
+
+  $('.edit-project-board').each(function () {
+    const projectTitleLabel = $(this).closest('.board-column-header').find('.board-label');
+    const projectTitleInput = $(this).find(
+      '.content > .form > .field > .project-board-title'
+    );
+
+    $(this)
+      .find('.content > .form > .actions > .red')
+      .on('click', function (e) {
+        e.preventDefault();
+
+        $.ajax({
+          url: $(this).data('url'),
+          data: JSON.stringify({title: projectTitleInput.val()}),
+          headers: {
+            'X-Csrf-Token': csrf,
+            'X-Remote': true,
+          },
+          contentType: 'application/json',
+          method: 'PUT',
+        }).done(() => {
+          projectTitleLabel.text(projectTitleInput.val());
+          projectTitleInput.closest('form').removeClass('dirty');
+          $('.ui.modal').modal('hide');
+        });
+      });
+  });
+
+  $('.delete-project-board').each(function () {
+    $(this).click(function (e) {
+      e.preventDefault();
+
+      $.ajax({
+        url: $(this).data('url'),
+        headers: {
+          'X-Csrf-Token': csrf,
+          'X-Remote': true,
+        },
+        contentType: 'application/json',
+        method: 'DELETE',
+      }).done(() => {
+        setTimeout(window.location.reload(true), 2000);
+      });
+    });
+  });
+
+  $('#new_board_submit').click(function (e) {
+    e.preventDefault();
+
+    const boardTitle = $('#new_board');
+
+    $.ajax({
+      url: $(this).data('url'),
+      data: JSON.stringify({title: boardTitle.val()}),
+      headers: {
+        'X-Csrf-Token': csrf,
+        'X-Remote': true,
+      },
+      contentType: 'application/json',
+      method: 'POST',
+    }).done(() => {
+      boardTitle.closest('form').removeClass('dirty');
+      setTimeout(window.location.reload(true), 2000);
+    });
+  });
+}
diff --git a/web_src/js/index.js b/web_src/js/index.js
index 32fb340dcb..a1b5035764 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -12,6 +12,7 @@ import initContextPopups from './features/contextpopup.js';
 import initGitGraph from './features/gitgraph.js';
 import initClipboard from './features/clipboard.js';
 import initUserHeatmap from './features/userheatmap.js';
+import initProject from './features/projects.js';
 import initServiceWorker from './features/serviceworker.js';
 import initMarkdownAnchors from './markdown/anchors.js';
 import renderMarkdownContent from './markdown/content.js';
@@ -527,6 +528,10 @@ function initCommentForm() {
           $list.find('.selected').html(`<a class="item" href=${$(this).data('href')}>${
             htmlEscape($(this).text())}</a>`);
           break;
+        case '#project_id':
+          $list.find('.selected').html(`<a class="item" href=${$(this).data('href')}>${
+            htmlEscape($(this).text())}</a>`);
+          break;
         case '#assignee_id':
           $list.find('.selected').html(`<a class="item" href=${$(this).data('href')}>` +
                         `<img class="ui avatar image" src=${$(this).data('avatar')}>${
@@ -556,7 +561,8 @@ function initCommentForm() {
     });
   }
 
-  // Milestone and assignee
+  // Milestone, Assignee, Project
+  selectItem('.select-project', '#project_id');
   selectItem('.select-milestone', '#milestone_id');
   selectItem('.select-assignee', '#assignee_id');
 }
@@ -2485,6 +2491,7 @@ $(document).ready(async () => {
     initGitGraph(),
     initClipboard(),
     initUserHeatmap(),
+    initProject(),
     initServiceWorker(),
     initNotificationCount(),
     renderMarkdownContent(),
-- 
cgit v1.2.3