add the setting and getting sidebar state stored in cookie

2 files changed, 36 insertions, 16 deletions

diff --git a/app/assets/javascripts/merge_request_tabs.js.coffee b/app/assets/javascripts/merge_request_tabs.js.coffee
index e98db63f51f..b46aefffcfc 100644
--- a/app/assets/javascripts/merge_request_tabs.js.coffee
+++ b/app/assets/javascripts/merge_request_tabs.js.coffee
@@ -3,7 +3,6 @@
 # Handles persisting and restoring the current tab selection and lazily-loading
 # content on the MergeRequests#show page.
 #
-#= require jquery.cookie
 #= require sidebar
 #
 # ### Example Markup
@@ -74,8 +73,7 @@ class @MergeRequestTabs
       RightSidebar.expandSidebar()
     else if action == 'diffs'
       @loadDiff($target.attr('href'))
-      if bp? and bp.getBreakpointSize() isnt 'lg'
-        RightSidebar.collapseSidebar()
+      RightSidebar.collapseSidebar()
     else if action == 'builds'
       @loadBuilds($target.attr('href'))
       RightSidebar.expandSidebar()
diff --git a/app/assets/javascripts/sidebar.js.coffee b/app/assets/javascripts/sidebar.js.coffee
index 57ae93987ce..60432e4241d 100644
--- a/app/assets/javascripts/sidebar.js.coffee
+++ b/app/assets/javascripts/sidebar.js.coffee
@@ -1,19 +1,41 @@
-collapsed = 'page-sidebar-collapsed'
-expanded = 'page-sidebar-expanded'
+#= require jquery.cookie
+
+leftSidebarCollapsed = 'page-sidebar-collapsed'
+leftSidebarExpanded = 'page-sidebar-expanded'
 
 @RightSidebar =
+  # set gutter state to one of this two values "expanded_gutter" or "collapsed_gutter"
+  setGutterState: (state) ->
+    gutterState = undefined
+    if state = 'expanded_gutter'
+      gutterState = 'right-sidebar-expanded'
+    else if state = 'collapsed_gutter'
+      gutterState = 'right-sidebar-collapsed'
+    else
+      throw new Error 'Unexpected argument, expected "expanded_gutter" or "collapsed_gutter"'
+
+    $.cookie(state, $('.page-with-sidebar').hasClass(gutterState), { path: '/' })
+
+  # "expanded_gutter" or "collapsed_gutter"
+  getGutterState: (state) ->
+    if state is 'expanded_gutter' or state is 'collapsed_gutter'
+      $.cookie(state)
+    else
+      throw new Error 'Unexpected argument, expected "expanded_gutter" or "collapsed_gutter"'
+
   collapseSidebar: ->
-    $gutterIcon = $('.js-sidebar-toggle i:visible')
+    if bp? and bp.getBreakpointSize() isnt 'lg'
+      $gutterIcon = $('.js-sidebar-toggle i:visible')
 
-    # Wait until listeners are set
-    setTimeout( ->
-      # Only when sidebar is expanded
-      if $gutterIcon.is('.fa-angle-double-right')
-        $gutterIcon.closest('a').trigger('click', [true])
-    , 0)
+      # Wait until listeners are set
+      setTimeout( ->
+        # Only when sidebar is expanded
+        if $gutterIcon.is('.fa-angle-double-right')
+          $gutterIcon.closest('a').trigger('click', [true])
+      , 0)
 
   expandSidebar: ->
-    return if $.cookie('collapsed_gutter') == 'true'
+    return if @getGutterState('collapsed_gutter') == 'true'
 
     $gutterIcon = $('.js-sidebar-toggle i:visible')
 
@@ -25,10 +47,10 @@ expanded = 'page-sidebar-expanded'
     , 0)
 
 toggleLeftSidebar = ->
-  $('.page-with-sidebar').toggleClass("#{collapsed} #{expanded}")
+  $('.page-with-sidebar').toggleClass("#{leftSidebarCollapsed} #{leftSidebarExpanded}")
   $('header').toggleClass("header-collapsed header-expanded")
   $('.toggle-nav-collapse i').toggleClass("fa-angle-right fa-angle-left")
-  $.cookie("collapsed_nav", $('.page-with-sidebar').hasClass(collapsed), { path: '/' })
+  $.cookie("collapsed_nav", $('.page-with-sidebar').hasClass(leftSidebarCollapsed), { path: '/' })
 
   setTimeout ( ->
     niceScrollBars = $('.nicescroll').niceScroll();
@@ -45,5 +67,5 @@ $ ->
   size = bp.getBreakpointSize()
 
   if size is "xs" or size is "sm"
-    if $('.page-with-sidebar').hasClass(expanded)
+    if $('.page-with-sidebar').hasClass(leftSidebarExpanded)
       toggleLeftSidebar()