Библиотека Javascript. SE@RCHER

<html> <head> <title>Игра. Подсчет плавающих шариков</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/> </head> <body bgcolor="#FFFFFF" text="#000000"> <script> var floatingspeed=2 var trynumbernew=0 var trynumberold=0 var skinwidth=228 var skinheight=150 var tempo=20 var guessmodus=false var timer var timetimer var timerwrong var timmercorrect var timerstart var timecolor="#000000" var gamemaxseconds=30 var stopit=false var starttime var nowtime=0 var penalty=0 var penaltyseconds=1 var dotsmax=16 var dotsrandom=5 var correctdots=dotsrandom+1 var correctanswers=0 var hits=0 var stepx=new Array() var stepy=new Array() for (i=0;i<=dotsmax;i++) { stepx[i]=randomspeed(floatingspeed) stepy[i]=randomspeed(floatingspeed) } var marginleft=37 var marginright=109 var margintop=50 var marginbottom=105 var spancontent=new Array() var imgpreload=new Image imgpreload.src="dot.gif" var browserinfos=navigator.userAgent var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/) var ns6=document.getElementById&&!document.all var opera=browserinfos.match(/Opera/) var browserok=ie5||ns6||opera for (i=0;i<=dotsmax;i++) { spancontent[i]="<img src='dot.gif'>" } function positiongame() { document.getElementById("quickeyeskin").style.visibility="visible" for (i=0;i<=dotsmax;i++) { document.getElementById("d"+i).style.visibility="visible" } } function guess(thisno) { if (nowtime<gamemaxseconds && guessmodus) { guessmodus=false if (thisno==correctdots) { correctanswers++ var resultbarwidth=correctanswers*4 document.getElementById("resultbar").innerHTML="<table border=0 cellpadding=0 cellspacing=0><tr valign=top><td align=left><img src='transparent.gif' width="+resultbarwidth+" height=5></td></tr></table>" document.getElementById("resultboard").innerHTML="<table width=80 height=62 border=0 cellpadding=2 cellspacing=0 bgcolor=green><tr valign=middle><td align=center><font face=Arial size=1 color=white>CORRECT</font></td></tr></table>" document.getElementById("resultboard").style.visibility="visible" trynumberold=trynumbernew clearTimeout(timerwrong) timercorrect=setTimeout("nextguess()",500) } else { penaltyseconds++ document.getElementById("resultboard").innerHTML="<table width=80 height=62 border=0 cellpadding=2 cellspacing=0 bgcolor=red><tr valign=middle><td align=center><font face=Arial size=1 color=white>WRONG.<br>Correct: "+correctdots+"<br>Penalty: "+penaltyseconds+" sec.</font></td></tr></table>" document.getElementById("resultboard").style.visibility="visible" penalty=(penaltyseconds*1000) trynumberold=trynumbernew timerwrong=setTimeout("nextguess()",penalty) } } } function startgame() { trynumbernew++ stopit=false guessmodus=true timecolor="000000" hideresultboard() startnewtime() setdots() } function stopgame() { clearTimeout(timerstart) stopit=true penalty=1 document.getElementById("resultbar").innerHTML="" document.getElementById("resultboard").innerHTML="<table width=80 height=62 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center bgcolor=black><font face=Arial size=1 color=white>New game</font></td></tr></table>" document.getElementById("resultboard").style.visibility="visible" document.getElementById("timesign").innerHTML="<font size=1 face=Arial color=black>30.00</font>" document.getElementById("timesign").style.visibility="visible" document.getElementById("hall").style.visibility="hidden" document.hallform.result.value=0 guessmodus=false nowtime=0 penaltyseconds=1 correctanswers=0 timerstart=setTimeout("startgame()",600) } function nextguess() { if (nowtime<gamemaxseconds && trynumbernew==trynumberold) { guessmodus=true hideresultboard() setdots() } } function hideresultboard() { document.getElementById("resultboard").style.visibility="hidden" } function startnewtime() { starttime= new Date() starttime=starttime.getTime() checktime() } function setdots() { dotsrandom=randommaker(dotsmax) correctdots=dotsrandom+1 for (i=0;i<=dotsmax;i++) { document.getElementById("d"+i).style.visibility="hidden" } for (i=0;i<=dotsrandom;i++) { document.getElementById("d"+i).innerHTML=spancontent[i] var randomposleft=marginright-marginleft var randompostop=marginbottom-margintop document.getElementById("d"+i).style.left=randommaker(randomposleft)+marginleft document.getElementById("d"+i).style.top=randommaker(randompostop)+margintop document.getElementById("d"+i).style.visibility="visible" } checkmovement() } function randomspeed(range) { rand=Math.floor(range*Math.random()) if (rand==0) {rand=Math.ceil(range/2)} return rand } function randommaker(range) { var randomposition=Math.floor(range*Math.random()) return randomposition } function checkmovement() { if (guessmodus && nowtime<gamemaxseconds && stopit==false) { checkposition() movepictures() timer=setTimeout("checkmovement()",tempo) } else { clearTimeout(timer) for (i=0;i<=dotsmax;i++) { document.getElementById("d"+i).style.visibility="hidden" document.getElementById("d"+i).style.left=marginleft document.getElementById("d"+i).style.top=margintop } } } function movepictures() { for (i=0;i<=dotsrandom;i++) { document.getElementById("d"+i).style.left=parseInt(document.getElementById("d"+i).style.left)+stepx[i] document.getElementById("d"+i).style.top=parseInt(document.getElementById("d"+i).style.top)+stepy[i] } } function checkposition() { for (i=0;i<=dotsrandom;i++) { var posleft=parseInt(document.getElementById("d"+i).style.left) var postop=parseInt(document.getElementById("d"+i).style.top) if (posleft>marginright) { document.getElementById("d"+i).style.left=parseInt(document.getElementById("d"+i).style.left)-Math.abs(stepx[i]) stepx[i]=randomspeed(floatingspeed)*-1 } if (posleft<marginleft) { document.getElementById("d"+i).style.left=parseInt(document.getElementById("d"+i).style.left)+Math.abs(stepx[i]) stepx[i]=randomspeed(floatingspeed) } if (postop>marginbottom) { document.getElementById("d"+i).style.top=parseInt(document.getElementById("d"+i).style.top)-Math.abs(stepy[i]) stepy[i]=randomspeed(floatingspeed)*-1 } if (postop<margintop) { document.getElementById("d"+i).style.top=parseInt(document.getElementById("d"+i).style.top)+Math.abs(stepy[i]) stepy[i]=randomspeed(floatingspeed) } } } function checktime() { if (nowtime<gamemaxseconds && stopit==false) { nowtime=new Date() nowtime=nowtime.getTime() nowtime=(nowtime-starttime)/1000 var countdown=gamemaxseconds-nowtime countdown=Math.floor(countdown*100)/100 if (countdown<0) {countdown=0} document.getElementById("timesign").innerHTML="<font size=1 face=Arial color="+timecolor+">"+countdown+"</font>" timetimer=setTimeout("checktime()",100) } else if (stopit==true) { clearTimeout(timetimer) for (i=0;i<=dotsmax;i++) { document.getElementById("d"+i).style.visibility="hidden" } } else { clearTimeout(timetimer) endgame() } } function endgame() { timecolor="000000" if (correctanswers<=10) { document.getElementById("resultboard").innerHTML="<table width=80 height=132 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center bgcolor=red><font face=Arial size=1 color=white>Game over.<br>Correct: "+correctanswers+"<br><br>Not good enough for our hall of fame<br><br>Try again.</font></td></tr></table>" document.getElementById("resultboard").style.visibility="visible" document.getElementById("timesign").innerHTML="" } else { document.getElementById("resultboard").innerHTML="<table width=80 height=132 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center bgcolor=red><font face=Arial size=1 color=white>Game over.<br>Correct answers: "+correctanswers+"</font></td></tr></table>" document.getElementById("resultboard").style.visibility="visible" document.getElementById("timesign").innerHTML="" pophalloffame() } } function pophalloffame() { document.getElementById("hall").style.visibility="visible" document.hallform.result.value=correctanswers } function hidehalloffame() { document.getElementById("hall").style.visibility="hidden" } function submithalloffame() { document.getElementById("hall").style.visibility="hidden" document.hallform.submit() } function ov(thisleft,thistop) { document.getElementById("l").style.left=thisleft document.getElementById("l").style.top=thistop document.getElementById("r").style.left=thisleft+17 document.getElementById("r").style.top=thistop document.getElementById("t").style.left=thisleft document.getElementById("t").style.top=thistop document.getElementById("b").style.left=thisleft document.getElementById("b").style.top=thistop+12 } function ou() { document.getElementById("l").style.left=0 document.getElementById("l").style.top=0 document.getElementById("r").style.left=0 document.getElementById("r").style.top=0 document.getElementById("t").style.left=0 document.getElementById("t").style.top=0 document.getElementById("b").style.left=0 document.getElementById("b").style.top=0 } document.close() if (browserok) { onload=positiongame } </script> <div id="roof" style="position:relative;width:152;height:230;overflow:hidden"> <div id="quickeyeskin" style="position:absolute;visibility:hidden;left:0px;top:0px"> <IMG SRC="skin.gif" USEMAP="#skin" BORDER=0> <MAP NAME="skin"> <AREA SHAPE=RECT COORDS="34,115,51,127" HREF="javascript:guess('1')" onMouseOver="ov(34,115)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="55,115,72,127" HREF="javascript:guess('2')" onMouseOver="ov(55,115)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="76,115,93,127" HREF="javascript:guess('3')" onMouseOver="ov(76,115)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="97,115,114,127" HREF="javascript:guess('4')" onMouseOver="ov(97,115)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="34,132,51,144" HREF="javascript:guess('5')" onMouseOver="ov(34,132)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="55,132,72,144" HREF="javascript:guess('6')" onMouseOver="ov(55,132)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="76,132,92,143" HREF="javascript:guess('7')" onMouseOver="ov(76,132)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="97,132,113,143" HREF="javascript:guess('8')" onMouseOver="ov(97,132)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="34,149,51,161" HREF="javascript:guess('9')" onMouseOver="ov(34,149)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="55,149,72,160" HREF="javascript:guess('10')" onMouseOver="ov(55,149)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="77,149,92,161" HREF="javascript:guess('11')" onMouseOver="ov(76,149)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="97,149,114,161" HREF="javascript:guess('12')" onMouseOver="ov(97,149)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="34,166,51,178" HREF="javascript:guess('13')" onMouseOver="ov(34,166)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="55,166,72,178" HREF="javascript:guess('14')" onMouseOver="ov(55,166)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="77,166,93,178" HREF="javascript:guess('15')" onMouseOver="ov(76,166)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="98,166,113,178" HREF="javascript:guess('16')" onMouseOver="ov(97,166)" onMouseOut="ou()"> <AREA SHAPE=RECT COORDS="76,184,113,194" HREF="javascript:stopgame()"> </MAP> </div> <div id="d0" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d1" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d2" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d3" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d4" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d5" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d6" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d7" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d8" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d9" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d10" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d11" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d12" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d13" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d14" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d15" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="d16" style="position:absolute;left:0px;top:-5px;visibility:hidden"><img src="dot.gif"></div> <div id="resultboard" style="position:absolute;left:35px;top:48px;visibility:hidden"><table width=80 height=60 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center><font face=Arial size=1 color=000000>Click start and guess the number of dots.<br>time: 30 sec.</font></td></tr></table></div> <div id="resultbar" style="position:absolute;left:35px;top:41px"></div> <div id="resultbarskin" style="position:absolute;left:35px;top:33px"><img src="resultbarskin.gif"></div> <div id="timesign" style="position:absolute;visibility:visible;left:39px;top:184px;"></div> <div id="l" style="position:absolute;left:0px;top:0px;"><table cellpadding=0 cellspacing=0 border=0><tr><img src="white.gif" height=13 width=1><td></td></tr></table></div> <div id="r" style="position:absolute;left:0px;top:0px;"><table cellpadding=0 cellspacing=0 border=0><tr><img src="white.gif" height=13 width=1><td></td></tr></table></div> <div id="t" style="position:absolute;left:0px;top:0px;"><table cellpadding=0 cellspacing=0 border=0><tr><img src="white.gif" height=1 width=18><td></td></tr></table></div> <div id="b" style="position:absolute;left:0px;top:0px;"><table cellpadding=0 cellspacing=0 border=0><tr><img src="white.gif" height=1 width=18><td></td></tr></table></div> <div id="hall" style="position:absolute;left:0px;top:0px;visibility:hidden"> <form name="hallform" action="http://www.24fun.com/cgi-bin/eyeqsave.pl" method="post" target="_blank"> <input type=hidden name="result"> <input type=hidden value="saveresults" name="whichsub"> <table border=0 cellpadding=2 cellspacing=0 width=150 height=230 style="border:1 solid black;background-color:#FFFFCC"> <tr><td> <font face=Verdana size=1 color=black>Add your result to the hall of fame</font> </td></tr> <tr><td> <font face=Verdana size=1 color=black> your name:<br> <input type=text style="font-size:8pt" name="name"><br><br> your email:<br> <input type=text style="font-size:8pt" name="email"><br><br> <input type=button onClick="submithalloffame();this.submit" value="add result" style="font-size:8pt"> <input type=button onClick="hidehalloffame()" value="close" style="font-size:8pt"><br> </td></tr></table> </form> </div> </div> </body> </html>