//function autoFlowImage(page, num_colunms, colunm_height, colunm_width, startCol, contentDiv, targetDiv, styles, contentMenu, menuOnOff, prevNext, prevNextOffOn){

	/*******************************************************************
* Auto Flowing Text in Div Colunms SCRIPT 
* By Kyle Gillis (kyle at galvindesign.com)
* © 2008 Galvin Design Australia (http://www.galvindesign.com)
* This notice MUST stay intact for legal use
* Visit http://www.galvindesign.com 
*******************************************************************/

function autoFlowImage(page, num_colunms, colunm_height, colunm_width, startCol, contentDiv, targetDiv, styles, contentMenu, menuOnOff, prevNext, prevNextOffOn, hideThese, showThese, hilight, unhilight, nextImage, prevImage, image){ //, menuStartType
	//set the width of the content container.
	document.getElementById(contentDiv).style.width = colunm_width+'px';
	//make sure the contentDiv is showing
	document.getElementById(contentDiv).style.display = 'block';
	if(contentMenu != ''){
		document.getElementById(contentMenu).style.display = 'block';
	}
	if (hideThese != ''){
		// hide this if the menu is clicked
		var hideTheseArray = hideThese.split(','); 
		for (var i=0; i<hideTheseArray.length; i++) {
			//alert(hideTheseArray[i]);
			var hideEM = hideTheseArray[i];
			document.getElementById(hideEM).style.display = 'none';
		}
	}
	if (showThese != ''){
		// hide this if the menu is clicked
		var showTheseArray = showThese.split(','); 
		for (var i=0; i<showTheseArray.length; i++) {
			var showEM = showTheseArray[i];
			document.getElementById(showEM).style.display = 'block';
		}
	}
	
	if (hilight != ''){
		// hide this if the menu is clicked
		var hilightArray = hilight.split(','); 
		for (var i=0; i<hilightArray.length; i++) {
			var hideEM = hilightArray[i];
			if (hideEM != ''){
				document.getElementById(hideEM).className='menuCurrent';
			}
		}
	}
	if (unhilight != ''){
		// hide this if the menu is clicked
		var unhilightArray = unhilight.split(','); 
		for (var i=0; i<unhilightArray.length; i++) {
			var hideEM = unhilightArray[i];
			if (hideEM != ''){
				document.getElementById(hideEM).className='menu';
			}
		}
	}
	// total height of colunms to be displayed.
	var displayHeight = eval(num_colunms * colunm_height);
	// change current offsett to suite page..
	var setpage = page - 1;
		
	var currentOffset = displayHeight * setpage;
	var currentOffset = -currentOffset;
	/// if the start colunm is not 1.. re adjust start point..
	var startColunm = eval((startCol - 1) * colunm_height);
	var currentOffset = currentOffset + startColunm; 
	
	///get the content	
	var content = document.getElementById(contentDiv).innerHTML;
	// get colunm height
	var content_height = document.getElementById(contentDiv).offsetHeight;
	// hide colunm
	// how many colunms needed
	var howManyCols = content_height / colunm_height;
	// round up...
	var howManyColsRU = Math.ceil(howManyCols) + (startCol - 1); 
	//// write colunms & content
	for (i=0;i<num_colunms;i++){	
		var col_num = i + 1;
		// set the target name
		var new_col_name = targetDiv + '_' + col_num;
		var newDivs = '<div style="'+styles+' width:'+colunm_width+'px; height:'+colunm_height+'px; float:left; overflow:hidden;"><div id="'+new_col_name+'"></div></div>';

		document.getElementById(targetDiv).innerHTML += newDivs;
		
		// add content to target divs
		document.getElementById(new_col_name).innerHTML = content;
		// offset the top position.
		document.getElementById(new_col_name).style.marginTop = currentOffset + 'px';
		var currentOffset = currentOffset - colunm_height;
	}
	
	
	
//	if(menuStartType==1){
		
//	}
	
	
	// #### LOOP
	// previous next menu
	if (prevNextOffOn == 'yes'){
		// SET UP MENU TO PAGINATE
		// how many pages..
		///////////////////var paginate = '';
		var paginate = Math.ceil(howManyColsRU / num_colunms);
		// create menu items.
		document.getElementById(prevNext).innerHTML = '';
		//alert(paginate + ' ' + howManyColsRU);	
		if (paginate > 1){
			// write the menu
			
			if (page != paginate){
				var nextPage = page + 1;
				document.getElementById(prevNext).innerHTML += '<a href="#"  style="cursor:pointer;" onClick="autoFlowImage('+nextPage+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\', \''+nextImage+'\', \''+prevImage+'\', \''+image+'\');" '+thisselect+'>'+nextImage+'</a><br>';
			}else{
				var nextPage = 1;
				document.getElementById(prevNext).innerHTML += '<a href="#"  style="cursor:pointer;" onClick="autoFlowImage('+nextPage+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\', \''+nextImage+'\', \''+prevImage+'\', \''+image+'\');" '+thisselect+'>'+nextImage+'</a><br>';
			}
			if (page != 1){
				var prevPage = page - 1;
				document.getElementById(prevNext).innerHTML += '<a href="#"  style="cursor:pointer;" onClick="autoFlowImage('+prevPage+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\', \''+nextImage+'\', \''+prevImage+'\', \''+image+'\');" '+thisselect+'>'+prevImage+'</a><br>';
			}else{
				var prevPage = paginate;
				document.getElementById(prevNext).innerHTML += '<a href="#"  style="cursor:pointer;" onClick="autoFlowImage('+prevPage+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\', \''+nextImage+'\', \''+prevImage+'\', \''+image+'\');" '+thisselect+'>'+prevImage+'</a><br>';
			}
			
			
			
			
		}else{
			document.getElementById(prevNext).innerHTML += '<a href="#"  style="cursor:pointer;" onClick="autoFlowImage(1, '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\', \''+nextImage+'\', \''+prevImage+'\', \''+image+'\');" '+thisselect+'>'+image+'</a><br>';
		
		}
	}
	
	//## DONT LOOP
 //	// previous next menu
//	if (prevNextOffOn == 'yes'){
//		// SET UP MENU TO PAGINATE
//		// how many pages..
//		///////////////////var paginate = '';
//		var paginate = Math.ceil(howManyColsRU / num_colunms);
//		// create menu items.
//		document.getElementById(prevNext).innerHTML = '';
//		//alert(paginate + ' ' + howManyColsRU);	
//		if (paginate > 1){
//			// write the menu
//			if (page != paginate){
//				var nextPage = page + 1;
//				document.getElementById(prevNext).innerHTML += '<a  style="cursor:pointer;" onClick="autoFlowImage('+nextPage+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\');" '+thisselect+'>Next Image</a><br>';
//			}else{
//				document.getElementById(prevNext).innerHTML += 'Next Image<br>';
//			}
//			if (page != 1){
//				var prevPage = page - 1;
//				document.getElementById(prevNext).innerHTML += '<a  style="cursor:pointer;" onClick="autoFlowImage('+prevPage+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\');" '+thisselect+'>Previous Image</a><br>';
//			}else{
//				document.getElementById(prevNext).innerHTML += 'Previous Image';	
//			}
//		}else{
//			document.getElementById(prevNext).innerHTML += '<a  style="cursor:pointer;" onClick="autoFlowImage(1, '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\');" '+thisselect+'>Image</a><br>';
//		
//		}
//	}
	
		
	if (menuOnOff == 'yes'){
		// SET UP MENU TO PAGINATE
		// how many pages..
		///////////////////var paginate = '';
		var paginate = Math.ceil(howManyColsRU / num_colunms);
		if (paginate > 1){
			// create menu items.
			document.getElementById(contentMenu).innerHTML = '';
			///alert(paginate + ' ' + howManyColsRU);
			for (i=0;i<paginate;i++){
				var page_num = i + 1;
				// get current page
				if(page == page_num){
					var thisselect = 'class="menuCurrent"';
				}else{ 
					var thisselect = ''; 
				}
				// write the menu
				document.getElementById(contentMenu).innerHTML += '<a href="#" style="cursor:pointer;" onClick="autoFlowImage('+page_num+', '+num_colunms+', '+colunm_height+', '+colunm_width+',  '+startCol+', \''+contentDiv+'\', \''+targetDiv+'\', \''+styles+'\', \''+contentMenu+'\', \''+menuOnOff+'\', \''+prevNext+'\', \''+prevNextOffOn+'\', \''+hideThese+'\', \''+showThese+'\', \''+hilight+'\', \''+unhilight+'\', \''+nextImage+'\', \''+prevImage+'\', \''+image+'\');" '+thisselect+' >'+page_num+'</a> ';
			}
		}
	}
	//make sure the contentDiv is hidden
	document.getElementById(contentDiv).style.display = 'none';
}

