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 Jon123

Can anyone tell me why the camera appears to show too much white space, when the player is close to the edges of the game? The example below shows what I mean:

/><br /> <br /> And this one shows the top of the game doing the same:<br /> <br /> <img src=

1 decade ago by Joncom 

/* main.js */

// Center screen over the player.
this.screen.x = player.pos.x + (player.size.x / 2) - (ig.system.width / 2);
this.screen.y = player.pos.y + (player.size.y / 2) - (ig.system.height / 2);
// Define map edges.
var minX = 0;
var maxX = this.collisionMap.pxWidth;
var minY = 0;
var maxY = this.collisionMap.pxHeight;
// Restrict camera to map edges.
this.screen.x = Math.min(this.screen.x, maxX);
this.screen.x = Math.max(this.screen.x, minX);
this.screen.y = Math.min(this.screen.y, maxY);
this.screen.y = Math.max(this.screen.y, minY);

1 decade ago by Jon123

Thanks, where would I put that? I have tried to put it in the "setupCamera" function and the "update" function but neither really worked. Here's what I have:

setupCamera: function() {
			// Set up the camera. The camera's center is at a third of the screen
			// size, i.e. somewhat shift left and up. Damping is set to 3px.		
			this.camera = new ig.Camera( ig.system.width/3, ig.system.height/3, 3 );
			
			// The camera's trap (the deadzone in which the player can move with the
			// camera staying fixed) is set to according to the screen size as well.
			this.camera.trap.size.x = ig.system.width/10;
			this.camera.trap.size.y = ig.system.height/3;
			
			// The lookahead always shifts the camera in walking position; you can 
			// set it to 0 to disable.
			this.camera.lookAhead.x = ig.system.width/6;
			
			// Set camera's screen bounds and reposition the trap on the player
			this.camera.max.x = this.collisionMap.pxWidth - ig.system.width;
			this.camera.max.y = this.collisionMap.pxHeight - ig.system.height;
			this.camera.set( this.player );
		},
		
		reloadLevel: function() {
			this.loadLevelDeferred( this.currentLevel );
		},
		
		update: function() {
			this.parent();
			var player = this.getEntitiesByType( EntityPlayer )[0];
			if( player ) {
				this.screen.x = player.pos.x - ig.system.width/2;
				this.screen.y = player.pos.y - ig.system.height/2;
			}
		},

1 decade ago by Jon123

OK I've got the camera to fix to the top and sides of the container now, but there is still a gap at the bottom..

/> </div> </div> <div class=

1 decade ago by Joncom

Oops. Ya, maxY should be ig.game.collisionMap.pxHeight - ig.system.height...

1 decade ago by Jon123

Brilliant thanks a lot! Works perfectly now.
Page 1 of 1
« first « previous next › last »