var baseUrl;
var langId;
var localeString;

$(document).ready( function()
{
	baseUrl = $("#baseUrl").val();
	langId = $("#langId").val();
	localeString =$("#localeString").val();
	
	$(document).pngFix();

	$(".menu_item").bind("mouseenter", addHoverEffect);
	$(".menu_item").bind("mouseleave", removeHoverEffect);

	$("#tell_friend").bind("click", removeGreyStyle);
	$("#tell_friend_btn").bind("click", sendMail);

	$("#find_game").bind("click", removeGreyStyle);

	$("#moreCats_btn").bind("click", showMoreCats);

	$("[id^=catsListItem_]").bind("click", showCatGames);

	$("div [id^=top10Item_]").bind("mouseenter", focusGame);
	$("div [id^=videoItem_]").bind("mouseenter", focusVideo);

	$("div [id^=latestAddedGamesItem_]").bind("mouseenter", showMe);
	$("div [id^=latestAddedGamesItem_]").bind("mouseleave", hideMe);

	//$("img[id^=catGame_]").bind("click", goToGame);

	// reference: http://flowplayer.org/tools/tooltip.html
		$("img[id^=catGame_]").tooltip(
		{
			track :true,
			delay :30,
			showURL :false,
			opacity :1,
			fixPNG :true,
			showBody :" - ",
			position :'center left'
		});
	});

function removeGreyStyle()
{
	$(this).removeClass('tiny_light_grey');
	$(this).val('');
}

function addGreyStyle()
{
	$(this).addClass('tiny_light_grey');
	$(this).val('type your friends\' email here...');
}

function addHoverEffect()
{
	var idArr = $(this).children().children().attr('src').split("_");
	if (idArr[2] != 'active.jpg')// the buttom is not in the active state
	{
		var id = idArr[0] + '_' + idArr[1];
		$(this).children().children().attr('src', id + '_hover.jpg');
	}
}

function removeHoverEffect()
{
	var idArr = $(this).children().children().attr('src').split("_");
	if (idArr[2] != 'active.jpg')// the buttom is not in the active state
	{
		var id = idArr[0] + '_' + idArr[1];
		$(this).children().children().attr('src', id + '_inactive.jpg');
	}
}

function goToGame()
{
	var idArr = $(this).attr('id').split("_");
	var id = idArr[1];

	window.location = baseUrl + "/game/index/id/" + id;
}

function showMoreCats()
{
	var localeString = $("#localeString").val();

	$("#moreCats_div").slideToggle('slow');
	// check the status of the menu bg image, to toggle it
	if ($("#moreCats_btn").attr('src') == baseUrl + '/images/' + localeString
			+ '/more_menu_active.jpg')
	{
		$("#moreCats_btn")
				.attr(
						'src',
						baseUrl + '/images/' + localeString
								+ '/more_menu_inactive.jpg');
	}
	else
		$("#moreCats_btn").attr('src',
				baseUrl + '/images/' + localeString + '/more_menu_active.jpg');

	// $("#moreCats_btn").parent().toggleClass("active");
}

function showCatGames()
{
	$("#loadingDiv").fadeIn();
	$("#catGames").html('');

	$("[id^=catsListItem_] a").removeClass("bold_orange");
	$("[id^=catsListItem_] a").addClass("bold_light_grey");

	$(this).children().removeClass("bold_light_grey");
	$(this).children().addClass("bold_orange");

	var idArr = $(this).attr('id').split("_");
	var id = idArr[1];

	$.ajax(
	{
		type :"POST",
		url :baseUrl + "/index/categorygames",
		data :"id=" + id + "&language=" + localeString,
		success : function(result)
		{
			$("#loadingDiv").hide('fast');
			$("#catGames").html(result);
			// reference: http://flowplayer.org/tools/tooltip.html
		$("img[id^=catGame_]").tooltip(
		{
			track :true,
			delay :30,
			showURL :false,
			opacity :1,
			fixPNG :true,
			showBody :" - ",
			position :'center left'
		});
	},
	error : function(e1, e2, e3)
	{
		// alert("error");
	}
	});
}

function focusGame()

{

	// $("div [id^=top10Item_1]").removeClass("top10_games_item_active");

	// $("div [id^=top10Item_1]").addClass("top10_games_item_inactive");

	$("div [id^=top10Item_]").removeClass("top10_games_item_active");

	$("div [id^=top10Item_] a").removeClass("bold_dark_red");

	$("div [id^=top10Item_]").addClass("top10_games_item_inactive");

	$("div [id^=top10Item_] a").addClass("tiny_black");

	$(this).addClass("top10_games_item_active");

	$(this).children().removeClass("tiny_black");

	$(this).children().addClass("bold_dark_red");

	var idArr = $(this).attr('id').split("_");

	var id = idArr[1];

	$("div [id^=top10List_]").removeClass("shown");

	$("div [id^=top10List_]").addClass("hidden");

	$("div #top10List_" + id).removeClass("hidden");

	$("div #top10List_" + id).addClass("shown");

}

function focusVideo()
{
	$("div [id^=videoItem_]").removeClass("top10_games_item_active");
	$("div [id^=videoItem_] a").removeClass("bold_dark_red");
	$("div [id^=videoItem_]").addClass("top10_games_item_inactive");
	$("div [id^=videoItem_] a").addClass("tiny_black");

	$(this).addClass("top10_games_item_active");
	$(this).children().removeClass("tiny_black");
	$(this).children().addClass("bold_dark_red");

	var idArr = $(this).attr('id').split("_");
	var id = idArr[1];

	$("div [id^=videoList_]").removeClass("shown");
	$("div [id^=videoList_]").addClass("hidden");

	$("div #videoList_" + id).removeClass("hidden");
	$("div #videoList_" + id).addClass("shown");
}

function toggleDescription()
{
	var idArr = $(this).attr('id').split("_");
	var id = idArr[1];

	// $("div #latestAddedGamesDesc_" + id).toggleClass("hidden");
	$("div #latestAddedGamesDesc_" + id).fadeIn("slow");
}

function showMe()
{
	var idArr = $(this).attr('id').split("_");
	var id = idArr[1];

	// $("div #latestAddedGamesDesc_" + id).toggleClass("hidden");
	// $("div #latestAddedGamesDesc_" +
	// id).fadeTo("fast",0.7).css('display','block');
	$("div #latestAddedGamesDesc_" + id).animate(
	{
		opacity :0.7
	}, 'fast').fadeIn('fast');
}
function hideMe()
{
	var idArr = $(this).attr('id').split("_");
	var id = idArr[1];

	// $("div #latestAddedGamesDesc_" + id).toggleClass("hidden");
	$("div #latestAddedGamesDesc_" + id).fadeOut("fast");
}

function sendMail()
{
	var mails = $("#tell_friend").val();
	var gameId = $("#tell_friend").val();
	if (areValidMails(mails))
	{
		$.ajax(
		{
			type :"POST",
			url :baseUrl + "/game/sendmail",
			data :"mails=" + mails,
			success : function(result)
			{
				$("#mail_confirmation").html(result);
				setTimeout("$('#mail_confirmation').hide()", 3000);
			},
			error : function(e1, e2, e3)
			{
				// alert("error");
		}
		});
	}
	else
	{
		$("#mail_confirmation").html('Please enter valid emails');
	}
}

function areValidMails(mails)
{
	var mailsArr = mails.split(",");

	var filter = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;

	var valid = true;

	for ( var i = 0; i < mailsArr.length; i++)
	{
		if (mailsArr[i].length == 0)
			valid = false;
		else if (!filter.test(mailsArr[i]))
			valid = false;
	}
	return valid;
}