Impact

This forum is read only and just serves as an archive. If you have any questions, please post them on github.com/phoboslab/impact

1 decade ago by Gregory

Hello, I am wanting to rotate the camera view depending on the angle of the entity. So if the entity is rotated at an angle of say 66, I want the camera to rotate to that angle, which will make the entity always look upright.

Is this possible?

Any help is appreciated, thanks!

1 decade ago by vincentpiel

You need re-define the draw of your game and also the draw of the rotated entities.

basically drawing with a rotation is a 3 steps process :
translate the context to the center of the rotation
rotate the context
draw the object in the new translated coordinates system.

(you might also save / restore context ... :-) )

I will assume your character is screen centered :

game draw becomes :


draw : function() {
   var ctx = ig.system.context , i=0;
   // clear screen here
   ctx.clearRect(0,0,ig.system.width, ig.system.height);
    // draw non rotated objects here
   var gameEnts = ig.game.entities, ent=null; 
   for ( i=0 ;  ent=gameEnts[i] ; i++ ) {    if ( ! ent.isRotated ) { ent.draw() }    }
   ctx.save();
   ctx.translate(ig.system.width/2, ig.system.height/2);
   ctx.rotate(  some angle );
   // draw the rotated entities here
   for ( i=0 ;  ent=gameEnts[i] ; i++ ) {    if ( ent.isRotated ) { ent.draw() }    }
   ctx.restore();
}


For entity you might want to extend entity into RotatingEntity.
Draw becomes :

    isRotated : true,

    draw: function() {
        var ca = this.currentAnim ; 
        f( ca ) {
                var x = 	this.pos.x - this.offset.x - ig.game._rscreen.x ;  
                var y =	this.pos.y - this.offset.y - ig.game._rscreen.y ;  
                x  -= ig.system.width/2  ;
                y -= ig.system.height/2 ; 
                     
                this.sheet.image.drawTile(
				x, y,
				ca.tile, 
                                ca.sheet.width, ca.sheet.height,
				ca.flip.x, ca.flip.y
			);

		}
	}


You noticed that i changed the call to ig.Animation.draw() to a direct call of ig.Image.drawTile : this is to avoid the cliping part of ig.Animation.draw.

But you'll have to do some clipping by yourself in case there are many off-screen entities.

Also I am not sure the flip arguments of the drawTile, but hopefully this will get you started.
Page 1 of 1
« first « previous next › last »