Merge request drag-n-drop on milestone page

Allows moving milestone between 3 columns: unassigned, assigned, declined Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

Merge request drag-n-drop on milestone page
Allows moving milestone between 3 columns: unassigned, assigned, declined Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Dmitriy Zaporozhets
1 parent 868629dc
Showing 4 changed files with 56 additions and 19 deletions Show diff stats
app/assets/javascripts/milestone.js.coffee
app/views/projects/milestones/_merge_request.html.haml
app/views/projects/milestones/_merge_requests.html.haml
app/views/projects/milestones/show.html.haml
@@ -11,10 +11,23 @@ class Milestone
           new Flash("Issue update failed", 'alert')
       dataType: "json"
+  @updateMergeRequest: (li, merge_request_url, data) ->
+    $.ajax
+      type: "PUT"
+      url: merge_request_url
+      data: data
+      success: (data) ->
+        if data.saved == true
+          $(li).effect 'highlight'
+        else
+          new Flash("Issue update failed", 'alert')
+      dataType: "json"
+
   constructor: ->
-    @bindSorting()
+    @bindIssuesSorting()
+    @bindMergeRequestSorting()
-  bindSorting: ->
+  bindIssuesSorting: ->
     $("#issues-list-unassigned, #issues-list-ongoing, #issues-list-closed").sortable(
       connectWith: ".issues-sortable-list",
       dropOnEmpty: true,
@@ -38,4 +51,28 @@ class Milestone
     ).disableSelection()
+  bindMergeRequestSorting: ->
+    $("#merge_requests-list-unassigned, #merge_requests-list-ongoing, #merge_requests-list-closed").sortable(
+      connectWith: ".merge_requests-sortable-list",
+      dropOnEmpty: true,
+      receive: (event, ui) ->
+        new_state = $(this).data('state')
+        merge_request_id = ui.item.data('iid')
+        merge_request_url = ui.item.data('url')
+
+        data = switch new_state
+          when 'ongoing'
+            "merge_request[assignee_id]=" + gon.current_user_id
+          when 'unassigned'
+            "merge_request[assignee_id]="
+          when 'closed'
+            "merge_request[state_event]=close"
+
+        if $(ui.sender).data('state') == "closed"
+          data += "&merge_request[state_event]=reopen"
+
+        Milestone.updateMergeRequest(ui.item, merge_request_url, data)
+
+    ).disableSelection()
+
 @Milestone = Milestone
-%li
-  = link_to [@project, merge_request] do
-    %span.label.label-info ##{merge_request.iid}
-  &ndash;
-  = link_to_gfm truncate(merge_request.title, length: 60), [@project, merge_request]
+%li{ class: 'mr-row', 'data-iid' => merge_request.iid, 'data-url' => project_merge_request_path(@project, merge_request) }
+  %span.str-truncated
+    = link_to [@project, merge_request] do
+      %span.cgray ##{merge_request.iid}
+    = link_to_gfm truncate(merge_request.title, length: 60), [@project, merge_request]
@@ -0,0 +1,6 @@
+.panel.panel-default
+  .panel-heading= title
+  %ul{ class: "well-list merge_requests-sortable-list", id: "merge_requests-list-#{id}", "data-state" => id }
+    - merge_requests.each do |merge_request|
+      = render 'merge_request', merge_request: merge_request
+    %li.light Drag and drop available
@@ -84,18 +84,12 @@
   .tab-pane#tab-merge-requests
     .row
-      .col-md-6
-        .panel.panel-default
-          .panel-heading Open
-          %ul.well-list
-            - @merge_requests.opened.each do |merge_request|
-              = render 'merge_request', merge_request: merge_request
-      .col-md-6
-        .panel.panel-default
-          .panel-heading Closed
-          %ul.well-list
-            - @merge_requests.closed.each do |merge_request|
-              = render 'merge_request', merge_request: merge_request
+      .col-md-4
+        = render('merge_requests', title: 'Work in progress (open and unassigned)', merge_requests: @merge_requests.opened.unassigned, id: 'unassigned')
+      .col-md-4
+        = render('merge_requests', title: 'Assigned (open and assigned)', merge_requests: @merge_requests.opened.assigned, id: 'ongoing')
+      .col-md-4
+        = render('merge_requests', title: 'Declined (closed)', merge_requests: @merge_requests.closed, id: 'closed')
   .tab-pane#tab-participants
     %ul.bordered-list
	@@ -11,10 +11,23 @@ class Milestone		@@ -11,10 +11,23 @@ class Milestone
