var hintField = function(input_id, hint_css_class, blank_css_class){
	
	var input_field = YAHOO.util.Dom.get(input_id);
	if (!input_field) {
		return false;	
	}
	
    // FUNCTION TO BLANK A FIELD WHEN IT GETS FOCUS
    var blankField = function() {
    	YAHOO.util.Dom.removeClass(input_field, hint_css_class);
    	YAHOO.util.Dom.addClass(input_field, blank_css_class);
    }
    
    // FUNCTION TO SHOW HINT BACKGROUND IF EMAIL FIELD IS BLANK
    var hintField = function() {
    	YAHOO.util.Dom.addClass(input_field, hint_css_class);
    	YAHOO.util.Dom.removeClass(input_field, blank_css_class);
    }
	
	var changeField = function(){
		if (YAHOO.lang.isValue(input_field.value) && input_field.value.length > 0) {
			blankField();
		} else {
			hintField();
		}
	}
	    
    // LISTENERS
	YAHOO.util.Event.on(input_field, "focusin", blankField, this, true);
	YAHOO.util.Event.on(input_field, "focusout", changeField, this, true);
	
	// SET THE INITIAL SETTING
	changeField();
   
}

YAHOO.namespace("sg");
YAHOO.sg.NavDialog = function(){
	
	
	this.ajax_timeout = 5;
	
	var args = {
			"title"			:"",
			"div_hilight"	:"",
			"footer_txt"	:"",
			"footer_link"	:"",
			"content_txt"	:"",
			"content_url"	:""
	};
	
	this.openDialog = function(args2){
		
		// IF ANOTHER ONE IS OPEN, CLOSE IT
		if (this.dialog.cfg.getProperty('visible')) {
			this.closeDialog();
		}
		
		// NOTIFICATIONS
		if( YAHOO.lang.isObject(args2) && YAHOO.lang.isString(args2.type)){
			
			args.width				= '350px;';
			args.menu_position 		= 'tl'; // SET POSITION OF POPUP'S TOP-LEFT 
			args.anchor_position	= 'bl'; // SET OSITION OF POPUP'S TOP-LEFT TO ANCHOR'S BOTTOM-LEFT 
			args.offset				= [-1,-1];
			//if(YAHOO.lang.isValue(console)){
			//		console.log(args2);	
			//	}
			
			
			
			
			
			
			if(args2.type == 'notifications'){
				args.title 			= 'Notifications';
				args.div_hilight	= 'top-icons-notifications';
				args.footer_txt		= 'View all notifications';
				args.footer_link	= 'http://www.thefoat.com/fa/user_notifications';
				args.content_txt	= '<table><tr><td class="new">look! Static Notifications Content!</td></tr><tr><td>look! Static Notifications Content!</td></tr></table>';
				args.content_url	= window.location.protocol+'//'+window.location.hostname+'/fa/user_notifications-ajax_navlist';
				args.width			= "350px";
			}
			else if(args2.type == 'messages'){
				args.title 			= 'Messages';
				args.div_hilight	= 'top-icons-messages';
				args.footer_txt		= 'View all messages';
				args.footer_link	= 'http://www.thefoat.com/fa/messages';
				args.content_txt	= 'Please Wait...';
				args.content_url	= window.location.protocol+'//'+window.location.hostname+'/fa/user_messages-ajax_navlist';
				args.width			= "450px";
			}
			else if(args2.type == 'forums'){
				args.title 			= 'New posts in your forums';
				args.div_hilight	= 'top-icons-forums';
				args.footer_txt		= 'All FOAT Forums';
				args.footer_link	= 'http://forums.thefoat.com';
				args.content_txt	= '<div class="center"><img src="/images/lay2/icon_loading.gif" class="middle" style="margin:10px auto;"></div>';
				args.content_url	= window.location.protocol+'//'+window.location.hostname+'/fa/user_featured_forums-ajax_navlist';
				args.width			= "350px";
			}
			else if(args2.type == 'events'){
				args.title 			= 'My Events';
				args.div_hilight	= 'top-icons-events';
				args.footer_txt		= 'View all upcoming events';
				args.footer_link	= 'http://tickets.thefoat.com';
				args.content_txt	= '';
				args.content_url	= window.location.protocol+'//'+window.location.hostname+'/fa/user_events-ajax_navlist';
				args.width			= "550px";
			}
			else if(args2.type == 'commerce'){
				args.title 			= 'Tickets and Merchandise';
				args.div_hilight	= 'top-icons-commerce';
				args.footer_txt		= '';
				args.footer_link	= '';
				args.content_txt	= '<table>';
				args.content_txt	+= '<tr><td><a href="/fa/ticketbuy_host">Manage Tickets</a></td></tr>';				
				args.content_txt	+= '<tr><td><a href="/fa/merchandise_manager">Manage Merchandise</a></td></tr>';
				args.content_txt	+= '</table>';
				args.content_url	= null;
				//args.menu_position 		= 'tr'; // SET POSITION OF POPUP'S TOP-RIGHT 
				//args.anchor_position	= 'br'; // SET OSITION OF POPUP'S TOP-RIGHT TO ANCHOR'S BOTTOM-RIGHT 
				//args.offset				= [1,0];
				//args.width				= "200px";
			}
			else if(args2.type == 'account'){
				args.title 			= 'My Account';
				args.div_hilight	= 'links-account';
				args.footer_txt		= 'Full Control Panel';
				args.footer_link	= 'http://www.thefoat.com/fa/user';
				args.content_txt	= '<table>';
				args.content_txt	+= '<tr><td><a href="/fa/main-help">Help</a></td></tr>';				
				args.content_txt	+= '<tr><td><a href="/fa/user_profile-about">Edit Profile</a></td></tr>';
				args.content_txt	+= '<tr><td><a href="/fa/sg-user_settings-privacy">Privacy Settings</a></td></tr>';
				args.content_txt	+= '<tr><td><a href="/fa/sg-user_settings-email_notifications">Settings &amp; Options</a></td></tr>';
				args.content_txt	+= '<tr><td><a href="/?sg=user_wallet.main">Account Settings</a></td></tr>';
				args.content_txt	+= '<tr><td><a href="/fa/main-logout">Log Out</a></td></tr>';
				args.content_txt	+= '</table>';
				args.content_url	= null;
				args.menu_position 		= 'tr'; // SET POSITION OF POPUP'S TOP-RIGHT 
				args.anchor_position	= 'br'; // SET OSITION OF POPUP'S TOP-RIGHT TO ANCHOR'S BOTTOM-RIGHT 
				args.offset				= [1,0];
				args.width				= "200px";
			}
			else if(args2.type == 'general'){
				args = null;
				args = new Object;
				//args = Y.clone(args2, true);
				//YAHOO.lang.augment(args, args2);
				//args = args2.clone();
				//if(YAHOO.lang.isValue(console)){
				//	console.log(args);	
				//}
				for(i in args2){
					args[i] = args2[i];
				}
				
			}
			else{
				return false;
			}
		}else{
			alert('invalid menu found');	
			return false;
		}
		
		// WE HAVE TO MAKE SURE IT'S RENDERED BEFORE WE CAN MAKE CHANGES VIA CFG.SETPROPERTY
		this.dialog.render(document.body);
		
		// APPLY CHANGES
		if (YAHOO.lang.isValue(args.width)) {
			this.dialog.cfg.setProperty('width',args.width);
		}
		this.dialog.cfg.setProperty('context',[args.div_hilight, args.menu_position, args.anchor_position, false, args.offset ]);
		this.dialog.cfg.setProperty('zIndex',20);
		this.dialog.setHeader(args.title);
		if (YAHOO.lang.isValue(args.footer_link)) {
			this.dialog.setFooter('<span><a href="' + args.footer_link + '">' + args.footer_txt + '</a></span>');
		} else {
			this.dialog.setFooter('<span>' + args.footer_txt + '</span>');
		}
		if (YAHOO.lang.isValue(args.content_url)) {
			this.dialog.setBody('<div class="center"><img src="/images/lay2/icon_loading.gif" class="middle" style="margin:10px auto;"></div>');
		} else {
			this.dialog.setBody(args.content_txt);
		}
		if (YAHOO.lang.isValue(args.draggable)) {
			this.dialog.cfg.setProperty('draggable',args.draggable);
		}
		this.dialog.cfg.setProperty('modal',false);
		if (YAHOO.lang.isValue(args.modal)) {
			this.dialog.cfg.setProperty('modal',args.modal);
		}
		//this.dialog.show();
		YAHOO.lang.later(100, this, function(){ 
					//YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
					this.dialog.show();		
					// SET THE DIV_HILIGHT TO HILIGHTED
					YAHOO.util.Dom.addClass(args.div_hilight, 'nav-dialog-hilight');
					}, false, false);
		
		//if(YAHOO.lang.isValue(console)){
		//	console.log(this.dialog.cfg);	
		//}
		
		
		// ADD A MOUSE CLICK LISTENER TO AUTO CLOSE IF CLICKING OUTSIDE THE PANEL
		YAHOO.util.Event.addListener(document, 'mousedown', onDocumentMouseDown, null);
		
		// ON CLOSE, RESET THE DIV_HILIGHT TO NORMAL
		this.dialog.hideEvent.subscribe(function(e) {
			YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
		});
		
		// IF GETTING CONTENT VIA AJAX, GET AFTER IT.
		if (YAHOO.lang.isValue(args.content_url)) {
			this.getAjaxContent(args.content_url);
		}

		
	}
	this.closeDialog = function(){
		//usage: later ( when,  o,  fn,  data,  periodic )
		YAHOO.lang.later(200, this, function(){ 
					//YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
					this.dialog.hide();		
					}, false, false);
		//this.dialog.hide();	
		YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
	}
	
	this.dialog = new YAHOO.widget.Panel("navDialog", 
	{ 
		width: "350px",
		visible: false,
		draggable: false,
		close: true,
		text: args.title,
		icon: YAHOO.widget.SimpleDialog.ICON_HELP,
		constraintoviewport: true,
		modal:false,
		iframe: true,
		underlay:'shadow'//,
		//effect:{effect:YAHOO.widget.ContainerEffect.FADE, duration: 0.2}
	} );
    
	this.dialog.setHeader(args.title);
	
	this.dialog.render(document.body);	
	this.dialog.hide();
	
	// FUNCTION TO GET CONTENT FROM AJAX URL AND PLACE IT INTO THE DIALOG
	this.getAjaxContent = function(ajax_url){
			
		// IF WE ALREADY HAVE AN OPEN AJAX REQUEST, CLOSE IT
		if( YAHOO.lang.isValue(this.ajax_handle) && YAHOO.util.Connect.isCallInProgress(this.ajax_handle) ){
			YAHOO.util.Connect.abort(this.ajax_handle);
		}				
					
		// UNIQUE NAME
		var uniqueID = uniqid();	
		
		// start ajax request	
		this.ajax_handle = YAHOO.util.Connect.asyncRequest('GET', ajax_url, callback, false );
	}
	
	// CALLBACK FOR getAjaxContent(ajax_url)
	var callback =	{
		success: function(o) {
			if(o.responseText == ''){
				this.dialog.setBody('<div style="padding:10px;">Failure: Empty response.</div>');
				return false;
			}else{
				// MUST BE JSON RESPONSE
				try {
					var resp = YAHOO.lang.JSON.parse(o.responseText);  
				}
				catch(e) {	
					this.dialog.setBody('<div class="red" style="padding:10px;">Failure: Invalid Response.</div>');
					return false;
				}
				// If server said failure
				if(resp.success == 0){		
					// do nothing	
					this.dialog.setBody('<div id="navlist-errors" style="padding:10px;"></div>');
					display_errors('navlist-errors', resp.errors);
					
					return false;
					
				}else{			
				
				
					//waitingPanel.hide();
					if(YAHOO.lang.isObject(resp.customObj)){						
						var html = resp.customObj.html + '<div class="clear"></div>';
						this.dialog.setBody(html);
						
					}				
				}

			}
			
		},
		
		failure: function(o) {
		},
		timeout: 5000, // timeout after 5 seconds
		scope: this

		
	};
	
}
// WHEN THE DOM IS READY, INSTANTIATE THE NAVIGATION DIALOG
YAHOO.util.Event.onDOMReady(function(){
	window.navDialog = new YAHOO.sg.NavDialog();
	window.navDialog.dialog.render(document.body);	
});

