document.write(unescape('%3Cscript type="text/javascript" charset="UTF-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"%3E%3C/script%3E'));
document.write(unescape('%3Cscript type="text/javascript" charset="UTF-8" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"%3E%3C/script%3E'));

function loadGetinLive(team)
{
	if (typeof jQuery != 'undefined') {  
		jQuery.noConflict();  


		var getinliveHtml = '';
		getinliveHtml += '<div id="getinliveWidget-match">'
							+ '<div id="getinliveLogo">Loading widget...</div>'
							+ '</div>'
							+ '<div id="getinliveWidget-lineup"></div>';


		jQuery('#getinliveWidget').html(getinliveHtml);


		document.write(unescape('%3Cscript type="text/javascript" charset="UTF-8" src="/widget/team/'+team+'" %3E%3C/script%3E'));
	}  
	
}
function doCallback(data) {
		var htmlMatch = '';
	  	htmlMatch += '<div class="getinliveContent">'
				+ '<div class="getinliveTeams">'
				 + '<div class="getinliveAwayTeam rounded2" style="background: #'+data.matchInfo.details.awayColorHex+' url(/images/team/all/team_overlay.png) repeat-x;"><div class="getinliveTeam"><a href="http://www.getinlive.com/team/'+data.matchInfo.details.awayTeamId+'" target="_blank" onfocus="this.blur()" style="color: #' + data.matchInfo.details.awayTextColor + '">' + data.matchInfo.details.awayTeamName + '</a></div></div>'
				 + '<div class="getinliveHomeTeam rounded2" style="background: #'+data.matchInfo.details.homeColorHex+' url(/images/team/all/team_overlay.png) repeat-x;"><div class="getinliveTeam"><a href="http://www.getinlive.com/team/'+data.matchInfo.details.homeTeamId+'" target="_blank" onfocus="this.blur()" style="color: #' + data.matchInfo.details.homeTextColor + '">' + data.matchInfo.details.homeTeamName + '</a></div></div>' 
				+ '<div class="getinliveTeamsVs"></div>'
				+ '</div>'
				+ '<div class="getinlivePrediction rounded2"><div class="getinlivePredictionContent"><div id="getinlivePredictionMore"></div>Prediction: <span id="getinlivePredictionText"></span>'
				+ '<div id="getinlivePredictionContent"></div>'
				+ '</div></div>'
				+ '<div class="getinliveStats rounded2"><div class="getinliveStatsContent"><div id="getinliveStatsMore"></div>Team Statistics.'
				+ '<div id="getinliveStatsContent"></div>'
				+ '</div></div>'
				+ '<div class="getinliveMatchNav-container"><div class="getinliveMatchLogo rounded2"><a href="http://www.getinlive.com" onfocus="this.blur()" target="_blank">Getinlive.com</a></div><div class="getinliveMatchNav rounded2">'
				+ '<a href="#" onfocus="this.blur();" onclick="jQuery(\'#getinliveWidget-match\').hide(); jQuery(\'#getinliveWidget-lineup\').show(); jQuery(\'#getinliveWidget-lineup-players-container\').show(); jQuery(\'#getinliveCopy\').hide(); return false;">Set lineup</a>'
				+ '</div></div>'
  			 + '</div>';
	  	
	


		
		//hide logo
		jQuery('#getinliveLogo').fadeOut( function() {
			jQuery('#getinliveWidget-match').html(htmlMatch);

			//show prediction
			showPrediction(
				data.matchInfo.details.matchId,
				data.matchInfo.details.homeColorHex,
				data.matchInfo.details.awayColorHex,
				data.matchInfo.details.homeTextColor,
				data.matchInfo.details.awayTextColor,				
				data.matchInfo.prediction[1],
				data.matchInfo.prediction["X"],
				data.matchInfo.prediction[2]
			);

			//show stats
			showStats(
				data.matchInfo.details.matchId,
				data.matchInfo.details.homeColorHex,
				data.matchInfo.details.awayColorHex,
				data.matchInfo.details.homeTextColor,
				data.matchInfo.details.awayTextColor,
				data.matchInfo.goals.homeForm,
				data.matchInfo.goals.awayForm,
				data.matchInfo.goals.homeAvg,
				data.matchInfo.goals.awayAvg,
				data.matchInfo.ranks.homeRank,
				data.matchInfo.ranks.awayRank
			);
			
		});
		
	  
		htmlLineup = '<div class="getinliveContent">'
			+ '<div id="getinliveWidget-lineup-players-container" class="rounded5-tl rounded5-bl">'
			+ '<ul id="getinliveWidget-lineup-players"></ul>'
			+ '<div class="drag-arrow"></div>'
			+ '</div>'
			+ '<div id="getinliveWidget-lineupImageDiv" class="rounded2"></div>'
			+ '<div id="getinliveWidget-generatedLink"></div>'
			+ '<div class="getinliveLineupNav-container"><div class="getinliveLineupBack rounded2"><a href="#" onclick="jQuery(\'#getinliveWidget-match\').show(); jQuery(\'#getinliveWidget-lineup\').hide(); return false;" onfocus="this.blur()" target="_blank">Back</a></div><div class="getinliveLineupNav rounded2">'
			+ '<a href="#" id="getinliveWidget-genLineup" onfocus="this.blur();">Generate image and embed</a>'
			+ '</div></div>'
			+ '</div>'
			+ '<div id="getinliveCopy" class="rounded2"></div>'
			+ '</div>'
	  jQuery('#getinliveWidget-lineup').html(htmlLineup);
	  jQuery.each(data.lineup, function(i, val) {
		  //jQuery.each(key, function(i, val) {
			  jQuery('#getinliveWidget-lineup-players').append('<li id="player-'+val.player+'"><span>'+val.shirtName + '</span></li>');
		  //});
		
		
	  });

	  	var $playersLineup = jQuery('#getinliveWidget-lineup-players'), $lineupImage = jQuery('#getinliveWidget-lineupImageDiv');
	  	jQuery('li',$playersLineup).draggable();
	  
	
		
		//generate image
		jQuery('#getinliveWidget-genLineup').click(function(e){
			
			//remove drawer
			jQuery("#getinliveWidget-lineup-players-container").fadeOut();
			
			//show copy
			jQuery("#getinliveCopy").show();
			
				//copy text
				jQuery("#getinliveCopy").html('Generating image...');
			
			
		  var fOffset = jQuery('#getinliveWidget-lineupImageDiv').offset();
		  var height = jQuery('#getinliveWidget-lineupImageDiv').innerHeight()+fOffset.top;
		  var width = jQuery('#getinliveWidget-lineupImageDiv').innerWidth()+fOffset.left;
		  //console.dir(jQuery('#getinliveWidget-lineupImageDiv').offset())
		 
		  var params = { 'img[otop]': fOffset.top, 'img[oleft]': fOffset.left, 'img[owidth]': jQuery('#getinliveWidget-lineupImageDiv').innerWidth(), 'img[oheight]': jQuery('#getinliveWidget-lineupImageDiv').innerHeight() };
		  var pOffset = 0;
		  jQuery.each(data.lineup, function(i, val) {
			  //jQuery.each(key, function(i, val) {
				  pOffset = jQuery('#player-'+val.player+' span').offset()
				  if (pOffset.left > fOffset.left && pOffset.left < width && pOffset.top > fOffset.top && pOffset.top < height)
				  {
					  params['player['+val.player+']'] = pOffset.top + ';' + pOffset.left;
					  //console.dir(jQuery('#player-'+val.player).offset());
				  }
			 // });
		  });
		  
		jQuery.post("/widget/index/generate", params,
			function(data){
				jQuery('#getinliveCopy').html('<strong>Lineup image generated.</strong><br />Copy URL and embed on forum/blog.<br /><br /><input style="border:1px solid #666; margin-bottom: 5px; width: 80%; padding: 2px" value="http://www.getinlive.com'+data+'"><br /><a href="'+data+'" onfocus="this.blur()" target="_blank" style="color: #000;">Click to see image.</a>');
		});
		  
		e.preventDefault();
	  	});

		
		
		return false;



}


