//JavaScript Document
//Place functions within this document
//Call functions within the dom ready in the html page
var boxSlider = function(mask, boxheader, switchboxsx, switchboxdx, boxnav, n) {
	
	// count segments
	var count = 0;
	// get display width
	boxW = document.id(mask).getSize().x;
	// get number of divs in display
	numdiv = $$('.boxed').length;
	// check if slide has reached desierd  position
	var motiondone=true;
	// fuction you are here
	var youAreHere = new Fx.Tween($(boxheader), { 
		duration: 1000,
		transition: Fx.Transitions.Expo.easeOut ,
		
		//here are some events
		onStart: function(passes_tween_element){
				//these event will pass the tween object
				//so here we are applying the "highlight" effect
				//when the animation starts
				//passes_tween_element.highlight('#ff00ff');
				//alert(passes_tween_element+"????");
				motiondone = false;
				
		},
 
        //notice how the commas are consistent
        //between every option and event
        //and NO COMMA AFTER THE LAST option or event  
        onComplete: function(passes_tween_element){
                //and here we apply the highlight effect on complete
	        //passes_tween_element.highlight('#2c8cb5');
			motiondone = true;
		}

	});

	try{
		var curpage = document.id("div"+getId());
		if(curpage){
			var scrollto = document.id(mask).getPosition(curpage).x;
			// check if slide has reached desierd  position
			var motiondone=false;
			youAreHere.start('left', scrollto + 'px ');
		}
	}catch(e){
		
	}
//
	document.id(switchboxsx).addEvent('click', function() { 
		
		// increment count
		count--;
		// check if you are witin bounds
		if(count<0)count=numdiv-1;
		// output msg
		//msg($(boxheader).getPosition().x+"<-- box="+boxW+" count="+(count)).inject($('errmsg') , 'top');
		youAreHere.cancel();
		youAreHere.start('left', -count*boxW + 'px ');
		

	});
//
	document.id(switchboxdx).addEvent('click', function() { 
	
		// increment count
		count++;
		// check if you are witin bounds
		if(count>=numdiv)count=0;
		// output msg
		//msg($(boxheader).getPosition().x+"<-- box="+boxW+" count="+(count)).inject($('errmsg') , 'top');
		youAreHere.cancel();
		youAreHere.start('left', -count*boxW + 'px ');
		

	});
	
	function msg(str){
		var newElementVar = new Element('div', {
			//here you set all the element parameters
			'id': 'id_name',
			'text': str,
			'styles': {
				//here you set all the style parameters
				'background-color': '#eee',
				'float': 'left',
				'border': '1px solid red'
			}
		});
		return newElementVar;
	}
	
	// buttons
	//$(boxnav).getElements('img').each(navigateBox);
	
	// adds functionality to images
	function navigateBox(item){
		// show it is clickable
		item.setStyle('cursor', 'pointer');
		// add click event
		item.addEvent('click', function() { 
		
			// modifica il count delle immagini
			count = (this.get('class').replace('news',''));
			
			var id=this.get('id').replace('thumb','');
			var thisPos = $(boxheader).getPosition('box'+id).x;
			youAreHere.cancel();
			youAreHere.start('left', thisPos + 'px '); 
			
			
		})
		/* events ("start" / "stop") */
		item.addEvents({
			mouseenter: function() {
				//temporarily stop
				$clear(periodicalID);
			},
			mouseleave: begin
		});
	}
	
	// reset img style
	function resetStyle(item){
		item.setStyles({
			'border':'none'
		})
	}


	// reset img style
	function getId(){
		var item = 'id';
		
		var myURI = new URI(location.href);
		toString = myURI.toString();
		// $get(‘#’):
		myAnchor = myURI.get('fragment');
		// $get(’somevar’):
		myGetVar = myURI.get('data'); 
		
		return myGetVar[item];
	}
};