Game interface logic: yourgamename.js - Sejarah semakan

Victoria la: /* Animations */

2016-08-31T01:59:47Z

Animations

← Semakan terdahulu		Semakan pada 03:59, 31 Ogos 2016
Baris 218:		Baris 218:
	'''this.slideToObjectPos( mobile_obj, target_obj, target_x, target_y, duration, delay )'''		'''this.slideToObjectPos( mobile_obj, target_obj, target_x, target_y, duration, delay )'''

	This method does exactly the same ~~than~~ "~~slideToObjectPos~~", except than you can specify some (x,y) coordinates. This way, "mobile_obj" will slide to the specified x,y position relatively to "target_obj".		This method does exactly the same as "slideToObject", except than you can specify some (x,y) coordinates. This way, "mobile_obj" will slide to the specified x,y position relatively to "target_obj".

	Example: slide a token to some place on the board, 10 pixels to the bottom:		Example: slide a token to some place on the board, 10 pixels to the bottom:

Victoria la: /* Dialogs */

2016-07-26T02:09:48Z

Dialogs

← Semakan terdahulu		Semakan pada 04:09, 26 Julai 2016
Baris 597:		Baris 597:
	Sometimes although, you need to display a dialog window. Here is how you do this:		Sometimes although, you need to display a dialog window. Here is how you do this:

	~~<pre>~~

	// Create the new dialog. You should store the handler in a member variable to access it later		// Create the new dialog. You should store the handler in a member variable to access it later
	this.myDlg = new dijit.Dialog({ title: _("my dialog title to translate") });		this.myDlg = new dijit.Dialog({ title: _("my dialog title to translate") });

	// Create the HTML of my dialog. The best practice here is to use [[Game_layout:_view_and_template:_yourgamename.view.php_and_yourgamename_yourgamename.tpl#Javascript_templates\|Javascript templates]]:		// Create the HTML of my dialog.
			// The best practice here is to use [[Game_layout:_view_and_template:_yourgamename.view.php_and_yourgamename_yourgamename.tpl#Javascript_templates\|Javascript templates]]
	var html = this.format_block( 'jstpl_myDialogTemplate', {		var html = this.format_block( 'jstpl_myDialogTemplate', {
	arg1: myArg1,		arg1: myArg1,
Baris 608:		Baris 609:
	...		...
	} );		} );

	// Show the dialog		// Show the dialog
	this.myDlg.attr("content", html );		this.myDlg.attr("content", html );
	this.myDlg.show();		this.myDlg.show();

	// Now that the dialog has been displayed, you can connect your method to some dialog elements		// Now that the dialog has been displayed, you can connect your method to some dialog elements
	// Example, a "close" button:		// Example, a "close" button:
Baris 620:		Baris 621:
	} );		} );

	~~</pre>~~

	Tip: be careful with "hide()" method to close your dialog: the dialog and its content is not completely removed from the DOM. It can cause you problems if you try to display the same dialog several times. A good practice is to wrap all the content of your dialog in a "<div id='myDlgContent'>" div element, and to call "dojo.destroy('myDlgContent')" before displaying your dialog.
			Tip: be careful with "hide()" method to close your dialog: the dialog and its content is not completely removed from the DOM. It can cause you problems if you try to display the same dialog several times. A good practice is to wrap all the content of your dialog in a <nowiki><div id='myDlgContent'></nowiki> div element, and to call "dojo.destroy('myDlgContent')" before displaying your dialog.

	=== Scoring dialogs ===		=== Scoring dialogs ===

Victoria la: /* Confirmation dialog */

2016-07-26T02:02:32Z

Confirmation dialog

@@ Baris 575: / Baris 575: @@
              this.ajaxcall( '/mygame/mygame/makeThis.html', { lock:true }, this, function( result ) {} );
          } ) );
 </pre>

Sourisdudesert: /* Players input */

2015-11-06T15:54:21Z

Players input

← Semakan terdahulu		Semakan pada 17:54, 6 November 2015
Baris 405:		Baris 405:
	: Same as dojo.connect(), but for all the nodes set with the specified cssClassName		: Same as dojo.connect(), but for all the nodes set with the specified cssClassName

	'''this.addActionButton( id, label, method, (opt)depreciated, (opt)bHighlight )'''		'''this.addActionButton( id, label, method, (opt)depreciated, (opt)bHighlight, (opt)color )'''

	You can use this method to add an action button in the main action status bar.		You can use this method to add an action button in the main action status bar.
Baris 414:		Baris 414:
	* method: the name of your method that must be triggered when the player clicks on this button.		* method: the name of your method that must be triggered when the player clicks on this button.
	* depreciated (optional): do not use this. Please not specify this argument or use "null".		* depreciated (optional): do not use this. Please not specify this argument or use "null".
	* bHighlight: if set to "true", the button is going blink to catch player's attention. Please don't abuse of blinking button.		* bHighlight (optional): if set to "true", the button is going blink to catch player's attention. Please don't abuse of blinking button.
			* color: could be '''blue''' (default), '''red''' or '''gray'''.

	You should only use this method in your "onUpdateActionButtons" method. Usually, you use it like this (from Hears example):		You should only use this method in your "onUpdateActionButtons" method. Usually, you use it like this (from Hears example):

