Forums » Help » How would I implement dialog in my game?

I was wondering, does anyone know how I can implement, or for that matter; how everyone can implement dialog into their games. Examples would include; Speech bubbles, and text at the bottom of the screen when you go next to an NPC or other character. If anyone can please help me with this, I'd appreciate it greatly, any method would work for me, I just need some help.

Sincerely,

Gamma

You can try something like this for a multipage dialog:

main.js, before init:

// Dialog
dialog: {
	image: new ig.Image('media/gui_dialog.png'), // Your image for dialog box
	pages: []
},

main.js, inside init:

// Dialog position
this.dialog.pos = {
	x: (ig.system.width / 2) - (this.dialog.image.width / 2),
	y: ig.system.height - this.dialog.image.height
}

main.js, inside draw:

// Draw dialog
if(this.dialog.pages.length != 0) {
	this.dialog.pos = {
		x: (ig.system.width / 2) - (this.dialog.image.width / 2),
		y: ig.system.height - this.dialog.image.height
	}
	this.dialog.image.draw(this.dialog.pos.x, this.dialog.pos.y);
	var wrapper = new WordWrap(ig.game.dialog.pages[0], 25);
	this.font.draw(wrapper.wrap(), this.dialog.pos.x + 8, ig.system.height - this.dialog.image.height + 8, ig.Font.ALIGN.LEFT);
}

player.js, top of update:

if(ig.input.pressed('action')) {
	if(ig.game.dialog.pages.length != 0) {
		ig.game.dialog.pages = ig.game.dialog.pages.slice(1, ig.game.dialog.pages.length);
	}
}

You'll notice the use of the wordwrap function, you can remove or download it from here:
http://impactjs.com/forums/code/wrapping-text

Thank you. I get where you going here, but I want to ask one more thing. Before I ask, do you recall the video that Dominic Szablewski (developer of this engine) made on Vimeo of the making of Biolab Disaster? If you do, do you recall the debris falling from the ceiling of the map due to a trigger? If you haven't seen the video, the part is at 3:50 (link below). But if you already understand what I'm talking about, how would I make it so that when the player walks through a specific trigger a block of text symbolizing a "shout" would pop up and (for example) say "Hey you!".

http://vimeo.com/14920760 (Go up to 3:45)

(untested but am confident it should work)

You'd copy one of the triggeredBy-equipped classes from the biolab entity pack to a new one named, say, "PopBubble".

Then in WM:
1. add a PopupBubble and give it some kind of name (e.g., key:name, value:bubble1)

2. then, add a Trigger, giving it a property key target.1 with a value set to name of bubble (e.g., bubble1). You should then see a line linking the two entities.

3. Last, in the PopupBubble class implementation, modify the triggeredBy and draw methods as befits your needs (e.g., in triggeredBy, set this.currentAnim to something other than null, and in draw, draw text if bubble.currentAnim is not null).

Optional:
a. if bubble is to disappear after a certain time, add a timer and check for expiration at which time you set this.currentAnim to null.

b. in init(x, y, settings), check for presence of text property, which then allows you to set the text the bubble will contain directly from WM.

That makes sense. Thank you Alexandre, and Datamosh for both of your ideas. This really helped. I appreciate it greatly.