//var effect = $('box').effect('background-color', {duration: 5000});
var periodical;
var my_periodical;
var count = 0;
var which_one = 'fol_1';
var propMod = propCount;
var propMod2 = propCount*2;
var maxCount = 200;
var propWait = 5000;
var colMod = propCount; //propCount-1;
var divLarge = 233;
var divSmall = 115;
var divWidth;

var propw;
var folioCtrl;
var folio2Ctrl;
var folio = false;
var featprop = 'feat_property';
var mask = 'mask';
folioCtrl = document.getElementById('folio');
if (folioCtrl) {
	folio2Ctrl = document.getElementById('folio_2');
	divWidth = divLarge;
	propw = propCount * divWidth;
} else {
	folioCtrl = document.getElementById('foliosmall');
	folio2Ctrl = document.getElementById('folio_2small');
	divWidth = divSmall;
	propw = propCount * divWidth;
	featprop += 'small';
	mask += 'small';
}
if (folioCtrl) {folioCtrl.style.width = propw + 'px';}
if (folio2Ctrl) {folio2Ctrl.style.width = propw + 'px';}
folio = (folioCtrl && folio2Ctrl);
var fx = function() {
	count = count+1;
	if(count%propMod==0)
	{
		which_one = 'fol_2';		
	}
	if(count%propMod2==0)
	{
		which_one = 'fol_1';
	}
	if(count==maxCount)
	{
		$clear(periodical);
	}
	slideFolio(count%propMod,which_one);
}

if (folio) {
periodical = fx.periodical(propWait); //5000

$(mask).addEvent("mouseenter", function(){
		$clear(periodical);
		
	});
        //this clears the periodical, and highlights the timer bar
	$(mask).addEvent("mouseleave", function(){
		//fx();
		periodical = fx.periodical(propWait);
	});
 
}

function slideFolio(col,this_one){

	var str = window.location+'';
	var mySplitResult = str.split("/");
	var my_url = mySplitResult[2];

	var i = document.getElementById(featprop);
	var right_width = i.offsetWidth; //height of side bit
	if(this_one=='fol_1')
	{
		var x = ((col)*-right_width);
		var y = ((col-colMod)*-right_width);
	}
	else if(this_one=='fol_2')
	{
		var y = ((col)*-right_width);
		var x = ((col-colMod)*-right_width);
	}
	var folioChange = new Fx.Style(folioCtrl, 'left', {duration:500});
	var folioChange_2 = new Fx.Style(folio2Ctrl, 'left', {duration:500});
	
	
	if(col==0)
	{
			//my_periodical = hide_me.periodical(500); //500
	}
	if(col==1)
	{
		if(this_one=='fol_1')
		{
			$(folio2Ctrl).setStyle('visibility', 'hidden');
			
			$(folioCtrl).setStyle('visibility', 'visible');
			//load all props into fol_2

		}
		else if(this_one=='fol_2')
		{
			$(folioCtrl).setStyle('visibility', 'hidden');
			$(folio2Ctrl).setStyle('visibility', 'visible');

			//load all props into fol_2

		}
	}
	if(col==2)
	{
		if(this_one=='fol_1')
		{
			$(folio2Ctrl).setStyle('visibility', 'visible');

		}
		else if(this_one=='fol_2')
		{
			$(folioCtrl).setStyle('visibility', 'visible');
		}
	}
	if(col==colMod)
	{
	//	fx();
		my_periodical = hide_me.periodical(0); //500
	
	}
	
	
	folioChange.start(x);	
	folioChange_2.start(y);	
	
}

var hide_me = function() {
	
	if(which_one=='fol_2')
	{
		$(folio2Ctrl).setStyle('visibility', 'hidden');

		$(folio2Ctrl).setStyle('visibility', 'visible');
		//load all props into fol_2

	}
	else if(which_one=='fol_1')
	{
		$(folioCtrl).setStyle('visibility', 'hidden');
		$(folio2Ctrl).setStyle('visibility', 'visible');

	}

	$clear(my_periodical);
	fx();
}

function dave(col){
//alert(col);
slideFolio(col);

}