new Event.observe(window, 'load', initJnesisMenu);

var previousDisplayedContent = null;
var currentDisplayedContent = null;
var protoFlow = null;
var protoFlowId = 'protoflow';

function initJnesisMenu()
{

	var linkElts = $$('#competences li a');
	for(var i=0; i<linkElts.length; i++)
	{
		linkElts[i].parentNode.hoverToken=0;
		new Event.observe(linkElts[i].parentNode, 'mouseout', linkEltOut);
		new Event.observe(linkElts[i], 'mouseover', linkEltIn);

	}

	var contentElts = $$('div.mini-content');
	for(var i=0; i<contentElts.length; i++)
	{
		if(contentElts[i].readAttribute('id')!="logo" /*&& contentElts[i].readAttribute('id')!="protoflow"*/)
		{
			contentElts[i].style.display='none';			
		}
		contentElts[i].style.marginLeft='0';
	}	

}

function initProtoFlow()
{
    if(protoFlow == null)
    {
        protoFlow = new ProtoFlow($(protoFlowId), {
                startIndex: 2,  //which image do you want the flow
                                                //to focus on by default
                slider: true,   //show or hide slider?
                captions: true, //show or hide captions, by default we hide it. 
                                //So YOU MUST turn it on here
                useReflection: false,   //Add reflection to your images. Please 
                                //note that this will slow down rendering.
                enableOnClickScroll: false //add NEW! if you wish to keep scrolling 
                                //on click just set this to be true 
        });    

    }
}

function updateProtoFlow()
{
    if(protoFlow == null)
    {
	initProtoFlow();
    }
    else
    {
	protoFlow.goTo(protoFlow.currIndex);
	protoFlow.updateSlider(protoFlow.currIndex);
    }
}

function linkEltIn()
{
	if(currentDisplayedContent == null)
	{
		//new Effect.Fade($("logo"),{});
		new Effect.Opacity($('logo'),{ from: 1.0, to: 0.1});
	}
	var id=Element.readAttribute(this,"href");
	if($$(id)[0] != currentDisplayedContent)
	{
		previousDisplayedContent = currentDisplayedContent;		
		fadeContent();

		//if this is gallery, we init protoflow
		if(id=="#web2")
		{
		    new Effect.Appear($$(id)[0],{duration:0.5, afterFinish:updateProtoFlow});
		}
		else
		{
		    new Effect.Appear($$(id)[0],{duration:0.5});
		}
		currentDisplayedContent = $$(id)[0];
	}
}

function linkEltOut()
{
	new Effect.Highlight(this,{ startcolor:'#CADB2A',endcolor:'#ffffff', restorecolor:'#ffffff' });	
}

function fadeContent()
{
	if(previousDisplayedContent != null)
	{
		//fade previous displayed content
		new Effect.Fade(previousDisplayedContent,{duration:0.5});	
	}
	else
	{
		//move pictos on the right
		var forceElts = $$('#forces li');
		for(var i=0; i<forceElts.length; i++)
		{
			forceElts[i].morph('width:94px;');
		}
	}
}