Refs #3542 @1h; Add Time navigation

2 files changed, 70 insertions, 0 deletions

diff --git a/app/javascript/packs/referential_overview/overview.js b/app/javascript/packs/referential_overview/overview.js
new file mode 100644
index 000000000..59c326e9a
--- /dev/null
+++ b/app/javascript/packs/referential_overview/overview.js
@@ -0,0 +1 @@
+import ReferentialOverview from '../../referential_overview'
diff --git a/app/javascript/referential_overview/index.coffee b/app/javascript/referential_overview/index.coffee
new file mode 100644
index 000000000..8dd0e3561
--- /dev/null
+++ b/app/javascript/referential_overview/index.coffee
@@ -0,0 +1,69 @@
+class TimeTravel
+  constructor: (@overview)->
+    @container = @overview.container.find('.time-travel')
+    @todayBt = @container.find(".today")
+    @prevBt = @container.find(".prev-page")
+    @nextBt = @container.find(".next-page")
+    @initButtons()
+
+  initButtons: ->
+    @prevBt.click (e)=>
+      @overview.prevPage()
+      e.preventDefault()
+      false
+
+    @nextBt.click (e)=>
+      @overview.nextPage()
+      e.preventDefault()
+      false
+
+    @todayBt.click (e)=>
+      today = new Date()
+      month = today.getMonth() + 1
+      month = "0#{month}" if month < 10
+      day = today.getDate()
+      day = "0#{month}" if day < 10
+      @overview.showDay "#{today.getFullYear()}-#{month}-#{day}"
+      e.preventDefault()
+      false
+
+  scrolledTo: (progress)->
+    console.log "scrolledTo: #{progress*100}%"
+    @prevBt.removeClass 'disabled'
+    @nextBt.removeClass 'disabled'
+    @prevBt.addClass 'disabled' if progress == 0
+    @nextBt.addClass 'disabled' if progress == 1
+
+class window.ReferentialOverview
+  constructor: (selector)->
+    @container = $(selector)
+    @timeTravel = new TimeTravel(this)
+    @currentOffset = 0
+
+  showDay: (date)->
+    day = @container.find(".day.#{date}")
+    offset = day.offset().left
+    parentOffset = @container.find(".right .inner").offset().left
+    @scrollTo parentOffset - offset
+
+  currentOffset: ->
+    @container.find(".right .inner").offset().left
+
+  prevPage: ->
+    @scrollTo @currentOffset + @container.find(".right").width()
+
+  nextPage: ->
+    @scrollTo @currentOffset - @container.find(".right").width()
+
+  minOffset: ->
+    @_minOffset ||= @container.find(".right").width() - @container.find(".right .line").width()
+    @_minOffset
+
+  scrollTo: (offset)->
+    @currentOffset = offset
+    @currentOffset = Math.max(@currentOffset, @minOffset())
+    @currentOffset = Math.min(@currentOffset, 0)
+    @container.find(".right .inner").css "margin-left": "#{@currentOffset}px"
+    @timeTravel.scrolledTo 1 - (@minOffset() - @currentOffset) / @minOffset()
+
+export default ReferentialOverview