View source for OLPCities/Shooting in the bad guys

At the previous lesson you have tried the exercice 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 | 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 "echoos", the mosters that live in the planet.

How did we code  this?

The sprite "bullet" needs to be "glued" to the sprite "astronaut" aproximately near the gun and having an inferior "Z" to be hided. There are the method <b>follow</b> to do it. At the exercice we have:

<pre> 
bl.follow(av,15,   16);
</pre>
The two number are de coordinates of the bullet "inside" the avatar.
At the moment of the shoot (pressing the key "P") we liberate the bullet, difine 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>
...
if(skey.pressed){
 if(shoot==0){
   bl.stopFollowing();
   bl.setDir(av.xdir,av.ydir);
   bl.setSpeed(5);
   shoot=1; 
  }
...
</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 [[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]]