Use new dropdown for weight in sidebar

Closes #453

app/assets/javascripts/weight_select.js.coffee

 class @WeightSelect
   constructor: ->
     $('.js-weight-select').each (i, dropdown) ->
-      $(dropdown).glDropdown(
+      $dropdown = $(dropdown)
+      updateUrl = $dropdown.data('issueUpdate')
+      $selectbox = $dropdown.closest('.selectbox')
+      $block = $selectbox.closest('.block')
+      $sidebarCollapsedValue = $block.find('.sidebar-collapsed-icon span')
+      $value = $block.find('.value')
+      abilityName = $dropdown.data('ability-name')
+      $loading = $block.find('.block-loading').fadeOut()
+
+      updateWeight = (selected) ->
+        data = {}
+        data[abilityName] = {}
+        data[abilityName].weight = selected
+        $loading
+          .fadeIn()
+        $dropdown.trigger('loading.gl.dropdown')
+        $.ajax(
+          type: 'PUT'
+          dataType: 'json'
+          url: updateUrl
+          data: data
+        ).done (data) ->
+          $dropdown.trigger('loaded.gl.dropdown')
+          $loading.fadeOut()
+          $selectbox.hide()
+
+          $value.html(data.weight)
+          $sidebarCollapsedValue.html(data.weight)
+
+      $dropdown.glDropdown(
         selectable: true
-        fieldName: $(dropdown).data("field-name")
+        fieldName: $dropdown.data("field-name")
+        hidden: (e) ->
+          $selectbox.hide()
+          # display:block overrides the hide-collapse rule
+          $value.removeAttr('style')
         id: (obj, el) ->
           $(el).data "id"
-        clicked: ->
+        clicked: (selected) ->
           if $(dropdown).is ".js-filter-submit"
             $(dropdown).parents('form').submit()
+          else
+            selected = $dropdown
+              .closest('.selectbox')
+              .find("input[name='#{$dropdown.data('field-name')}']").val()
+            updateWeight(selected)
       )

app/views/shared/issuable/_sidebar.html.haml

@@ -127,19 +127,23 @@
               - else
                 No
           .title.hide-collapsed
-            %label Weight
+            Weight
+            = icon('spinner spin', class: 'block-loading')
             - if can?(current_user, :"admin_#{issuable.to_ability_name}", @project)
-              .pull-right
-                = link_to 'Edit', '#', class: 'edit-link'
-          .value.hide-collapsed
+              = link_to 'Edit', '#', class: 'edit-link pull-right'
+          .value.bold.hide-collapsed
             - if issuable.weight
-              = icon('balance-scale')
               = issuable.weight
             - else
               .light None
           .selectbox.hide-collapsed
-            = f.select :weight, issues_weight_options(issuable.weight, edit: true), { include_blank: true },
-              { class: 'select2 js-select2', data: { placeholder: "Select weight" }}
+            = dropdown_tag("Weight", options: { title: "Change weight", toggle_class: 'js-weight-select', dropdown_class: "dropdown-menu-selectable",
+              placeholder: "Search weight", data: { field_name: "weight", issue_update: "#{issuable_json_path(issuable)}", ability_name: "#{issuable.to_ability_name}" } }) do
+              %ul
+                - Issue.weight_options.each do |weight|
+                  %li
+                    %a{href: "#", data: { id: weight }, class: ("is-active" if params[:weight] == weight.to_s)}
+                      = weight
 
       = render "shared/issuable/participants", participants: issuable.participants(current_user)
       - if current_user
@@ -172,6 +176,7 @@
     :javascript
       new MilestoneSelect('{"namespace":"#{@project.namespace.path}","path":"#{@project.path}"}');
       new LabelsSelect();
+      new WeightSelect();
       new IssuableContext('#{current_user.to_json(only: [:username, :id, :name])}');
       new Subscription('.subscription')
-      new Sidebar();
\ No newline at end of file
+      new Sidebar();