11	new Flash("Issue update failed", 'alert')	11	new Flash("Issue update failed", 'alert')
12	dataType: "json"	12	dataType: "json"
13		13
		14	+ @updateMergeRequest: (li, merge_request_url, data) ->
		15	+ $.ajax
		16	+ type: "PUT"
		17	+ url: merge_request_url
		18	+ data: data
		19	+ success: (data) ->
		20	+ if data.saved == true
		21	+ $(li).effect 'highlight'
		22	+ else
		23	+ new Flash("Issue update failed", 'alert')
		24	+ dataType: "json"
		25	+
14	constructor: ->	26	constructor: ->
15	- @bindSorting()	27	+ @bindIssuesSorting()
		28	+ @bindMergeRequestSorting()
16		29
17	- bindSorting: ->	30	+ bindIssuesSorting: ->
18	$("#issues-list-unassigned, #issues-list-ongoing, #issues-list-closed").sortable(	31	$("#issues-list-unassigned, #issues-list-ongoing, #issues-list-closed").sortable(
19	connectWith: ".issues-sortable-list",	32	connectWith: ".issues-sortable-list",
20	dropOnEmpty: true,	33	dropOnEmpty: true,
	@@ -38,4 +51,28 @@ class Milestone		@@ -38,4 +51,28 @@ class Milestone
38		51
39	).disableSelection()	52	).disableSelection()
40		53
		54	+ bindMergeRequestSorting: ->
		55	+ $("#merge_requests-list-unassigned, #merge_requests-list-ongoing, #merge_requests-list-closed").sortable(
		56	+ connectWith: ".merge_requests-sortable-list",
		57	+ dropOnEmpty: true,
		58	+ receive: (event, ui) ->
		59	+ new_state = $(this).data('state')
		60	+ merge_request_id = ui.item.data('iid')
		61	+ merge_request_url = ui.item.data('url')
		62	+
		63	+ data = switch new_state
		64	+ when 'ongoing'
		65	+ "merge_request[assignee_id]=" + gon.current_user_id
		66	+ when 'unassigned'
		67	+ "merge_request[assignee_id]="
		68	+ when 'closed'
		69	+ "merge_request[state_event]=close"
		70	+
		71	+ if $(ui.sender).data('state') == "closed"
		72	+ data += "&merge_request[state_event]=reopen"
		73	+
		74	+ Milestone.updateMergeRequest(ui.item, merge_request_url, data)
		75	+
		76	+ ).disableSelection()
		77	+
41	@Milestone = Milestone	78	@Milestone = Milestone
1	-%li
2	- = link_to [@project, merge_request] do
3	- %span.label.label-info ##{merge_request.iid}
4	- –
5	- = link_to_gfm truncate(merge_request.title, length: 60), [@project, merge_request]	1	+%li{ class: 'mr-row', 'data-iid' => merge_request.iid, 'data-url' => project_merge_request_path(@project, merge_request) }
		2	+ %span.str-truncated
		3	+ = link_to [@project, merge_request] do
		4	+ %span.cgray ##{merge_request.iid}
		5	+ = link_to_gfm truncate(merge_request.title, length: 60), [@project, merge_request]
@@ -0,0 +1,6 @@		@@ -0,0 +1,6 @@
	1	+.panel.panel-default
	2	+ .panel-heading= title
	3	+ %ul{ class: "well-list merge_requests-sortable-list", id: "merge_requests-list-#{id}", "data-state" => id }
	4	+ - merge_requests.each do \|merge_request\|
	5	+ = render 'merge_request', merge_request: merge_request
	6	+ %li.light Drag and drop available