     @loadSubject(sampleData[0])
 
     console.log @canvasGraph.largestX
-    @el.find("#scale-slider").attr "max", @canvasGraph.largestX
+    @el.find("#scale-slider").attr "max", @canvasGraph.largestX - @zoomRange
     @el.find("#scale-slider").attr "min", @canvasGraph.smallestX
 
     $(document).on 'mark-change', => @updateButtons()

    @isZoomed = !@isZoomed
    zoomButton = @el.find("#toggle-zoom")[0]
    if @isZoomed
      @canvasGraph.plotPoints(@focusCenter-@zoomRange/2,@focusCenter+@zoomRange/2)
      zoomButton.innerHTML = '<img src="images/icons/toolbar-zoomminus.png">Zoom'
      @el.find("#toggle-zoom").addClass("toggled")
      @el.find("#scale-slider").addClass("active")
      @el.find(".faux-range-thumb").fadeIn(150)
    else
      @canvasGraph.plotPoints()
      zoomButton.innerHTML = '<img src="images/icons/toolbar-zoomplus.png">Zoom'
      @el.find("#toggle-zoom").removeClass("toggled")
      @el.find("#scale-slider").removeClass("active")
      @el.find(".faux-range-thumb").fadeOut(150)

  onToggleFav: ->
    favButton = @el.find("#toggle-fav")[0]


  constructor: ->
    super
    @zoomRange = 15

    isZoomed: false
    ifFaved: false
    @scaleSlider = new FauxRangeInput('#scale-slider')
