var X=0;
var Y=0;
var targetX=0;
var targetY=0;
var dx=5;
var dy=5;
var startfly;
var bflydir="../img/butterfly/";
var piclayer;

var NS4 = (navigator.appName.indexOf("Netscape")>=0 && parseFloat(navigator.appVersion) >= 4 && parseFloat(navigator.appVersion) < 5)? true : false;
var IE4 = (window.parent.document.all)? true : false;
var NS6 = (parseFloat(navigator.appVersion) >= 5 && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var wind_w, wind_h, t='';


function getRandomButterfly(){
var indx = Math.floor(Math.random()*12);
//6,9,12 - bad
//alert(indx);
return bflydir+"bfly"+indx+".gif";
}

t+=(NS4)?'<layer name="pic" visibility="hide" width="10" height="10"><a href="javascript:hidebutterfly()">' : '<div id="pic" style="position:absolute; visibility:hidden;width:10px; height:10px"><a href="javascript:hidebutterfly()">';
t+='<img src="'+getRandomButterfly()+'" id="p0" border="0">';
t+=(NS4)? '</a></layer>':'</a></div>';

document.write(t);

function getid(name){
if(NS4)return document.layers[name];
if(IE4)return document.all[name];
if(NS6)return document.getElementById(name);
}

function moveidto(x,y){
if(NS4)piclayer.moveTo(x,y);
if(IE4 || NS6){
piclayer.style.left=x+'px';
piclayer.style.top=y+'px';
}
}

function init(){
piclayer=getid('pic');
if(NS4){
piclayer.W=piclayer.document.images["p0"].width;
piclayer.H=IDs[i].document.images["p0"].height;
}
if(NS6 || IE4){
piclayer.W=document.images["p0"].width;
piclayer.H=document.images["p0"].height;
}
X = Math.floor(getwindowwidth()/2);
Y = Math.floor(getwindowheight()/2);
piclayer.style.top=Y;
piclayer.style.left=X;
targetX = measureLeft(document.getElementById("back"))+60; 
targetY = measureTop(document.getElementById("back"))+5; 
dx = Math.floor((targetX-X)/20);
dy = Math.floor((targetY-Y)/20);
}

function showbutterfly(){
	if (NS4||NS6||IE4){
		if(NS4)piclayer.visibility = "show";
		if(IE4 || NS6) piclayer.style.visibility = "visible";
		startfly = setInterval("move()",Math.floor(Math.random()*100)+100);
	}
}

function hidebutterfly(){
if (IE4)
  eval("document.all.pic.style.visibility='hidden'");
else if (NS6)
  document.getElementById("p0").style.visibility='hidden';
else if (NS4)
  eval("document.pic.visibility='hide'");
clearInterval(startfly);
}

function move()
{
	X=X+dx //+ Math.floor(Math.random()*10);
	Y=Y+dy //+ Math.floor(Math.random()*10);
	if(checkbound())
		moveidto(X,Y);	
}

//check the boundary and bounce it back when the image out of the area
function checkbound()
{
	if( ( X > targetX ) && ( Y > targetY ) ){
		clearInterval(startfly);
    X = Math.floor(getwindowwidth()/2);
    Y = Math.floor(getwindowheight()/2);
    return false;
  }
  return true;
}

function measureLeft(oElement){
var iLeft = oElement.offsetLeft;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iLeft += oParent.offsetLeft;
oParent = oParent.offsetParent;
}
return iLeft;
}

function measureTop(oElement){
var iTop = oElement.offsetTop;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iTop += oParent.offsetTop;
oParent = oParent.offsetParent;
}
return iTop;
}

function getwindowwidth(){
if(NS4 || NS6)return window.innerWidth;
if(IE4)return document.body.clientWidth;
}

function getwindowheight(){
if(NS4 || NS6)return window.innerHeight;
if(IE4)return document.body.clientHeight;
}