###############  LabList view  ###############
class window.LabListView

  constructor: (@lab_list)->
    @el = $('#lab_list')
    @template = null
    this.render() if @lab_list
    view = this
    LabList.tracker_elem.change( -> view.render() )

  render: ->
    @template = Handlebars.compile($('#lab_item_template').html()) unless @template
    view = this
    view.el.empty()
    $.each( @lab_list.getLabs(), (index, lab)-> view.el.append( $(view.template(lab)) ) )



###############  Map view  ###############
## the standard map view with lab icon  ##
class window.MapView
  constructor: (@collection, @center_point)->
    this.render()
    view = this
    LabList.tracker_elem.change( -> view.render() )

  el: $('#map_canvas')
  center_marker: null
  view: null
  markerBounds: new google.maps.LatLngBounds()
  markerBoundsZoomOut: 0.1

  options: {
    mapTypeId: google.maps.MapTypeId.ROADMAP
    mapTypeControl: false
  }

  prepareMap: ->
    if !this.view
      this.view = new google.maps.Map(document.getElementById("map_canvas"), this.options)

  createCenterMarker: ->
    if @center_point
      point = new google.maps.LatLng(this.center_point.lat, this.center_point.lng)
      @center_marker = new google.maps.Marker({
        position: point,
        map: this.view,
        title: this.center_point.title
        icon: "/assets/medivo/arrow.png"
      })
    this.markerBounds.extend(this.center_marker.position) if this.markerBounds and this.center_marker

  setMarkers: (map, markerBounds) ->
    $.each( @collection.getLabs(), (index, model)-> model.setMarker(map, markerBounds) )

  clear: ->
    @collection.clearMarkers()
    if this.center_marker
      this.center_marker.setMap(null)
      this.center_marker = null
    this.markerBounds = new google.maps.LatLngBounds()

  render: ->
    return unless @collection
    this.clear()
    this.prepareMap()
    this.createCenterMarker()
    this.setMarkers(this.view, this.markerBounds)

    # extend the bounds if its too small
    if (this.markerBounds.getNorthEast().equals(this.markerBounds.getSouthWest()))
      extendPoint = new google.maps.LatLng(
        this.markerBounds.getNorthEast().lat() + this.markerBoundsZoomOut,
        this.markerBounds.getNorthEast().lng() + this.markerBoundsZoomOut
      )
      this.markerBounds.extend(extendPoint)
    this.view.fitBounds(this.markerBounds)