Ludovic: /* Access and manipulate the DOM */

2015-10-31T10:15:47Z

Access and manipulate the DOM

← Semakan terdahulu		Semakan pada 12:15, 31 Oktober 2015
Baris 164:		Baris 164:
	values possibles :		values possibles :

	"replace" : (see description above)		"replace" : (see description above).

	"first" : Places the node as a child of the reference node. The node is placed as the first child.		"first" : Places the node as a child of the reference node. The node is placed as the first child.

	"last" : Places the node as a child of the reference node. The node is placed as the last child.		"last" : Places the node as a child of the reference node. The node is placed as the last child.

	"before" : places the node right before the reference node.		"before" : places the node right before the reference node.

	"last (value by default) " : places the node right after the reference node.		"last (value by default) " : places the node right after the reference node.

	"only" : replaces all children of the reference node with the node.		"only" : replaces all children of the reference node with the node.

	positif integer : This parameter can be a positif integer. In this case, the node will be placed as a child of the reference node with this number (counting from 0). If the number is more than number of children, the node will be appended to the reference node making it the last child.		positif integer : This parameter can be a positif integer. In this case, the node will be placed as a child of the reference node with this number (counting from 0). If the number is more than number of children, the node will be appended to the reference node making it the last child.

Ludovic: /* Access and manipulate the DOM */

2015-10-31T10:14:39Z

Access and manipulate the DOM

@@ Baris 160: / Baris 160: @@
 </pre>
-Note: the third parameter of dojo.place can take various interesting value: "first", "after", ... [http://dojotoolkit.org/reference-guide/1.7/dojo/place.html See full doc on dojo.place].
+The third parameter of dojo.place can take various interesting value.
 Usually, when you want to insert some piece of HTML in your game interface, you should use "[[Game_layout:_view_and_template:_yourgamename.view.php_and_yourgamename_yourgamename.tpl#Javascript_templates|Javascript templates]]".

Archduke: /* General tips */

2014-06-05T16:00:00Z

General tips

← Semakan terdahulu		Semakan pada 18:00, 5 Jun 2014
Baris 33:		Baris 33:
	: You can update it as needed to keep an up to date reference of the game on the client side if you need it (most of the time you don't).		: You can update it as needed to keep an up to date reference of the game on the client side if you need it (most of the time you don't).

	; isCurrentPlayerActive()		; this.isCurrentPlayerActive()
	: Returns true if the player on whose browser the code is running is currently active (it's his turn to play)		: Returns true if the player on whose browser the code is running is currently active (it's his turn to play)

Quinarbre: /* Tooltips */

2014-04-30T23:36:24Z

Tooltips

← Semakan terdahulu		Semakan pada 01:36, 1 Mei 2014
Baris 513:		Baris 513:
	IMPORTANT: all concerned nodes must have IDs to get tooltips.		IMPORTANT: all concerned nodes must have IDs to get tooltips.

	'''addTooltipHtmlToClass( cssClass, html, delay )'''		'''this.addTooltipHtmlToClass( cssClass, html, delay )'''

	Add an HTML tooltip to to all the DOM nodes set with this cssClass (for more elaborate content such as presenting a bigger version of a card).		Add an HTML tooltip to to all the DOM nodes set with this cssClass (for more elaborate content such as presenting a bigger version of a card).

	IMPORTANT: all concerned nodes must have IDs to get tooltips		IMPORTANT: all concerned nodes must have IDs to get tooltips

			'''this.removeTooltip( nodeId )'''

			Remove a tooltip from the DOM node.

	== Dialogs, warning messages, confirmation dialogs, ... ==		== Dialogs, warning messages, confirmation dialogs, ... ==

Sourisdudesert: /* Adding stuff to player's panel */

2014-03-24T17:43:35Z

Adding stuff to player's panel

← Semakan terdahulu		Semakan pada 19:43, 24 Mac 2014
Baris 677:		Baris 677:
	At first, create a new "JS template" string in your template (tpl) file:		At first, create a new "JS template" string in your template (tpl) file:

	(from ~~Reversi~~ example)		(from Gomoku example)
	<pre>		<pre>
	var jstpl_player_board = '\<div class="cp_board">\		var jstpl_player_board = '\<div class="cp_board">\

Sourisdudesert: /* Animations */

2014-03-19T10:51:16Z

Animations

← Semakan terdahulu		Semakan pada 12:51, 19 Mac 2014
Baris 231:		Baris 231:
	Example:		Example:
	<pre>		<pre>
	this.slideToObjectAndDestroy( "some_token", "some_place_on_board", 1000, 0 ~~).play(~~);		this.slideToObjectAndDestroy( "some_token", "some_place_on_board", 1000, 0 );
	</pre>		</pre>