Merge branch 'collapseable-nav' of https://github.com/jasonblanchard/gitlabhq...

Merge branch 'collapseable-nav' of https://github.com/jasonblanchard/gitlabhq into jasonblanchard-collapseable-nav

CHANGELOG

@@ -62,6 +62,7 @@ v 7.8.0
   - 
   - 
   - Added support for firing system hooks on group create/destroy and adding/removing users to group (Boyan Tabakov)
+  - Added persistent collapse button for left side nav bar (Jason Blanchard)
 
 v 7.7.2
   - Update GitLab Shell to version 2.4.2 that fixes a bug when developers can push to protected branch

app/assets/javascripts/sidebar.js.coffee

@@ -24,3 +24,13 @@ $ ->
 $(window).resize ->
   responsive_resize()
   return
+
+$(document).on("click", '.toggle-nav-collapse', (e) ->
+  e.preventDefault()
+  if $('.page-with-sidebar').hasClass('collapsed')
+    $('.page-with-sidebar').removeClass('collapsed')
+    $.cookie("collapsed_nav", "false", { path: '/' })
+  else
+    $('.page-with-sidebar').addClass('collapsed')
+    $.cookie("collapsed_nav", "true", { path: '/' })
+)

app/assets/stylesheets/sections/nav_sidebar.scss

@@ -110,7 +110,7 @@
 
     .nav-sidebar {
       margin-top: 20px;
-      position: fixed;
+      position: relative;
       top: 45px;
       width: $sidebar_width;
     }
@@ -150,6 +150,37 @@
   }
 }
 
+.collapse-nav {
+  position: relative;
+  top: 50px;
+  width: 230px;
+  text-align: right;
+  padding-right: 21px;
+}
+
+.page-with-sidebar.collapsed {
+
+  .collapse-nav {
+    width: 53px;
+  }
+
+  padding-left: 50px;
+
+  .sidebar-wrapper {
+    width: 52px;
+    overflow-x: hidden;
+
+    .nav-sidebar {
+      width: 52px;
+    }
+    
+    .nav-sidebar li a > span {
+      display: none;
+    }
+  }
+}
+
+
 @media (max-width: $screen-md-max) {
   @include folded-sidebar;
 }
@@ -157,3 +188,9 @@
 @media(min-width: $screen-md-max) {
   @include expanded-sidebar;
 }
+
+@media (max-width: $screen-md-max) {
+  .collapse-nav {
+    display: none;
+  }
+}

app/helpers/nav_helper.rb

+module NavHelper
+  def nav_menu_collapsed?
+    cookies[:collapsed_nav] == 'true'
+  end
+end

app/views/layouts/_collapse_button.html.haml

+- if nav_menu_collapsed?
+  = link_to icon('plus-square'), '#', class: 'toggle-nav-collapse'
+- else
+  = link_to icon('minus-square'), '#', class: 'toggle-nav-collapse'

app/views/layouts/_page.html.haml

 - if defined?(sidebar)
-  .page-with-sidebar
+  .page-with-sidebar{:class => ("collapsed" if nav_menu_collapsed?)}
     = render "layouts/broadcast"
     .sidebar-wrapper
       = render(sidebar)
+      .collapse-nav
+        = render :partial => 'layouts/collapse_button'
     .content-wrapper
       .container-fluid
         .content

spec/helpers/nav_helper_spec.rb

+require 'spec_helper'
+
+# Specs in this file have access to a helper object that includes
+# the NavHelper. For example:
+#
+# describe NavHelper do
+#   describe "string concat" do
+#     it "concats two strings with spaces" do
+#       expect(helper.concat_strings("this","that")).to eq("this that")
+#     end
+#   end
+# end
+describe NavHelper do
+  describe '#nav_menu_collapsed?' do
+    it 'returns true when the nav is collapsed in the cookie' do
+      helper.request.cookies[:collapsed_nav] = 'true'
+      expect(helper.nav_menu_collapsed?).to eq true
+    end
+
+    it 'returns false when the nav is not collapsed in the cookie' do
+      helper.request.cookies[:collapsed_nav] = 'false'
+      expect(helper.nav_menu_collapsed?).to eq false
+    end
+  end
+end