window.addEvent("domready",function(){
	var templates = $('templates-hide');
	var templatesWrap = $('list-templates');
	var extensions = $('extensions-hide');
	var extensionsWrap = $('list-extensions');
	var templateSelector = $('selector-templates');
	var extensionSelector = $('selector-extensions');
	var iframe = $('loader');
	var navbar = $('nav-bar');
	var mouseOverTemplates = false;
	var mouseOverExtensions = false;
	var tooltip = $('tooltip');
	var submenuFx = [];
	var submenuItems = $$('ul.submenu li');
	var mouseOverSubmenu = [];
	
	if(!window.opera){
		iframe.setStyle("height",(window.getHeight()-48)+"px");
	}else{
		iframe.setStyle("height",(navbar.getCoordinates().top)+"px");	
	}
	
	iframe.src = (toLoad != 'null') ? toLoad : $$('ul.thumbs li a')[0].href;
	
	templates.setStyle("left",templateSelector.getCoordinates().left - 1);
	extensions.setStyle("left",templateSelector.getCoordinates().left - 1);
	
	$$('.list-submenu').each(function(el,i){
		submenuFx[i] = new Fx.Tween(el,{duration:300});
		submenuFx[i].start("width",0);
		(function(){el.setProperty("class","list-submenu");}).delay(50);
		mouseOverSubmenu[i] = false; 
	});
	
	submenuItems.each(function(el,i){
		el.addEvent("mouseenter",function(){
			submenuFx.each(function(elm,j){
				if(j == i) {
					elm.start("width",242);
				}
				else{
					elm.start("width",0);
				} 
			});

			if(i == 0){
				$$('.list-submenu')[i].setStyle("left",el.getPosition().x + 50 + "px");
				$$('.list-submenu')[i].setStyle("top",($$('ul.submenu li')[0].getPosition().y-42)+"px");
			}else{
				$$('.list-submenu')[i].setStyle("left",el.getPosition().x + 50 + "px");
				$$('.list-submenu')[i].setStyle("top",($$('ul.submenu li')[0].getPosition().y+8)+"px");
			}
		});
		
		el.addEvent("mouseleave",function(){
			(function(){
		 		if(!mouseOverSubmenu[i]) submenuFx[i].start("width",0);
		 	}).delay(50);
		});
	});	

	$$('.list-submenu').each(function(el,i){
		el.addEvent("mouseenter", function(){
			mouseOverSubmenu[i] = true;
		});	
		
		el.addEvent("mouseleave", function(){
			mouseOverSubmenu[i] = false;
			submenuFx[i].start("width",0);
		});
	});
	
	/*$$('ul.submenu').addEvent("mouseleave",function(){
		mouseOverSubmenu.each(function(elm,i){
			if(!elm) submenuFx[i].start("width",0);
		});
	});*/
	
	var tmplFx = new Fx.Tween(templates,{duration:300,transition:Fx.Transitions.Quart.easeInOut});
	var extFx = new Fx.Tween(extensions,{duration:300,transition:Fx.Transitions.Quart.easeInOut});
	tmplFx.start("height",0);
	extFx.start("height",0);
	(function(){
		templates.removeProperty("class");
		extensions.removeProperty("class");		
	}).delay(100);
	
	templateSelector.addEvent("click", function(){
		if(!mouseOverTemplates){
			tmplFx.start("height",templatesWrap.getSize().y);
			mouseOverTemplates = true;
			extFx.start("height",0);
			mouseOverExtensions = false;
		}else{
			tmplFx.start("height",0);		
			mouseOverTemplates = false;
		}	
	});

	extensionSelector.addEvent("click", function(){
		if(!mouseOverExtensions){
			extFx.start("height",extensionsWrap.getSize().y);
			tmplFx.start("height",0);
			$$('.list-submenu').fireEvent("mouseleave");
			mouseOverExtensions = true;
			mouseOverTemplates = false;
		}else{
			extFx.start("height",0);	
			mouseOverExtensions = false;	
		}	
	});
	
	$$('ul.thumbs li a').each(function(el){
		el.getParent().addEvent("mouseenter", function(e){
			var tooltip_content = el.getParent().getElement(".unvisible")
			if(tooltip_content){ 
				tooltip.innerHTML = tooltip_content.innerHTML;
				tooltip.removeProperty("class");
				tooltip.setStyle("left",el.getPosition().x+100+"px");
				tooltip.setStyle("top",e.page.y-190+"px");	
			}
		});
	
		el.getParent().addEvent("mouseleave", function(e){	
			tooltip.setProperty("class","unvisible");
			tooltip.setStyle("left","-10000px");
		});
	});
	
	$$('ul.thumbs li a').each(function(el){
		el.getParent().addEvent("click", function(e){
			e.stop();
			iframe.src = el.getProperty("href");
			tmplFx.start("height",0);
			$$('.list-submenu').fireEvent("mouseleave");
			extFx.start("height",0);
			mouseOverTemplates = false;
			mouseOverExtensions = false;
		});
	});
	
	$$('#list-extensions a').each(function(el){
		el.getParent().addEvent("click", function(e){
			e.stop();
			iframe.src = el.getProperty("href");
			tmplFx.start("height",0);
			$$('.list-submenu').fireEvent("mouseleave");
			extFx.start("height",0);
			mouseOverTemplates = false;
			mouseOverExtensions = false;
		});
	});
	
	$(document.body).addEvent("click",function(e){
		if(e.target != templateSelector && e.target != extensionSelector){
			tmplFx.start("height",0);
			$$('.list-submenu').fireEvent("mouseleave");
			extFx.start("height",0);
			mouseOverTemplates = false;
			mouseOverExtensions = false;
		}
	});
});