$.fn.reverse = [].reverse; //attach javascript reverse to jQuery object

var positions = {
	soccer: {"GK": "Goalie", "D": "Defender", "M": "Midfielder", "F": "Forward"},
	volleyball: {"S": "Setter", "OH": "Outside Hitter",  "MH": "Middle Hitter", "L": "Livero"},
	basketball: {"G": "Guard", "F": "Forward"},
	baseball: {"IF": "Infielder", "OF": "Outfielder", "C": "Catcher", "P": "Pitcher", "RHP": "Right-Handed Pitcher", "LHP": "Left-Handed Pitcher"},
	lacrosse: {"G": "Goalie", "D": "Defender", "M": "Midfielder", "A": "Attacker"},
	golf: {"RH": "Right-handed", "LH": "Left-handed"}
};

var years = {"FR": "Freshman", "SO": "Sophomore"};

/*Right now this is used to combine positions into a single line, but it could be used on any array (?)*/
/*recursion requires too many array operations*/
function arrayToStringList(r){
	var numItems = r.length;
	if(numItems < 1){
		return '';
	}else if(numItems == 1){
		return r[0];
	}else if(numItems == 2){
		return r[0] + " &amp; " + r[1];
	}else if(numItems > 2){
		var stringList = '';
		for(i = 0; i < numItems-2; i++){
			stringList += r[i]+', '; 
		}
		return stringList + r[numItems - 2] + " &amp; " + r[numItems - 1];
	}
}


