Stock - Riwayat revisi

Sourisdudesert: /* Using stock: a simple example */

2013-04-08T12:33:20Z

Using stock: a simple example

← Revisi sebelumnya		Revisi per 8 April 2013 14.33
Baris 18:		Baris 18:

	Let's have a look on how the stock is used in game "Hearts" to display a hand of standard cards.		Let's have a look on how the stock is used in game "Hearts" to display a hand of standard cards.

			At first, don't forget to add "ebg/stock" as a dependency:
			<pre>
			define([
			"dojo","dojo/_base/declare",
			"ebg/core/gamegui",
			"ebg/counter",
			"ebg/stock" /// <==== HERE
			],
			</pre>

	The stock is initialized in Javascript "setup" method like this:		The stock is initialized in Javascript "setup" method like this:

Sourisdudesert: /* Complete stock component reference */

2013-03-20T17:00:01Z

Complete stock component reference

← Revisi sebelumnya		Revisi per 20 Maret 2013 19.00
Baris 97:		Baris 97:
	g_themeurl+'img/your_game_name/yourimage.png'		g_themeurl+'img/your_game_name/yourimage.png'
	</pre>		</pre>
	_ image_position: if "image" specify the URL of a CSS sprite, you must specify the position of the item image in this CSS sprite. For example, if you have a CSS sprite with 3 cubes with a size of 20x20 pixels each (so your CSS image has for example a size of 20x60 or 60x20), you specify "0" for the first cube image, 1 for the second, 2 for the third.		* image_position: if "image" specify the URL of a CSS sprite, you must specify the position of the item image in this CSS sprite. For example, if you have a CSS sprite with 3 cubes with a size of 20x20 pixels each (so your CSS image has for example a size of 20x60 or 60x20), you specify "0" for the first cube image, 1 for the second, 2 for the third.
	Important: there are more than one line of items in your CSS sprite, you must specify how many items per line you have in your CSS sprite like this:		Important: there are more than one line of items in your CSS sprite, you must specify how many items per line you have in your CSS sprite like this:
	<pre>		<pre>

Sourisdudesert: /* Complete stock component reference */

2013-03-20T16:59:47Z

Complete stock component reference

← Revisi sebelumnya		Revisi per 20 Maret 2013 18.59
Baris 89:		Baris 89:

	Parameters:		Parameters:
	_ type: ID of the type to add. You can choose any positive integer. All item types must have distinct IDs.		* type: ID of the type to add. You can choose any positive integer. All item types must have distinct IDs.
	_ weight: weight of items of this type. Weight value is used to sort items of the stock during the display. Note that you can specify the same weight for all items (in this case they are not sorted).		* weight: weight of items of this type. Weight value is used to sort items of the stock during the display. Note that you can specify the same weight for all items (in this case they are not sorted).
	_ image: URL of item image. Most of the time, you will use a CSS sprite for stock item, so you have to specify CSS sprite image here.		* image: URL of item image. Most of the time, you will use a CSS sprite for stock item, so you have to specify CSS sprite image here.

	Be careful: you must specify the image url as this:		Be careful: you must specify the image url as this:
	<pre>		<pre>

Sourisdudesert: /* Complete stock component reference */

2013-03-20T16:59:00Z

Complete stock component reference

← Revisi sebelumnya		Revisi per 20 Maret 2013 18.59
Baris 234:		Baris 234:
	},		},
	</pre>		</pre>

			Note: The "control_name" argument is the ID (the "DOM" id) of the <div> container of your stock control. Using "control_name", you can use the same callback method for different Stock control and see which one trigger the method.

	'''getSelectedItems()'''		'''getSelectedItems()'''

Sourisdudesert: /* Tips when adding/removing items to/from Stock components */

2013-03-06T15:06:03Z

Tips when adding/removing items to/from Stock components

← Revisi sebelumnya		Revisi per 6 Maret 2013 17.06
Baris 298:		Baris 298:
	The usual way is the following:		The usual way is the following:

	'''~~1st case~~'''		'''Situation A''':

	When you add a card to a stock item, and this card is '''not''' coming from another stock: use "addToStockWithId" with a "from" argument set to the element of your interface where card should come from.		When you add a card to a stock item, and this card is '''not''' coming from another stock: use "addToStockWithId" with a "from" argument set to the element of your interface where card should come from.

	'''~~2nd case~~'''		'''Situation B''':

	When you add a card to a stock item, and this card is coming from another stock:		When you add a card to a stock item, and this card is coming from another stock:
