// switch between login, forgot, register
var modes = ['login', 'forgot', 'register'];
function switch_LFR(mode)
{
	for (var i in modes)
	{
		if (modes[i] != mode)
		{
			$('#'+modes[i]+'_div').hide();
		}
	}

	if ($('#overlay').css('display') == 'none')
	{
		$('#overlay').fadeIn(300, function()
		{
			$('#'+mode+'_div').show();
		});
	}
	else
	{
		$('#'+mode+'_div').show();
	}
}

function hide_overlay()
{
	$('#overlay').fadeOut(200, function()
	{
		$('#login_errors').html('');
		$('#login_form input:text').val('');
		$('#login_form input:password').val('');
		$('#login_form input:checkbox').attr('checked', false);

		$('#forgot_errors').html('');
		$('#forgot_form input:text').val('');

		$('#register_errors').html('');
		$('#register_form input:text').val('');
		$('#register_form input:password').val('');
		$('#register_form input:checkbox').attr('checked', false);
	});
}

function hide_overlay2()
{
	$('#overlay2').fadeOut(100);
}

function hide_overlay3()
{
	$('#overlay3').fadeOut(200, function()
	{
		$('#report_errors').html('');
		$('#report_other_reason').val('');
		$('#report_body').val('Describe the problem in details');
		$('#report_errors input:radio').attr('checked', false);
	});
}

function switch_gender(gender)
{
	var other_gender = gender == 'male' ? 'female' : 'male';
	var value = gender == 'male' ? 'm' : 'f';
	if ($('#'+gender+'_checkbox').attr('checked'))
	{
		$('#'+other_gender+'_checkbox').attr('checked', false);
		$('#register_gender').val(value);
	}
	else
	{
		$('#register_gender').val('');
	}
}

function show_tutorial(c)
{
	$('#help_page1').css({top:  jQuery(document).scrollTop() + (jQuery(window).height() - 658) / 2 + 'px'});
	$('#help_page1').css({left: (jQuery(window).width() - 980) / 2 + 'px'});

	$('#help_page2').css({top:  jQuery(document).scrollTop() + (jQuery(window).height() - 658) / 2 + 'px'});
	$('#help_page2').css({left: (jQuery(window).width() - 980) / 2 + 'px'});

	for (var i=1; i<=2; i++)
	{
		if (i != c)
		{
			$('#help_page'+i).fadeOut(200);
		}
	}

	if ($('#overlay2').css('display') == 'none')
	{
		$('#overlay2').fadeIn(300, function()
		{
			$('#help_page'+c).fadeIn(500);
		});
	}
	else
	{
		$('#help_page'+c).fadeIn(500);
	}
}

function show_song_report_form()
{
	$('.black_bg').height($('body').height());
	$('.white_bg').height($('body').height());

	$('#report').css({top:  jQuery(document).scrollTop() + (jQuery(window).height() - 500) / 2 + 'px'});
	$('#report').css({left: (jQuery(window).width() - 500) / 2 + 'px'});

	if ($('#overlay3').css('display') == 'none')
	{
		$('#overlay3').fadeIn(300, function()
		{
			$('#report').fadeIn(500);
		});
	}
	else
	{
		$('#report').fadeIn(500);
	}
}

jQuery(document).ready(function()
{
	$('.black_bg').height($('body').height());
	$('.white_bg').height($('body').height());

	jQuery(document).keyup(function(event)
	{
		if (event.keyCode == '27')
		{
			hide_overlay2();
		}
	});

	$('#report_option').click(function()
	{
		show_song_report_form();
		return false;
	});

	$('#tutorial_option').click(function()
	{
		show_tutorial(1);
		return false;
	});

	$('#login_option').click(function()
	{
		switch_LFR('login');
	});

	$('#register_option').click(function()
	{
		switch_LFR('register');
	});

	$('#male_checkbox').click(function()
	{
		switch_gender('male');
	});

	$('#female_checkbox').click(function()
	{
		switch_gender('female');
	});

	$('#login_form').submit(function(event)
	{
		$.ajax(
		{
			type: "POST",
			url: this.action,
			data: $("#login_form").serialize(),
			success: function(xml)
			{
				if (!xml)
				{
					return;
				}
				var errors = $('error', xml);
				if (errors.length)
				{
					var s = '';
					for (var i=0, j=errors.length; i<j; i++)
					{
						s += '<p><div style="font-size:11px; color:#F00;">' + errors[i].textContent + '</div></p>';
					}
					$('#login_errors').html(s);
					return;
				}
				var username = $('data', xml).attr('username');
				$('div.head').html('<div class="sign_up"><a href="/logout">Logout</a></div><div class="log_in"><a href="/my" class="login_head">' + username + '</a></div>');
				if ($('table.comment_leave').html())
				{
					$('table.comment_leave td.avatar').html('<img src="' + $('data', xml).attr('avatar') + '" width="75" height="75" style="border:1px solid #DDDDCC;" /><br /><div style="font-size:11px; color:#767676; margin-top:5px;">' + username + '</div>');
					$('#add_comment_form input.submit_noact').attr('class', 'submit');
					$('#add_comment_form input.submit').attr('disabled', false);
				}
				hide_overlay();
			}
		});
		return false;
	});

	$('#forgot_form').submit(function()
	{
		$.ajax(
		{
			type: "POST",
			url: this.action,
			data: $("#forgot_form").serialize(),
			success: function(xml)
			{
				if (!xml)
				{
					return;
				}
				var errors = $('error', xml);
				if (errors.length)
				{
					var s = '';
					for (var i=0, j=errors.length; i<j; i++)
					{
						s += '<p><div style="font-size:11px; color:#F00;">' + errors[i].textContent + '</div></p>';
					}
					$('#forgot_errors').html(s);
					return;
				}
			}
		});
		//You have successfully requested information on how to reset your password. Please check your e-mail to reset your password.
		return false;
	});

	$('#register_form').submit(function()
	{
		$.ajax(
		{
			type: "POST",
			url: this.action,
			data: $("#register_form").serialize(),
			success: function(xml)
			{
				if (!xml)
				{
					return;
				}
				var errors = $('error', xml);
				if (errors.length)
				{
					var s = '';
					for (var i=0, j=errors.length; i<j; i++)
					{
						s += '<p><div style="font-size:11px; color:#F00;">' + errors[i].textContent + '</div></p>';
					}
					$('#register_errors').html(s);
					return;
				}
				var username = $('data', xml).attr('username');
				$('div.head').html('<div class="head"><div class="sign_up"><a href="/logout">Logout</a></div><div class="log_in"><a href="/my" class="login_head">' + username + '</a></div></div>');
				hide_overlay();
			}
		});
		return false;
	});
});