caz

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="André M and Mikkel Johnsen">
<meta name="Keywords" content="">
<meta name="Description" content="">
<!-- r = radius    der ligges en til Z, som på den måde repræsenterer tiden! hvor hurtigt det skal gå kommer an på Z's increment, time...-->
<script type="text/javascript">

var xcoord = 0;
var ycoord = 0;
function GetMouseXY(e)
 {
	if(!e) e=window.event;
	xcoord = e.clientX;
	ycoord = e.clientY;
}

function moveObject(id, r, x, y, z, time)
{
	// z = degree on circle where our cube starts... r = radius, x and y being starting coordinates, if these are not correct the first run-through will correct that. id is the name of our element for easy targetting.

	var obj = document.getElementById(id);
	obj.style.left = (x + xcoord) + 'px';
	obj.style.top = (y + ycoord) + 'px';

	if(z > 360) z = 0;
	z_temp = (2*Math.PI/360*z);
	x = Math.round(-r * Math.cos(z_temp));
	y = Math.round(r * Math.sin(z_temp));
	setTimeout('moveObject("'+id+'", '+ r +',' + x + ',' + y + ',' + (z+1) + ',' + time + ');', time);
}

function moveToLoc(id, now_x, now_y, t_loc_x, t_loc_y, speed, y, x, z)
{
	// now_yx = first location x y && t_loc_yx  = target location x y
	//Actually, speed == time, but speed describes it better!
	if (!x && !y)
	{
		var x = now_x;
		var y = now_y;
	}

	var object = document.getElementById(id);
	object.style.left = (Math.round(x)) + 'px';
	object.style.top = (Math.round(y)) + 'px';

	var dist = (Math.sqrt((t_loc_y - now_y) * (t_loc_y - now_y) + (t_loc_x - now_x) * (t_loc_x - now_x)));
	var z = (dist-(Math.sqrt((t_loc_y - y) * (t_loc_y - y) + (t_loc_x - x) * (t_loc_x - x)))+1);
	var move_y = ( (t_loc_y - now_y)/dist);
	var move_x = ( (t_loc_x - now_x)/dist);

	y = ((move_y * z)+now_y);
	x = ((move_x * z)+now_x);

	if (z>dist)
	{

	var temp = now_x;
	now_x = t_loc_x;
	t_loc_x = temp;

	temp = now_y;
	now_y = t_loc_y;
	t_loc_y = temp;
	}

	window.status="x:  " + x + "  y: " + y + "time:    "  + z + "   dist:  " + dist;
	setTimeout('moveToLoc("'+id+'",' + now_x + ',' + now_y + ',' + t_loc_x + ',' + t_loc_y + ',' + speed + ',' + y + ',' + x +');', speed);
}


function drawdddObject(idprefix, amount, size)
{
	var divObj = document.getElementById(idprefix+'0');
	if(!divObj)
	{
		for(var i=0; i<amount; i++)
		{
		var myObj = document.createElement('div');
		document.body.appendChild(myObj);
		myObj.id = (idprefix + '' + i); 
		myObj.style.height = size + 'px'; 
		myObj.style.width = size +'px'; 
		myObj.style.position = "absolute";
		myObj.style.border = "2px solid black";
		}
	}
}

function dddObject(idprefix, amount, size, r, Vx, Vy, Vz, time)
{
	
	if(Vz > 360) Vz = 0;
  // Converting to degrees! Doing Vz later, but we need it in the start of the next loop! So doing it there.
	Vy_temp = (2*Math.PI/360*Vy);
	Vx_temp = (2*Math.PI/360*Vx);

	
	for(var i = 0; i<amount; i++)
	{
		//Vz_temp skal defineres! 360 / amount så boxene kan spredes ud...
		// Men hvordan sørger man for at de så ikke også overskrider 360?

		if((360/amount * i + Vz)>360) Vz_i = ((360/amount*i+Vz)-360);
		else Vz_i = (360/amount*i+Vz);

		Vz_temp = (2*Math.PI/360*Vz_i);
		x = (r*Math.cos(Vz_temp)*Math.cos(Vy_temp));  // definition of our coords
		y = (r*Math.sin(Vz_temp)*Math.cos(Vx_temp));
		z = (Math.tan(Vx_temp)*y + Math.tan(Vy_temp)*x);

		var obj = document.getElementById(idprefix+i); // Time to change the position of that box before we move on!
		obj.style.left = (Math.round(x)+200)+'px';
		obj.style.top = (Math.round(y)+200)+'px';
		//document.write(z);
	}
	// x y & z coords defined by Vx Vy and Vz... I want Vz to be incrementing, Vy and Vx to be changed by mouse movement.
	// amount = split over 360 degrees of Vz.
	setTimeout('dddObject("' + idprefix + '", ' + amount + ',' + size + ',' + r + ',' + Vx + ',' + Vy + ',' + (Vz+1) + ',' + time ');', time);
}


function init()
{
	moveObject('Tank1', 100, 0, 0, 1, 25);
	moveToLoc('Tank', 55, 100, 65, 200, 15);
	drawdddObject('Moo', 12, 20);
	dddObject('Moo', 12, 20, 45, 0, 0, 5, 45);
	document.onmousemove = GetMouseXY;
}

</script>

</head>

<body onload=init()>
<!--<div id="Tank" style="position:absolute;border:2px solid black; height:2px;width:2px;"></div>-->
<table id="Tank" border="5" width="0px" height="0px" style="position:absolute">
<tr>
	<td>
	</td>
</tr>
</table>
<table id="Tank1" border="5" width="0px" height="0px" style="position:absolute">
<tr>
	<td>
	</td>
</tr>
</table>