1 decade ago by Logan
Hello,
My name's Logan and I'm relatively new to the Javascript / Canvas HTML5 Element world. I've made a few browser games with HTML, CSS, PHP, and MySQL. I'm also very experienced in Vb.net.
I know this has already been explained on here a couple of times but i still can't seem to get this right.
My questions: I'm currently working on firing a bullet from the player to a certain mouse coord on the canvas. I have 3 entities, the player, the enemy, and the bullet. I'm basically trying to:
1) Spawn the bullet entity.
- this will be a called inside the player entity:
2) Move bullet entity to the mouse coords.
- I'm guessing this will be a function inside the bullet entity that finds the angle between the (player.x, player.y) and (mouse.x, mouse.y). then move the entity on that angle with a certain Vel.x, Vel.y?
3) Delete when collides with something.
- assuming this will be called in the bullet entity? but not really sure? havent dont much with collision yet?
My name's Logan and I'm relatively new to the Javascript / Canvas HTML5 Element world. I've made a few browser games with HTML, CSS, PHP, and MySQL. I'm also very experienced in Vb.net.
I know this has already been explained on here a couple of times but i still can't seem to get this right.
My questions: I'm currently working on firing a bullet from the player to a certain mouse coord on the canvas. I have 3 entities, the player, the enemy, and the bullet. I'm basically trying to:
1) Spawn the bullet entity.
- this will be a called inside the player entity:
update: function(){
if( ig.input.pressed('shoot') ){
ig.game.spawnEntity(EntityBullet, this.x, this.y);
}
if( ig.input.state('up') ){
this.vel.y = -100;
}
else if( ig.input.state('down') ){
this.vel.y = 100;
}
else if( ig.input.state('left') ){
this.vel.x = -100;
}
else if( ig.input.state('right') ){
this.vel.x = 100;
}
else {
this.vel.y = 0;
this.vel.x = 0;
}
this.parent();
}
2) Move bullet entity to the mouse coords.
- I'm guessing this will be a function inside the bullet entity that finds the angle between the (player.x, player.y) and (mouse.x, mouse.y). then move the entity on that angle with a certain Vel.x, Vel.y?
EntityBullet = ig.Entity.extend({
size:{x:5,y:5},
collides: ig.Entity.COLLIDES.ACTIVE,
animSheet: new ig.AnimationSheet( 'media/tilesets/textures/5x5_bullet.png', 5, 5 ),
move_toward_coord: function(x, y) {
var distance_x = x - this.pos.x - this.size.x / 2;
var distance_y = y - this.pos.y - this.size.y / 2;
var speed = 30;
this.vel.x = (distance_x > 1 ? 1 : -1) * speed * (Math.abs(distance_x) / (Math.abs(distance_x) + Math.abs(distance_y)));
this.vel.y = (distance_y > 1 ? 1 : -1) * speed * (Math.abs(distance_y) / (Math.abs(distance_x) + Math.abs(distance_y)));
},
init: function( x, y, settings ) {
this.parent( x, y, settings );
this.addAnim( 'idle', 1, [0] );
},
update: function(){
this.parent();
}
3) Delete when collides with something.
- assuming this will be called in the bullet entity? but not really sure? havent dont much with collision yet?