نمونه کد های ساده برای جاوا اسکریپت بازی ها به خاطر سپردن عکس

شاید شما هم یادتاب باشد سالها قبل این بازی به عنوان یکی از اولین بازی های جاوا به بازار عرضه شد کد ها بسیار ساده بودند و نیازی به کتابخانه ی جاوا نیود و همین باعث شد این بازی بسیار محبوب شود کد های این بازی را باهم ببینیم. کمی هم با کد ها بازی گوشی کنیم ببینیم می توانیم کار بامزه ای بکنیم یا نه.

نمونه کد های ساده برای جاوا اسکریپت بازی ها به خاطر سپردن عکس

خودتان بازی را امتحان کنید.

<html>
<head>
<SCRIPT LANGUAGE = "Javascript">
hairL1 = new Image;
hairL1.src = 'hairL1.gif';
hairR1 = new Image;
hairR1.src = 'hairR1.gif';
hairM1 = new Image;
hairM1.src = 'hairM1.gif';
eyeL1 = new Image;
eyeL1.src = 'eyeL1.gif';
eyeR1 = new Image;
eyeR1.src = 'eyeR1.gif';
cheekL1 = new Image;
cheekL1.src = 'cheekL1.gif';
cheekR1 = new Image;
cheekR1.src = 'cheekR1.gif';
nose1 = new Image;
nose1.src = 'nose1.gif';
mouth1 = new Image;
mouth1.src = 'mouth1.gif';
chin1 = new Image;
chin1.src = 'chin1.gif';
hairL2 = new Image;
hairL2.src = 'hairL2.gif';
hairR2 = new Image;
hairR2.src = 'hairR2.gif';
hairM2 = new Image;
hairM2.src = 'hairM2.gif';
eyeL2 = new Image;
eyeL2.src = 'eyeL2.gif';
eyeR2 = new Image;
eyeR2.src = 'eyeR2.gif';
cheekL2 = new Image;
cheekL2.src = 'cheekL2.gif';
cheekR2 = new Image;
cheekR2.src = 'cheekR2.gif';
nose2 = new Image;
nose2.src = 'nose2.gif';
mouth2=new Image;
mouth2.src = 'mouth2.gif';
chin2 = new Image;
chin2.src = 'chin2.gif';
hairL3 = new Image;
hairL3.src = 'hairL3.gif';
hairR3 = new Image;
hairR3.src = 'hairR3.gif';
hairM3 = new Image;
hairM3.src = 'hairM3.gif';
eyeL3 = new Image;
eyeL3.src = 'eyeL3.gif';
eyeR3 = new Image;
eyeR3.src = 'eyeR3.gif';
cheekL3 = new Image;
cheekL3.src = 'cheekL3.gif';
cheekR3 = new Image;
cheekR3.src = 'cheekR3.gif';
nose3 = new Image;
nose3.src = 'nose3.gif';
mouth3 = new Image;
mouth3.src = 'mouth3.gif';
chin3 = new Image;
chin3.src = 'chin3.gif'
blnk = new Image;
blnk.src = 'blnk.gif'
</script>
<title>Face Memory Game</title>
</head>
<body onload="document.forms[0].reset()">
<center><h2>How is Your Memory for Faces?</h2>
<table width=241 height=241 cols=7 cellspacing=0 cellpadding=0 border=0>
<tr>
<td width=1 height=1>
<td width=40 height=1>
<td width=40 height=1>
<td width=40 height=1>
<td width=40 height=1>
<td width=40 height=1>
<td width=40 height=1>
<tr>
<td width=1 height=40>
<td rowspan=3 width=40 height=120>
<img src=hairL1.gif width=40 height=120 border=0 name=hairL>
<td colspan=4 width=160 height=40>
<img src=hairM1.gif width=160 height=40 border=0 name=hairM>
<td rowspan=3 width=40 height=120>
<img src=hairR1.gif width=40 height=120 border=0 name=hairR>
<tr>
<td width=1 height=40>
<td colspan=2 width=80 height=40>
<img src=eyeL1.gif width=80 height=40 border=0 name=eyeL>
<td colspan=2 width=80 height=40>
<img src=eyeR1.gif width=80 height=40 border=0 name=eyeR>
<tr>
<td width=1 height=40>
<td rowspan=3 width=40 height=120>
<img src=cheekL1.gif width=40 height=120 border=0 name=cheekL>
<td colspan=2 rowspan=2 width=80 height=80>
<img src=nose1.gif width=80 height=80 border=0 name=nose>
<td rowspan=3 width=40 height=120>
<img src=cheekR1.gif width=40 height=120 border=0 name=cheekR>
<tr>
<td width=1 height=40>
<td width=40 height=40>
<td width=40 height=40>
<tr>
<td width=1 height=40>
<td width=40 height=40>
<td colspan=2 width=80 height=40>
<img src=mouth1.gif width=80 height=40 border=0 name=mouth>
<td width=40 height=40>
<tr>
<td width=1 height=40>
<td colspan=2 width=80 height=40>
<td colspan=2 width=80 height=40>
<img src=chin1.gif width=80 height=40 border=0 name=chin>
<td colspan=2 width=80 height=40>
</table>