$(document).ready(function(){

	$("#print-link").show();

	//var hash = window.location.hash.substring(1); //skip the #

	//what if we are using multiple classes? should check against all classes, all sports
	//should go through header row, pick out content and then set the # of the col to a variable
	var sportPositions = positions[$("table#roster").attr("class")];
	var numPlayers = $("table#roster tr").length - 1; //header row
	var imageDir = "roster-images/";
	var requestURL = "/jcc-cgi/roster-image-list.cgi?host="+window.location.host+"&path="+window.location.pathname;
	
	var teamPicture = $("div#detail").html();
	
	$.getJSON(requestURL, function(data){
		var numPictures = 0;
		
		$("#roster tr th").each(function(i){
			var s = jQuery.trim($(this).text().toLowerCase());
			if(s == "name"){nameCol = i;}
			else if(s == "number" || s == "no."){numberCol = i;}
			else if(s == "position" || s == "pos."){positionCol = i;}
			else if(s == "year" || s == "yr"){yearCol = i;}
			else if(s == "hometown/high school"){fromCol = i;}
			else if(s == "height"){heightCol = i;}
			else if(s == "weight" || s == "wt."){weightCol = i;}
			else{
				//alert("Unknown table column: " + s);
			}		
		});
	
		$("#roster tr").each(function(i){
			if($(this).children("td").length != 0){ //avoid the header row
				var name = jQuery.trim($(this).children("td").eq(nameCol).text());
				var number = $(this).children("td").eq(numberCol).text(); 
				var positionArray = [];
				var position = $(this).children("td").eq(positionCol).text().split("/");
				jQuery.each(position, function(i, val){
					var positionName = "";
					if(sportPositions[position[i]]){
						positionName = sportPositions[position[i]];
					}else{
						positionName = position[i];
					}
					positionArray.push(positionName);
				});
				
				var year = years[$(this).children("td").eq(yearCol).text()];
				var from = $(this).children("td").eq(fromCol).text().split("/");
				var height = (typeof(heightCol) != "undefined") ? $(this).children("td").eq(heightCol).text() : '';
				var weight = (typeof(weightCol) != "undefined") ? $(this).children("td").eq(weightCol).text() : '';
						
				//current policy is to make 1 word last name, all other words go in 1st name
				sName = name.split(" ");
				var fname = sName.slice(0, sName.length-1).join(" ");
				var lname = sName[sName.length-1]; //one word last name
				lname = lname.replace(/\W/gi, "");
				var imageAddr = fname.substr(0,1) + lname + ".jpg";
				
				if(jQuery.inArray(imageAddr.toLowerCase(), data.images) != -1){
					numPictures++;
					imageAddr = imageDir + imageAddr.toLowerCase();
				}else{ // No image for this player
					imageAddr = 'roster-images/no-image.gif';
				}
				
				$(this).children("td").eq(nameCol).data("playerInfo", {
					"name": name, 
					"number": number, 
					"position": positionArray, 
					"year": year,
					"hometown": from[0],
					"school": from[1],
					"img": imageAddr,
					"height": height,
					"weight": weight
				});
			}
		});  //end .each

//order players from A-Z
if(numPictures/numPlayers > .75){

	$("table#roster").before('<div id="playerList"></div>');
	
	$("#playerList").append("<ul></ul>");
	$("table#roster tr").each(function(){
		if($(this).children().eq(nameCol).text() != 'Name'){ //avoid the TH row
	
			var playerData = $(this).children("td").eq(nameCol).data("playerInfo");
			var playerLink = '<li><a href="'+playerData.img+'">'+playerData.name+'</a></li>';
			
			//add the first player to the list
			if($("#playerList ul").children().length == 0){
				$(playerLink).appendTo("#playerList ul").children("a").data("playerInfo", playerData);
			}else{			
				var names = $(this).children("td").eq(nameCol).text().split(" ");
				var lname = names[names.length-1]; //assume 1-word last name
				var inserted = false;
				
				//insert lname into list
				$("#playerList ul li").each(function(){
					var curNames = $(this).text().split(" ");
					var curLName = curNames[curNames.length-1];
					if(lname < curLName){
						$(playerLink).insertBefore(this).children("a").data("playerInfo", playerData);
						inserted = true;
						return false; //break out of each	
					}
				});
				
				if(inserted == false){
					$(playerLink).appendTo("#playerList ul").children("a").data("playerInfo", playerData);
				}
			}
		}
	});
	
	$("table#roster").remove();
	$("div#playerList").attr("id", "roster");
	
}//end table->list

//defines listener on <a> that was inserted above
$("#roster a").click(function(){
	$("div#detail").empty();
	
	$("#roster a").removeClass("currentPlayer");
	$(this).addClass("currentPlayer");
	
	//still need width and height? or define in CSS and allow to scale/stretch?
	$("div#detail").append('<img id="player-picture" src="'+$(this).attr("href")+'" alt="Photo of '+$(this).text()+'">');
	$("div#detail").append('<div id="player-info"><h3>#<span id="number">'+$(this).data("playerInfo").number+"</span>: "+$(this).data("playerInfo").name+'</h3></div>');
			
	$("div#detail h3").after("<ul></ul>");
	jQuery.each($(this).data("playerInfo"), function(key, val){
		if(key != "name" && key != "number"){  //these are already used in heading
			if(key == "position"){
				$("div#detail ul").append('<li>'+arrayToStringList(val)+'</li>');
			}else if(key != "img" && val != ""){
				$("div#detail ul").append('<li>'+val+'</li>');
			}
		}
	});
		
	// add nav links
	// if this is first or last link, disable next/previous
	// this assumes that list is longer than 1
	var playerNavLinks;
	
	//no *next* element
	if($(this).parent("li").next("li").length == 0){
		playerNavLinks = $('<a href="" id="previous" class="playerNav">&#8592;Previous</a><a href="" id="reset" class="playerNav">Team</a><span id="next" class="playerNav">Next&#8594;</span>');
		
	//no *previous* element
	}else if($(this).parent("li").prev("li").length == 0){
		playerNavLinks = $('<span id="previous" class="playerNav">&#8592;Previous</span><a href="" id="reset" class="playerNav">Team</a><a href="" id="next" class="playerNav">Next&#8594;</a>');

		
	}else{
		playerNavLinks = $('<a href="" id="previous" class="playerNav">&#8592;Previous</a><a href="" id="reset" class="playerNav">Team</a><a id="next" href="" class="playerNav">Next&#8594;</a>');
	}
	
	//this is adding a click listener to everything in playerNavLinks - including the span?!
	$(playerNavLinks).click(function(){
		var playerList;
		var matched = 0;
		var clicked = $(this).attr("id");

		if($(this).attr("id") == "next"){
			playerList = $("div#roster ul li a");	
		}else if($(this).attr("id") == "previous"){
			playerList = $("div#roster ul li a").reverse();
		}else if($(this).attr("id") == "reset"){
			$("div#detail").html(teamPicture);
			$("#roster a").removeClass("currentPlayer");
			return false;
		}

		$(playerList).each(function(i){
			if(matched == 1){
				$(this).click();
				//put keyboard focus on the element that was just clicked
				if($("div#player-nav a#"+clicked).length == 0){
					$("div#player-nav a#reset").focus();
				}else{
					$("div#player-nav a#"+clicked).focus();
				}
				return false;
			}
		
			if($(this).data("playerInfo").number == $("div#detail h3 span#number").text()){
				matched = 1;
			}
		});
		
		return false;
	}).appendTo("div#detail").wrapAll('<div id="player-nav"></div>');
	//end of nav links insertion
	
	return false; //do not actually go to link location
}); //end click listener


//now all LIs have content + data
var numColumns = 3;
var playersPerColumn = Math.floor(numPlayers / numColumns);
var extraPlayers = numPlayers % numColumns;

var startColumnLength = 0;
switch(extraPlayers){
	case 0:
		startColumnLength = playersPerColumn;
		break;
	case 1:
		startColumnLength = playersPerColumn;
		break;
	case 2:
		startColumnLength = playersPerColumn + 1;
		break;
}

var pos = 0;
$("div#roster ul li").each(function(i){
	if(pos < startColumnLength){
		//leave these alone
	}else if(pos >= startColumnLength && pos < 2*startColumnLength){
		if(pos == startColumnLength){$(this).css("margin-top", -1.2*startColumnLength+"em");}
		$(this).addClass("col2");
	}else{
		if(pos == 2*startColumnLength){$(this).css("margin-top", -1.2*startColumnLength+"em");}
		$(this).addClass("col3");
	}
	pos++;

});



//access keys
$(document).keypress(function(e){
	//what if these links are missing?
	//switch statement here?
	//ffffound + google reader keys? h/k?
	//mark up as accesskeys?
	//should I use e.which or e.keyCode? cross-browser?
	if((e.which == 110 && !e.ctrlKey) || (e.which == 78 && !e.ctrlKey) || (e.keyCode == 39 && e.ctrlKey)){ 
		// n or N or ctrl+right arrow 
		$("a#next").click();
	}else if((e.which == 112 && !e.ctrlKey) || (e.which == 80 && !e.ctrlKey) || (e.keyCode == 37 && e.ctrlKey)){ 
		// p or P or ctrl+left arrow
		$("a#previous").click();
	}
});




}); //end Ajax data grab
}); //end page load listener