var t;

var directions=[[1,0],[0,1],[-1,0],[0,-1],[1,0],[1,-1],[-1,-1],[-1,1]];

function timedAnimator(div_id,direction_index)
{
var my_img;
var imgsrc_swap;
var x_pos,y_pos;
var child_img;
var str_op;
var retime = 40;

my_img=document.getElementById(div_id);

child_img = my_img.getElementsByClassName("clipped")[0];

x_pos = parseInt(child_img.style.left);
y_pos = parseInt(child_img.style.top);

if (x_pos!=0) x_pos +=directions[direction_index][0];
if (y_pos!=0) y_pos+=directions[direction_index][1];
x_pos=Math.round(x_pos*.96);
y_pos=Math.round(y_pos*.96);

if((x_pos==0)&&(y_pos==0))
{

   direction_index=Math.floor(directions.length*Math.random());
   if (direction_index>=directions.length) direction_index=0; //Catch any uncommon rounding errors
   
   x_pos=-directions[direction_index][0]*300;//my_img.width;
   y_pos=-directions[direction_index][1]*200;//my_img.height;
  
  imgsrc_swap = my_img.style.backgroundImage;
  str_op = child_img.src;
  str_op = str_op.slice(str_op.lastIndexOf("/")+1);
  my_img.style.backgroundImage="url('"+str_op+"')";//"url("+my_img.src+")";
  imgsrc_swap = imgsrc_swap.slice(imgsrc_swap.indexOf('"')+1,imgsrc_swap.lastIndexOf('"'));
  child_img.src=imgsrc_swap;
 
  retime = 3000;	//wait 5 seconds before 
}

child_img.style.left = x_pos+"px";
child_img.style.top = y_pos+"px";

t=setTimeout("timedAnimator('"+div_id+"',"+direction_index+")",retime);
}

// cycle through all elements of class 'clipwrapper' -
// load the url given in the 'alt' so it's pre-loaded !
// then call the animator with the appropriate parameters.

function animateImages()
{
var n,t_img,t;
var list_of_clips;
var child_img;

	list_of_clips = document.getElementsByClassName('clipwrapper');
	for(n=0;n<list_of_clips.length;n++)
	{
		child_img = list_of_clips[n].getElementsByClassName("clipped")[0];
		
		//document.write("alt="+child_img.alt+" ");
		
		list_of_clips[n].style.backgroundImage = "url('"+child_img.alt+"')";
		//document.write("clip_id="+list_of_clips[n].id);
		
		t=setTimeout("timedAnimator('"+list_of_clips[n].id+"',0)",40+n*600);
		child_img.style.left = "-"+child_img.width +"px";
		//document.write(".left=-"+child_img.width +"px");
		child_img.style.top = "0px";
	}
}

