var activeElm=0;
var maxPages=0;
var position=0;

function loadViewPager()
{
	 activeElm=0;
	 position=0;
	//screen.mozLockOrientation("portrait");
	//añadir controles	
	$(".page").each(function(i,e){
		var html="<a href='#p"+i+"' class='btn' style='font-size:120%;'>O</a>";
		$("#controls").append(html);
	});
	//inicializacion
	$($(".page").get()[0]).addClass("active");			
	maxPages=$(".page").get().length;
	//eventos botones
	$(".btn").each(function(i,e){
		$(this).click(function(evt)
		{				
			evt.preventDefault();				
			position=i;
			changePage(i);
		});
	});
	
	$("#ViewPager").swipeLeft(function() {
		if(position<maxPages-1)
		{
			position++;
			changePage(position);					
		}
	});
	$("#ViewPager").swipeRight(function() {
		if(position>0)
		{					
			position--;
			changePage(position);					
		}
	});

}

function changePage(i)
{
	var elm=$(".page").get()[i];
	var elmA=$(".page").get()[activeElm];
	$(elmA).removeClass("active");
	$(elm).addClass("active");
	activeElm=i;
}