Merge branch 'functional-closed-sidebar' into 'master'

app/assets/javascripts/gl_dropdown.js.coffee

@@ -195,6 +195,8 @@ class GitLabDropdown
     if @options.filterable
       @dropdown.find(".dropdown-input-field").focus()
 
+    @dropdown.trigger('shown.gl.dropdown')
+
   hidden: (e) =>
     if @options.filterable
       @dropdown
@@ -209,6 +211,8 @@ class GitLabDropdown
     if @options.hidden
       @options.hidden.call(@,e)
 
+    @dropdown.trigger('hidden.gl.dropdown')
+
 
   # Render the full menu
   renderMenu: (html) ->

app/assets/javascripts/issuable_context.js.coffee

@@ -9,7 +9,7 @@ class @IssuableContext
     $(".issuable-sidebar .inline-update").on "change", ".js-assignee", ->
       $(this).submit()
 
-    $(document).on "click",".edit-link", (e) ->
+    $(document).off("click", ".edit-link").on "click",".edit-link", (e) ->
       $block = $(@).parents('.block')
       $selectbox = $block.find('.selectbox')
       if $selectbox.is(':visible')

app/assets/javascripts/labels_select.js.coffee

@@ -16,6 +16,7 @@ class @LabelsSelect
       abilityName = $dropdown.data('ability-name')
       $selectbox = $dropdown.closest('.selectbox')
       $block = $selectbox.closest('.block')
+      $sidebarCollapsedValue = $block.find('.sidebar-collapsed-icon span')
       $value = $block.find('.value')
       $loading = $block.find('.block-loading').fadeOut()
 
@@ -142,6 +143,7 @@ class @LabelsSelect
         if not selected.length
           data[abilityName].label_ids = ['']
         $loading.fadeIn()
+        $dropdown.trigger('loading.gl.dropdown')
         $.ajax(
           type: 'PUT'
           url: issueUpdateURL
@@ -149,15 +151,20 @@ class @LabelsSelect
           data: data
         ).done (data) ->
           $loading.fadeOut()
+          $dropdown.trigger('loaded.gl.dropdown')
           $selectbox.hide()
           data.issueURLSplit = issueURLSplit
-          if not data.labels.length
-            template = labelNoneHTMLTemplate()
-          else
+          labelCount = 0
+          if data.labels.length
             template = labelHTMLTemplate(data)
-          href = $value
-                  .show()
-                  .html(template)
+            labelCount = data.labels.length
+          else
+            template = labelNoneHTMLTemplate()
+          $value
+            .removeAttr('style')
+            .html(template)
+          $sidebarCollapsedValue.text(labelCount)
+
           $value
             .find('a')
             .each((i) ->
@@ -226,7 +233,8 @@ class @LabelsSelect
 
         hidden: ->
           $selectbox.hide()
-          $value.show()
+          # display:block overrides the hide-collapse rule
+          $value.removeAttr('style')
           if $dropdown.hasClass 'js-multiselect'
             saveLabelData()
 

app/assets/javascripts/milestone_select.js.coffee

@@ -18,6 +18,7 @@ class @MilestoneSelect
       abilityName = $dropdown.data('ability-name')
       $selectbox = $dropdown.closest('.selectbox')
       $block = $selectbox.closest('.block')
+      $sidebarCollapsedValue = $block.find('.sidebar-collapsed-icon')
       $value = $block.find('.value')
       $loading = $block.find('.block-loading').fadeOut()
 
@@ -80,18 +81,14 @@ class @MilestoneSelect
           milestone.name is selectedMilestone
         hidden: ->
           $selectbox.hide()
-          $value.show()
-        clicked: (selected) ->
+
+          # display:block overrides the hide-collapse rule
+          $value.removeAttr('style')
+        clicked: (e) ->
           if $dropdown.hasClass 'js-filter-bulk-update'
             return
 
-          if $dropdown.hasClass('js-filter-submit')
-            if selected.name?
-              selectedMilestone = selected.name
-            else if selected.title?
-              selectedMilestone = selected.title
-            else
-              selectedMilestone = ''
+          if $dropdown.hasClass 'js-filter-submit'
             $dropdown.parents('form').submit()
           else
             selected = $selectbox
@@ -102,20 +99,22 @@ class @MilestoneSelect
             data[abilityName].milestone_id = selected
             $loading
               .fadeIn()
+            $dropdown.trigger('loading.gl.dropdown')
             $.ajax(
               type: 'PUT'
               url: issueUpdateURL
               data: data
             ).done (data) ->
+              $dropdown.trigger('loaded.gl.dropdown')
               $loading.fadeOut()
               $selectbox.hide()
-              $milestoneLink = $value
-                      .show()
-                      .find('a')
+              $value.removeAttr('style')
               if data.milestone?
                 data.milestone.namespace = _this.currentProject.namespace
                 data.milestone.path = _this.currentProject.path
                 $value.html(milestoneLinkTemplate(data.milestone))
+                $sidebarCollapsedValue.find('span').text(data.milestone.title)
               else
                 $value.html(milestoneLinkNoneTemplate)
-      )
+                $sidebarCollapsedValue.find('span').text('No')
+      )
\ No newline at end of file

app/assets/javascripts/right_sidebar.js.coffee

