Refs #912: adding alternate layout, starting new nav system

9 files changed, 185 insertions, 1 deletions

diff --git a/app/assets/javascripts/sidemenu.coffee b/app/assets/javascripts/sidemenu.coffee
new file mode 100644
index 000000000..d55096eab
--- /dev/null
+++ b/app/assets/javascripts/sidemenu.coffee
@@ -0,0 +1,6 @@
+@mainmenu = ->
+  $('#main_nav').each ->
+    $(this).on 'click', '.toggleMenu', (e) ->
+      $(this).parent().toggleClass 'open'
+
+$(document).on 'ready turbolinks:load', mainmenu
diff --git a/app/assets/stylesheets/application_new.sass b/app/assets/stylesheets/application_new.sass
new file mode 100644
index 000000000..e3aeee56b
--- /dev/null
+++ b/app/assets/stylesheets/application_new.sass
@@ -0,0 +1,6 @@
+//----------//
+//  Custom  //
+//----------//
+
+@import 'new/layout'
+@import 'new/components/*'
diff --git a/app/assets/stylesheets/base.sass b/app/assets/stylesheets/base.sass
new file mode 100644
index 000000000..3035fd64c
--- /dev/null
+++ b/app/assets/stylesheets/base.sass
@@ -0,0 +1,15 @@
+//-------------//
+//  Libraries  //
+//-------------//
+
+// Bootstrap
+@import 'bootstrap-sass-official/_bootstrap-sprockets.scss'
+@import 'bootstrap-sass-official'
+
+// FontAwesome
+@import 'font-awesome-sprockets'
+@import 'font-awesome'
+
+// Select2
+@import 'select2'
+@import 'select2-bootstrap'
diff --git a/app/assets/stylesheets/new/components/_main_nav.sass b/app/assets/stylesheets/new/components/_main_nav.sass
new file mode 100644
index 000000000..e7a56e38c
--- /dev/null
+++ b/app/assets/stylesheets/new/components/_main_nav.sass
@@ -0,0 +1,79 @@
+#main_nav
+  display: table
+  height: 50px
+  width: 100%
+  background-color: #fafafa
+  border-bottom: 1px solid darken(#fafafa, 10%)
+
+  > *
+    display: table-cell
+    vertical-align: middle
+    height: 50px
+    padding: 15px
+
+  .nav-menu
+    width: 50px
+    text-align: center
+    background-color: #fff
+    border-right: 1px solid darken(#fafafa, 10%)
+
+  .nav-right
+    padding: 0
+    width: 150px
+
+    > li
+      display: inline-block
+      text-align: center
+
+      > a
+        display: block
+        border-left: 1px solid darken(#fafafa, 10%)
+        padding: 15px
+        width: 50px
+        height: 50px
+
+#main_nav .nav-menu
+  .toggleMenu
+    display: inline-block
+    cursor: pointer
+    transform: rotate(0deg)
+    transition: 0.3s
+    font: normal normal normal 14px/1 FontAwesome
+    text-rendering: auto
+    -webkit-font-smoothing: antialiased
+    font-size: 1.3333em
+    list-style: 0.75em
+    visibility: -15%
+
+    &:before
+      content: '\f0c9'
+
+  .menu-content
+    display: block
+    text-align: left
+    width: 280px
+    margin: 0 0 0 -280px
+    padding: 0
+    position: fixed
+    z-index: 999
+    top: 51px
+    left: 0
+    bottom: 0
+    border-right: 1px solid darken(#fafafa, 10%)
+    background-color: #fff
+    transition: 0.3s
+
+    > li > a
+      display: block
+      padding: 15px
+      border-top: 1px solid darken(#fafafa, 10%)
+
+    > li:first-child > a
+      border-top: none
+
+  &.open
+    .toggleMenu
+      transform: rotate(-90deg)
+
+    .menu-content
+      margin-left: 0
diff --git a/app/assets/stylesheets/new/layout.sass b/app/assets/stylesheets/new/layout.sass
new file mode 100644
index 000000000..f32dd798f
--- /dev/null
+++ b/app/assets/stylesheets/new/layout.sass
@@ -0,0 +1,9 @@
+//----------//
+//  Layout  //
+//----------//
+
+html
+  box-sizing: border-box
+
+  *
+    box-sizing: inherit
diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
index c2414f5bb..b616def70 100644
--- a/app/controllers/application_controller.rb
+++ b/app/controllers/application_controller.rb
@@ -2,6 +2,9 @@ class ApplicationController < ActionController::Base
   include Pundit
   rescue_from Pundit::NotAuthorizedError, with: :user_not_authorized
 
+  # Comment to activate the new layout
+  # layout 'application_new'
+
   # TODO : Delete hack to authorize Cross Request for js and json get request from javascript
   protect_from_forgery unless: -> { request.get? && (request.format.json? || request.format.js?) }
   before_action :authenticate_user!
diff --git a/app/views/layouts/application_new.html.slim b/app/views/layouts/application_new.html.slim
new file mode 100644
index 000000000..4abe6678c
--- /dev/null
+++ b/app/views/layouts/application_new.html.slim
@@ -0,0 +1,38 @@
+doctype html
+html lang=I18n.locale
+  head
+    meta charset="utf-8"
+    meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+
+    = csrf_meta_tag
+
+    title STIF BOIV
+
+    = stylesheet_link_tag 'base', media: 'all', 'data-turbolinks-track': true
+    = stylesheet_link_tag 'application_new', media: 'all', 'data-turbolinks-track': true
+
+    = javascript_include_tag 'application', 'data-turbolinks-track': true
+
+
+  body
+    = render 'layouts/new/main_nav'
+    
+    .container-fluid
+      .row
+        .col-lg-12
+          = "ton papa"
+
+    / #middle.container
+    /   .row
+    /     div class=("#{content_for?(:sidebar) ? 'col-md-9' : 'col-md-12'}") 
+    /       #workspace class=("#{controller_name} #{action_name}") 
+    /         = render partial: 'shared/flash_messages', flash: flash
+    /         = render 'shared/breadcrumb'
+    /         
+    /         = yield
+    /         
+    /     #sidebar class=("#{content_for?(:sidebar) ? 'col-md-3' : ''}") 
+    /       = yield :sidebar
+
+    / #footer
+    /   = render 'shared/footer'
diff --git a/app/views/layouts/new/_main_nav.html.slim b/app/views/layouts/new/_main_nav.html.slim
new file mode 100644
index 000000000..04541754e
--- /dev/null
+++ b/app/views/layouts/new/_main_nav.html.slim
@@ -0,0 +1,28 @@
+nav#main_nav
+  .nav-menu
+    span.toggleMenu title='Toggle menu'
+
+    ul.menu-content
+      li
+        = link_to '#' do
+          span.fa.fa-lg.fa-paw
+          = " Le premier lien"
+      li
+        = link_to '#' do
+          span.fa.fa-lg.fa-paw
+          = " Le deuxième lien"
+
+  div
+    |Breadcrumb to go
+
+  ul.nav-right
+    li
+      = link_to '#' do
+        span.fa.fa-lg.fa-user
+
+    li
+      = link_to '#' do
+        span.fa.fa-lg.fa-search
+    li
+      = link_to '#' do
+        span.fa.fa-lg.fa-bell-o
diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb
index 928236c4a..9ca59134e 100644
--- a/config/initializers/assets.rb
+++ b/config/initializers/assets.rb
@@ -5,4 +5,4 @@ Rails.application.config.assets.version = '1.0'
 
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
-Rails.application.config.assets.precompile += %w( es6_browserified/*.js )
+Rails.application.config.assets.precompile += %w( base.css application_new.css es6_browserified/*.js )