#= require jquery
#= require typehead.js

$(document).ready ->
  window.typeahead.init()

window.typeahead = {

  ######################
  # INITIALIZATION STUFF
  ######################

  # Set @compare to true or false
  # Set up typeahead elements variables
  # Initialize district/state typeaheads and compare listeners
  init: ->
    if window.location.href.indexOf('compare-') > -1
      @compare = true
    else
      @compare = false
    @setElementVariables()
    @initStateTypeahead()
    @initDistrictTypeahead()
    @createComparePricesListeners()

  setElementVariables: ->
    # @typeaheadStates = $('input.typeahead-states')
    # @typeaheadStatesCompare = $('input.typeahead-radio-states')
    @typeaheadDistricts = $('input.typeahead-districts')
    @typeaheadDistrictsCompare = $('input.typeahead-radio-districts')
    @postalCd = $('.state-container').data('state') || $('.district-container').data('state')
    @districtSlug = $('.district-container').data('district-slug')

  createComparePricesListeners: ->
    $('.button.compare-prices, a.compare-link').click =>
      prefix = "#{window.location.origin}/2015/compare-prices"
      if @districtSlug != undefined
        window.location.href = "#{prefix}/#{@postalCd}/districts/#{@districtSlug}"
      else if @postalCd != undefined
        window.location.href = "#{prefix}/#{@postalCd}"
      else
        window.location.href = prefix

    $('.compare-districts').click =>
      prefix = "#{window.location.origin}/2015/compare-districts"
      if @districtSlug != undefined
        window.location.href = "#{prefix}/#{@postalCd}/districts/#{@districtSlug}"
      else if @postalCd != undefined
        window.location.href = "#{prefix}/#{@postalCd}"
      else
        window.location.href = prefix



  ########################
  # STATE TYPEAHEAD STUFF
  #######################

  initStateTypeahead: ->
    if @stateData == undefined
      $.getJSON("/api/states").done @createStateTypeaheads.bind(@)
    else
      @createStateTypeaheads()

  createStateTypeaheads: (data) ->
    # set @stateData to all the states that return
    # create state typeahead with name and typeahead element
    @stateData = data if data != undefined
    @createStateTypeahead('states', @typeaheadDistricts)
    # @createStateTypeahead('radio-states', @typeaheadStatesCompare) if @compare

  createStateTypeahead: (name, typeahead) ->
    # options are from typeahead
    options = @stateTypeaheadOptions()
    options.name = name
    @createTypeahead(typeahead, options, @handleStateChange)
    @setInitialStateValue(typeahead)

  stateTypeaheadOptions: ->
    displayKey: 'full_name'
    source: (q, sync) =>
      sync @substringMatcher(@stateData, q, 'state')
    limit: 60

  setInitialStateValue: (typeahead) ->
    if @stateName == undefined
      $.each @stateData, (_, state) =>
        if state.postal_cd == @postalCd
          @stateName = state.full_name
          typeahead.typeahead('val', @stateName)
    else
      typeahead.typeahead('val', @stateName)

  handleStateChange: (e, state) ->
    if @validateState(state.full_name)
      if $(e.target).hasClass('typeahead-radio-states-prices')
        window.location.href = "/2015/compare-prices/#{state.postal_cd}"
      else if $(e.target).hasClass('typeahead-radio-states-districts')
        window.location.href = "/2015/compare-districts/#{state.postal_cd}"
      else
        window.location.href = "/2015/#{state.postal_cd}"
    else
      $(e.target).typeahead('val', @stateName)

  validateState: (state) ->
    @stateData.some (validState) ->
      validState.full_name == state

  ###########################
  # DISTRICT TYPEAHEAD STUFF
  ###########################

  initDistrictTypeahead: ->
    if @districtData == undefined
      $.getJSON("/api/districts").done [@setDistrictData.bind(@), @createDistrictTypeaheads.bind(@)]
    else
      @createDistrictTypeaheads()

  setDistrictData: (data) ->
    @districtData = data
    @inStateDistrictData = data.filter (district) =>
      district.postal_cd == @postalCd
    @outOfStateDistrictData = data.filter (district) =>
      district.postal_cd != @postalCd

  createDistrictTypeaheads: ->
    if @postalCd != undefined
      @createDistrictTypeaheadsWithPostalCd()
    else
      @createDistrictTypeaheadsWithoutPostalCd()

  createDistrictTypeaheadsWithPostalCd: ->
    options = [
      @districtTypeaheadOptions(@inStateDistrictData, @inStateDistrictHeader.bind(@)),
      @districtTypeaheadOptions(@outOfStateDistrictData, @outOfStateDistrictHeader.bind(@))
    ]
    @createDistrictTypeahead(@typeaheadDistricts, options, 'districts-state', 'districts-nation')
    @createDistrictTypeahead(@typeaheadDistrictsCompare, options, 'radio-districts', 'radio-districts') if @compare

  createDistrictTypeaheadsWithoutPostalCd: ->
    options = @districtTypeaheadOptions(@outOfStateDistrictData, @outOfStateDistrictHeader.bind(@))
    @createDistrictTypeahead(@typeaheadDistricts, options, 'districts-nation')

  districtTypeaheadOptions: (data, header) ->
    displayKey: 'name'
    source: (q, sync) =>
      sync @substringMatcher(data, q, 'district')
    limit: 30
    templates:
      header: header()
      suggestion: @districtSuggestion

  districtSuggestion: ->
    suggestion = @suggestion.arguments[0]
    "<div data-district-name='#{suggestion.name}' data-state-postal-cd='#{suggestion.postal_cd}' data-district-name='#{suggestion.nces_cd}'>#{suggestion.name}, #{suggestion.postal_cd}</div>"

  inStateDistrictHeader: ->
    "<div class='tt-suggestion-header-state'>#{@typeaheadStates.val()}</div>"

  outOfStateDistrictHeader: ->
    '<div class="tt-suggestion-header-national">National</div>'

  createDistrictTypeahead: (typeahead, options, firstName, secondName) ->
    if secondName != undefined
      options[0].name = firstName
      options[1].name = secondName
    else
      options.name = firstName
    @createTypeahead(typeahead, options, @handleDistrictChange)
    @setInitialDistrictValue(typeahead)

  handleDistrictChange: (e, district) ->
    if @validateDistrict(district.name)
      suffix = "#{district.postal_cd}/districts/#{district.slug}"
      if $(e.target).hasClass('typeahead-radio-districts')
        window.location.href = "/2015/compare-districts/#{suffix}"
      else
        window.location.href = "/2015/#{suffix}"
    else
      $(e.target).typeahead('val', @districtName)

  validateDistrict: (districtName) ->
    @districtData.some (validDistrict) ->
      validDistrict.name == districtName

  setInitialDistrictValue: (typeahead) ->
    if @districtName == undefined
      $.each @inStateDistrictData, (_, district) =>
        if district.slug == @districtSlug
          @districtName = district.name
          typeahead.typeahead('val', @districtName)
          if @compare
            $('.distance-filter').show()
    else
      typeahead.typeahead('val', @districtName)
      if @compare
        $('.distance-filter').show()

  ###################
  # SHARED STUFF
  ###################

  createTypeahead: (element, options, changeCallback) ->
    element.typeahead(@typeaheadOptions(), options)
    .on 'typeahead:selected typeahead:autocompleted typeahead:change', changeCallback.bind(@)
    .on 'typeahead:active', @activeTypeahead

  typeaheadOptions: ->
    minLength: 0

  substringMatcher: (data, query, type) ->
    matches = []
    substrRegex = new RegExp(query, 'i')
    $.each data, (_, obj) ->
      if type == 'state'
        str = obj.full_name
      else
        str = obj.name
      matches.push(obj) if substrRegex.test(str)

    if type == 'district'
      matches.sort (a, b) ->
        if a.name < b.name then -1 else 1
    matches

  activeTypeahead: (e) ->
    element = $(e.target)
    element.typeahead('val', '')
    element.attr('placeholder', '')
}