Forums » Help » Getting Started Questions...

As I mentioned I'm brand new to impact and completely new to doing programming, especially where javascript is concerned.

I did a few searches on the forums here to find what I considered to perhaps be some common questions, but some didn't offer any definitive answers and a few returned no relevant results.

So...

Game Screen Size: This is my first question, I have already been tinkering with the level editor and doing things but I wanted to know, is there a best practice for the size of the playing screen. Ideally I want to go in the direction of building games that are viable on a smartphone, particularly android. That requires the controls to work on touch screen (or mouse click).

With so many phones having varying screen size, I was curious if anyone knew a particular screen size to use.

---

Game Interface: I was so surprised that I didn't find any relevant post about having a persistent game interface like a score / ammo / health tracker on the forums. I am very curious as to how to make one using 2 methods.

1 - Persistent, always on at the top of bottom of the screen.
2 - Selectable, like a menu feature when you press a button.

---

I appreciate any input available from the community

Hi Garinova welcome to Impact. I'm not sure yet about the suitable game screen size for phones. You might want to check out Jesse Freeman's Introducing HTML5 Game Development its all about Impact. I find this book very helpful and informative when I first started Impact. It also discusses several approaches to create a game interface.

HI Tarrent

I actually have that book. I didn't think to repurpose the screen overlay to show stats as a persistent in-game interface because, it doesn't show (at least not that I've found) how to lock those tiles (if you were to use 3 tiles at 16px per) at the base of the game screen as part of the game. Using the overlay method you'd just be taking away screen space and if your game levels have multiple heights it could be a problem.

Thanks for the reply, I could play with it.

Hi,

@Datamosh created a GUI plugin some time ago which also includes a demo project http://impactjs.com/forums/code/impact-gui take a look at this first it will save you a lot of time.

Also look at the demo games other members have posted, a lot of these show simple menus and HUDs. The reason I say look at the games is because you say that you are new to javascript, looking at the games will help you see in context how the scores are displayed on the HUD.

Thanks for the reply and the advice Stuart. I looked at 2 games but since javascript is all foreign to me I couldn't make out much of any of it because I didn't know what i was looking at.

As I've been working on my own starter project I am becoming more familiar with impact functions and recognizing that code and how it applies to the game / levels / entities.

Is there a repository of sorts housing all the impact plugins, possibly also showing which version of impact they are working for?

Hi,
http://www.pointofimpactjs.com/ has a lot of plugins / tutorials and code snippets, Still you will find a lot of plugins in these forums which have not been put on pointofimpact.

In most cases I have not had any version issues with plugins etc. but you can always ask the author.

Have you looked at the sample videos and projects you get with impact if not that’s a good starting point.

I'll assume that you have some kind of player in your game and that can collect some kind of entity to increase the score and another type of entity that can kill your player entity:

In your main.js you need to define a couple of properties to hold the players score and the number of lives (These two properties are the ones we want to display on the screen (HUD) all the time). We also need to define and load a font that we can use to write on the HUD with.

ig.module(
	'game.main'
)
.requires(
	'impact.game', 
	'impact.collision-map', 
	'impact.background-map', 
	'impact.font'
	
	// Any other plugins / entities you need to include at this point  
	
)
.defines(function ()
{
    MyGame = ig.Game.extend(
	{
		 // this is the font we will use to draw the text on the HUD with
		 // This file must be in your media folder	
		 font: new ig.Font('media/04b03.font.png'),
		 // define the properties to hold the players score & Lives
		 playerScore: 0, 
		 playerLives: 3, // Start with 3 lives
	

	init: function() {

		 // Bind keys etc.
		},
	draw: function() {
		// Let the engine draw everything else first
		this.parent();

		// now we can draw on top of it
		// Notice we are using the playerLives and playerScore properties defined in this class
		// ouside of this class i.e. in entities we can refer to them like this
		// ig.game.playerScore and ig.game.playerLives because if you look after .defines above 
		// we extend the ig.game class.
		
		this.font.draw("Lives : " + this.playerLives.toString() , 200, 10);

		this.font.draw("Score : " + this.playerScore.toString(), 400, 10);

});

We need some kind of entity the player can pick up that gives us some points:

ig.module(
	'game.entities.gem'
)
.requires(
	'impact.entity'
)
.defines(function(){

EntityGem = ig.Entity.extend({
	size: {x:32, y:32},
	type:  ig.Entity.TYPE.NONE,
	checkAgainst: ig.Entity.TYPE.A, // Our player
	collides: ig.Entity.COLLIDES.NEVER,
	gravityFactor: 0, // we want it to stay where we put it..
	animSheet: new ig.AnimationSheet(‘media/gem.png’,32,32),
init: function(x,y,settings) {
	this.parent(x,y,settings);
	this.addAnim(“gemspin’,0.1, [0,1,2,3,4,5]);
},
check: function(other) {
	// we could check the Name / Type of the other entity here
	Ig.game.playerScore += 100;  // add 100 points to the playerScore
	this.kill(); // kill this entity else the player will get a high score pretty quick.
}
});
});

In the player entity we could easily change the number of lives in the kill method which impact automatically calls when the entities health is 0 or less:

Kill: function() {
	this.parent();
	Ig.game.playerLives -=1; // take one away from the playerLives
},

At some point in your code you will need to respawn the EntityPlayer if it still has some lives left. This could easily be done in the main.js file.
Sorry for any typos, just did this on the train in notepad.

You also need to create entities than will inflict some kind of damage on the player.

This is just a sample of how you can do it, impact and javascript allow you todo this in many different ways.

Stuart

Thanks for all the help, i'll have to soak it in and play with it a little bit.