The following script produces floating orbs on the screen, if Orb[i].renew==2 then Orb[i].Img.src should update. This property is set to 1 if the orb "bounces" off the screen, if it is set to 1, when it next leaves the screen it will be set to Orb[i].renew = 2. On each iteration of UpdateOrbs this value is tested and Orb[i].Img.src should update if Orb[i].renew==2. It does, but only occasionally. I at first thought it must be a scope problem, but if so, it should never update! Can anyone figure out what is happening? Here is the url
http://huduzu.trollnest.com
Code:
///////////////////////////////////////////////
// Thanks to the inspiration of thwacks! //
// evolve 14/06/2004 //
// http://www.mgifos.demon.co.uk //
// last evolved 15/06/2004 //
///////////////////////////////////////////////
var numOrbs=12; //number of Orbs
var InitialVelocity=1.5; //initial Orb speed
var Zeye; //perspective:distance of eye from box centre
var Zscreen; //perspective:distance of screen from box centre
var OrbBaseRadius
var OrbProximityFactor;
var Xmin,Ymin,Xmax,Ymax,Zmin,Zmax;
var Perspective;
var Dimensions=[];
var Orb=[];
function init(){
for(i=0;i<numOrbs;i++){
Orb[i]=[];
Orb[i].Img=new Element("img",{src:"./images/Orb.png"});
$("container").insert(Orb[i].Img);
OrbBaseRadius=25;
resize();
var theta;
Orb[i].PositionX=Xmax/2;
Orb[i].PositionY=Ymax/2;
Orb[i].PositionZ=Zmax*.6;
theta=Math.PI*2*Math.random();
phi=Math.asin(Math.random());
//if(Math.random()>0.5)phi=-phi;
Orb[i].VelocityX=InitialVelocity*Math.sin(theta)*Math.cos(phi);
theta=Math.PI*2*Math.random();
phi=Math.asin(Math.random());
if(Math.random()>0.5)phi=-phi;
Orb[i].VelocityY=InitialVelocity*Math.cos(theta)*Math.cos(phi);
theta=Math.PI*2*Math.random();
phi=Math.asin(Math.random());
phi=-phi;
Orb[i].VelocityZ=InitialVelocity*Math.cos(phi)*8;
Orb[i].renew=1;
}
setInterval("collisions()",50);
}
function collisions(){
/////////////////////////////////////////////////////////////
// Collision math
// Based on the fluid simulation by Peter Birtles //
// http://astronomy.swin.edu.au/pbourke/modelling/fluid/ //
// //
// Javascript conversion evolved January 2002 //
// 3D conversion and "energy leak" plugged 10/06/2004 //
/////////////////////////////////////////////////////////////
var i,q,Proximity,VelocityXa,VelocityYa,VelocityZa,VelocityXb,VelocityYb,VelocityZb,Xdisplacement,Ydisplacement,Zdisplacement,Xvector,Yvector,Zvector,m,ResultantTotal,Xresultant,Yresultant,Zresultant;
for(i=0;i<numOrbs;i++){
Perspective=(Zeye-Zscreen)/(Zeye-Orb[i].PositionZ);
Orb[i].size=OrbBaseRadius*Perspective;
OrbProximityFactor=4*Orb[i].size*Orb[i].size;
for(q=(i+1); q<numOrbs; q++){ //Note:The original iterated both a and b from 1 to numOrbs, skipping the a=b case
Proximity = (Orb[i].PositionX-Orb[q].PositionX)*(Orb[i].PositionX-Orb[q].PositionX)+(Orb[i].PositionY-Orb[q].PositionY)*(Orb[i].PositionY-Orb[q].PositionY)+(Orb[i].PositionZ-Orb[q].PositionZ)*(Orb[i].PositionZ-Orb[q].PositionZ);
if (Proximity < OrbProximityFactor){
Proximity = Math.sqrt(Proximity);
VelocityXi= Orb[i].VelocityX;VelocityYi=Orb[i].VelocityY;VelocityZi=Orb[i].VelocityZ;VelocityXq=Orb[q].VelocityX;VelocityYq=Orb[q].VelocityY;VelocityZq=Orb[q].VelocityZ;
Xdisplacement=Orb[q].PositionX-Orb[i].PositionX;
Ydisplacement=Orb[q].PositionY-Orb[i].PositionY;
Zdisplacement=Orb[q].PositionZ-Orb[i].PositionZ;
if (Math.abs(Proximity)>0.0001){
Xvector=Xdisplacement/Proximity;Yvector=Ydisplacement/Proximity;Zvector=Zdisplacement/Proximity;
m = Math.sqrt(VelocityXi*VelocityXi+VelocityYi*VelocityYi+VelocityZi*VelocityZi);
if (Math.abs(m)>0.0001){
TotalResultant = (Xvector*VelocityXi+Yvector*VelocityYi+Zvector*VelocityZi);
Xresultant=TotalResultant*Xvector;
Yresultant=TotalResultant*Yvector;
Zresultant=TotalResultant*Zvector;
VelocityXi -= Xresultant;
VelocityYi -= Yresultant;
VelocityZi -= Zresultant;
VelocityXq += Xresultant;
VelocityYq += Yresultant;
VelocityZq += Zresultant;
}
m = Math.sqrt(Orb[q].VelocityX*Orb[q].VelocityX+Orb[q].VelocityY*Orb[q].VelocityY+Orb[q].VelocityZ*Orb[q].VelocityZ);
if (Math.abs(m) >0.0001){
TotalResultant = (Xvector*Orb[q].VelocityX+Yvector*Orb[q].VelocityY+Zvector*Orb[q].VelocityZ);
Xresultant=TotalResultant*Xvector;
Yresultant=TotalResultant*Yvector;
Zresultant=TotalResultant*Zvector;
VelocityXi += Xresultant;
VelocityYi += Yresultant;
VelocityZi += Zresultant;
VelocityXq -= Xresultant;
VelocityYq -= Yresultant;
VelocityZq -= Zresultant;
}
Orb[i].VelocityX=VelocityXi;Orb[i].VelocityY=VelocityYi;Orb[i].VelocityZ=VelocityZi;Orb[q].VelocityX=VelocityXq;Orb[q].VelocityY=VelocityYq;Orb[q].VelocityZ=VelocityZq;
}
}
}
}
moveOrbs();
}
function moveOrbs(){
for(i=0;i<numOrbs;i++){
Orb[i].PositionX += Orb[i].VelocityX;
Orb[i].PositionY += Orb[i].VelocityY;
Orb[i].PositionZ += Orb[i].VelocityZ;
Perspective=(Zeye-Zscreen)/(Zeye-Orb[i].PositionZ);
Orb[i].size=OrbBaseRadius*Perspective;
if (Orb[i].PositionX<Xmin-(Orb[i].size*2)){
if(Orb[i].renew==1){
Orb[i].renew=2;
}
Orb[i].PositionX=Xmax+Orb[i].size;//wrap
}
if (Orb[i].PositionX>Xmax+(Orb[i].size*2)){
if(Orb[i].renew==1){
Orb[i].renew=2;
}
Orb[i].PositionX=Xmin-Orb[i].size*2;//wrap
}
//Orb[i].PositionY=Math.round(Orb[i].PositionY);
if (Orb[i].PositionY<Ymin-(Orb[i].size*2)){
if(Orb[i].renew==1){
Orb[i].renew=2;
}
Orb[i].PositionY=Ymax+Orb[i].size;//wrap
}
if (Orb[i].PositionY>Ymax+(Orb[i].size*2)){
if(Orb[i].renew==1){
Orb[i].renew=2;
}
Orb[i].PositionY=Ymin-Orb[i].size;//wrap
}
if (Orb[i].PositionZ<Zmin-(Orb[i].size)){
Orb[i].VelocityZ=-Orb[i].VelocityZ;//rebound
}
if (Orb[i].PositionZ>Zmax+(Orb[i].size)){
Orb[i].renew=1;
Orb[i].VelocityZ=-Orb[i].VelocityZ;//rebound
}
if (Orb[i].renew==2){
Orb[i].Img.src="./images/NewImage.png";
Orb[i].renew=0
}
Orb[i].Img.style.left=Orb[i].PositionX-Orb[i].size+'px';
Orb[i].Img.style.top=Orb[i].PositionY-Orb[i].size+'px';
Orb[i].Img.style.width=Orb[i].size*2+'px';
Orb[i].Img.style.height=Orb[i].size*2+'px';
Orb[i].Img.style.zIndex=-Orb[i].PositionZ;
Orb[i].Img.style.display='block';
}
}
function resize(){
if (window.innerWidth){ //if browser supports window.innerWidth
Dimensions.width=window.innerWidth;
Dimensions.height=window.innerHeight;
}
else if (document.all){ //else if browser supports document.all (IE 4+)
Dimensions.width=document.body.clientWidth;
Dimensions.height=document.body.clientHeight;
}
var styles={
left :'0px',
top :'0px',
height :Dimensions.height+'px',
width :Dimensions.width+'px',
zIndex :0
}
container.setStyle(styles);
Xmax=Dimensions.width;
Ymax=Dimensions.height;
Zmax=-Dimensions.width;
Xmin=0;
Ymin=0;
Zmin=0;
Zscreen=Zmax*.25;
Zeye=Zmax*1.25;
}
Before you post, read our: 
