/*
if (!window.console || !console.firebug)
{
    var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
    "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];

    window.console = {};
    for (var i = 0; i < names.length; ++i)
        window.console[names[i]] = function() {}
}
*/

;(function($) {
	/*
		Initializes the draft machine controls, preloads images
	*/	
	var init = function() {
		// reset the form values when we come back to this page
		$('#draftContent form input[type=hidden]').val('');
		var aTeams = [
			"atl", "bos", "cha", "chi", "cle", "dal", "den", "det", 
			"gsw", "hou", "ind", "lac", "lal", "mem", "mia", "mil", 
			"min", "njn", "nor", "nyk", "orl", "phi", "pho", "por", 
			"sac", "sea", "sas", "tor", "uth", "was"
		];
		var imageSizes = ['175x25_ON','300x35_ON','300x35_OFF'];
		var imgPath = 'http://assets.espn.go.com/i/nba/draft2008/draftmachine/';
		var img = new Image(); //document.createElement('img'); // create an image tag
		// do the image preload after the document loads
		var count = 0;
		var gap = 14;
		$(window).bind('load',function() {
			
			for(var i=0; i<aTeams.length; i++) {
				var src = imgPath + imageSizes[0] + '/' + aTeams[i] + '.jpg';
				$('<img/>').attr('src',src);	
			}
			
			showPage(); // show the page when the loop finishes
			
			/*
			function fetch(i,s) {
				i.src = s; //imgPath + imageSizes[0] + '/' + aTeams.shift() + '.jpg';
			}
			
			
			$(document.createElement('img')).bind('load',function() {
				if(aTeams[0]) {
					var src = imgPath + imageSizes[0] + '/' + aTeams.shift() + '.jpg';
					//if($.browser.msie && count%gap==0 && count > 1) { 
						// we need to rest for IE when preloading images
					//	setTimeout(function(){ fetch(this,src); }, 0);
					//} else {
						fetch(this,src);
					//}
					//count++;
					//this.src = imgPath + imageSizes[0] + '/' + aTeams.shift() + '.jpg';
				} else {
					//$(this).remove();
					showPage();
				}	
			}).trigger('load');
			*/
		});

	};
	
	var showPage = function() {
		$('window').unbind('load');
		$('#loadingMockImage').hide();
		$('#draftContent').show();
		// add click/drag handlers to the players
		$('.moduleplayer').each(function() {
			var p = $(this);
			makePlayerDraggable(p);
			makePlayerClickable(p);
			p.bind('mouseover',function(evt) {
				handlePlayerMouseOver(evt,$(this));
			});
		});
		// teams are droppable by default
		$('.moduleteam').droppable({
			'accept':'*',
			'tolerance':'pointer',
			drop: function(e,ui) {
				move(ui); 
			}
		});
	};
	
	var makePlayerClickable = function(player) {
		if(player.hasClass('moduleplayer')) {
			player.bind('click',function(e) {
				handlePlayerClick(e, $(this));
			});						
		}
	};
	
	var makePlayerDraggable = function(player) {
		player.draggable({
			'zIndex':9000, // rise above
			'opacity':'0.7',
			'revert':true,
			'distance':5,
			'start': function() {
				$(this).unbind('click');	
			},
			'stop':function() {
				makePlayerClickable($(this));	
			}
		});
	};
	
	var makePlayerDroppable = function(player,team) {
		turnOffPlayer(player);
		player.droppable({
			'accept':function(d) {
				// only accept the draggable if the Player Names match
				return $(d).find('dt').html() === $(this).find('dt p').html();
			},
			'tolerance':'pointer',
			drop: function(e,ui) {
				move(ui);
			}
		});
	};
	
	var makeTeamDraggable = function(team) {
		team.draggable({
			'zIndex':9000, // rise above
			'opacity':'0.7',
			'revert':true,
			'distance':5,
			'start': function() {
				$(this).unbind('click');	
			},
			'stop':function() {
				if($(this).hasClass('moduleteamon')) {
					makeTeamClickable($(this));		
				}
			}
		});
	};
	
	var makeTeamClickable = function(team) {
		team.bind('click',function() {
			handleTeamClick($(this));
		});
	};
	
	var move = function(ui) {
		// we need to determine the type of move we're making
		var drag = $(ui.draggable); 
		var drop = $(ui.element);   
		
		if(drag.hasClass('moduleteamon') && drop.hasClass('moduleteamon')) {
			// TEAM ON -> TEAM ON
			moveTeamOnTeamOn(drag,drop);
		
		} else if(drag.hasClass('moduleplayer') && drop.hasClass('moduleteam')) {
			// we have a player on to team off	
			movePlayerOnTeamOff(drag,drop);
		
		} else if(drag.hasClass('moduleplayer') && drop.hasClass('moduleteamon')) {
			// we have a player on -> team on [ add new player, revert old player]
			movePlayerOnTeamOn(drag,drop);
		
		} else if(drag.hasClass('moduleteamon') && drop.hasClass('moduleteam')) {
			// TEAM ON -> TEAM OFF
			moveTeamOnTeamOff(drag,drop);
		
		} else if(drag.hasClass('moduleteamon') && drop.hasClass('moduleplayeroff')) {
			// TEAM ON -> PLAYER OFF
			moveTeamOnPlayerOff(drag,drop);
		}		
	};
	
	var movePlayerOnTeamOff = function(player,team) {
		turnOnTeam(team,player);
		makePlayerDroppable(player,team);		
		setForm(player,team);
	};
	
	var movePlayerOnTeamOn = function(player,team) {
		// ok, we need to swap the players on the teams
		var outPlayerId = getPlayerIdFromForm(team);
		var outPlayer = $('#'+outPlayerId).parents('div.moduleplayeroff');
		turnOnPlayer(outPlayer);
		turnOffPlayer(player);
		turnOnTeam(team,player);
		makePlayerDroppable(player,team);	
		setForm(player,team);
	};
	
	var moveTeamOnTeamOff = function(team1,team2) {
		var team1PlayerId = getPlayerIdFromForm(team1);
		var player = $('#'+team1PlayerId).parents('div.moduleplayeroff');
		turnOnTeam(team2,player);
		turnOffTeam(team1);
		resetForm(team1);
		setForm(player,team2);
		player.droppable('destroy');
		makePlayerDroppable(player,team2);
	};
	
	var moveTeamOnTeamOn = function(team1,team2) {
		var team1PlayerId = getPlayerIdFromForm(team1);
		var player1 = $('#'+team1PlayerId).parents('div.moduleplayeroff');
		var team2PlayerId = getPlayerIdFromForm(team2);
		var player2 = $('#'+team2PlayerId).parents('div.moduleplayeroff');
		// swap the player names
		var player1Name = team1.find('dt').html();
		var player2Name = team2.find('dt').html();
		team1.find('dt').html(player2Name);
		team2.find('dt').html(player1Name);
		// set the form data
		setForm(player2,team1);
		setForm(player1,team2);
	};
	
	var moveTeamOnPlayerOff = function(team,player) {
		turnOffTeam(team);
		turnOnPlayer(player);
		resetForm(team);
	};
	
	var turnOnPlayer = function(player) {
		player.droppable('destroy')
			.removeClass('moduleplayeroff')
			.addClass('moduleplayer');
		makePlayerDraggable(player);
		makePlayerClickable(player);
	};
	
	var turnOffPlayer = function(player) {
		player.draggable('destroy')
			.removeClass('moduleplayer')
			.addClass('moduleplayeroff')
			.unbind('click')
			.css('z-index',1);
	};
	
	var turnOnTeam = function(team,player) {
		team.removeClass('moduleteam')
			.addClass('moduleteamon')
			.css({'background-image':team.css('background-image').replace('_OFF','_ON')})
			.find('dt').html(player.find('dt p').html()); // add player's name to the team widget
		makeTeamDraggable(team);
		makeTeamClickable(team);
	};
	
	var turnOffTeam = function(team) {
		team.removeClass('moduleteamon').addClass('moduleteam')
			.css({'background-image':team.css('background-image').replace('_ON','_OFF')}) // turn off the background
			.draggable('destroy')
			.find('dt').html('')
			.css('z-index',1);
	};
	
	var setForm = function(player, team) {
		var playerId = player.find('dt').attr('id').split('-')[1];
		var teamId = team.attr('id').split('-')[1];
		$('#player-'+teamId).val(playerId);
		/*
		$('#draftContent form input').each(function() {
			console.log(this);
		});
		*/
	};
	
	var getPlayerIdFromForm = function(team) {
		// return the player id 
		var teamId = team.attr('id').split('-')[1];
		var playerId = 'pid-' + $('#player-'+teamId).val();
		return playerId;
	};
	
	var resetForm = function(team) {
		// remove a player from the form
		var teamId = team.attr('id').split('-')[1];
		$('#player-'+teamId).val('');
		/*
		$('#draftContent form input').each(function() {
			console.log(this);
		});
		*/
	};
	
	var handlePlayerClick = function(evt, player) {
		// we're going to move the player to the next available slot
		//console.log(evt.target.tagName);
		evt.preventDefault();
		evt.returnValue = false;
		if(evt.target.tagName == 'A') {
			// we clicked on the team link
			evt.preventDefault();
			evt.returnValue = false;
			handleAddToTeamClick($(evt.target));
			evt.returnValue = false;
			return false;
		} else {
			var firstSlot = $('#draftContent form input[value=""]:first');
			if(firstSlot[0]) {
				var team = firstSlot.parents('div.moduleteam');
				var obj = {
					'draggable': player,
					'element': team	
				};	
				move(obj);
			}
		}
	};
	
	var handlePlayerMouseOver = function(evt,player) {
		if(player.hasClass('moduleplayer')) { 
			var div = player.find('div.teamSelector');
			div.show();
		}
		/*
		var link = div.find('a');
		link.click(function(e) {
			console.log(e);
			e.stopPropagation();
			handleAddToTeamClick($(this));
			return false;
		});
		*/
		player.one('mouseout',function(e) {
			handlePlayerMouseOut(e,$(this));
		});			
	};
	
	var handlePlayerMouseOut = function(evt,player) {
		evt.stopPropagation();
		player.unbind('mouseout');
		player.find('div.teamSelector').hide();	
		player.one('mouseover',function(e) {
			handlePlayerMouseOver(e,$(this));
		});
	};
	
	var handleTeamClick = function(team) {
		var playerId = team.find('input').val();
		var player = $('#pid-'+playerId).parents('div.moduleplayeroff');
		var obj = {
			'draggable': team,
			'element': player	
		};
		move(obj);
	};
	
	var handleAddToTeamClick = function(link) {
		var teams = $('.teamcolumn > div');
		var count = 0;
		var teamDiv = $('#addToTeams').empty();
		
		var player = link.parents('.moduleplayer');
		var playerName = player.find('dl:first dt').text();
		var playerStats = player.find('dl:first dd').text();
		//teamDiv.append('<b>'+playerName+'</b><br />');
		//teamDiv.append(playerStats);
		
		var teamList = $('<ul></ul>');
		teams.each(function() {
			var thisTeam = $(this);
			var linkClass = thisTeam.hasClass('moduleteamon') ? 'off' : '';
			if(count%10 == 0 && count > 0) {
				teamDiv.append(teamList);
				teamList = $('<ul></ul>');
			}
			
			var team = $('<li><a href="#">'+$(this).find('dd').html()+'</a></li>');
			team.addClass(linkClass);
			team.find('a').bind('click',function(e) {
				e.returnValue = false;
				e.preventDefault();
				// bind the move functionality
				var player = $(link).parents('.moduleplayer');
				var ui = {
					'draggable': player,
					'element': thisTeam
				};
				$('#addToTeams:visible').empty().hide();
				move(ui);				
			});
			teamList.append(team);
			count++;
		});
		
		
		teamDiv.append(teamList); // put the final team list up
		var tOffset = player.offset();
		teamDiv.css({
			'top':(tOffset.top)+'px',
			'left':(tOffset.left+player.width()-teamDiv.width())+'px'
		});
		teamDiv.show();
		offTeams = onTeams = null; // dump memory
		return false; // stop link from processing
	};
	
	$(function() {
		init();
		$('body').bind('mouseover',function(e) {
			var t = $(e.target);
			//console.log(t.parents('#addToTeams').length==0);
			if(t.parents('#addToTeams').length==0 && $('#addToTeams:visible')) {
				$('#addToTeams:visible').empty().hide();
			}	
		});
	});
	
})(jQuery);

var submitDraft = function(form) {
	tenpicked = true;
	for (x=1;x<11;x++) {
		var playerValue = $('#player-'+x).val();	
		if (playerValue == null || playerValue == '') {
			tenpicked = false;
		}
	}
	if (tenpicked) {
		form.submit();
		return true;
	} else {
		alert("You must set the first 10 picks to continue.  Please try again.");
	}
};