+class @Sidebar
+  constructor: (currentUser) ->
+    @addEventListeners()
+
+  addEventListeners: ->
+    $('aside').on('click', '.sidebar-collapsed-icon', @sidebarCollapseClicked)
+    $('.dropdown').on('hidden.gl.dropdown', @sidebarDropdownHidden)
+    $('.dropdown').on('loading.gl.dropdown', @sidebarDropdownLoading)
+    $('.dropdown').on('loaded.gl.dropdown', @sidebarDropdownLoaded)
+
+  sidebarDropdownLoading: (e) ->
+    $sidebarCollapsedIcon = $(@).closest('.block').find('.sidebar-collapsed-icon')
+    img = $sidebarCollapsedIcon.find('img')
+    i = $sidebarCollapsedIcon.find('i')
+    $loading = $('<i class="fa fa-spinner fa-spin"></i>')
+    if img.length
+      img.before($loading)
+      img.hide()
+    else if i.length
+      i.before($loading)
+      i.hide()
+
+  sidebarDropdownLoaded: (e) ->
+    $sidebarCollapsedIcon = $(@).closest('.block').find('.sidebar-collapsed-icon')
+    img = $sidebarCollapsedIcon.find('img')
+    $sidebarCollapsedIcon.find('i.fa-spin').remove()
+    i = $sidebarCollapsedIcon.find('i')
+    if img.length
+      img.show()
+    else
+      i.show()
+
+
+  sidebarCollapseClicked: (e) ->
+    e.preventDefault()
+    $block = $(@).closest('.block')
+
+    $('aside')
+      .find('.gutter-toggle')
+      .trigger('click')
+    $editLink = $block.find('.edit-link')
+
+    if $editLink.length
+      $editLink.trigger('click')
+      $block.addClass('collapse-after-update')
+      $('.page-with-sidebar').addClass('with-overlay')
+
+  sidebarDropdownHidden: (e) ->
+    $block = $(@).closest('.block')
+    if $block.hasClass('collapse-after-update')
+      $block.removeClass('collapse-after-update')
+      $('.page-with-sidebar').removeClass('with-overlay')
+      $('aside')
+        .find('.gutter-toggle')
+        .trigger('click')
\ No newline at end of file

app/assets/javascripts/users_select.js.coffee

@@ -19,6 +19,7 @@ class @UsersSelect
       $block = $selectbox.closest('.block')
       abilityName = $dropdown.data('ability-name')
       $value = $block.find('.value')
+      $collapsedSidebar = $block.find('.sidebar-collapsed-user')
       $loading = $block.find('.block-loading').fadeOut()
 
       $block.on('click', '.js-assign-yourself', (e) =>
@@ -32,12 +33,14 @@ class @UsersSelect
         data[abilityName].assignee_id = selected
         $loading
           .fadeIn()
+        $dropdown.trigger('loading.gl.dropdown')
         $.ajax(
           type: 'PUT'
           dataType: 'json'
           url: issueURL
           data: data
         ).done (data) ->
+          $dropdown.trigger('loaded.gl.dropdown')
           $loading.fadeOut()
           $selectbox.hide()
 
@@ -51,11 +54,22 @@ class @UsersSelect
               name: 'Unassigned'
               username: ''
               avatar: ''
+          $value.html(assigneeTemplate(user))
+          $collapsedSidebar.html(collapsedAssigneeTemplate(user))
 
-          $value.html(noAssigneeTemplate(user))
-          $value.find('a').attr('href')
 
-      noAssigneeTemplate = _.template(
+      collapsedAssigneeTemplate = _.template(
+        '<% if( avatar ) { %>
+        <a class="author_link" href="/u/<%= username %>">
+          <img width="24" class="avatar avatar-inline s24" alt="" src="<%= avatar %>">
+          <span class="author">Toni Boehm</span>
+        </a>
+        <% } else { %>
+        <i class="fa fa-user"></i>
+        <% } %>'
+      )
+
+      assigneeTemplate = _.template(
         '<% if (username) { %>
         <a class="author_link " href="/u/<%= username %>">
           <% if( avatar ) { %>
@@ -131,7 +145,8 @@ class @UsersSelect
 
         hidden: (e) ->
           $selectbox.hide()
-          $value.show()
+          # display:block overrides the hide-collapse rule
+          $value.removeAttr('style')
 
         clicked: (user) ->
           page = $('body').data 'page'

app/assets/stylesheets/framework/sidebar.scss

@@ -288,6 +288,10 @@
   @media (min-width: $screen-sm-min) {
     padding-right: $sidebar_collapsed_width;
   }
+
+  .sidebar-collapsed-icon {
+    cursor: pointer;
+  }
 }
 
 .right-sidebar-expanded {
@@ -300,4 +304,8 @@
   @media (min-width: $screen-md-min) {
     padding-right: $gutter_width;
   }
+
+  &.with-overlay {
+    padding-right: $sidebar_collapsed_width;
+  }
 }

app/controllers/projects/merge_requests_controller.rb

@@ -154,7 +154,7 @@ class Projects::MergeRequestsController < Projects::ApplicationController
                        @merge_request.target_project, @merge_request])
         end
         format.json do
-          render json: @merge_request.to_json(include: [:milestone, :labels, :assignee])
+          render json: @merge_request.to_json(include: [:milestone, :labels, assignee: { methods: :avatar_url }])
         end
       end
     else

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

@@ -150,3 +150,4 @@
       new LabelsSelect();
       new IssuableContext('#{current_user.to_json(only: [:username, :id, :name])}');
       new Subscription('.subscription')
+      new Sidebar();
\ No newline at end of file