Baris 309:		Baris 309:
	(note that it's important to do things in this order, because source item must still exists when you use it as the origin of the slide).		(note that it's important to do things in this order, because source item must still exists when you use it as the origin of the slide).

	'''~~3rd case~~'''		'''Situation C''':

	When you move a card from a stock item to something that is not a stock item:		When you move a card from a stock item to something that is not a stock item:

Sourisdudesert pada 6 Maret 2013 15.05

2013-03-06T15:05:36Z

← Revisi sebelumnya		Revisi per 6 Maret 2013 17.05
Baris 293:		Baris 293:

	</pre>		</pre>

			== Tips when adding/removing items to/from Stock components ==

			The usual way is the following:

			'''1st case'''

			When you add a card to a stock item, and this card is '''not''' coming from another stock: use "addToStockWithId" with a "from" argument set to the element of your interface where card should come from.

			'''2nd case'''

			When you add a card to a stock item, and this card is coming from another stock:
			* on the destination Stock, use "addToStockWithId" with a "from" equals to the HTML id of the corresponding item in the source Stock. For example, If the source stock id is "myHand", then the HTML id of card 48 is "myHand_item_48".
			* then, remove the source item with "removeFromStockById".
			(note that it's important to do things in this order, because source item must still exists when you use it as the origin of the slide).

			'''3rd case'''

			When you move a card from a stock item to something that is not a stock item:
			* insert the card as a classic HTML template (dojo.place / this.format_block).
			* place it on the Stock item with "this.placeOnObject", using Stock item HTML id (see above).
			* slide it to its new position with "this.slideToObject"
			* remove the card from the Stock item with "removeFromStockById".

			Using the methods above, your cards should slided to, from and between your Stock controls smoothly

Sourisdudesert: /* Complete stock component reference */

2013-02-12T12:11:45Z

Complete stock component reference

← Revisi sebelumnya		Revisi per 12 Februari 2013 14.11
Baris 266:		Baris 266:

	See "Jaipur" game to see an example to use of this function.		See "Jaipur" game to see an example to use of this function.

			'''onItemCreate'''

			Using onItemCreate, you can trigger a method each time a new item is added to the Stock, in order you can customize it.

			Complete example:
			<pre>
			// During "setup" phase, we associate our method "setupNewCard" with the creation of a new stock item:
			this.myStockItem.onItemCreate = dojo.hitch( this, 'setupNewCard' );

			(...)

			// And here is our "setupNewCard":
			setupNewCard: function( card_div, card_type_id, card_id )
			{
			// Add a special tooltip on the card:
			this.addTooltip( card_div.id, _("Some nice tooltip for this item"), '' );

			// Note that "card_type_id" contains the type of the item, so you can do special actions depending on the item type

			// Add some custom HTML content INSIDE the Stock item:
			dojo.place( this.format_block( 'jstpl_my_card_content', {
			....
			} ), card_div.id );
			}

			</pre>

Sourisdudesert: /* Complete stock component reference */

2013-02-02T08:55:38Z

Complete stock component reference

← Revisi sebelumnya		Revisi per 2 Februari 2013 10.55
Baris 167:		Baris 167:

	If you moved an item from the stock control manually (ex: after a drag'n'drop) and want to reset their position to their original ones, you can call this method.		If you moved an item from the stock control manually (ex: after a drag'n'drop) and want to reset their position to their original ones, you can call this method.

			'''item_margin'''

			By default, there is a margin of 5px between the items of a stock. You can change the member variable "item_margin" to change this.

			Example:
			<pre>
			this.myStockControl.item_margin=5;
			</pre>

	'''changeItemsWeight( newWeights )'''		'''changeItemsWeight( newWeights )'''

Pikiou: /* Complete stock component reference */

2013-01-26T04:58:23Z

Complete stock component reference

← Revisi sebelumnya		Revisi per 26 Januari 2013 06.58
Baris 71:		Baris 71:
	Parameters:		Parameters:
	* page: the container page. Usually: "this".		* page: the container page. Usually: "this".
	* container_div: the container "<div>" element (a void <div> element in your template).		* container_div: the container "<div>" element (a void <div> element in your template, with an id).
	* a stock item width and height, in pixels.		* a stock item width and height, in pixels.

Sourisdudesert: /* Complete stock component reference */

2013-01-23T06:45:58Z

Complete stock component reference

Lihat perubahan