<form onsubmit=return false>
<input style="width:200" width=200 type=button name="button1" value="START" onclick="StartGame(this.value)"><hr>
<input name="inst" value="Click START to begin the game"
size=90>
<hr>
<script>
RealOne=new Array()
YourOne=new Array()
Parts=new Array("hairL","hairM","hairR","eyeL","eyeR","cheekL","cheekR","nose","chin","mouth")
for(x=0;x<Parts.length;x++){
document.write("<select name=Prt",x," size=4 onchange=Chosen('",Parts[x],"',this.options[this.selectedIndex].value)>")
document.write("<option selected>",Parts[x],"</option>")
document.write("<option value='1'>1")
document.write("<option value='2'>2")
document.write("<option value='3'>3")
document.write("</select>")
}
</script>
<hr>
<input type=button value="NEW GAME" onclick="NewGame()">
</form>
<hr>
<a href = "../chgames.html">[Back to Games]</A> | <a href =
"../chmemory.html">[Back to Memory Games]</A> |
<a href = "faces.html">[Back to Face Recognition]</A> </center>
<p>
Game developed by Kien Caoxuan.
</body>

<script>
function Chosen(prt,num){
if(document.forms[0].button1.value!="OKAY")return
document[prt].src=prt+num+".gif"
}

function RanFace(){
document.hairL.src=eval("hairL"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.hairM.src=eval("hairM"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.hairR.src=eval("hairR"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.eyeL.src=eval("eyeL"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.eyeR.src=eval("eyeR"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.cheekL.src=eval("cheekL"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.cheekR.src=eval("cheekR"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.nose.src=eval("nose"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.chin.src=eval("chin"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.mouth.src=eval("mouth"+parseInt(1+Math.floor(3*Math.random()))+".src")
}

function NewGame(){
if(confirm("Do you want to do it again?")) location.reload()
else return
}

function StartGame(x){

if(x=="START"){
cont=setInterval('RanFace()',150)
document.forms[0].button1.value="PLAY";
document.forms[0].inst.value="Click PLAY to freeze the face"
return
}

if(x=="PLAY"){
clearInterval(cont);
document.forms[0].button1.value="READY";
document.forms[0].inst.value="Now memorize this face. When you are ready, click READY"
return
}

if(x=="READY"){
for(i=0;i<10;i++){
document.forms[0].elements["Prt"+i].selectedIndex=0
}
RealOne[0]=document.hairL.src
RealOne[1]=document.hairM.src
RealOne[2]=document.hairR.src
RealOne[3]=document.eyeL.src
RealOne[4]=document.eyeR.src
RealOne[5]=document.cheekL.src
RealOne[6]=document.cheekR.src
RealOne[7]=document.nose.src
RealOne[8]=document.chin.src
RealOne[9]=document.mouth.src

document.hairL.src=blnk.src
document.hairM.src=blnk.src
document.hairR.src=blnk.src
document.eyeL.src=blnk.src
document.eyeR.src=blnk.src
document.cheekL.src=blnk.src
document.cheekR.src=blnk.src
document.nose.src=blnk.src
document.chin.src=blnk.src
document.mouth.src=blnk.src
document.forms[0].inst.value="Select the pieces from the list below. Try to build the face you saw. Click OKAY when done."
document.forms[0].button1.value="OKAY"
return
}

if(x=="OKAY"){
Result=0
for(i=0;i<10;i++){
YourOne[i]=document[Parts[i]].src
if(document[Parts[i]].src==RealOne[i])Result++
}
Verdict="NOT TO GOOD ... try again!"
if(Result>3)Verdict="OK ... not too bad!"
if(Result>6)Verdict="GOOD ... stop that smug look!"
if(Result>8)Verdict="FANTASTIC ... you have a great memory for faces?"
document.forms[0].button1.value="SEE ORIGINAL"
document.forms[0].inst.value=Result+" CORRECT BITS! That's "+Verdict
return
}

if(x=="SEE ORIGINAL"){
for(i=0;i<10;i++){
document[Parts[i]].src=RealOne[i]
}
document.forms[0].button1.value="SEE YOURS"
return
}
if(x=="SEE YOURS"){
for(i=0;i<10;i++){
document[Parts[i]].src=YourOne[i]
}
document.forms[0].button1.value="SEE ORIGINAL"
return
}

}

</script>

</html>

من می خواهم کمی تغییر در این کدها بدهم باهم نتیجه را ببینیم

من قصد داشتم که کاربر با کلیک های متوالی بتوانید عکس اولیه را بیابد .

شروع بازی >>>

<hr>
<input type=button value="NEW GAME" onclick="NewGame()">
</form>
<hr><br>
<a href = "../chgames.html">[Back to Games]</A> | <a href =
"../chmemory.html">[Back to Memory Games]</A> |
<a href = "faces.html">[Back to Face Recognition]</A> </center>
<p>
Game developed by Kien Caoxuan.
</center>
</body>

function RanFace(){
document.hairL.src=eval("hairL"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.hairM.src=eval("hairM"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.hairR.src=eval("hairR"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.eyeL.src=eval("eyeL"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.eyeR.src=eval("eyeR"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.cheekL.src=eval("cheekL"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.cheekR.src=eval("cheekR"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.nose.src=eval("nose"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.chin.src=eval("chin"+parseInt(1+Math.floor(3*Math.random()))+".src")
document.mouth.src=eval("mouth"+parseInt(1+Math.floor(3*Math.random()))+".src")
}

function NewGame(){
if(confirm("Do you want to do it again?")) location.reload()
else return
}

function StartGame(x){

if(x=="START"){
cont=setInterval('RanFace()',150)
document.forms[0].button1.value="PLAY";
document.forms[0].inst.value="Click PLAY to freeze the face"
return
}

if(x=="PLAY"){
clearInterval(cont);
document.forms[0].button1.value="READY";
document.forms[0].inst.value="Now memorize this face. When you are ready, click READY"
return
}

if(x=="READY"){
RealOne[0]=document.hairL.src
RealOne[1]=document.hairM.src
RealOne[2]=document.hairR.src
RealOne[3]=document.eyeL.src
RealOne[4]=document.eyeR.src
RealOne[5]=document.cheekL.src
RealOne[6]=document.cheekR.src
RealOne[7]=document.nose.src
RealOne[8]=document.chin.src
RealOne[9]=document.mouth.src

document.hairL.src=blnk.src
document.hairM.src=blnk.src
document.hairR.src=blnk.src
document.eyeL.src=blnk.src
document.eyeR.src=blnk.src
document.cheekL.src=blnk.src
document.cheekR.src=blnk.src
document.nose.src=blnk.src
document.chin.src=blnk.src
document.mouth.src=blnk.src
document.forms[0].inst.value="Click on the ?s to flip through the pieces. Try to build the face you saw. Click OKAY when done."
document.forms[0].button1.value="OKAY"
return
}

if(x=="OKAY"){
Result=0
for(i=0;i<10;i++){
YourOne[i]=document[Parts[i]].src
if(document[Parts[i]].src==RealOne[i])Result++
}
Verdict="NOT TOO GOOD... try again!"
if(Result>3)Verdict="OK... your memory is fading away..."
if(Result>6)Verdict="GOOD... your memory is just fine!!!"
if(Result>8)Verdict="FANTASTIC... you have a great memory for faces!"
document.forms[0].button1.value="SEE ORIGINAL"
document.forms[0].inst.value=Result+" CORRECT BITS! ... That's "+Verdict
return
}

if(x=="SEE ORIGINAL"){
for(i=0;i<10;i++){
document[Parts[i]].src=RealOne[i]
}
document.forms[0].button1.value="SEE YOURS"
return
}
if(x=="SEE YOURS"){
for(i=0;i<10;i++){
document[Parts[i]].src=YourOne[i]
}
document.forms[0].button1.value="SEE ORIGINAL"
return
}

}

</script>

</html>