function showPrediction(matchId,homeColor,awayColor,homeTextColor,awayTextColor,homeWin,draw,awayWin) {
	
	
	var html = '<div id="predict-draw" style="background: #333 url(http://www.getinlive.com/images/common/whiteOverlay.png) repeat-x; background-position: 0 -5px; padding-left: '+homeWin+'%; padding-right: '+awayWin+'%; width: '+draw+'%; color: #fff;">'
		+ '<div style="display: none">'+draw+'%</div>'
		+ '</div>'
		+ '<div id="predict-home" style="background: #'+homeColor+' url(http://www.getinlive.com/images/team/all/team_overlay.png) repeat-x; background-position: 0 -5px; width: '+homeWin+'%; color: #'+homeTextColor+'">'
		+ '<div style="display: none">'+homeWin+'%</div>'
		+ '</div>'
		+ '<div id="predict-away" style="background: #'+awayColor+' url(http://www.getinlive.com/images/common/whiteOverlay.png) repeat-x; background-position: 0 -5px;  width: '+awayWin+'%; color: #'+awayTextColor+'">'
		+ '<div style="display: none">'+awayWin+'%</div>'
		+ '</div>'
		+ '<img src="http://www.getinlive.com//images/common/predict-1.png" style="display: none; position: absolute; top: 5px; left: 3px;" id="predict-icon-home" />'
		+ '<img src="http://www.getinlive.com//images/common/predict-draw.png" style="display: none; position: absolute; top: 5px; left: '+(homeWin+1)+'%" id="predict-icon-draw" />'
		+ '<img src="http://www.getinlive.com//images/common/predict-2.png" style="display: none; position: absolute; top: 5px; left: '+((homeWin+draw)+1)+'%;" id="predict-icon-away" />';
	
	jQuery("#getinlivePredictionContent").html(html);
	
	//above 3%?
	if(homeWin > 5) { jQuery("#predict-home div, #predict-icon-home").show(); }
	if(draw > 5) { jQuery("#predict-draw div, #predict-icon-draw").show(); }
	if(awayWin > 5) { jQuery("#predict-away div, #predict-icon-away").show(); }
	
	//text
	var max = Math.max(homeWin,draw,awayWin);
	switch(max) {
		case homeWin:
			var homeTeam = jQuery(".getinliveHomeTeam .getinliveTeam").text();
			jQuery("#getinlivePredictionText").html("<strong>"+homeTeam+"</strong> to win.");
			break;
		case draw > 3:
			jQuery("#getinlivePredictionText").html("Draw.");
			break;
		case awayWin:
			var awayTeam = jQuery(".getinliveAwayTeam .getinliveTeam").text();
			jQuery("#getinlivePredictionText").html("<strong>"+awayTeam+"</strong> to win.");
			break;
	}
	
	//more link
	jQuery("#getinlivePredictionMore").html('<a href="http://www.getinlive.com/pregame/predictions/'+matchId+'"  onfocus="this.blur()" target="_blank">More</a>');
	
	
	
}



