// add dynamic behavior to login fields
function setUpFields() {
	if( $('#email_field').val() != 'E-mail' ) {
		$('#email_field').removeClass( 'shaded' );
	}
	
	$('#email_field').focus( function() {
		if( $.trim( $('#email_field').val() ) == 'E-mail' ) {
			$('#email_field').removeClass( 'shaded' );
			$('#email_field').val('');
		}
	});
	
	$('#email_field').blur(function() {
		if( $.trim( $('#email_field').val() ).length == 0 ) {
			$("#email_field").addClass( 'shaded' );
			$('#email_field').val( 'E-mail' );
		}
	});
	
	$('#password_field_fake').val( 'Password' );
	$('#password_field_fake').focus(function() {
			$('#password_field_fake').toggleClass( 'hidden' );
			$('#password_field').toggleClass( 'hidden' );
			$('#password_field').focus();
	});
	
	$('#password_field').blur(function() {
		if( $.trim( $('#password_field').val() ).length == 0 ) {
			$('#password_field').val( '' );
			$('#password_field_fake').toggleClass( 'hidden' );
			$('#password_field').toggleClass( 'hidden' );
		}
	});
	
	$('#key_field').val( 'Course Key' );
	$('#key_field').focus( function() {
		if( $.trim( $('#key_field').val() ) == 'Course Key' ) {
			$('#key_field').removeClass( 'shaded' );
			$('#key_field').val('');
		}
	});
	
	$('#key_field').blur(function() {
		if( $.trim( $('#key_field').val() ).length == 0 ) {
			$("#key_field").addClass( 'shaded' );
			$('#key_field').val( 'Course Key' );
		}
	});
}

// display random background image
function rotateBg() {
	var bg_images = new Array();
	
	for( var i=1; i<7; i++ ){
		bg_images[i] = new Image();
		bg_images[i].src = "images/pages/home/home_bg" + i + ".jpg";
	}
	
	var num = Math.floor(Math.random()*6) + 1;
	
	$("#main").css("backgroundImage","url(" + bg_images[num].src + ")");
}

function imgRollovers() {
	var enter_over = new Image();
	enter_over.src = "images/pages/home/enter_btn_over.png";
	
	var login_over = new Image();
	login_over.src = "images/pages/home/login_btn_over.png";
	
	// in js/shared/template.js
	setRollover("#enter_btn", enter_over);
	setRollover("#home_login_btn", login_over);
}

// Execute these on document load
$(document).bind('ready', function() {
	setUpFields();
	rotateBg();
	imgRollovers();
	
	$('#activate_instructions, #key_field, #enter_btn').show();

	/* documentation at bottom of main code src: http://plugins.jquery.com/project/bt */
	$('#activate .showinfo').bt( $('#keyInfo').html(),  
								  {trigger: 'click', 
									closeWhenOthersOpen: true,
									padding: 10,
									width: 200,
									spikeLength: 0,
									cornerRadius: 7,
									fill: '#ffffff',
									strokeWidth: 1,
									strokeStyle: '#8b8a8a',
									cssStyles: {color: '#000'} } );
});
