Refs #3542; Add a date lookup

3 files changed, 58 insertions, 30 deletions

diff --git a/app/assets/stylesheets/components/_referential_overview.sass b/app/assets/stylesheets/components/_referential_overview.sass
index af1baf4ec..5abbb47cd 100644
--- a/app/assets/stylesheets/components/_referential_overview.sass
+++ b/app/assets/stylesheets/components/_referential_overview.sass
@@ -1,14 +1,14 @@
 .referential-overview
   $left-size: 100px
-  $line-height: 57px
+  $line-height: 60px
   margin-top: 50px
   overflow: hidden
   .time-travel, .filters
     background-color: $lightergrey
     padding: 10px
     float: right
-    border-top-left-radius: 10px
-    border-top-right-radius: 10px
+    border-top-left-radius: 4px
+    border-top-right-radius: 4px
     border: 1px solid $lightgrey
     border-bottom: none
     position: relative
@@ -22,12 +22,32 @@
       box-shadow: 0 0 10px rgba(0,0,0,0.5)
       z-index: 1
   .time-travel
+    padding-top: 4px
+    padding-bottom: 4px
     a.btn:first-child
-      border-right: 1px solid $grey
       margin-right: 1px
     a.btn:last-child
-      border-left: 1px solid $grey
+      margin-right: 1px
+
     max-width: 33%
+    .btn-group, .form-group
+      position: relative
+      z-index: 2
+    .form-group
+      margin-left: 10px
+      margin-bottom: 0
+      display: inline-block
+      input
+        padding: 6px 5px
+        border: 1px solid $lightgrey
+        outline: none
+        height: 34px
+        border-radius: 4px
+        padding-right: 25px
+      a
+        padding: 4px
+        margin-top: 2px
+        margin-left: -25px
   .filters
     float: left
     max-width: 66%
@@ -41,14 +61,14 @@
         border-color: $grey
         width: auto
         flex: 1 1
-        padding: 12px 11px 11px
+        padding: 4px 11px 5px
         .input-group-btn
           right: 10px
         &.togglable
-          padding-top: 12px
-          padding-bottom: 11px
+          padding-top: 6px
+          padding-bottom: 5px
           &:before
-            top: 7px
+            top: 0px
 
   .overview-table
     position: relative
@@ -93,7 +113,7 @@
           width: 0
           content: ""
       .line
-        padding: 5px 10px
+        padding: 7px 10px
         border-bottom: 1px solid $grey
         font-size: 0.8em
         &:last-child
@@ -218,7 +238,7 @@
               border: none
             &.weekend
               background: $lightergrey
-            &.today, &:hover
+            &.selected, &:hover
               color: $blue
               background-color: transparentize($blue, 0.7)
               &:after
@@ -256,7 +276,7 @@
           top: 50%
           margin-top: -6px
           transform: translateY(-50%)
-          background-color: transparentize(white, 0.5)
+          background-color: transparentize(white, 0.25)
           padding: 5px
           font-size: 0.7em
           border-radius: 5px
@@ -273,19 +293,6 @@
           background: white
           opacity: 0.25
           z-index: 3
-        &:before
-          content: ""
-          border-right: 1px dashed $grey
-          top: -100%
-          bottom: -100%
-          position: absolute
-          right: -1px
-          z-index: 4
-        &:hover
-          &:after
-            opacity: 0.5
-          .title
-            background-color: transparentize(white, 0.2)
         &.empty
           z-index: 1
           background: rgb(244, 67, 67)
@@ -293,6 +300,12 @@
           &.accepted
             background: #f19039
             background: repeating-linear-gradient(-45deg, #f5e1cf,#f5e1cf 12px,#f19039 12px,#f19039 25px)
+        &:hover
+          z-index: 3
+          &:after
+            opacity: 0.5
+            .title
+              background-color: transparentize(white, 0.1)
 
   &.sticky
     .time-travel
@@ -300,6 +313,7 @@
       bottom: 0
       z-index: 15
       right: 35px
+      box-shadow: 0 0 10px rgba(0,0,0,0.5)
 
     .overview-table .right
       .lines
diff --git a/app/javascript/referential_overview/index.coffee b/app/javascript/referential_overview/index.coffee
index 31a689273..0e6541421 100644
--- a/app/javascript/referential_overview/index.coffee
+++ b/app/javascript/referential_overview/index.coffee
@@ -4,6 +4,8 @@ class TimeTravel
     @todayBt = @container.find(".today")
     @prevBt = @container.find(".prev-page")
     @nextBt = @container.find(".next-page")
+    @searchDateBt = @container.find("a.search-date")
+    @searchDateInput = @container.find("input.date-search")
     @initButtons()
 
   initButtons: ->
@@ -27,6 +29,11 @@ class TimeTravel
       e.preventDefault()
       false
 
+    @searchDateBt.click (e)=>
+      @overview.showDay @searchDateInput.val() if @searchDateInput.val().length > 0
+      e.preventDefault()
+      false
+
   scrolledTo: (progress)->
     @prevBt.removeClass 'disabled'
     @nextBt.removeClass 'disabled'
@@ -44,8 +51,10 @@ class window.ReferentialOverview
 
   showDay: (date)->
     day = @container.find(".day.#{date}")
+    @container.find(".day.selected").removeClass('selected')
+    day.addClass "selected"
     offset = day.offset().left
-    parentOffset = @currentOffset
+    parentOffset = @currentOffset + @container.find(".right").offset().left
     @scrollTo parentOffset - offset
 
   currentOffset: ->
diff --git a/app/views/referentials/_overview.html.slim b/app/views/referentials/_overview.html.slim
index 20bfd6c15..c35d4d5f5 100644
--- a/app/views/referentials/_overview.html.slim
+++ b/app/views/referentials/_overview.html.slim
@@ -19,10 +19,15 @@
         = link_to 'Effacer', @workbench, class: 'btn btn-link'
         = f.submit 'Filtrer', class: 'btn btn-default'
 
-  .time-travel.btn-group
-    = link_to I18n.t("referentials.overview.head.prev_page"), '#', class: "prev-page btn btn-default disabled"
-    = link_to I18n.t("referentials.overview.head.today"), '#', class: "today btn btn-default #{overview.includes_today? ? '' : 'disabled'}"
-    = link_to I18n.t("referentials.overview.head.next_page"), '#', class: "next-page btn btn-default"
+  .time-travel
+    .btn-group
+      = link_to I18n.t("referentials.overview.head.prev_page"), '#', class: "prev-page btn btn-default disabled"
+      = link_to I18n.t("referentials.overview.head.today"), '#', class: "today btn btn-default #{overview.includes_today? ? '' : 'disabled'}"
+      = link_to I18n.t("referentials.overview.head.next_page"), '#', class: "next-page btn btn-default"
+    .form-group
+      input.date-search type="date" min=overview.period.first max=overview.period.last
+      a.search-date href='#'
+        span.fa.fa-search
   .overview-table
     .left
       .head