// IS A MOUSE CLICK INSIDE THE NAV PANEL?
function isInsideNavPanel(clicked_element) {
	var current_element = clicked_element;
	while(current_element && current_element != document.body) {
		if (current_element == navDialog.dialog.element) {
			return true;
		}
		
		current_element = current_element.parentNode;
	}
	
	return false;
}
// LISTEN FOR CLICKS WHEN THE NAV PANEL IS OPENED
function onDocumentMouseDown(e) {
	if (navDialog.dialog.cfg.getProperty('visible')) {
		if (!isInsideNavPanel(e.target)) {
			setTimeout( 'navDialog.closeDialog()', 0);
			YAHOO.util.Event.removeListener(document, onDocumentMouseDown);
		}
	}
}









YAHOO.namespace("sg");
YAHOO.sg.PopDialog = function(){
	
	
	this.ajax_timeout = 5;
	
	var args = {
			"title"			:"",
			"div_hilight"	:"",
			"footer_txt"	:"",
			"footer_link"	:"",
			"content_txt"	:"",
			"content_url"	:""
	};
	
	this.openDialog = function(args2){
		
		// IF ANOTHER ONE IS OPEN, CLOSE IT
		if (this.dialog.cfg.getProperty('visible')) {
			this.closeDialog();
		}
		
		// NOTIFICATIONS
		if( YAHOO.lang.isObject(args2) && YAHOO.lang.isString(args2.type)){
			
			args.width				= '350px;';
			args.menu_position 		= 'tl'; // SET POSITION OF POPUP'S TOP-LEFT 
			args.anchor_position	= 'bl'; // SET OSITION OF POPUP'S TOP-LEFT TO ANCHOR'S BOTTOM-LEFT 
			args.offset				= [-1,-1];
			//if(YAHOO.lang.isValue(console)){
			//		console.log(args2);	
			//	}
			if(args2.type == 'general'){
				args = null;
				args = args2.clone();
				//if(YAHOO.lang.isValue(console)){
				//	console.log(args);	
				//}
				
			}
			else{
				return false;
			}
		}else{
			alert('invalid menu found');	

			return false;
		}
		
		// WE HAVE TO MAKE SURE IT'S RENDERED BEFORE WE CAN MAKE CHANGES VIA CFG.SETPROPERTY
		this.dialog.render(document.body);
		
		// APPLY CHANGES
		if (YAHOO.lang.isValue(args.width)) {
			this.dialog.cfg.setProperty('width',args.width);
		}
		this.dialog.cfg.setProperty('context',[args.div_hilight, args.menu_position, args.anchor_position, false, args.offset ]);
		this.dialog.cfg.setProperty('zIndex',20);
		this.dialog.setHeader(args.title);
		if (YAHOO.lang.isValue(args.footer_link)) {
			this.dialog.setFooter('<span><a href="' + args.footer_link + '">' + args.footer_txt + '</a></span>');
		} else {
			this.dialog.setFooter('<span>' + args.footer_txt + '</span>');
		}
		if (YAHOO.lang.isValue(args.content_url)) {
			this.dialog.setBody('<div class="center"><img src="/images/lay2/icon_loading.gif" class="middle" style="margin:10px auto;"></div>');
		} else {
			this.dialog.setBody(args.content_txt);
		}
		if (YAHOO.lang.isValue(args.draggable)) {
			this.dialog.cfg.setProperty('draggable',args.draggable);
		}
		this.dialog.cfg.setProperty('modal',false);
		if (YAHOO.lang.isValue(args.modal)) {
			this.dialog.cfg.setProperty('modal',args.modal);
		}
		this.dialog.show();
		
		//if(YAHOO.lang.isValue(console)){
		//	console.log(this.dialog.cfg);	
		//}
		
		// SET THE DIV_HILIGHT TO HILIGHTED
		YAHOO.util.Dom.addClass(args.div_hilight, 'nav-dialog-hilight');
		
		// ADD A MOUSE CLICK LISTENER TO AUTO CLOSE IF CLICKING OUTSIDE THE PANEL
		YAHOO.util.Event.addListener(document, 'mousedown', onDocumentMouseDown, null);
		
		// ON CLOSE, RESET THE DIV_HILIGHT TO NORMAL
		this.dialog.hideEvent.subscribe(function(e) {
			YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
		});
		
		// IF GETTING CONTENT VIA AJAX, GET AFTER IT.
		if (YAHOO.lang.isValue(args.content_url)) {
			this.getAjaxContent(args.content_url);
		}

		
	}
	this.closeDialog = function(){
		//usage: later ( when,  o,  fn,  data,  periodic )
		YAHOO.lang.later(200, this, function(){
					this.dialog.hide();		 
					YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
					}, false, false);
		//this.dialog.hide();	
		//YAHOO.util.Dom.removeClass(args.div_hilight, 'nav-dialog-hilight');
	}
	
	this.dialog = new YAHOO.widget.Panel("popDialog", 
	{ 
		width: "350px",
		visible: false,
		draggable: false,
		close: true,
		text: args.title,
		icon: YAHOO.widget.SimpleDialog.ICON_HELP,
		constraintoviewport: true,
		modal:false,
		iframe: true,
		underlay:'shadow'//,
		//effect:{effect:YAHOO.widget.ContainerEffect.FADE, duration: 0.2}
	} );
    
	this.dialog.setHeader(args.title);
	
	this.dialog.render(document.body);	
	this.dialog.hide();
	
	// FUNCTION TO GET CONTENT FROM AJAX URL AND PLACE IT INTO THE DIALOG
	this.getAjaxContent = function(ajax_url){
			
		// IF WE ALREADY HAVE AN OPEN AJAX REQUEST, CLOSE IT
		if( YAHOO.lang.isValue(this.ajax_handle) && YAHOO.util.Connect.isCallInProgress(this.ajax_handle) ){
			YAHOO.util.Connect.abort(this.ajax_handle);
		}				
					
		// UNIQUE NAME
		var uniqueID = uniqid();	
		
		// start ajax request	
		this.ajax_handle = YAHOO.util.Connect.asyncRequest('GET', ajax_url, callback, false );
	}
	
	// CALLBACK FOR getAjaxContent(ajax_url)
	var callback =	{
		success: function(o) {
			if(o.responseText == ''){
				this.dialog.setBody('<div style="padding:10px;">Failure: Empty response.</div>');
				return false;
			}else{
				this.dialog.setBody(o.responseText);
			
			}
			
		},
		
		failure: function(o) {
		},
		timeout: 5000, // timeout after 5 seconds
		scope: this

		
	};
	
}



