var act_page = 1;

function initialize() {
	pagerProducts();
	goToPage(1);
}

function pagerProducts() {
	var pager_con = $('products_pager');
	var pager_con2 = $('products_pager2');
	var page_names = "";
	var page_names2 = "";
	var products = $$('#prodNav li');
	
	var page = 0;
	
	if(products.length > 3){
		if (act_page > 6){
			page_names2 += "<li class='prev'><a href='javascript: changePager(1)'> < </a></li>";
		}
		for (var i=0; i<products.length; i++) {
			if (i%3 == 0 && i < 18){
				page++;
				
				if(page == act_page){
					page_names += "<li class='page"+ page + " act'><a href='javascript: goToPage(" + page +")'>" + page +"</a></li>";
				}
				else {
					page_names += "<li class='page"+ page + "'><a href='javascript: goToPage(" + page +")'>" + page +"</a></li>";
				}
			} else if (i%3 == 0 && i >= 18){
				page++;
				
				if(page == act_page){
					page_names2 += "<li class='page"+ page + " act'><a href='javascript: goToPage(" + page +")'>" + page +"</a></li>";
				}
				else {
					page_names2 += "<li class='page"+ page + "'><a href='javascript: goToPage(" + page +")'>" + page +"</a></li>";
				}
			}
		}
		if (act_page <= 6 && page_names2 != ""){
			page_names += "<li class='next'><a href='javascript: changePager(2)'> > </a></li>";
		}
		pager_con.innerHTML = page_names;
		pager_con2.innerHTML = page_names2;
	}
}

function goToPage(cur_page){
	//remove classnames
	$$('#prodNav li').each(function (n){
		n.removeClassName("visible");
	});
	
	//add class visible to each product of current page
	for (var i = (cur_page * 3) - 3; i <= (cur_page * 3)-1; i++) {
		if($$('#prodNav li')[i] != undefined){
			$$('#prodNav li')[i].addClassName('visible');
		}
	}
	
	act_page = cur_page;
	
	// call it again for act-class
	pagerProducts();
}

function changePager(pager){
	if (pager == 1) {
		var pager_old = $('products_pager2');
		var pager_new = $('products_pager');
	} else if (pager == 2) {
		var pager_old = $('products_pager');
		var pager_new = $('products_pager2');
	}
	
	pager_new.addClassName("visible");
	pager_old.addClassName("realhidden");
	
	pager_new.removeClassName("realhidden");
	pager_old.removeClassName("visible");
	
	if (pager == 1) {
		goToPage(6);
	} else if (pager == 2) {
		goToPage(7);
	}
	
	
	
	// call it again for act-class
	pagerProducts();
}





Event.observe(window, 'load', initialize);

//document.observe('dom:loaded', initialize);