Classes

Dialog

The Dialog class is capable of generating a nine-slice-scaled dialog window, from nine predefined Sprite assets, this type of mechanism facilitates the creation of stretchable dialog windows that do not distort at the corners. This means you can animate the length and width properties to create some nice effects. Once you create one Dialog entity, you can instantiate it again and again, overriding any property you wish. Very useful especially if your game has lots of text bubbles for example. The main requirement when using this class is you need to have nine Sprite assets previously initialized in GAME.initAssets().

TIP: Dialogs are quasi-first class objects! What this means is that a dialog entity can only do some of the same stuff that a Sprite entity can. For example, you can make a Dialog entity size, slide, move, fade, etc.. Some exceptions are: tint, rotate, spin

The following example shows you how to properly initialize a Dialog:


	GAME.initAssets(function(){
		GAME.Sprite.asset('dialogs.png', {name:'dtl', width:16, height:16, offsetX:3, offsetY:0});
		GAME.Sprite.asset('dialogs.png', {name:'dtm', width:16, height:16, offsetX:4, offsetY:0});
		GAME.Sprite.asset('dialogs.png', {name:'dtr', width:16, height:16, offsetX:5, offsetY:0});
		GAME.Sprite.asset('dialogs.png', {name:'dml', width:16, height:16, offsetX:3, offsetY:1});
		GAME.Sprite.asset('dialogs.png', {name:'dmm', width:16, height:16, offsetX:4, offsetY:1});
		GAME.Sprite.asset('dialogs.png', {name:'dmr', width:16, height:16, offsetX:5, offsetY:1});
		GAME.Sprite.asset('dialogs.png', {name:'dbl', width:16, height:16, offsetX:3, offsetY:2});
		GAME.Sprite.asset('dialogs.png', {name:'dbm', width:16, height:16, offsetX:4, offsetY:2});
		GAME.Sprite.asset('dialogs.png', {name:'dbr', width:16, height:16, offsetX:5, offsetY:2});	
		
		GAME.Dialog.asset({
			name: 'dialog',
			tl: 'dtl', // top left (top left corner)
			tm: 'dtm', // top middle
			tr: 'dtr', // top right (top right corner)
			ml: 'dml', // middle left
			mm: 'dmm', // middle middle
			mr: 'dmr', // middle right
			bl: 'dbl', // bottom left (bottom left corner)
			bm: 'dbm', // bottom middle
			br: 'dbr'  // bottom right (bottom right corner)
		})
	});

NOTE: the offsetX and offsetY values in the above example are spritesheet offsets. The offsets are based off multiples of the width/height.

Methods (static)

Name	Parameter	Type	Description
asset	initializes a resource asset to be used as a reference in the creation of entities. Its only parameter is an options object literal with the following required properties.
	* options.name	String	name of asset.
	* options.tl	String	top left Sprite asset (top left corner).
	* options.tm	String	top middle Sprite asset.
	* options.tr	String	top right Sprite asset (top right corner).
	* options.ml	String	middle left Sprite asset.
	* options.mm	String	middle middle Sprite asset.
	* options.mr	String	middle right Sprite asset.
	* options.bl	String	bottom left Sprite asset (bottom left corner).
	* options.bm	String	bottom middle Sprite asset.
	* options.br	String	bottom right Sprite asset (bottom right corner).
create	creates an entity object to be used for instantiating in Rooms.
	* assetName	String	existing asset name.
	options.name	String	name of new entity. This is optional; if none provided, defaults to assetName.
	* options.width	Number	total width (including the repeating borders). This can be dynamically resized at run-time.
	* options.height	Number	total height (including the repeating borders). This can be dynamically resized at run-time.
	options.originX	Number	the registration X value; between 0-1. 0.5 means middle. (default: 0)
	options.originY	Number	the registration Y value; between 0-1. 0.5 means middle. (default: 0)
	options.foreground	Boolean	if set to TRUE, Dialog will appear in front of non-foregound entities. (default: FALSE)
	options.alpha	Number	alpha transparency, with 0 being fully transparent and 1 being fully opaque. (default: 1)
createChild	creates a child entity object to be used for instantiating in Rooms.
	* entityName	String	name of an existing entity to clone.
	options.???	Mixed	same as create* options.*
add	instantiates an entity object into the current Room.
	* entityName	String	name of existing entity reference to instantiate.
	* options.x	Number	x coordinate to place in game.
	* options.y	Number	y coordinate to place in game.
	options.???	Object	same as create* options; name not required.*

Properties (object)

Name	Type	Description
x	Number	the x coordinate to place in game.
y	Number	the y coordinate to place in game.
alpha	Number	the alpha transparency, with 0 being fully transparent and 1 being fully opaque.
text	Object	An existing Text entity can be assigned to a Dialog. This means that the text object can leverage its containing Dialog's properties. For example, when creating a Dialog, you can accurately position the text object relative to itself, and conversely, you can dynamically adjust the Dialog's width and height to match the new Text object's width and height. Assigning a Text entity to a Dialog also means that when then the Dialog is faded out or destroyed, all of its associated elements are also faded out and/or destroyed. GAME.initInterface(function(){ var dialog = GAME.Dialog.create('dialog', {name:'dialog', width:200, height:100}); dialog.onCreate(function(obj){ var content = 'Hello World, this is JackyJS!'; obj.text = GAME.Text.add('test', { name: 'dialogText', x: obj.x-obj.width/2, y: obj.y-obj.height/2, originX: 0, originY: 0, content: content, foreground: true, style: { wordWrapWidth: obj.width, dropShadowDistance: 1, dropShadow: true, fill: '#ffff00' } }); obj.size({width:obj.text.width, height:obj.text.height}, function(obj){ obj.text.x = obj.x-obj.width/2; obj.text.y = obj.y-obj.height/2; }); obj.fadeIn({time:500, easing:true, alpha:0.90}); }); });

Methods (object)

Name	Parameter	Type	Description
size	sizes a dialog window in real-time. This can be used to dynamically adjust the window dimensions according its containing text width. See above example for details.
	* options.width	Number	the new width.
	* options.height	Number	the new height.
	options.time	Number	the time duration, in milliseconds, of the effect. (default: 200)

Events (object)

See Core > Entity : Events for available events.