// REWRITE QUANTITIES FIELD BASED ON PRODUCT ID AND VARIATIONS (GEAR STORE)
// - args[product_id, field_var1, field_var2, field_var3, field_quantities]
// requires window.product_quantities to be built server-side
var updateGearQuantities = function(product_id) {
	// REQUIRE PRODUCT ID AND FIELD ID OF QUANTITIES
	if (
		!YAHOO.lang.isValue(product_id)
		) {
		return false;
	}
	var field_id1 = "var_id1_" + product_id;
	var field_id2 = "var_id2_" + product_id;
	var field_id3 = "var_id3_" + product_id;
	var field_idq = "quantity" + product_id;
	var f1 = YAHOO.util.Dom.get(field_id1);
	var f2 = YAHOO.util.Dom.get(field_id2);
	var f3 = YAHOO.util.Dom.get(field_id3);
	var fq = YAHOO.util.Dom.get(field_idq);
	if (!fq) { 
		return false;	
	}
	var selectedIndex = fq.selectedIndex;
	var v1 = 0;
	var v2 = 0;
	var v3 = 0;
	if (f1) {
		v1 = intVal(f1.value);
	}
	if (f2) {
		v2 = intVal(f2.value);
	}
	if (f3) {
		v3 = intVal(f3.value);
	}
	
	if (YAHOO.lang.isValue(product_quantities)) {
		var k = product_id +'_'+ v1 +'_'+ v2 +'_'+ v3 ;
		var quantity = intVal(product_quantities[k]);
		fq.options.length = 0;
		
		// if none left in stock, say so
		if (quantity == 0) {
			fq.options[0] = new Option("Out of Stock", "0", true, true);
			return true;
		}
		fq.options[0] = new Option("Quantity", "0", false, false);
		for (var y=0; y < quantity; y++) { 
			x = y+1;
			if(x > 20) {
				break;	
			}
			is_selected = false;
			if(selectedIndex == x) {
				is_selected = true;	
			}
			fq.options[x] = new Option(x, x, false, is_selected);
	    } 
	}
}