function showStats(matchId,homeColor,awayColor,homeTextColor,awayTextColor,homeForm,awayForm,homeAvg,awayAvg,homePos,awayPos) {
	html = '<div class="head-to-head-container">'
		+ '<div class="head-to-head-home" style="background: #'+homeColor+' url(http://www.getinlive.com//images/common/whiteOverlay.png) repeat-x; background-position: 0 -5px; color: #'+homeTextColor+'">'
		+ '<div>'+homeForm+'/100</div></div>'
		+ '<div class="head-to-head-away" style="background: #'+awayColor+' url(http://www.getinlive.com//images/common/whiteOverlay.png) repeat-x; background-position: 0 -5px; color: #'+awayTextColor+'"">'
		+ '<div>'+awayForm+'/100</div></div>'
		+ '<div class="head-to-head-title">Form</div>'
		+ '</div>';
		
	html += '<div class="head-to-head-container">'
		+ '<div class="head-to-head-home" style="background: #'+homeColor+' url(http://www.getinlive.com//images/common/whiteOverlay.png) repeat-x; background-position: 0 -5px; color: #'+homeTextColor+'"">'
		+ '<div>'+homeAvg+'</div></div>'
		+ '<div class="head-to-head-away" style="background: #'+awayColor+' url(http://www.getinlive.com//images/common/whiteOverlay.png) repeat-x; background-position: 0 -5px; color: #'+awayTextColor+'"">'
		+ '<div>'+awayAvg+'</div></div>'
		+ '<div class="head-to-head-title">Avg. Goals</div>'
		+ '</div>';

	//html += '<div class="head-to-head-container">'
	//	+ '<div class="head-to-head-home" style="background: red url(/images/common/whiteOverlay.png) repeat-x;">'
	//	+ '<div>'+homePos+'</div></div>'
	//	+ '<div class="head-to-head-away" style="background: #fff url(/images/common/whiteOverlay.png) repeat-x;">'
	//	+ '<div>'+awayPos+'</div></div>'
	//	+ '<div class="head-to-head-title">Position</div>'
	//	+ '</div>';
		
	jQuery("#getinliveStatsContent").html(html);
	
	//more link
	jQuery("#getinliveStatsMore").html('<a href="http://www.getinlive.com/pregame/statistics/'+matchId+'" onfocus="this.blur()" target="_blank">More</a>');
}