var tweenDuration = 500;
var pageWidthBig = 540;
var pageWidthSmall = 270;
var page;
var loginValidation;
var registerValidation;

$(document).ready( constructor );

function constructor()
{
	page = $('div#page');

	page.css('width', pageWidthSmall);
	$('div#login').hide();
	$('div#register').hide();
	$('div#video').hide();

	$('form .error').hide();
	
	$('a#loginButton').click( loginButtonClick );
	$('a#registerButton').click( registerButtonClick );
	$('a#videoButton').click( videoButtonClick );

	$('form#loginForm').submit( loginFormSubmit );
	$('form#registerForm').submit( registerFormSubmit );
}

function loginButtonClick()
{
	(page.width() < pageWidthBig) ? expandLayout( showLogin ) : showLogin();
}

function registerButtonClick()
{
	(page.width() < pageWidthBig) ? expandLayout( showRegister ) : showRegister();
}

function videoButtonClick()
{
	(page.width() < pageWidthBig) ? expandLayout( showVideo ) : showVideo();
}

function expandLayout( callback )
{
	page.animate( {width: pageWidthBig}, tweenDuration, null, callback );
}

function showLogin()
{
	$('div#login').slideDown( tweenDuration );
	$('div#register').slideUp( tweenDuration );
	$('div#video').fadeOut( tweenDuration );
}

function showRegister()
{
	$('div#login').slideUp( tweenDuration );
	$('div#register').slideDown( tweenDuration );
	$('div#video').fadeOut( tweenDuration );
}

function showVideo()
{
	$('div#login').slideUp( tweenDuration );
	$('div#register').slideUp( tweenDuration );
	$('div#video').fadeIn( tweenDuration );
}

function loginFormSubmit()
{
	//alert('exec loginFormSubmit');

	loginValidation = [
		{elementId:'username', method:isPresent},
		{elementId:'password', method:isPresent},
		{elementId:'username', method:isUsername},
		{elementId:'password', method:isPassword}
	];
	
	if( validate( 'form#loginForm', loginValidation) )
	{
		//alert(' - loginFormSubmit: true');
		return true;
	}
	else
	{
		//alert(' - loginFormSubmit: false');
		return false;
	}
}

function registerFormSubmit()
{
	//alert('exec registerFormSubmit: ' + $('form#registerForm #bits').val());
	
	registerValidation = [
		{elementId:'firstName', method:isPresent},
		{elementId:'surname', method:isPresent},
		{elementId:'email', method:isEmail},
		{elementId:'usernameRegister', method:isUsername},
		{elementId:'passwordRegister', method:isPassword},
		{elementId:'passwordConfirm', method:isMatch, args:[ $('form#registerForm #passwordRegister').val() ]},
		{elementId:'bits', method:isPresent},
		{elementId:'find', method:isPresent}
	];
	
	if ( validate( 'form#registerForm', registerValidation ) )
	{
		return true;
	}
	else
	{
		return false;
	}
}

function validate( form, vaidationRoutines )
{
	//alert('exec validate');

	var errors = [];

	for(var i=0; i<vaidationRoutines.length; i++)
	{
		var element = $(form + ' #' + vaidationRoutines[i].elementId);
		var args = ( vaidationRoutines[i].args ) ? vaidationRoutines[i].args : new Array();
		args.unshift( element );		// Add the element to the beginning of the args
		
		var valid = vaidationRoutines[i].method.apply(this, args);
		
		//alert(vaidationRoutines[i].elementId + ' = ' + valid);
		
		
		if( valid )
		{
			// all okay
			element.parent().children('.error').hide( tweenDuration );
			element.css( 'background-color', '#ffffff' );
			element.css( 'color', '#949494' );
		}
		else
		{
			//alert(vaidationRoutines[i].elementId + ' = ' + valid);
			
			errors.push( vaidationRoutines[i] );
			element.parent().children('.error').show( tweenDuration );
			element.css( 'background-color', '#bf98c9' );
			element.css( 'color', '#333333' );
		}
	}
	
	
	return (errors.length == 0) ? true : false;
}

function isPresent( element )
{
	if(element.val().length > 0)
	{
		return true;
	}
	else
	{
		return false;
	}
}

function isEmail( element )
{
	var str = element.val();
	var at="@";
	var dot=".";
	var lat=str.indexOf(at);
	var lstr=str.length;
	var ldot=str.indexOf(dot);
	
	if (str.indexOf(at)==-1){
	   return false;
	}

	if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
	   return false;
	}

	if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
	    return false;
	}

	 if (str.indexOf(at,(lat+1))!=-1){
	    return false;
	 }

	 if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
	    return false;
	 }

	 if (str.indexOf(dot,(lat+2))==-1){
	    return false;
	 }
	
	 if (str.indexOf(" ")!=-1){
	    return false;
	 }

	 return true;
}

function isMatch( element, matchValue )
{
	//alert('exec isMatch: '+element.val()+', match: '+matchValue);

	if(element.val() == matchValue)
	{
		return true;
	}
	else
	{
		return false;
	}
}

function isUrl( element )
{
	if(element.val())
	{
		var regexp = /(http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/
		return regexp.test( element.val() );
	}
	else
	{
		// Not checking to see isPresent, so return true as default
		return true;
	}
}


function isPassword( element )
{
	s = element.val();
	
	var regexp = /[^a-zA-Z0-9-_]/;		// is there any char in the str that is not in the range
	
	if( s.length < 4 )
	{
		return false;
	}
	else if( regexp.test( s ) )
	{
		return false;
	}
	
	return true;
}


function isUsername( element )
{
	s = element.val();
	
	var regexp = /[^a-zA-Z0-9-_]/;		// is there any char in the str that is not in the range
	
	if( s.length < 4 )
	{
		return false;
	}
	else if( regexp.test( s ) )
	{
		return false;
	}
	
	return true;
}