     @ui.dateRangeInput.daterangepicker(
       locale:
         format: 'L'
-      startDate: moment().subtract(3, 'months').format("L")
+      startDate: moment().subtract(@DEFAULT_TIME_PERIOD_TIME, @DEFAULT_TIME_PERIOD_UNIT).format("L")
       endDate: moment().format("L")
       opens: "left"
     (start, end, label) =>
+      @fetchData(start.valueOf(), end.valueOf())
       @paintGraph()
     )
     return
 
 
-  initializeRangeSlider : ->
-
-    RangeSlider.create(@ui.rangeSliderInput[0],
-      start: [0, 80]
-      connect: true
-      step: 1
-      range:
-        min: 0
-        max: 100 #TODO: Find min/max in data
-    )
-
-    @ui.rangeSliderInput[0].noUiSlider.on('update', (values, handle) =>
-      @ui.rangeSliderLabel1[0].innerHTML = "#{Math.round(+values[0])}h";
-      @ui.rangeSliderLabel2[0].innerHTML = "#{Math.round((+values[0] + +values[1]) / 2)}h";
-      @ui.rangeSliderLabel3[0].innerHTML = "#{Math.round(+values[1])}h";
-      @paintGraphDebounced()
-    )
-    return
+  renderRangeSlider : ->
+
+    sliderEl = @ui.rangeSliderInput[0]
+
+    @fetchPromise.done( =>
+      minMaxHours = @getMinMaxHours()
+
+      # Destroy existing instance to reconfigure
+      if sliderEl.noUiSlider
+        sliderEl.noUiSlider.destroy()
+
+      RangeSlider.create(sliderEl,
+        start: [
+          Math.max(minMaxHours.min, @chosenMinHours)
+          Math.min(minMaxHours.max, @chosenMaxHours)
+        ]
+        connect: true
+        step: 1
+        margin: 1
+        range: minMaxHours
+      )
+
+      sliderEl.noUiSlider.on('update', (values, handle) =>
+        @chosenMinHours = Math.round(+values[0])
+        @chosenMaxHours = Math.round(+values[1])
+        @ui.rangeSliderLabel1[0].innerHTML = "#{@chosenMinHours}h";
+        @ui.rangeSliderLabel2[0].innerHTML = "#{Utils.roundTo((+values[0] + +values[1]) / 2, 1)}h";
+        @ui.rangeSliderLabel3[0].innerHTML = "#{@chosenMaxHours}h";
+        @paintGraphDebounced()
+      )
+    )
 
 
   paintGraphDebounced : ->

    "rangeSliderLabel2" : "#rangeSliderLabel2"
    "rangeSliderLabel3" : "#rangeSliderLabel3"


  initialize : ->

    @fetchPromise = @model.fetch()


  onRender : ->

    @ui.taskTypesCheckbox.prop("checked", true)
    @initializeDateRangePicker()
    @initializeRangeSlider()
    @paintGraph()



  buildNodes : (taskTypes, projects) ->

    svgUsers = @users.map( (user) =>
      if @doDrawUser(user)
        userName = user.firstName + " " + user.lastName
        workingHours = user.workingHours
        minMaxHours = @getMinMaxHours()
        color = @colorJet(128 - (workingHours - minMaxHours.min) * (128 / minMaxHours.max - minMaxHours.min) + 128)

        @quoted(userName) + " [id="+ @quoted(user.id) + ", shape=box, fillcolor=" + @quoted(color) + "]"
    ).join(";")

    svgTaskTypes = ""
