// JavaScript Document
$(document).ready( function(){		//when the DOM is ready starting up
	kg_start();						//start the main function
} );

function kg_start(){				//the main function that starts the whole thing up
	this.settings	= new Object();
	this.settings.test			= false;
	this.settings.icons			= $('div.icons');
	this.settings.icon			= $('a.icon');
	this.settings.menu			= $('div.menu');
	this.settings.menuItems		= $('div.menu a.menu_item');
	this.settings.submenu		= $('div.submenu');
	this.settings.submenuItemsClassname	= 'submenu_item';
	this.settings.submenuItems			= $('div.' + settings.submenuItemsClassname);
	this.settings.submenuItemLinks		= $('div.' + settings.submenuItemsClassname + ' a.submenu_item_link');
	this.settings.content		= $('div.content');
	this.settings.references	= null;
	//this.settings.albums		= null;
	
	this.settings.submenuItems.hide();	//hiding all submenu items
	this.settings.submenu.hide();	//hiding all submenu items
	
	$('.album a').lightBox();			//making album
	init_icon();						//initiating icons
	init_menuitems();					//initiating menu items
	init_submenuitems();				//initiating submenu items
}

function init_icon(){					//this initiates the icons on the page
	settings.icon.html('');				//remove html/text content from icons
	settings.icon.each( function(index) {
	    $(this).attr('rel', $(this).attr('href'));
	    $(this).removeAttr('href');
	});
	settings.icon.click( function () { 					//click event observing on icon
		 var myPosition		= $(this).position();		//get event generator element position
		 icons_hide();
		 var href	= $(this).attr('rel');
		 load_content(href);
	});
	
}

function init_menuitems(){				//this initates the menu items
	
	settings.menuItems.click( function () { 			//click event observing on menu item
		var myPosition		= $(this).position();		//get event generator element position
		var mySubmenuRel	= $(this).attr('rel');		//getting the rel attribute
		var myMenuItem		= $(this);					//the menu item that generated the click event
		var mySubmenu		= $('div.submenu_item[rel|='+ mySubmenuRel +']');	//the related sub menu
		var mySubmenuPosition	= myPosition.left-15;							//this will be the position of the submenu
		if( mySubmenuPosition > $(window).width() - mySubmenu.width() ){		//check if the target submenu position is ok  
			mySubmenuPosition = $(window).width() - mySubmenu.width() - 15;		//correct the value
		}
		var founditem	= false;							//var showing a visible submenu
		settings.submenuItems.each(							//for each submenu
			function(index) {
			    if( $(this).attr('rel') != mySubmenuRel ){	//if the submenu is not related to the clicked menu
			    	if( $(this).css('display')!='none' ){	//if the submenu is visible
			    		founditem	= true;					//set value
			    		$(this).stop(true,false);			//stop all animations related to this submenu
			    		$(this).slideUp(					//hide the submenu by sliding it up
			    				//{ marginLeft: -500 }, 
			    				'fast',						//with fast speed
			    				function(){					//and after that execute function
			    					$(this).hide();			//hide the submenu - just to make sure?
			    					//settings.submenu.hide();
			    					//alert("hide submenu");
			    					
			    					mySubmenu.show();		//show the submenu related to the clicked menu 
			    					mySubmenu.css('marginLeft',-500);				//set left margin for the submenu
			    					//var thisTopmargin	= mySubmenu.height()*(-1);	//calculate top margin for the submenu
			    					//var thisTopmargin	= 0;						//calculate top margin for the submenu
			    					//mySubmenu.css('marginTop',thisTopmargin);		//set the top margin for the submenu
			    					//var bottomPosition	= 399;
			    					//mySubmenu.css('bottom',bottomPosition);		//set the bottom for the submenu
			    					mySubmenu.animate(								//show the apropriate submenu
			    							{ marginLeft: mySubmenuPosition }, 		//change the left marging
			    							'slow'									//using slow animation speed
			    							)
			    				}
			    		);
			    	}
			    }
			}
		);
		if (!founditem && mySubmenu.css('display')=='none' ){	//if no visible submenu was found
			settings.submenu.show();
			mySubmenu.show();									//show submenu related to the clicked menu
			mySubmenu.css('marginLeft',-500);					//change the left margin of submenu
			//var thisTopmargin	= mySubmenu.height()*(-1);		//calculate the top margin
			//mySubmenu.css('marginTop',thisTopmargin);			//change the top margin
			mySubmenu.animate(									//animate the submenu
					{ marginLeft: mySubmenuPosition }, 			//change the left margin
					'slow'										//using slow animation speed
					)
		}
		
	});
	
	
	/*settings.menuItems.live("click", 
		function() { 
			$(this).stop(true,false).slideUp();
		} 
	);*/
	
}


