var images=new Array();
var ready=false;

function start_scroll(){
	ready=false;
}
function end_scroll(id, image_number_change){
	$('scroller_image_number_'+id).innerHTML=$('scroller_image_number_'+id).innerHTML.toInt()+image_number_change.toInt();
	ready=true;
}
function scroll_forward(id, count, width){
	if(ready && $('scroller_image_number_'+id).innerHTML.toInt() < count){
		//check for dynamic image loading, the map property detail bubbles do not use it
		if(images[id]){
			//create the next image if it does not exist
			var next_image_num=$('scroller_image_number_'+id).innerHTML.toInt()+1;
			if(!$('image_'+id+'_'+next_image_num)){
				var new_img = document.createElement("img");
				new_img.setAttribute("id",'image_'+id+'_'+next_image_num);
				new_img.setAttribute("width","190");
				new_img.setAttribute("height","114");
				new_img.setAttribute("alt","Listing image");
				new_img.setAttribute("src",images[id][next_image_num]);
				$('image_scroll_'+id).appendChild(new_img);
			}
		}
		//then scroll
		var left=$('image_scroll_'+id).getStyle('left').toInt();
		$('image_scroll_'+id).effect('left',{
			duration: 500,
			transition: Fx.Transitions.Cubic.easeInOut,
			onStart: start_scroll,
			onComplete: end_scroll.pass([id, 1])
		}).start(left, left-width);
	}
}
function scroll_back(id, count, width){
	if(ready && $('scroller_image_number_'+id).innerHTML.toInt() > 1){
		var left=$('image_scroll_'+id).getStyle('left').toInt();
		$('image_scroll_'+id).effect('left',{
			duration: 500,
			transition: Fx.Transitions.Cubic.easeInOut,
			onStart: start_scroll,
			onComplete: end_scroll.pass([id, -1])
		}).start(left, left+width);
	}
}
window.addEvent('domready', function() {
	ready=true;
});
