var player_postings

$(document).ready(function() {
  
  // form submittal
  $("#reply-form :submit").click(function() {
    // validation
    var errMsg = []
    var addErr = function(err) { errMsg[errMsg.length] = err; }
    var name = $("#name")
    var email = $("#email")
    var phone = $("#phone_number")
    var answer = $("#answer")
    
    if (name.val() == "") addErr("You must supply your name") 
    if (email.val() == "" && phone.val() == "") addErr("You must supply either an email address or phone number") 
    
    if (errMsg.length > 0) {
      $("#errs").remove()
      var msg = $("<ul id='errs'>")
      jQuery.each(errMsg, function(index, item) { msg.append("<li>"+item+"</li>")})
      $("#details").after(msg)
    }
  
    // abort submittal if errors exist
    if (errMsg.length > 0 || (answer.val() != "6" && answer.val().toLowerCase() != "six")) return false 
    
    var form = $("#reply-form form")
    $.post(form.attr("action") + ".js", form.find(":input").serialize(), function(data) {
      $("#reply-form")
        .before("<div id='flash' class='success'>" + data + "</div>")
        .hide()
      setTimeout(function() { $("#flash").fadeOut() }, 3000)
    })
    
    return false
  })
  
  // google maps
  if (GBrowserIsCompatible()) {
    
    var map = new GMap2(document.getElementById("map"));
    var location = new GLatLng(45,-97); 
     
    map.setCenter(location, 1);
    
    $.getJSON("player_postings", function(jData) {
      
      player_postings = jData
      
      jQuery.each(jData, function(index, item) {
        var posting = item["player_posting"]
        var point = new GLatLng(posting.latitude, posting.longitude);
        var marker = new GMarker(point)
        var summary = ""
        
        summary += "<strong>Age:</strong> " + (posting.age == "" ? "Doesn't Matter" : posting.age)
        summary += "<br/><strong>Gender:</strong> " + posting.gender
        summary += "<br/><strong>Level:</strong> " + posting.competitive_level
        summary += "<br/><a href='#' onclick='getPlayerPostingDetails("+index+");$(\"#reply-form\").show()'>View More</a>";

        GEvent.addListener(marker, "click", function() {
          map.openInfoWindowHtml(point, summary);
        });
        
        map.addOverlay(marker);
      })
    })
    
    // add mapping control widgets
    map.addControl(new GSmallMapControl());      
  }
})

function getPlayerPostingDetails(index) {
  var id = player_postings[index]["player_posting"].id
  $.getJSON("player_postings/show/"+id, function(jData) {
    var posting = jData[0]["player_posting"];
    var teamName = posting.team_name;
    var phone = posting.contact_phone_number;
    var captainName = posting.team_captain_name;
    var details = posting.details.replace(/\r\n/g, "<br/>");

    $("#team-name").html(teamName || "-");
    $("#contact-phone").html(phone || "-");
    $("#contact-name").html(captainName || "-");
    $("#note-details").html(details || "-");

    $("#posting-details").show();
  })
}