function init_submenuitems(){
	//settings.submenu.css( 'margin-top', (-1)*settings.menu.height() );  // no need to set the place of the submenu
	settings.submenuItemLinks.each( function(index) {
	    //alert(index + ': ' + $(this).text());
	    $(this).attr('rel', $(this).attr('href'));
	    $(this).removeAttr('href');
	});
	settings.submenuItems.mouseleave( function () { 	//click event observing on icon
		// $(this).stop(true,true).slideUp();
	});
	settings.submenuItems.click( function () { 			//click event observing on icon
		 $(this).stop(true,false).slideUp(
		 	'fast',
		 	function() {
		 		settings.submenu.hide();
		 	}
		 );
		 
	});
	settings.submenuItemLinks.click( function () { 		//click event observing on icon
		icons_hide();
		$(document).attr('title', 'Kilin Gyöngyi - make-up artist' + ' - ' + $(this).html() );
		var href	= $(this).attr('rel');
		load_content(href); 
	});
}

function reference_expand(item){
	item.stop();
	item.animate(
		{ width: '300px' }, 						//change the width
		'slow'										//using slow animation speed
	)
}

function reference_collapse(item){
	item.stop();
	item.animate(
		{ width: '125px' }, 						//change the width
		'slow'										//using slow animation speed
	)
}

function init_references(){					//this initiates the reference icons on the page
	settings.references	= $('div.references[rel|=reference_icons] div.content_reference');	//select reference icons
	settings.references.css('width', 125);
	
	settings.references.click( function () { 					//click event observing on icon
		 var myPosition		= $(this).position();		//get event generator element position	 
	});
	
	settings.references.mouseover( function () { 		//mouseover event observing on icon
		reference_expand( $(this) );	 
	});
	settings.references.mouseout( function () { 		//mouseleave event observing on icon
		reference_collapse( $(this) );	 
	});
	
}

function init_albums(){						//this initiates the albums on the page
	$('div.album a').lightBox();			//create lightbox if needed
}

function icons_hide(){
	settings.icons.stop(true,false);
	settings.icons.animate(
		{
			marginLeft: -1000
		},
		'slow',
		function(){
			settings.icons.hide();
			menu_moveup();
		}
	)
	
}


function menu_moveup(){
	settings.menu.stop(true,false);
	settings.menu.animate(
		{ 
			marginTop: -180
		},
		'slow'
	);
	content_moveup();
	submenu_moveup();
}

function submenu_moveup(){
	settings.submenu.stop(true,false);
	settings.submenu.css('marginTop', -180);
}

function content_moveup(){
	settings.content.stop(true,false);
	settings.content.animate(
		{ 
			marginTop: -180
		},
		'slow'
	);
}

function show_content(){
	
}

function move_content(){
	
}

function hide_homelinks(){
	homelink	= $("a.home");
	homelink.css('display','none');
}

function load_content(href){
	$.ajax({
	  url: href,
	  cache: false,
	  success: function(html){
	    settings.content.html(html);
	    //hide home links
	    hide_homelinks();
	    //init_references();
	    init_albums();
	  }
	});
}