OLPCities/Shooting in the bad guys: Difference between revisions
Jump to navigation
Jump to search
PREVIOUS LESSON: Using the Time-Space Portal...........TOC :Tutorials..........NEXT LESSON : Inside a house
No edit summary |
(just fixed the minor spelling mistakes) |
||
| (28 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
At the previous lesson you have tried the exercise of this lesson. If not, try it now:[http://www.dmu.com/olpctut/tut5e.html http://www.dmu.com/olpctut/tut5e.html]. |
|||
[[Image:Tut7-1.jpg]] Look the figure. The astronaut has a gun. And glued to the gaun there are a little red bullet. |
|||
They are in the "Pink planet" and the astronaut can shoot against one of the "echoos", the mosters that live in the planet. |
|||
[[Image:Tut7-1.jpg | left ]] |
|||
Look the figure. The astronaut has a gun. And glued to the gun there are a little red bullet. They are in the "Pink planet" and the astronaut can shoot against one of the "echoes", the monsters that live in the planet. |
|||
How did we code this? |
How did we code this? |
||
The sprite "bullet" needs to be "glued" to the sprite "astronaut" |
The sprite "bullet" needs to be "glued" to the sprite "astronaut" approximately near the gun and having an inferior "Z" to be hided. There are the method <b>follow</b> to do it. At the exercise we have: |
||
<pre> |
<pre> |
||
bl.follow(av,15, 16); |
bl.follow(av,15, 16); |
||
</pre> |
</pre> |
||
The two number are |
The two number are the coordinates of the bullet "inside" the avatar. |
||
At the moment of the shoot (pressing the key "P") we liberate the bullet, |
At the moment of the shoot (pressing the key "P") we liberate the bullet, define its direction (the same of the avatar at this moment) and we increase the velocity (2 for the avatar and 5 for the bullet). Look part of the code. This action needs to be "discreet" - only one time - and we use a flag ("shoot") to do this: |
||
<pre> |
<pre> |
||
... |
... |
||
| Line 21: | Line 25: | ||
... |
... |
||
</pre> |
</pre> |
||
The other interesting thing we are doing is to make the monster to go in the direction of the astronaut. We use the method <b>target</b> to do this. |
|||
[[Image:Echoo1.gif | left ]] |
|||
And we need to change the frames of the sprite according the angle the monster is walking. We use <b>setFrameByDirection</B> to do it. (Read the references of these methods at [[OLPCities/Sprites|Sprites]] to understand better.) Look the lines of code: |
|||
<pre> |
|||
... |
|||
e1.setFrameByDirection(1,45,2,46,134,1,135,224,3,225,314,0,315,360,2); |
|||
... |
|||
e1.target(av,0,0); |
|||
... |
|||
</pre> |
|||
[[Image:Tut7-2.jpg | left ]] |
|||
Pay attention that we need to begin the definition of the directions by the angle 1 until 360. |
|||
Another detail: to do a SwitchOff of an sprite we need previously to do a SwithOn . |
|||
When the bullet is at the limits of the Lot we do an automatic "recharge". The "recharge" really is the bullet going back to the gun. |
|||
Look these and some other "tricks" at the complete code of the Lot: |
|||
<pre><html> |
|||
<head> |
|||
<script language="Javascript" src="http://www.dmu.com/olpc/gamelib_core.js"></script> |
|||
<script language="Javascript" src="http://www.dmu.com/olpc/gamelib_sprites.js"></script> |
|||
<script language="Javascript" src="http://www.dmu.com/olpc/gamelib_keyboard.js"></script> |
|||
<script language="Javascript"> |
|||
function init(){ |
|||
Sp_linuxcompatible=true; |
|||
Gl_preloader("floorPINK1.gif"); |
|||
Gl_preloader("echoo1.gif"); |
|||
Gl_preloader("astronaut.gif"); |
|||
Gl_preloader("bullet.gif"); |
|||
Gl_preloader("goldenbean.gif"); |
|||
Gl_preloader("timespace.gif"); |
|||
Gl_preloader("timespaceS0.gif"); |
|||
Gl_preloader("timespaceS.gif"); |
|||
upkey=Kb_trapkey("UP"); |
|||
downkey=Kb_trapkey("DOWN"); |
|||
rightkey=Kb_trapkey("RIGHT"); |
|||
leftkey=Kb_trapkey("LEFT"); |
|||
skey=Kb_trapkey("S"); |
|||
rkey=Kb_trapkey("R"); |
|||
onetime=0; |
|||
shoot=0; |
|||
av=new Sp_Sprite(); |
|||
av.setImage("astronaut.gif",32,32,4,2); |
|||
av.setXlimits(5,610); |
|||
av.setYlimits(5,385); |
|||
av.moveTo( 300,170); |
|||
av.setFrame(3); |
|||
av.setFrameByDirection(90,90,1,180,180,3,270,270,0,0,0,2); |
|||
av.setAnimation(0); |
|||
av.setZ(10); |
|||
av.collides=true; |
|||
av.useHitEvents(true); |
|||
av.setAnimationSpeed(3); |
|||
av.setSpeed(2); |
|||
av.switchOn(); |
|||
floor=new Sp_Sprite(); |
|||
floor.setImage("floorPINK1.gif",614,390,1,1); |
|||
floor.setXlimits( 0,616); |
|||
floor.setYlimits( 0,390); |
|||
floor.setFrame(0); |
|||
floor.moveTo(0 , 0 ); |
|||
floor.setZ(5); |
|||
floor.switchOn(); |
|||
bl=new Sp_Sprite(); |
|||
bl.setImage("bullet.gif",5,5,1,1); |
|||
bl.setXlimits( 0,614); |
|||
bl.setYlimits( 0,390); |
|||
bl.setFrame(0); |
|||
bl.moveTo(av.x , av.y ); |
|||
bl.setZ(8); |
|||
bl.collides=true; |
|||
bl.useHitEvents(true); |
|||
bl.switchOn(); |
|||
bl.switchOff(); |
|||
e1=new Sp_Sprite(); |
|||
e1.setImage("echoo1.gif",32,32,4,1); |
|||
e1.setXlimits( 0,614); |
|||
e1.setYlimits( 0,390); |
|||
e1.setFrame(3); |
|||
e1.setFrameByDirection(1,45,2,46,134,1,135,224,3,225,314,0,315,360,2); |
|||
e1.moveTo( 100 , 10 ); |
|||
e1.setDir( 1,0); |
|||
e1.setSpeed(1); |
|||
e1.target(av,0,0); |
|||
e1.setZ(8); |
|||
e1.collides=true; |
|||
e1.useHitEvents(true); |
|||
e1.switchOn() |
|||
gb=new Sp_Sprite(); |
|||
gb.setImage("goldenbean.gif",20,20,1,2); |
|||
gb.setXlimits(0,614); |
|||
gb.setYlimits(5,280); |
|||
gb.moveTo(50,80); |
|||
gb.setFrame(0); |
|||
gb.setAnimation(0); |
|||
gb.setAnimationLoop(0,2); |
|||
gb.setAnimationSpeed(8); |
|||
gb.setZ(6); |
|||
gb.setAnimationRepeat(-1); |
|||
gb.makeHard(); |
|||
gb.collides=true; |
|||
gb.switchOn(); |
|||
ts=new Sp_Sprite(); |
|||
ts.setImage("timespace.gif",114,110,1,4); |
|||
ts.setXlimits(0,614); |
|||
ts.setYlimits(5,280); |
|||
ts.moveTo(305, 0); |
|||
ts.setFrame(0); |
|||
ts.setAnimationLoop(0,3); |
|||
ts.setAnimationSpeed(4); |
|||
ts.setAnimation(0); |
|||
ts.setZ(6); |
|||
ts.setAnimationRepeat(-1); |
|||
ts.collides=true; |
|||
ts.switchOn(); |
|||
ts.switchOff(); |
|||
tsS=new Sp_Sprite(); |
|||
tsS.setImage("timespaceS.gif",62,14,1,1); |
|||
tsS.setXlimits( 0,614); |
|||
tsS.setYlimits( 0,390); |
|||
tsS.setFrame(0); |
|||
tsS.moveTo( 345 , 70 ); |
|||
tsS.setZ(0); |
|||
tsS.makeHard(); |
|||
tsS.switchOn(); |
|||
tsS.switchOff(); |
|||
tsS0=new Sp_Sprite(); |
|||
tsS0.setImage("timespaceS0.gif",95,79,1,1); |
|||
tsS0.setXlimits( 0,614); |
|||
tsS0.setYlimits( 0,390); |
|||
tsS0.setFrame(0); |
|||
tsS0.moveTo( 315 , 0 ); |
|||
tsS0.setZ(0); |
|||
tsS0.makeHard(); |
|||
tsS0.switchOn(); |
|||
tsS0.switchOff(); |
|||
dial1 =new Sp_Sprite(); |
|||
dial1.setImage("dialtut1.gif",615,160,1,1); |
|||
dial1.setXlimits( 0,614); |
|||
dial1.setYlimits( 0,390); |
|||
dial1.setFrame(0); |
|||
dial1.moveTo(0 , 300 ); |
|||
dial1.setZ(20); |
|||
dial1.switchOn() |
|||
Gl_hook("timestep()"); |
|||
Gl_start(); |
|||
} |
|||
function timestep(){ |
|||
av.setSpeed(0); |
|||
av.setAnimationRepeat(0); |
|||
if(rightkey.pressed){ |
|||
dial1.switchOff(); |
|||
av.setDir(1,0); |
|||
av.setAnimationRepeat(-1); |
|||
av.setSpeed(2); |
|||
if(onetime==0){ |
|||
bl.follow(av,15, 16); |
|||
bl.switchOn(); |
|||
onetime=1 ; |
|||
} |
|||
} |
|||
else if(leftkey.pressed){ |
|||
dial1.switchOff(); |
|||
av.setDir(-1,0); |
|||
av.setAnimationRepeat(-1); |
|||
av.setSpeed(2); |
|||
if(onetime==0){ |
|||
bl.follow(av,15 , 16); |
|||
bl.switchOn(); |
|||
onetime=1; |
|||
} |
|||
} |
|||
else if(downkey.pressed){ |
|||
dial1.switchOff(); |
|||
av.setDir(0,1); |
|||
av.setAnimationRepeat(-1); |
|||
av.setSpeed(2); |
|||
if(onetime==0){ |
|||
bl.follow(av,15, 16); |
|||
bl.switchOn(); |
|||
onetime=1; |
|||
} |
|||
} |
|||
else if(upkey.pressed){ |
|||
dial1.switchOff(); |
|||
av.setDir(0,-1); |
|||
av.setAnimationRepeat(-1); |
|||
av.setSpeed(2); |
|||
if(onetime==0){ |
|||
bl.follow(av,15, 16); |
|||
bl.switchOn(); |
|||
onetime=1; |
|||
} |
|||
} |
|||
if(skey.pressed){ |
|||
if(shoot==0){ |
|||
bl.stopFollowing(); |
|||
bl.setDir(av.xdir,av.ydir); |
|||
bl.setSpeed(5); |
|||
shoot=1; |
|||
} |
|||
} |
|||
if(rkey.pressed || bl.x <= 5 || bl.x >= 600 || bl.y <= 5 || bl.y >= 380 ){ |
|||
if(shoot==1){ |
|||
bl.moveTo(av.x+10 , av.y ); |
|||
bl.follow(av,15, 16); |
|||
bl.switchOn() |
|||
shoot=0; |
|||
} |
|||
} |
|||
if(av.hasHit(gb)){ |
|||
gb.switchOff(); |
|||
tsS.switchOn(); |
|||
tsS0.switchOn(); |
|||
ts.switchOn(); |
|||
} |
|||
if(bl.hasHit(e1)){ |
|||
e1.switchOff(); |
|||
bl.switchOff(); |
|||
} |
|||
if(e1.hasHit(av)){ |
|||
e1.switchOff(); |
|||
av.switchOff(); |
|||
bl.switchOff(); |
|||
window.location="tut6.html"; |
|||
} |
|||
if(av.hasHit(tsS)){ |
|||
window.location="tut5w.html"; |
|||
} |
|||
}//timestep |
|||
</script> |
|||
</head> |
|||
<title>TUTCITY </title> |
|||
<body bgcolor="black" onload="init()" > |
|||
</html> |
|||
</pre> |
|||
<center>PREVIOUS LESSON: [[OLPCities/Using the Time-Space Portal|Using the Time-Space Portal]]...........TOC :[[OLPCities/Tutorials|Tutorials]]..........NEXT LESSON : [[OLPCities/Inside a house|Inside a house]]</center> |
|||
[[Category:OLPCities Tutorials]] |
|||
Latest revision as of 16:47, 24 March 2007
At the previous lesson you have tried the exercise of this lesson. If not, try it now:http://www.dmu.com/olpctut/tut5e.html.
Look the figure. The astronaut has a gun. And glued to the gun there are a little red bullet. They are in the "Pink planet" and the astronaut can shoot against one of the "echoes", the monsters that live in the planet.
How did we code this?
The sprite "bullet" needs to be "glued" to the sprite "astronaut" approximately near the gun and having an inferior "Z" to be hided. There are the method follow to do it. At the exercise we have:
bl.follow(av,15, 16);
The two number are the coordinates of the bullet "inside" the avatar. At the moment of the shoot (pressing the key "P") we liberate the bullet, define its direction (the same of the avatar at this moment) and we increase the velocity (2 for the avatar and 5 for the bullet). Look part of the code. This action needs to be "discreet" - only one time - and we use a flag ("shoot") to do this:
...
if(skey.pressed){
if(shoot==0){
bl.stopFollowing();
bl.setDir(av.xdir,av.ydir);
bl.setSpeed(5);
shoot=1;
}
...
The other interesting thing we are doing is to make the monster to go in the direction of the astronaut. We use the method target to do this.
And we need to change the frames of the sprite according the angle the monster is walking. We use setFrameByDirection to do it. (Read the references of these methods at Sprites to understand better.) Look the lines of code:
... e1.setFrameByDirection(1,45,2,46,134,1,135,224,3,225,314,0,315,360,2); ... e1.target(av,0,0); ...
Pay attention that we need to begin the definition of the directions by the angle 1 until 360.
Another detail: to do a SwitchOff of an sprite we need previously to do a SwithOn .
When the bullet is at the limits of the Lot we do an automatic "recharge". The "recharge" really is the bullet going back to the gun.
Look these and some other "tricks" at the complete code of the Lot:
<html>
<head>
<script language="Javascript" src="http://www.dmu.com/olpc/gamelib_core.js"></script>
<script language="Javascript" src="http://www.dmu.com/olpc/gamelib_sprites.js"></script>
<script language="Javascript" src="http://www.dmu.com/olpc/gamelib_keyboard.js"></script>
<script language="Javascript">
function init(){
Sp_linuxcompatible=true;
Gl_preloader("floorPINK1.gif");
Gl_preloader("echoo1.gif");
Gl_preloader("astronaut.gif");
Gl_preloader("bullet.gif");
Gl_preloader("goldenbean.gif");
Gl_preloader("timespace.gif");
Gl_preloader("timespaceS0.gif");
Gl_preloader("timespaceS.gif");
upkey=Kb_trapkey("UP");
downkey=Kb_trapkey("DOWN");
rightkey=Kb_trapkey("RIGHT");
leftkey=Kb_trapkey("LEFT");
skey=Kb_trapkey("S");
rkey=Kb_trapkey("R");
onetime=0;
shoot=0;
av=new Sp_Sprite();
av.setImage("astronaut.gif",32,32,4,2);
av.setXlimits(5,610);
av.setYlimits(5,385);
av.moveTo( 300,170);
av.setFrame(3);
av.setFrameByDirection(90,90,1,180,180,3,270,270,0,0,0,2);
av.setAnimation(0);
av.setZ(10);
av.collides=true;
av.useHitEvents(true);
av.setAnimationSpeed(3);
av.setSpeed(2);
av.switchOn();
floor=new Sp_Sprite();
floor.setImage("floorPINK1.gif",614,390,1,1);
floor.setXlimits( 0,616);
floor.setYlimits( 0,390);
floor.setFrame(0);
floor.moveTo(0 , 0 );
floor.setZ(5);
floor.switchOn();
bl=new Sp_Sprite();
bl.setImage("bullet.gif",5,5,1,1);
bl.setXlimits( 0,614);
bl.setYlimits( 0,390);
bl.setFrame(0);
bl.moveTo(av.x , av.y );
bl.setZ(8);
bl.collides=true;
bl.useHitEvents(true);
bl.switchOn();
bl.switchOff();
e1=new Sp_Sprite();
e1.setImage("echoo1.gif",32,32,4,1);
e1.setXlimits( 0,614);
e1.setYlimits( 0,390);
e1.setFrame(3);
e1.setFrameByDirection(1,45,2,46,134,1,135,224,3,225,314,0,315,360,2);
e1.moveTo( 100 , 10 );
e1.setDir( 1,0);
e1.setSpeed(1);
e1.target(av,0,0);
e1.setZ(8);
e1.collides=true;
e1.useHitEvents(true);
e1.switchOn()
gb=new Sp_Sprite();
gb.setImage("goldenbean.gif",20,20,1,2);
gb.setXlimits(0,614);
gb.setYlimits(5,280);
gb.moveTo(50,80);
gb.setFrame(0);
gb.setAnimation(0);
gb.setAnimationLoop(0,2);
gb.setAnimationSpeed(8);
gb.setZ(6);
gb.setAnimationRepeat(-1);
gb.makeHard();
gb.collides=true;
gb.switchOn();
ts=new Sp_Sprite();
ts.setImage("timespace.gif",114,110,1,4);
ts.setXlimits(0,614);
ts.setYlimits(5,280);
ts.moveTo(305, 0);
ts.setFrame(0);
ts.setAnimationLoop(0,3);
ts.setAnimationSpeed(4);
ts.setAnimation(0);
ts.setZ(6);
ts.setAnimationRepeat(-1);
ts.collides=true;
ts.switchOn();
ts.switchOff();
tsS=new Sp_Sprite();
tsS.setImage("timespaceS.gif",62,14,1,1);
tsS.setXlimits( 0,614);
tsS.setYlimits( 0,390);
tsS.setFrame(0);
tsS.moveTo( 345 , 70 );
tsS.setZ(0);
tsS.makeHard();
tsS.switchOn();
tsS.switchOff();
tsS0=new Sp_Sprite();
tsS0.setImage("timespaceS0.gif",95,79,1,1);
tsS0.setXlimits( 0,614);
tsS0.setYlimits( 0,390);
tsS0.setFrame(0);
tsS0.moveTo( 315 , 0 );
tsS0.setZ(0);
tsS0.makeHard();
tsS0.switchOn();
tsS0.switchOff();
dial1 =new Sp_Sprite();
dial1.setImage("dialtut1.gif",615,160,1,1);
dial1.setXlimits( 0,614);
dial1.setYlimits( 0,390);
dial1.setFrame(0);
dial1.moveTo(0 , 300 );
dial1.setZ(20);
dial1.switchOn()
Gl_hook("timestep()");
Gl_start();
}
function timestep(){
av.setSpeed(0);
av.setAnimationRepeat(0);
if(rightkey.pressed){
dial1.switchOff();
av.setDir(1,0);
av.setAnimationRepeat(-1);
av.setSpeed(2);
if(onetime==0){
bl.follow(av,15, 16);
bl.switchOn();
onetime=1 ;
}
}
else if(leftkey.pressed){
dial1.switchOff();
av.setDir(-1,0);
av.setAnimationRepeat(-1);
av.setSpeed(2);
if(onetime==0){
bl.follow(av,15 , 16);
bl.switchOn();
onetime=1;
}
}
else if(downkey.pressed){
dial1.switchOff();
av.setDir(0,1);
av.setAnimationRepeat(-1);
av.setSpeed(2);
if(onetime==0){
bl.follow(av,15, 16);
bl.switchOn();
onetime=1;
}
}
else if(upkey.pressed){
dial1.switchOff();
av.setDir(0,-1);
av.setAnimationRepeat(-1);
av.setSpeed(2);
if(onetime==0){
bl.follow(av,15, 16);
bl.switchOn();
onetime=1;
}
}
if(skey.pressed){
if(shoot==0){
bl.stopFollowing();
bl.setDir(av.xdir,av.ydir);
bl.setSpeed(5);
shoot=1;
}
}
if(rkey.pressed || bl.x <= 5 || bl.x >= 600 || bl.y <= 5 || bl.y >= 380 ){
if(shoot==1){
bl.moveTo(av.x+10 , av.y );
bl.follow(av,15, 16);
bl.switchOn()
shoot=0;
}
}
if(av.hasHit(gb)){
gb.switchOff();
tsS.switchOn();
tsS0.switchOn();
ts.switchOn();
}
if(bl.hasHit(e1)){
e1.switchOff();
bl.switchOff();
}
if(e1.hasHit(av)){
e1.switchOff();
av.switchOff();
bl.switchOff();
window.location="tut6.html";
}
if(av.hasHit(tsS)){
window.location="tut5w.html";
}
}//timestep
</script>
</head>
<title>TUTCITY </title>
<body bgcolor="black" onload="init()" >
</html>