<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>https://en.doc.boardgamearena.com/api.php?action=feedcontributions&amp;feedformat=atom&amp;user=Elliot+K</id>
	<title>Board Game Arena - User contributions [en]</title>
	<link rel="self" type="application/atom+xml" href="https://en.doc.boardgamearena.com/api.php?action=feedcontributions&amp;feedformat=atom&amp;user=Elliot+K"/>
	<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/Special:Contributions/Elliot_K"/>
	<updated>2026-10-19T11:49:00Z</updated>
	<subtitle>User contributions</subtitle>
	<generator>MediaWiki 1.39.0</generator>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Gamehelpriftforce&amp;diff=23524</id>
		<title>Gamehelpriftforce</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Gamehelpriftforce&amp;diff=23524"/>
		<updated>2024-12-17T17:45:49Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: &lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Overview ==&lt;br /&gt;
Riftforce is a 2 player game. You face up head to head, turn after turn.&lt;br /&gt;
&lt;br /&gt;
If a player reaches 12 points the end of the game is triggered. Finally the player with the most points wins (of course).&lt;br /&gt;
&lt;br /&gt;
The game starts with the guild selection and with players taking turns.&lt;br /&gt;
&lt;br /&gt;
== Guild Selection ==&lt;br /&gt;
The base game contains 10 guilds. Each guild has a unique ability you can activate on your turn.&lt;br /&gt;
One guild is assigned randomly to every player. From the remaining 8 guilds, one is discarded. From the remaining 7 cards the players draft guilds until every player has 4 guilds.&lt;br /&gt;
&lt;br /&gt;
For each guild, 4 elementals with 5 life points, 3 elementals with 6 life points, and 2 elementals with 7 life points are shuffled and 7 cards are drawn to start the game.&lt;br /&gt;
&lt;br /&gt;
== Turn Overview ==&lt;br /&gt;
On your turn you perform 1 action. You can choose from these 3 possible actions:&lt;br /&gt;
&lt;br /&gt;
*• Play Cards&lt;br /&gt;
*• Activate&lt;br /&gt;
*• Check &amp;amp; Draw&lt;br /&gt;
&lt;br /&gt;
After that your opponent takes a turn, also choosing one action and then it comes back to you.&lt;br /&gt;
&lt;br /&gt;
== Possible Actions ==&lt;br /&gt;
&lt;br /&gt;
=== Play ===&lt;br /&gt;
Play up to 3 elementals from your hand to locations on your side of the Rift. They must either all show the same symbol or all show the same number.&lt;br /&gt;
&lt;br /&gt;
You can play these elementals either&lt;br /&gt;
&lt;br /&gt;
*• individually to three adjacent locations (1 elemental per location)&lt;br /&gt;
*• together in an order of your choice all to the same location&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Note that the outermost locations on both ends are not considered adjacent to each other.&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
=== Activate === &lt;br /&gt;
Select 1 elemental from your hand, show it face up and discard it your discard pile.  &lt;br /&gt;
&lt;br /&gt;
Activate up to 3 elementals that either &lt;br /&gt;
&lt;br /&gt;
*• all show the same number&lt;br /&gt;
*• all show the same symbol&lt;br /&gt;
&lt;br /&gt;
as the just discarded elemental.&lt;br /&gt;
&lt;br /&gt;
The elementals you activate can be at any location and do not have to be adjacent to each other.&lt;br /&gt;
&lt;br /&gt;
When you activate an elemental, it uses the ability described on its guild’s summoner. You must resolve all steps of the ability in order from top to bottom as much as you can.&lt;br /&gt;
&lt;br /&gt;
When elementals change their position through abilities they are placed at the last position of the new location.&lt;br /&gt;
&lt;br /&gt;
With most abilities you will place damage on the „first enemy”. This is the elemental closest to the location. &lt;br /&gt;
&lt;br /&gt;
When you activate an elemental, resolve its ability completely and then check if you destroyed any elementals before activating your next elemental.&lt;br /&gt;
&lt;br /&gt;
If the damage total on an elemental is equal to or higher than its number, that elemental is destroyed (discarded to the players discard pile). You gain 1 Riftforce for each destroyed enemy. &lt;br /&gt;
&lt;br /&gt;
If an ability places more damage on an elemental than is needed to destroy it, the excess damage is not carried over to the next elemental.&lt;br /&gt;
&lt;br /&gt;
=== Check &amp;amp; Draw === &lt;br /&gt;
You can only choose this action if you have less than 7 elementals in your hand. &lt;br /&gt;
&lt;br /&gt;
Check if you control any of the locations. You control a location if at least 1 of your elementals and no enemy is present there. &lt;br /&gt;
&lt;br /&gt;
You gain 1 Riftforce for each controlled location. &lt;br /&gt;
&lt;br /&gt;
If you choose this action only you can gain Riftforce even if your opponent controls locations at that moment.&lt;br /&gt;
&lt;br /&gt;
Now draw elementals from your draw pile until you have 7 elementals in your hand.&lt;br /&gt;
&lt;br /&gt;
== GAME END ==&lt;br /&gt;
As soon as a player reaches 12 Riftforce the game end is triggered.&lt;br /&gt;
&lt;br /&gt;
After finishing the action completely, the opponent gets a last action if the player triggering the game end is the starting player. That way both of you get the same amount of actions.&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Deck&amp;diff=12031</id>
		<title>Deck</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Deck&amp;diff=12031"/>
		<updated>2022-02-22T18:04:22Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Mention possible consequences of overflowing DB field size limits with location names including player IDs&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;{{Studio_Framework_Navigation}}&lt;br /&gt;
&lt;br /&gt;
&amp;quot;Deck&amp;quot; is one of the most useful component on the PHP side. With &amp;quot;Deck&amp;quot;, you can manage the cards in your game on the server side.&lt;br /&gt;
&lt;br /&gt;
Using &amp;quot;deck&amp;quot;, you will be able to use the following features without writing a single SQL database request:&lt;br /&gt;
* Place cards in a pile, shuffle cards, draw cards one by one or many at a time.&lt;br /&gt;
* &amp;quot;Auto-reshuffle&amp;quot; the discard pile into the deck when the deck is empty.&lt;br /&gt;
* Move cards between different locations: hands of players, the table, etc.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Using Deck: Hearts example ==&lt;br /&gt;
&lt;br /&gt;
The Deck component is extensively used in the sample &#039;&#039;Hearts&#039;&#039; card game. You will find in &amp;quot;hearts.game.php&amp;quot; that the object &amp;quot;$this-&amp;gt;cards&amp;quot; is used many times.&lt;br /&gt;
&lt;br /&gt;
== Deck overview ==&lt;br /&gt;
&lt;br /&gt;
With Deck component, you manage all cards of your game.&lt;br /&gt;
&lt;br /&gt;
=== The 5 properties of each card ===&lt;br /&gt;
&lt;br /&gt;
Using the Deck component, each card will have 5 properties:&lt;br /&gt;
* &#039;&#039;&#039;id&#039;&#039;&#039;: This is the unique ID of each card.&lt;br /&gt;
* &#039;&#039;&#039;type&#039;&#039;&#039; and &#039;&#039;&#039;type_arg&#039;&#039;&#039;: These two values define the type of your card (i.e., what sort of card is this?).&lt;br /&gt;
* &#039;&#039;&#039;location&#039;&#039;&#039; and &#039;&#039;&#039;location_arg&#039;&#039;&#039;: These two values define where the card is at now.&lt;br /&gt;
&lt;br /&gt;
The id, type, and type_arg properties are constants throughout the game. location and location_arg change when your cards move from one place to another in the game area.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;id&#039;&#039;&#039; is the unique ID of each card. Two cards cannot have the same ID. IDs are generated automatically by the Deck component when you create cards during the Setup phase of your game.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;type&#039;&#039;&#039; and &#039;&#039;&#039;type_arg&#039;&#039;&#039; defines the type of your card.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;type&#039;&#039;&#039; is a short string, and &#039;&#039;&#039;type_arg&#039;&#039;&#039; is an integer.&lt;br /&gt;
&lt;br /&gt;
You can use these two values as you like to make sure you will be able to identify the different cards in the game. See usage of &amp;quot;type&amp;quot; and &amp;quot;type_arg&amp;quot; below.&lt;br /&gt;
&lt;br /&gt;
Examples of usage of &amp;quot;type&amp;quot; and &amp;quot;type_arg&amp;quot;:&lt;br /&gt;
* In &#039;&#039;Hearts&#039;&#039;, &amp;quot;type&amp;quot; represents the color (suite) of the card (1 to 4) and &amp;quot;type_arg&amp;quot; is the value of the card (1, 2, ... 10, J, Q, K).&lt;br /&gt;
* In &#039;&#039;Seasons&#039;&#039;, &amp;quot;type&amp;quot; represents the type of the card (e.g., 1 is Amulet of Air, 2 is Amulet of Fire, etc...). type_arg is not used.&lt;br /&gt;
* In &#039;&#039;Takenoko&#039;&#039;, a Deck component is used for objective cards. &amp;quot;type&amp;quot; is the kind of objective (irrigation/panda/plot) and &amp;quot;type_arg&amp;quot; is the ID of the specific objective to realize (e.g., &amp;quot;green bamboo x4&amp;quot;). Note that a second Deck component is used in &#039;&#039;Takenoko&#039;&#039; to manage the &amp;quot;garden plot&amp;quot; pile.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;location&#039;&#039;&#039; and &#039;&#039;&#039;location_arg&#039;&#039;&#039; define where a card is at now. &#039;&#039;&#039;location&#039;&#039;&#039; is a short string, and &#039;&#039;&#039;location_arg&#039;&#039;&#039; is an integer.&lt;br /&gt;
&lt;br /&gt;
You can use &#039;location&#039; and &#039;location_arg&#039; as you like, to move your card within the game area.&lt;br /&gt;
&lt;br /&gt;
There are 3 special &#039;location&#039; values that Deck manages automatically. You can choose to use these locations or not, depending on your needs:&lt;br /&gt;
* &#039;deck&#039;: the &#039;deck&#039; location is a standard draw deck. Cards are placed face down in a stack and are drawn in sequential order during the game. &#039;location_arg&#039; is used to specify where the card is located within the stack (the card with the highest location_arg value is the next to be drawn).&lt;br /&gt;
* &#039;hand&#039;: the &#039;hand&#039; location represents cards in a player&#039;s hand. &#039;location_arg&#039; is set to the ID of each player.&lt;br /&gt;
* &#039;discard&#039;: the &#039;discard&#039; location is used for discard piles. Card in &#039;discard&#039; may be reshuffled into the deck if needed (see &amp;quot;autoreshuffle&amp;quot;).&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Tips: using the Deck component, you will use generic properties (&amp;quot;location&amp;quot;, &amp;quot;type_arg&amp;quot;,...) for specific purposes in your game. Thus, during the design step before realizing your game, take a few minutes to write down the exact meaning of each of these generic properties in the context of your game.&lt;br /&gt;
&lt;br /&gt;
=== Create a new Deck component ===&lt;br /&gt;
&lt;br /&gt;
For each Deck component in your game, you need to create a dedicated table in the SQL database. This table has a standard format. In practice, if you just want to have a Deck component named &amp;quot;card&amp;quot;, you can copy/paste the following into your &amp;quot;dbmodel.sql&amp;quot; file:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
CREATE TABLE IF NOT EXISTS `card` (&lt;br /&gt;
  `card_id` int(10) unsigned NOT NULL AUTO_INCREMENT,&lt;br /&gt;
  `card_type` varchar(16) NOT NULL,&lt;br /&gt;
  `card_type_arg` int(11) NOT NULL,&lt;br /&gt;
  `card_location` varchar(16) NOT NULL,&lt;br /&gt;
  `card_location_arg` int(11) NOT NULL,&lt;br /&gt;
  PRIMARY KEY (`card_id`)&lt;br /&gt;
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: the database schema of this table does not have to be exactly what is listed above. You can increase the size of the fields or add more fields. For additional fields&lt;br /&gt;
you just have to do manual queries.&lt;br /&gt;
&lt;br /&gt;
In particular, if you are going to have deck locations specific to individual players, you may wish to use their player IDs in the card_location field. Those IDs can be 8+ characters long, leaving only 8 characters for the rest of the name if you use the varchar(16). If you exceed the size of the field, it will get silently truncated, which can be very difficult to troubleshoot!&lt;br /&gt;
&lt;br /&gt;
Once you have done this (and restarted your game), you can declare the Deck component in your PHP code in your class constructor. For &#039;&#039;Hearts&#039;&#039; for example, I added to the &amp;quot;Hearts()&amp;quot; method:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        $this-&amp;gt;cards = self::getNew( &amp;quot;module.common.deck&amp;quot; );&lt;br /&gt;
        $this-&amp;gt;cards-&amp;gt;init( &amp;quot;card&amp;quot; );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note that we specify &amp;quot;card&amp;quot; here: the name of our previously created table. This means you can create several &amp;quot;Deck&amp;quot; components with multiple tables:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        $this-&amp;gt;firstKindCards = self::getNew( &amp;quot;module.common.deck&amp;quot; );&lt;br /&gt;
        $this-&amp;gt;firstKindCards -&amp;gt;init( &amp;quot;first_kind_card&amp;quot; );&lt;br /&gt;
        $this-&amp;gt;secondKindCards = self::getNew( &amp;quot;module.common.deck&amp;quot; );&lt;br /&gt;
        $this-&amp;gt;secondKindCards -&amp;gt;init( &amp;quot;second_kind_card&amp;quot; );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Most of the time this is not useful; a Deck component should manage all objects of the same kind (i.e., all cards in the game).&lt;br /&gt;
Note that you need to create a table for each &amp;quot;Deck&amp;quot;, table name should be &amp;quot;first_kind_card&amp;quot; but the fields must remain &amp;quot;card_id&amp;quot;, &amp;quot;card_type&amp;quot; and so on.&lt;br /&gt;
&lt;br /&gt;
Afterwards, we can initialize your &amp;quot;Deck&amp;quot; by creating all the cards of the game. Generally, this is done only once during the game, in the &amp;quot;setupNewGame&amp;quot; method.&lt;br /&gt;
&lt;br /&gt;
The &amp;quot;Deck&amp;quot; component provides a fast way to initialize all your cards at once: createCards. Here is how it is used for &amp;quot;Hearts&amp;quot;:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        // Create cards&lt;br /&gt;
        $cards = array();&lt;br /&gt;
        foreach( $this-&amp;gt;colors as  $color_id =&amp;gt; $color ) // spade, heart, diamond, club&lt;br /&gt;
        {&lt;br /&gt;
            for( $value=2; $value&amp;lt;=14; $value++ )   //  2, 3, 4, ... K, A&lt;br /&gt;
            {&lt;br /&gt;
                $cards[] = array( &#039;type&#039; =&amp;gt; $color_id, &#039;type_arg&#039; =&amp;gt; $value, &#039;nbr&#039; =&amp;gt; 1);&lt;br /&gt;
            }&lt;br /&gt;
        }&lt;br /&gt;
&lt;br /&gt;
        $this-&amp;gt;cards-&amp;gt;createCards( $cards, &#039;deck&#039; );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
As you can see, &amp;quot;createCards&amp;quot; takes a description of all cards of the game. For each type of card, you have to specify its &amp;quot;type&amp;quot;, &amp;quot;type_arg&amp;quot; and the number of cards to create (&amp;quot;nbr&amp;quot;). &amp;quot;createCards&amp;quot; create all cards and place them into the &amp;quot;deck&amp;quot; location (as specified in the second argument).&lt;br /&gt;
&lt;br /&gt;
Now, you are ready to use &amp;quot;Deck&amp;quot;!&lt;br /&gt;
&lt;br /&gt;
=== Simple examples using Deck ===&lt;br /&gt;
&lt;br /&gt;
(Most examples are from &amp;quot;Hearts&amp;quot; game)&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     // In &amp;quot;getAllDatas&#039;, we need to send to the current player all the cards he has in hand:&lt;br /&gt;
     $result[&#039;hand&#039;] = $this-&amp;gt;cards-&amp;gt;getCardsInLocation( &#039;hand&#039;, $player_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     // At some time we want to check if all the cards (52) are in player&#039;s hands:&lt;br /&gt;
     if( $this-&amp;gt;cards-&amp;gt;countCardInLocation( &#039;hand&#039; ) == 52 )&lt;br /&gt;
           // do something&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     // When a player plays a card in front of him on the table:&lt;br /&gt;
     $this-&amp;gt;cards-&amp;gt;moveCard( $card_id, &#039;cardsontable&#039;, $player_id );&lt;br /&gt;
&lt;br /&gt;
     // Note the use of the custom location &#039;cardsontable&#039; here to keep track of cards on the table.&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     // This is a new hand: let&#039;s gather all cards from everywhere in the deck:&lt;br /&gt;
     $this-&amp;gt;cards-&amp;gt;moveAllCardsInLocation( null, &amp;quot;deck&amp;quot; );&lt;br /&gt;
&lt;br /&gt;
     // And then shuffle the deck&lt;br /&gt;
     $this-&amp;gt;cards-&amp;gt;shuffle( &#039;deck&#039; );&lt;br /&gt;
&lt;br /&gt;
     // And then deal 13 cards to each player&lt;br /&gt;
     // Deal 13 cards to each players&lt;br /&gt;
     // Create deck, shuffle it and give 13 initial cards&lt;br /&gt;
     $players = self::loadPlayersBasicInfos();&lt;br /&gt;
     foreach( $players as $player_id =&amp;gt; $player )&lt;br /&gt;
     {&lt;br /&gt;
        $cards = $this-&amp;gt;cards-&amp;gt;pickCards( 13, &#039;deck&#039;, $player_id );&lt;br /&gt;
           &lt;br /&gt;
        // Notify player about his cards&lt;br /&gt;
        self::notifyPlayer( $player_id, &#039;newHand&#039;, &#039;&#039;, array( &lt;br /&gt;
            &#039;cards&#039; =&amp;gt; $cards&lt;br /&gt;
         ) );&lt;br /&gt;
     }  &lt;br /&gt;
&lt;br /&gt;
     // Note the use of &amp;quot;notifyPlayer&amp;quot; instead of &amp;quot;notifyAllPlayers&amp;quot;: new cards is a private information ;)  &lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Deck component reference ==&lt;br /&gt;
&lt;br /&gt;
=== Initializing Deck component ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;init( $table_name )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Initialize the Deck component.&lt;br /&gt;
&lt;br /&gt;
Argument:&lt;br /&gt;
* table_name: name of the DB table used by this Deck component.&lt;br /&gt;
&lt;br /&gt;
Must be called before any other Deck method.&lt;br /&gt;
&lt;br /&gt;
Usually, init is called in your game constructor.&lt;br /&gt;
&lt;br /&gt;
Example with Hearts:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
	function Hearts( )&lt;br /&gt;
	{&lt;br /&gt;
        (...)&lt;br /&gt;
        &lt;br /&gt;
        $this-&amp;gt;cards = self::getNew( &amp;quot;module.common.deck&amp;quot; );&lt;br /&gt;
        $this-&amp;gt;cards-&amp;gt;init( &amp;quot;card&amp;quot; );&lt;br /&gt;
	}&lt;br /&gt;
&amp;lt;/pre&amp;gt; &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;createCards( $cards, $location=&#039;deck&#039;, $location_arg=null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Create card items in your deck component. Usually, all card items are created once, during the setup phase of the game.&lt;br /&gt;
&lt;br /&gt;
&amp;quot;cards&amp;quot; describe all cards that need to be created. &amp;quot;cards&amp;quot; is an array with the following format:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
   // Create 1 card of type &amp;quot;1&amp;quot; with type_arg=99,&lt;br /&gt;
   //  and 4 cards of type &amp;quot;2&amp;quot; with type_arg=12,&lt;br /&gt;
   //  and 2 cards of type &amp;quot;3&amp;quot; with type_arg=33&lt;br /&gt;
&lt;br /&gt;
   $cards = array(&lt;br /&gt;
        array( &#039;type&#039; =&amp;gt; 1, &#039;type_arg&#039; =&amp;gt; 99, &#039;nbr&#039; =&amp;gt; 1 ),&lt;br /&gt;
        array( &#039;type&#039; =&amp;gt; 2, &#039;type_arg&#039; =&amp;gt; 12, &#039;nbr&#039; =&amp;gt; 4 ),&lt;br /&gt;
        array( &#039;type&#039; =&amp;gt; 3, &#039;type_arg&#039; =&amp;gt; 33, &#039;nbr&#039; =&amp;gt; 2 )&lt;br /&gt;
        ...&lt;br /&gt;
   );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: During the &amp;quot;createCards&amp;quot; process, Deck generates unique IDs for all card items.&lt;br /&gt;
&lt;br /&gt;
Note: createCards is optimized to create a lot of cards at once. Do not use it to create cards one by one.&lt;br /&gt;
&lt;br /&gt;
If &amp;quot;location&amp;quot; and &amp;quot;location_arg&amp;quot; arguments are not set, newly created cards are placed in the &amp;quot;deck&amp;quot; location. If &amp;quot;location&amp;quot; (and optionally location_arg) is specified, cards are created for this specific location.&lt;br /&gt;
&lt;br /&gt;
=== Card standard format ===&lt;br /&gt;
&lt;br /&gt;
When Deck component methods are returning one or several cards, the following format is used:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
array(&lt;br /&gt;
   &#039;id&#039; =&amp;gt; ..,          // the card ID&lt;br /&gt;
   &#039;type&#039; =&amp;gt; ..,        // the card type&lt;br /&gt;
   &#039;type_arg&#039; =&amp;gt; ..,    // the card type argument&lt;br /&gt;
   &#039;location&#039; =&amp;gt; ..,    // the card location&lt;br /&gt;
   &#039;location_arg&#039; =&amp;gt; .. // the card location argument&lt;br /&gt;
);&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Picking cards ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;pickCard( $location, $player_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Pick a card from a &amp;quot;pile&amp;quot; location (ex: &amp;quot;deck&amp;quot;) and place it in the &amp;quot;hand&amp;quot; of specified player.&lt;br /&gt;
&lt;br /&gt;
Return the card picked or &amp;quot;null&amp;quot; if there are no more card in given location.&lt;br /&gt;
&lt;br /&gt;
This method supports auto-reshuffle (see &amp;quot;auto-reshuffle&amp;quot; below).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;pickCards( $nbr, $location, $player_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Pick &amp;quot;$nbr&amp;quot; cards from a &amp;quot;pile&amp;quot; location (ex: &amp;quot;deck&amp;quot;) and place them in the &amp;quot;hand&amp;quot; of specified player.&lt;br /&gt;
&lt;br /&gt;
Return an array with the cards picked (indexed by the card ID), or &amp;quot;null&amp;quot; if there are no more card in given location.&lt;br /&gt;
&lt;br /&gt;
Note that the number of cards picked can be less than &amp;quot;$nbr&amp;quot; in case there are not enough cards in the pile location.&lt;br /&gt;
&lt;br /&gt;
This method supports auto-reshuffle (see &amp;quot;auto-reshuffle&amp;quot; below). In case there are not enough cards in the pile, all remaining cards are picked first, then the auto-reshuffle is triggered, then the other cards are picked.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;pickCardForLocation( $from_location, $to_location, $location_arg=0 )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This method is similar to &#039;pickCard&#039;, except that you can pick a card for any sort of location and not only the &amp;quot;hand&amp;quot; location.&lt;br /&gt;
&lt;br /&gt;
* from_location is the &amp;quot;pile&amp;quot; style location from where you are picking a card.&lt;br /&gt;
* to_location is the location where you will place the card picked.&lt;br /&gt;
* if &amp;quot;location_arg&amp;quot; is specified, the card picked will be set with this &amp;quot;location_arg&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
This method supports auto-reshuffle (see &amp;quot;auto-reshuffle&amp;quot; below).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;pickCardsForLocation( $nbr, $from_location, $to_location, $location_arg=0, $no_deck_reform=false )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This method is similar to &#039;pickCards&#039;, except that you can pick cards for any sort of location and not only the &amp;quot;hand&amp;quot; location.&lt;br /&gt;
&lt;br /&gt;
* from_location is the &amp;quot;pile&amp;quot; style location from where you are picking some cards.&lt;br /&gt;
* to_location is the location where you will place the cards picked.&lt;br /&gt;
* if &amp;quot;location_arg&amp;quot; is specified, the cards picked will be set with this &amp;quot;location_arg&amp;quot;.&lt;br /&gt;
* if &amp;quot;no_deck_reform&amp;quot; is set to &amp;quot;true&amp;quot;, the auto-reshuffle feature is disabled during this method call.&lt;br /&gt;
&lt;br /&gt;
This method supports auto-reshuffle (see &amp;quot;auto-reshuffle&amp;quot; below).&lt;br /&gt;
&lt;br /&gt;
=== Moving cards ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;moveCard( $card_id, $location, $location_arg=0 )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move the specific card to given location.&lt;br /&gt;
&lt;br /&gt;
* card_id: ID of the card to move.&lt;br /&gt;
* location: location where to move the card.&lt;br /&gt;
* location_arg: if specified, location_arg where to move the card. If not specified &amp;quot;location_arg&amp;quot; will be set to 0.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;moveCards( $cards, $location, $location_arg=0 )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move the specific cards to given location.&lt;br /&gt;
&lt;br /&gt;
* cards: an array of IDs of cards to move.&lt;br /&gt;
* location: location where to move the cards.&lt;br /&gt;
* location_arg: if specified, location_arg where to move the cards. If not specified &amp;quot;location_arg&amp;quot; will be set to 0.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;insertCard( $card_id, $location, $location_arg )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move a card to a specific &amp;quot;pile&amp;quot; location where card are ordered.&lt;br /&gt;
&lt;br /&gt;
If location_arg place is already taken, increment all cards after location_arg in order to insert new card at this precise location.&lt;br /&gt;
&lt;br /&gt;
(note: insertCardOnExtremePosition method below is more useful in most of the case)&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;insertCardOnExtremePosition( $card_id, $location, $bOnTop )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move a card on top or at bottom of given &amp;quot;pile&amp;quot; type location. (Lower numbers: bottom of the deck. Higher numbers: top of the deck.)&lt;br /&gt;
&lt;br /&gt;
(note: Filling an empty location this way with N cards creates &amp;quot;location_arg&amp;quot;s from 1 to N if &amp;quot;$bOnTop&amp;quot; is true and -1 to -N if &amp;quot;$bOnTop&amp;quot; is false. This can cause off-by-one errors for code intended to run on a deck generated by &amp;quot;shuffle( $location )&amp;quot; which generates &amp;quot;location_arg&amp;quot;s from 0 to N - 1.)&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;moveAllCardsInLocation(  $from_location, $to_location, $from_location_arg=null, $to_location_arg=0 )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move all cards in specified &amp;quot;from&amp;quot; location to given location.&lt;br /&gt;
&lt;br /&gt;
* from_location: where to take the cards. If null, cards from all locations will be move.&lt;br /&gt;
* to_location: where to put the cards&lt;br /&gt;
* from_location_arg (optional): if specified, only cards with given &amp;quot;location_arg&amp;quot; are moved.&lt;br /&gt;
* to_location_arg (optional): if specified, cards moved &amp;quot;location_arg&amp;quot; is set to given value. Otherwise &amp;quot;location_arg&amp;quot; is set to 0.&lt;br /&gt;
&lt;br /&gt;
Note: if you want to keep &amp;quot;location_arg&amp;quot; untouched, you should use &amp;quot;moveAllCardsInLocationKeepOrder&amp;quot; below.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;moveAllCardsInLocationKeepOrder( $from_location, $to_location )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move all cards in specified &amp;quot;from&amp;quot; location to given &amp;quot;to&amp;quot; location. This method does not modify the &amp;quot;location_arg&amp;quot; of cards.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;playCard( $card_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Move specified card at the top of the &amp;quot;discard&amp;quot; location.&lt;br /&gt;
&lt;br /&gt;
Note: this is an alias for: insertCardOnExtremePosition( $card_id, &amp;quot;discard&amp;quot;, true )&lt;br /&gt;
&lt;br /&gt;
=== Get cards informations ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCard( $card_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get specific card information.&lt;br /&gt;
&lt;br /&gt;
Return null if this card is not found.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCards( $cards_array )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get specific cards information.&lt;br /&gt;
&lt;br /&gt;
$cards_array is an array of card IDs.&lt;br /&gt;
&lt;br /&gt;
If some cards are not found or if some card IDs are specified multiple times, the method throws an (unexpected) Exception.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCardsInLocation( $location, $location_arg = null, $order_by = null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get all cards in specific location, as an array. Return an empty array if the location is empty.&lt;br /&gt;
&lt;br /&gt;
* location (string): the location where to get the cards.&lt;br /&gt;
* location_arg (optional): if specified, return only cards with the specified &amp;quot;location_arg&amp;quot;.&lt;br /&gt;
* order_by (optional): if specified, returned cards are ordered by the given database field. Example: &amp;quot;card_id&amp;quot; or &amp;quot;card_type&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;countCardInLocation( $location, $location_arg=null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the number of cards in specified location.&lt;br /&gt;
&lt;br /&gt;
* location (string): the location where to count the cards.&lt;br /&gt;
* location_arg (optional): if specified, count only cards with the specified &amp;quot;location_arg&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;countCardsInLocations()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the number of cards in each location of the game.&lt;br /&gt;
&lt;br /&gt;
The method returns an associative array with the format &amp;quot;location&amp;quot; =&amp;gt; &amp;quot;number of cards&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  array(&lt;br /&gt;
    &#039;deck&#039; =&amp;gt; 12,&lt;br /&gt;
    &#039;hand&#039; =&amp;gt; 21,&lt;br /&gt;
    &#039;discard&#039; =&amp;gt; 54,&lt;br /&gt;
    &#039;ontable&#039; =&amp;gt; 3&lt;br /&gt;
  );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;countCardsByLocationArgs( $location )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the number of cards in each &amp;quot;location_arg&amp;quot; for the given location.&lt;br /&gt;
&lt;br /&gt;
The method returns an associative array with the format &amp;quot;location_arg&amp;quot; =&amp;gt; &amp;quot;number of cards&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
Example: count the number of cards in each player&#039;s hand:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    countCardsByLocationArgs( &#039;hand&#039; );&lt;br /&gt;
    &lt;br /&gt;
    // Result:&lt;br /&gt;
    array(&lt;br /&gt;
        122345 =&amp;gt; 5,    // player 122345 has 5 cards in hand&lt;br /&gt;
        123456 =&amp;gt; 4     // and player 123456 has 4 cards in hand&lt;br /&gt;
    );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getPlayerHand( $player_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get all cards in given player hand.&lt;br /&gt;
&lt;br /&gt;
Note: This is an alias for:&lt;br /&gt;
getCardsInLocation( &amp;quot;hand&amp;quot;, $player_id )&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCardOnTop( $location )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get the card on top of the given (&amp;quot;pile&amp;quot; style) location, or null if the location is empty.&lt;br /&gt;
&lt;br /&gt;
Note that the card pile won&#039;t be &amp;quot;auto-reshuffled&amp;quot; if there is no more card available.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCardsOnTop( $nbr, $location )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get the &amp;quot;$nbr&amp;quot; cards on top of the given (&amp;quot;pile&amp;quot; style) location.&lt;br /&gt;
&lt;br /&gt;
The method return an array with at most &amp;quot;$nbr&amp;quot; elements (or a void array if there is no card in this location).&lt;br /&gt;
&lt;br /&gt;
Note that the card pile won&#039;t be &amp;quot;auto-reshuffled&amp;quot; if there is not enough cards available.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getExtremePosition( $bGetMax ,$location )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
(rarely used)&lt;br /&gt;
&lt;br /&gt;
Get the position of cards at the top of the given location / at the bottom of the given location.&lt;br /&gt;
&lt;br /&gt;
Of course this method works only on location in &amp;quot;pile&amp;quot; where you are using &amp;quot;location_arg&amp;quot; to specify the position of each card (example: &amp;quot;deck&amp;quot; location).&lt;br /&gt;
&lt;br /&gt;
If bGetMax=true, return the location of the top card of the pile.&lt;br /&gt;
&lt;br /&gt;
If bGetMax=false, return the location of the bottom card of the pile.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCardsOfType( $type, $type_arg=null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get all cards of a specific type (rarely used).&lt;br /&gt;
&lt;br /&gt;
Return an array of cards, or an empty array if there is no cards of the specified type.&lt;br /&gt;
&lt;br /&gt;
* type: the type of cards&lt;br /&gt;
* type_arg: if specified, return only cards with the specified &amp;quot;type_arg&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getCardsOfTypeInLocation( $type, $type_arg=null, $location, $location_arg = null )&lt;br /&gt;
&lt;br /&gt;
Get all cards of a specific type in a specific location (rarely used).&lt;br /&gt;
&lt;br /&gt;
Return an array of cards, or an empty array if there is no cards of the specified type.&lt;br /&gt;
&lt;br /&gt;
* type: the type of cards&lt;br /&gt;
* type_arg: if specified, return only cards with the specified &amp;quot;type_arg&amp;quot;.&lt;br /&gt;
* location (string): the location where to get the cards.&lt;br /&gt;
* location_arg (optional): if specified, return only cards with the specified &amp;quot;location_arg&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
=== Shuffling ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;shuffle( $location )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Shuffle all cards in specific location.&lt;br /&gt;
&lt;br /&gt;
Shuffle only works on locations where cards are on a &amp;quot;pile&amp;quot; (ex: &amp;quot;deck&amp;quot;).&lt;br /&gt;
&lt;br /&gt;
Please note that all &amp;quot;location_arg&amp;quot; will be reset to reflect the new order of the cards in the pile.&lt;br /&gt;
&lt;br /&gt;
=== Auto-reshuffle ===&lt;br /&gt;
&lt;br /&gt;
To enable auto-reshuffle you must do &amp;quot;$this-&amp;gt;cards-&amp;gt;autoreshuffle = true&amp;quot; during the setup of the component (often in the &#039;&#039;_construct&#039;&#039; function when you &#039;&#039;init()&#039;&#039; the Deck object).&lt;br /&gt;
&lt;br /&gt;
Every time a card must be retrieved from the &amp;quot;deck&amp;quot; location, if it is empty the &amp;quot;discard&amp;quot; location will be automatically reshuffled into the &amp;quot;deck&amp;quot; location.&lt;br /&gt;
&lt;br /&gt;
If you need to notify players when the deck is shuffled, you can setup a callback method using this feature: $this-&amp;gt;cards-&amp;gt;autoreshuffle_trigger = array(&#039;obj&#039; =&amp;gt; $this, &#039;method&#039; =&amp;gt; &#039;deckAutoReshuffle&#039;);&lt;br /&gt;
&lt;br /&gt;
If you need to use other locations than &amp;quot;deck&amp;quot; and &amp;quot;discard&amp;quot; for auto-reshuffle feature, you can configure it this way: $this-&amp;gt;cards-&amp;gt;autoreshuffle_custom = array(&#039;deck&#039; =&amp;gt; &#039;discard&#039;); (replace &#039;deck&#039; and &#039;discard&#039; with your custom locations).&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Gamehelpuptown&amp;diff=11258</id>
		<title>Gamehelpuptown</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Gamehelpuptown&amp;diff=11258"/>
		<updated>2021-12-31T20:09:48Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: /* Objective */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Objective ==&lt;br /&gt;
The goal of Uptown is to place your colored tiles in such a way that at the end of the game, they&#039;re connected in as few groups of as possible. A group is a collection of tiles which are all touching at least one other member of the group on at least one side (not just on a corner).  Note: The NUMBER of groups is important, not the SIZE of the groups.&lt;br /&gt;
&lt;br /&gt;
If two or more players have the same number of groups at the end of the game, the player who has captured the fewest of their opponents&#039; tiles wins. See below for more about capturing.&lt;br /&gt;
&lt;br /&gt;
== Playing the Game ==&lt;br /&gt;
Below the board you can see the five tiles that are in your rack and available to place. On your turn, click one of these tiles, then click the space on the board where you want to place it. To be a legal move, the tile you&#039;re playing must match the board space where you&#039;re trying to place it. You can only place tiles with a letter on them (A-I) in the row with a matching label. You can only place tiles with a number (1-9) in the matching column. You can only place tiles with a symbol (man, ring, woman, street sign, skyline, saxophone, automobile, playing cards, champagne) in the area of the board with matching symbols on it. The dollar sign ($) tile is wild and you can place it anywhere.&lt;br /&gt;
&lt;br /&gt;
Your supply includes one tile of each letter, number, and symbol as well as a single dollar sign ($) tile. The game ends when each player has DRAWN (not played) all of their tiles and each player has taken a final turn (each player will have four un-played tiles). You can see how many tiles are left for you and your opponents to draw by looking at the number in the user information area in the top right corner of the page.&lt;br /&gt;
&lt;br /&gt;
=== Capturing ===&lt;br /&gt;
If you wish to place a tile on a square where an opponent has already placed one of their tiles, you may do so. However, you may not split an opponent&#039;s tiles into more groups than they already had. You may also never capture one of your own tiles.&lt;br /&gt;
&lt;br /&gt;
You can see any tiles that your opponents have captured displayed below their names. Tiles that you have captured appear below your rack of tiles - a captured tile cannot be played. At the end of the game, if two or more players have the same number of groups, the player with fewest captured tiles wins.&lt;br /&gt;
&lt;br /&gt;
== Game End ==&lt;br /&gt;
After all players draw their final tiles, everyone gets one final turn and then the game ends.  At the end of the game, you will have four un-played tiles left.&lt;br /&gt;
&lt;br /&gt;
== BGA Scoring ==&lt;br /&gt;
BGA counts each distinct set of 1 or more tiles as 1 NEGATIVE point, the closer your score is to 0 (and the fewer captures you&#039;ve made) the better you are doing!  If 2 or more players have the same score, the player with the fewest captures wins.  If 2 or more players have the same score AND the same number of captures, enjoy the win together - or enjoy a playoff game!&lt;br /&gt;
&lt;br /&gt;
== Variants ==&lt;br /&gt;
=== Blockers ===&lt;br /&gt;
Blockers! changed the end of game scoring rules. Instead of the number of captured tiles being a tie breaker, the largest number of captures tiles of a single color gets added to a player&#039;s score. So if a player were to end the game with one group and three captured blue tiles, they would lose to a player with two groups and only a single capture in each color.&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Stock&amp;diff=8128</id>
		<title>Stock</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Stock&amp;diff=8128"/>
		<updated>2021-04-30T23:27:04Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Document bug with Safari off-center sprites and work-around&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;{{Studio_Framework_Navigation}}&lt;br /&gt;
&lt;br /&gt;
== Overview ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Stock&#039;&#039;&#039; is a javascript component that you can use in your game interface to display a set of elements of the same size that need to be arranged in single or multiple lines.&lt;br /&gt;
&lt;br /&gt;
Stock is very flexible and is the most used component in BGA games.&lt;br /&gt;
&lt;br /&gt;
Examples of stock use cases:&lt;br /&gt;
&lt;br /&gt;
* Display a set of cards, typically hands (examples: &#039;&#039;Hearts&#039;&#039;, &#039;&#039;Seasons&#039;&#039;, &#039;&#039;The Boss&#039;&#039;, &#039;&#039;Race for the Galaxy&#039;&#039;).&lt;br /&gt;
* Display items in player panels (examples: &#039;&#039;Takenoko&#039;&#039;, &#039;&#039;Amyitis&#039;&#039;, ...)&lt;br /&gt;
* ... Many other situations. For example, black dice and cubes on cards in &#039;&#039;Troyes&#039;&#039; are displayed with stock components.&lt;br /&gt;
&lt;br /&gt;
Using stock:&lt;br /&gt;
&lt;br /&gt;
* Your items are arranged nicely and sorted by type.&lt;br /&gt;
* When adding or removing items to a set, all items slide smoothly to their new position in the set.&lt;br /&gt;
* Selecting and unselecting items are built-in functions.&lt;br /&gt;
* You don&#039;t have to worry about inserting/removing HTML code; the entire life cycle of the stock is managed by the component.&lt;br /&gt;
&lt;br /&gt;
== Using stock: a simple example ==&lt;br /&gt;
&lt;br /&gt;
Let&#039;s have a look on how the stock is used in the game &#039;&#039;Hearts&#039;&#039; to display a hand of standard cards.&lt;br /&gt;
&lt;br /&gt;
First, don&#039;t forget to add &amp;quot;ebg/stock&amp;quot; as a dependency in your js file:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
define([&lt;br /&gt;
    &amp;quot;dojo&amp;quot;,&amp;quot;dojo/_base/declare&amp;quot;,&lt;br /&gt;
    &amp;quot;ebg/core/gamegui&amp;quot;,&lt;br /&gt;
    &amp;quot;ebg/counter&amp;quot;,&lt;br /&gt;
    &amp;quot;ebg/stock&amp;quot;     /// &amp;lt;==== HERE&lt;br /&gt;
],&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The stock is initialized in the Javascript &amp;quot;setup&amp;quot; method like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Player hand&lt;br /&gt;
    this.playerHand = new ebg.stock();&lt;br /&gt;
    this.playerHand.create( this, $(&#039;myhand&#039;), this.cardwidth, this.cardheight );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Explanations:&lt;br /&gt;
* We create a new stock object for the player hand.&lt;br /&gt;
* As parameters of the &amp;quot;create&amp;quot; method, we provide the width/height of an item (a card), and the div container &amp;quot;myhand&amp;quot; - which is a simple empty &amp;quot;div&amp;quot; element defined in our HTML template (.tpl).&lt;br /&gt;
&lt;br /&gt;
Then, we must tell the stock what items it is going to display during its life: the 52 cards of a standard card game. Of course, we did not create 52 different images, but a &amp;quot;CSS sprite&amp;quot; image named &amp;quot;cards.jpg&amp;quot; with the cards arranged in 4 rows and 13 columns.&lt;br /&gt;
&lt;br /&gt;
Here&#039;s how we tell stock what items to display:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Specify that there are 13 images per row in the CSS sprite image&lt;br /&gt;
    this.playerHand.image_items_per_row = 13;&lt;br /&gt;
&lt;br /&gt;
    // Create card types:&lt;br /&gt;
    for( var color=1;color&amp;lt;=4;color++ )&lt;br /&gt;
    {&lt;br /&gt;
        for( var value=2;value&amp;lt;=14;value++ )&lt;br /&gt;
        {&lt;br /&gt;
            // Build card type id&lt;br /&gt;
            var card_type_id = this.getCardUniqueId( color, value );&lt;br /&gt;
            this.playerHand.addItemType( card_type_id, card_type_id, g_gamethemeurl+&#039;img/cards.jpg&#039;, card_type_id );&lt;br /&gt;
        }&lt;br /&gt;
    }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Explanation:&lt;br /&gt;
&lt;br /&gt;
* First, we tell the stock component that our CSS sprite contains 13 items per row. This way, it can find the correct image for each card type id.&lt;br /&gt;
* Then for the 4x13 cards, we call the &amp;quot;addItemType&amp;quot; method that creates the type. The arguments are the type id, the weight of the card (for sorting purpose), the URL of our CSS sprite, and the position of our card image in the CSS sprite.&lt;br /&gt;
&lt;br /&gt;
Note: In this specific example we need to generate a unique ID for each type of card based on its color and value. This is the only purpose of &amp;quot;getCardUniqueId&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
From now on, if we need to add a card - for example, the 5 of Hearts - to a player&#039;s hand, we can do this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
this.playerHand.addToStock( this.getCardUniqueId( 2 /* 2=hearts */, 5 ) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
In reality, cards have some IDs, which are useful to manipulate them. This is the reason we are using &amp;quot;addToStockWithId&amp;quot; instead:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
this.playerHand.addToStockWithId( this.getCardUniqueId( 2 /* 2=hearts */, 5 ), my_card_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
If afterwards we want to remove this card from the stock:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
this.playerHand.removeFromStockById( my_card_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Complete stock component reference ==&lt;br /&gt;
&lt;br /&gt;
=== Creation ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;create( page, container_div, item_width, item_height ):&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
With create, you create a new stock component.&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* page: the container page. Usually: &amp;quot;this&amp;quot;.&lt;br /&gt;
* container_div: the container &amp;quot;div&amp;quot; element (an empty div element in your template, with an id).&lt;br /&gt;
* width and height (in pixels) for the stock component.&lt;br /&gt;
&lt;br /&gt;
(See &#039;&#039;Hearts&#039;&#039; example above).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;addItemType( type, weight, image, image_position ):&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Define a new type of item and add it to the stock.&lt;br /&gt;
&lt;br /&gt;
This is mandatory to define a new item type before adding it to the stock. Example: if you want to have a stock contain cubes of 3 different colors, you must add 3 item types (one for each color).&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* {int} type: id of the type to add. You can choose any positive integer. All item types must have distinct IDs.&lt;br /&gt;
* {int} 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 and their order might change randomly at any time.&lt;br /&gt;
* {string} image: URL of item image. Most of the time, you will use a CSS sprite for stock items, so you have to specify CSS sprite image here.&lt;br /&gt;
&lt;br /&gt;
Be careful: you must specify the image url as this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  g_gamethemeurl+&#039;img/yourimage.png&#039;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
* image_position: if &amp;quot;image&amp;quot; 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 &amp;quot;0&amp;quot; for the first cube image, 1 for the second, 2 for the third.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;Important&#039;&#039;: if there is more than one line of items in your CSS sprite,  you must specify how many items per line you have in your CSS sprite, see image_items_per_row below:&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;image_items_per_row&#039;&#039;&#039;&lt;br /&gt;
Class member to set number of columns in css sprite (or how many items per row). I.e. if you sprite is 4 cards horizonatall and 6 vertically, you have to set it to 4.&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Specify that there are 10 image items per row in images used in &amp;quot;myStockObject&amp;quot; control.&lt;br /&gt;
    this.myStockObject.image_items_per_row = 4;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Add/Remove items ===&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;addToStock( type, from )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Add an item to the stock, with the specified type, but without a unique ID.&lt;br /&gt;
&lt;br /&gt;
To make your life easier, in most cases we suggest you use &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039; in order to give an ID to the item added. &#039;&#039;&#039;addToStock&#039;&#039;&#039; is suitable when you are using a stock to control items that are generic game materials that don&#039;t need to be tracked individually (example: a bunch of money tokens).&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* type: ID of the item type to use (as specified in &amp;quot;addItemType&amp;quot;)&lt;br /&gt;
* from: OPTIONAL: if you specify an HTML item here, the item will appear on this item and will be slid to its position on the stock item.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  // Add a money token to the &amp;quot;player money&amp;quot; stock.&lt;br /&gt;
  // The money token will appear on &amp;quot;player_id&amp;quot; player panel and will move to its position.&lt;br /&gt;
  this.playerMoney.addToStock( MONEY_TOKEN, &#039;overall_player_board_&#039;+player_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Important: for a given stock control, you must use either &#039;&#039;&#039;addToStock&#039;&#039;&#039; or &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039;, but NEVER BOTH OF THEM.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;addToStockWithId( type, id, from )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This is the same method as &#039;&#039;&#039;addToStock&#039;&#039;&#039;, except that it also associates an ID with the newly created item.&lt;br /&gt;
&lt;br /&gt;
This is especially useful:&lt;br /&gt;
&lt;br /&gt;
* When you need to know which item(s) have been selected by the user (see &#039;&#039;&#039;getSelectedItems&#039;&#039;&#039;).&lt;br /&gt;
* When you need to remove a specific item from the stock with &#039;&#039;&#039;removeFromStockById&#039;&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeFromStock( type, to, noupdate )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove an item of the specific type from the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;to&#039; is an optional parameter. If &amp;quot;to&amp;quot; contains the ID of an HTML element, the item removed from the Stock slides to this HTML element before it disappears. Note that this method does not expose the associated animation object, however, so it&#039;s not possible to trigger other actions when it finishes, for example. If you need to do that, use Dojo&#039;s slideToObject() instead.&lt;br /&gt;
&lt;br /&gt;
&#039;noupdate&#039; is an optional parameter. If set to &amp;quot;true&amp;quot; it will prevent the Stock display from changing. This is useful when multiple (but not all) items are removed at the same time, to avoid ghost items appearing briefly. If you pass noupdate you have to call updateDisplay() after all items are removed.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeFromStockById( id, to, noupdate )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove an item with a specific ID from the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;to&#039; is an optional parameter. If &amp;quot;to&amp;quot; contains the ID of an HTML element, the item removed from the Stock slides to this HTML element before it disappears. Note that this method does not expose the associated animation object, however, so it&#039;s not possible to trigger other actions when it finishes, for example. If you need to do that, use Dojo&#039;s slideToObject() instead.&lt;br /&gt;
&lt;br /&gt;
&#039;noupdate&#039; is an optional parameter. If set to &amp;quot;true&amp;quot; it will prevent the Stock display from changing. This is useful when multiple (but not all) items are removed at the same time, to avoid ghost items appearing briefly. If you pass noupdate you have to call updateDisplay() after all items are removed.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeAll()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove all items from the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeAllTo( to )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove all items from the stock. If &amp;quot;to&amp;quot; contains the ID of an HTML element, the item removed from the stock slides to this HTML element before it disappears.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Getters ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getPresentTypeList()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return an array with all the types of items present in the stock right now.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    this.myStockControl.removeAll();&lt;br /&gt;
    this.myStockControl.addToStock( 65 );&lt;br /&gt;
    this.myStockControl.addToStock( 34 );&lt;br /&gt;
    this.myStockControl.addToStock( 89 );&lt;br /&gt;
    this.myStockControl.addToStock( 65 );&lt;br /&gt;
    &lt;br /&gt;
    // The following returns: { 34:1,  65:1,  89:1  }&lt;br /&gt;
    var item_types = this.myStockControl.getPresentTypeList();&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;count():&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the total number of items in the stock right now.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getAllItems()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get all items (same format as getSelectedItems and getUnselectedItems).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getItemDivId(id)&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get the div id using the stock item id (to manipulate element properties directly).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getItemById(id)&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get the Stock item with the id in parameter&lt;br /&gt;
ex : return the object { type:1,  id:  1001 }&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Selection ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setSelectionMode( mode )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
For each stock control, you can specify a selection mode:&lt;br /&gt;
* 0: no item can be selected by the player.&lt;br /&gt;
* 1: a maximum of one item can be selected by the player at a time.&lt;br /&gt;
* 2 (default): multiple items can be selected by the player at the same time.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setSelectionAppearance( type )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
For each stock control, you can specify a selection highlighting type:&lt;br /&gt;
* &#039;border&#039;: there will be a red border around selected items (this is the default). The attribute &#039;apparenceBorderWidth&#039; can be used to manage the width of the border (in pixels).&lt;br /&gt;
* &#039;disappear&#039;: the selected item will fade out and disappear. This is useful when the selection has the effect of destroying the item.&lt;br /&gt;
* &#039;class&#039;: there will be an extra &#039;&#039;&#039;stockitem_selected&#039;&#039;&#039; css class added to the element when it is selected (and removed when unselected). The name of the class can be changed by using the &#039;&#039;&#039;selectionClass&#039;&#039;&#039; attribute. You can also override the default class in the css file for your game but beware of the &#039;&#039;&#039;!important&#039;&#039;&#039; keyword.&lt;br /&gt;
&lt;br /&gt;
By default this class definition is:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.stockitem_selected {&lt;br /&gt;
	border: 2px solid red ! important;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
If you want to override it (for example, to change the border color) add this in your &amp;lt;game&amp;gt;.css file:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.stockitem_selected {&lt;br /&gt;
	border: 2px solid orange ! important;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;isSelected( id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return a boolean indicating whether the specified item id has been selected.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;selectItem( id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Select the specified item.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;unselectItem( id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Unselect the specified item.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;unselectAll()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Unselect all items of the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;onChangeSelection&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This callback method is called when the player selects/unselects an item of the stock.&lt;br /&gt;
&lt;br /&gt;
You can connect this to one of your methods like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    dojo.connect( this.myStockControl, &#039;onChangeSelection&#039;, this, &#039;onMyMethodToCall&#039; );&lt;br /&gt;
    &lt;br /&gt;
    (...)&lt;br /&gt;
    &lt;br /&gt;
    onMyMethodToCall: function( control_name, item_id )&lt;br /&gt;
    {&lt;br /&gt;
        // This method is called when myStockControl selected items changed&lt;br /&gt;
        var items = this.myStockControl.getSelectedItems();&lt;br /&gt;
        &lt;br /&gt;
        // (do something)&lt;br /&gt;
    },&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Nota bene: &lt;br /&gt;
- The &amp;quot;control_name&amp;quot; argument is the ID (the &amp;quot;DOM&amp;quot; id) of the &amp;quot;div&amp;quot; container of your stock control. Using &amp;quot;control_name&amp;quot;, you can use the same callback method for different Stock control and see which one trigger the method.&lt;br /&gt;
- The &amp;quot;item_id&amp;quot; argument is the stock ID (index) of the stock item that has just been selected/unselected.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getSelectedItems()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the list of selected items, as an array with the following format:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
[&lt;br /&gt;
   { type:1,  id:  1001 },&lt;br /&gt;
   { type:1,  id:  1002 },&lt;br /&gt;
   { type:3,  id:  1003 }&lt;br /&gt;
   ...&lt;br /&gt;
]&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getUnselectedItems()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Same as the previous one, but return unselected item instead of seleted ones.&lt;br /&gt;
&lt;br /&gt;
=== Layout ===&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;resetItemsPosition()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
If you moved an item from the stock control manually (ex: after a drag&#039;n&#039;drop) and want to reset their positions to their original ones, you can call this method.&lt;br /&gt;
Note: it is the same as updateDisplay() without arugment, not sure why there are two methods.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;updateDisplay(from)&#039;&#039;&#039;&lt;br /&gt;
Update the display completely (if &#039;from&#039; is defined: moves new items from this location).&lt;br /&gt;
&lt;br /&gt;
Example code if you change the underlying stock item, or otherwise want to make the stock item refresh:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    this.myStockControl.updateDisplay();&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;item_margin&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
By default, there is a margin of 5px between the items of a stock. You can change the member variable &amp;quot;item_margin&amp;quot; to change this.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     this.myStockControl.item_margin=5;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;changeItemsWeight( newWeights )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
With this method you can change dynamically the weight of the item types in a stock control.&lt;br /&gt;
&lt;br /&gt;
Items are immediately re-sorted with the new weight.&lt;br /&gt;
&lt;br /&gt;
Example: with a stock control that contains classic cards, you can order them by value or by color. Using changeItemsWeight you can switch from one sort method to another when a player request this.&lt;br /&gt;
&lt;br /&gt;
newWeights is an associative array: item type id =&amp;gt; new weight.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Item type 1 gets a new weight of 10, 2 a new weight of 20, 3 a new weight of 30.&lt;br /&gt;
    this.myStockControl.changeItemsWeight( { 1: 10, 2: 20, 3: 30 } );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Example2:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Be careful with object initialisers with variables, use the bracket notation.&lt;br /&gt;
    // Item type 1 gets a new weight of 10&lt;br /&gt;
    var card_type = 1;&lt;br /&gt;
    this.myStockControl.changeItemsWeight( { [card_type]: 10 } );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;centerItems&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Center the stock items in the middle of the stock container.&lt;br /&gt;
e.g. this.myStock.centerItems = true; &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setOverlap( horizontal_percent, vertical_percent )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Make items of the stock control &amp;quot;overlap&amp;quot; each other, to save space.&lt;br /&gt;
&lt;br /&gt;
By default, horizontal_overlap and vertical_overlap are 0.&lt;br /&gt;
&lt;br /&gt;
When horizontal_overlap=20, it means that a stock item will overlap to only show 20% of the width of all the previous items. horizontal_overlap can&#039;t be greater than 100.&lt;br /&gt;
&lt;br /&gt;
vertical_overlap works differently: one items on two are shifted up.&lt;br /&gt;
&lt;br /&gt;
See the games &amp;quot;Jaipur&amp;quot; or &amp;quot;Koryŏ&amp;quot; to see examples of use of this function.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;autowidth&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Stock does not play well if you attempt to inline-block it with other blocks, to fix that you have to set this flag which will calculate width properly&lt;br /&gt;
   mystock.autowidth = true;&lt;br /&gt;
&lt;br /&gt;
=== Customize apperance ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;extraClasses&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Can be set to a list of class names (separated by space) on stock object, so when div is created these are added, i.e.&lt;br /&gt;
&lt;br /&gt;
  this.playerHand.extraClasses=&#039;mycard&#039;;&lt;br /&gt;
&lt;br /&gt;
Note that it is the same list for all items.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;onItemCreate&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Using onItemCreate, you can trigger a method each time a new item is added to the Stock, in order to customize it.&lt;br /&gt;
&lt;br /&gt;
Complete example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // During &amp;quot;setup&amp;quot; phase, we associate our method &amp;quot;setupNewCard&amp;quot; with the creation of a new stock item:&lt;br /&gt;
    this.myStockItem.onItemCreate = dojo.hitch( this, &#039;setupNewCard&#039; ); &lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
    // And here is our &amp;quot;setupNewCard&amp;quot;:&lt;br /&gt;
    setupNewCard: function( card_div, card_type_id, card_id )&lt;br /&gt;
    {&lt;br /&gt;
       // Add a special tooltip on the card:&lt;br /&gt;
       this.addTooltip( card_div.id, _(&amp;quot;Some nice tooltip for this item&amp;quot;), &#039;&#039; );&lt;br /&gt;
&lt;br /&gt;
       // Note that &amp;quot;card_type_id&amp;quot; contains the type of the item, so you can do special actions depending on the item type&lt;br /&gt;
&lt;br /&gt;
       // Add some custom HTML content INSIDE the Stock item:&lt;br /&gt;
       dojo.place( this.format_block( &#039;jstpl_my_card_content&#039;, {&lt;br /&gt;
                                ....&lt;br /&gt;
                           } ), card_div.id );&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;onItemDelete&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Function handler called when div is removed&lt;br /&gt;
&lt;br /&gt;
   this.myStock.onItemDelete = (card_div, card_type_id, card_id) =&amp;gt; { console.log(&amp;quot;card deleted from myStock: &amp;quot;+card_id); };&lt;br /&gt;
&lt;br /&gt;
== Tips when adding/removing items to/from Stock components ==&lt;br /&gt;
&lt;br /&gt;
Most cases will be one of the following situations:&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Situation A&#039;&#039;&#039;:&lt;br /&gt;
&lt;br /&gt;
When you add a card to a stock item, and this card is &#039;&#039;&#039;not&#039;&#039;&#039; coming from another stock:&lt;br /&gt;
&lt;br /&gt;
* Use &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039; with a &amp;quot;from&amp;quot; argument set to the element of your interface where the card should come from (i.e. div id). For example if you want to &amp;quot;reveal&amp;quot; card from player hand and it is not an interface element you can set from to be &#039;player_board_&#039;+activePlayerId (where activePlayerId is player who played that card).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Situation B&#039;&#039;&#039;:&lt;br /&gt;
&lt;br /&gt;
When you add a card to a stock item, and this card is coming from another stock:&lt;br /&gt;
&lt;br /&gt;
* On the destination Stock, use &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039; with a &amp;quot;from&amp;quot; argument which is the HTML id of the corresponding item in the source Stock. For example, if the source stock id is &amp;quot;myHand&amp;quot;, then the HTML id of card 48 is &amp;quot;myHand_item_48&amp;quot;.&lt;br /&gt;
* Then, remove the source item with &#039;&#039;&#039;removeFromStockById&#039;&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
(Note that it&#039;s important to do things in this order, because the source item must still exist when you use it as the origin of the slide.)&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Situation C&#039;&#039;&#039;:&lt;br /&gt;
&lt;br /&gt;
When you move a card from a stock item to something that is not a stock item:&lt;br /&gt;
&lt;br /&gt;
* Insert the card as a classic HTML template (dojo.place / this.format_block).&lt;br /&gt;
* Place it on the Stock item with &#039;&#039;&#039;this.placeOnObject&#039;&#039;&#039;, using the Stock item HTML id (see above).&lt;br /&gt;
* Slide it to its new position with &#039;&#039;&#039;this.slideToObject&#039;&#039;&#039;.&lt;br /&gt;
* Remove the card from the Stock item with &#039;&#039;&#039;removeFromStockById&#039;&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
Using the methods above, your cards should slide to, from, and between your Stock controls smoothly.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
You can customize this (showing the default value):&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
this.mystock.jstpl_stock_item= &amp;quot;&amp;lt;div id=\&amp;quot;${id}\&amp;quot; class=\&amp;quot;stockitem\&amp;quot; style=\&amp;quot;top:${top}px;left:${left}px;width:${width}px;height:${height}px;z-index:${position};background-image:url(&#039;${image}&#039;);\&amp;quot;&amp;gt;&amp;lt;/div&amp;gt;&amp;quot;;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
To produce a different type of stock item&lt;br /&gt;
&lt;br /&gt;
== Known issues ==&lt;br /&gt;
&lt;br /&gt;
==== Incorrectly displayed sprites on Safari ====&lt;br /&gt;
&lt;br /&gt;
As mentioned above, stock displays its images using &amp;quot;sprites&amp;quot; consisting of a portion of a larger image. To accomplish this, it uses the CSS background-position attribute in negative multiples of 100%. For example, the first element of the first row would be 0% 0%. The second element of the first row would be -100% 0%, etc.&lt;br /&gt;
&lt;br /&gt;
This works fine except in Safari, which sometimes slightly modifies the width of elements at smaller screen sizes. For example, you might get a ~49.99px x ~49.99px div instead of the 50px x 50px specified by CSS width/height. Combined with using percentages in background-position, this can cause sprites to be slightly off-center.&lt;br /&gt;
&lt;br /&gt;
Using pixels in background-position is probably the easiest way to fix this problem, but that would require modifying the stock code itself. As a developer, you can also work around the problem by specifying a background-size attribute based on the size in elements of your source image. For example, if you have a source image that contains 5 rows of 28 sprites, you should specify &amp;quot;background-size: 2800% 500%;&amp;quot;&lt;br /&gt;
&lt;br /&gt;
You can add background-size to your stock items by using the extraClasses attribute as explained above and then specifying the values in your game.css file.&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Main_game_logic:_Game.php&amp;diff=7906</id>
		<title>Main game logic: Game.php</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Main_game_logic:_Game.php&amp;diff=7906"/>
		<updated>2021-04-10T21:37:22Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Clarify that notifyPlayer() cannot notify spectators&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;{{Studio_Framework_Navigation}}&lt;br /&gt;
&lt;br /&gt;
This is the main file for your game logic. Here you initialize the game, persist data, implement the rules and notify the client interface of changes.&lt;br /&gt;
&lt;br /&gt;
== File Structure ==&lt;br /&gt;
&lt;br /&gt;
The details of how the file is structured are described directly with comments in the code skeleton provided to you.&lt;br /&gt;
 &lt;br /&gt;
Here is the basic structure:&lt;br /&gt;
&lt;br /&gt;
* Constructor: where you define global variables.&lt;br /&gt;
* setupNewGame: initial setup of the game. Takes an array of players, indexed by player_id. Structure of each player includes player_name, player_canal, player_avatar, and flags indicating admin/ai/premium/order/language/beginner.&lt;br /&gt;
* getAllDatas: where you retrieve all game data during a complete reload of the game. Returned value must include [&#039;players&#039;][playerId][&#039;score&#039;] for scores to populate when F5 is pressed.&lt;br /&gt;
* getGameProgression: where you compute the game progression indicator. Returns a number indicating percent of progression (0-100)&lt;br /&gt;
* Utility functions: your utility functions.&lt;br /&gt;
* Player actions: the entry points for players actions. &lt;br /&gt;
* Game state arguments: methods to return additional data on specific game states ([http://en.doc.boardgamearena.com/Your_game_state_machine:_states.inc.php#args more info here]).&lt;br /&gt;
* Game state actions: the logic to run when entering a new game state ([http://en.doc.boardgamearena.com/Your_game_state_machine:_states.inc.php#action more info here]).&lt;br /&gt;
* zombieTurn: what to do it&#039;s the turn of a zombie player.&lt;br /&gt;
* upgradeTableDb: function to migrate database if you change it after release on production.&lt;br /&gt;
&lt;br /&gt;
== Accessing player information ==&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important&#039;&#039;&#039;: In the following methods, be mindful of the difference between the &amp;quot;active&amp;quot; player and the &amp;quot;current&amp;quot; player. The &#039;&#039;&#039;active&#039;&#039;&#039; player is the player whose turn it is - not necessarily the player who sent a request! The &#039;&#039;&#039;current&#039;&#039;&#039; player is the player who sent the request and will see the results returned by your methods: not necessarily the player whose turn it is!&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
; getPlayersNumber()&lt;br /&gt;
: Returns the number of players playing at the table&lt;br /&gt;
: Note: doesn&#039;t work in setupNewGame (use count($players) instead).&lt;br /&gt;
&lt;br /&gt;
; getActivePlayerId()&lt;br /&gt;
: Get the &amp;quot;active_player&amp;quot;, whatever what is the current state type.&lt;br /&gt;
: Note: it does NOT mean that this player is active right now, because state type could be &amp;quot;game&amp;quot; or &amp;quot;multiplayer&amp;quot;&lt;br /&gt;
: Note: avoid using this method in a &amp;quot;multiplayer&amp;quot; state because it does not mean anything.&lt;br /&gt;
&lt;br /&gt;
; getActivePlayerName()&lt;br /&gt;
: Get the &amp;quot;active_player&amp;quot; name&lt;br /&gt;
: Note: avoid using this method in a &amp;quot;multiplayer&amp;quot; state because it does not mean anything.&lt;br /&gt;
&lt;br /&gt;
; loadPlayersBasicInfos()&lt;br /&gt;
: Get an associative array with generic data about players (ie: not game specific data).&lt;br /&gt;
: The key of the associative array is the player id. The returned table is cached, so ok to call multiple times without performance concerns.&lt;br /&gt;
: The content of each value is:&lt;br /&gt;
: * player_name - the name of the player&lt;br /&gt;
: * player_color (ex: ff0000) - the color code of the player&lt;br /&gt;
: * player_no - the position of the player at the start of the game in natural table order, i.e. 1,2,3&lt;br /&gt;
&lt;br /&gt;
; getCurrentPlayerId()&lt;br /&gt;
: Get the &amp;quot;current_player&amp;quot;. The current player is the one from which the action originated (the one who sent the request).&lt;br /&gt;
: &#039;&#039;&#039;Be careful&#039;&#039;&#039;: This is not necessarily the active player!&lt;br /&gt;
: In general, you shouldn&#039;t use this method, unless you are in &amp;quot;multiplayer&amp;quot; state.&lt;br /&gt;
: &#039;&#039;&#039;Very important&#039;&#039;&#039;: in your setupNewGame and zombieTurn function, you must never use getCurrentPlayerId() or getCurrentPlayerName(), otherwise it will fail with a &amp;quot;Not logged&amp;quot; error message (these actions are triggered from the main site and propagated to the gameserver from a server, not from a browser. As a consequence, there is no current player associated to these actions).&lt;br /&gt;
&lt;br /&gt;
; getCurrentPlayerName()&lt;br /&gt;
: Get the &amp;quot;current_player&amp;quot; name&lt;br /&gt;
: Be careful using this method (see above).&lt;br /&gt;
&lt;br /&gt;
; getCurrentPlayerColor()&lt;br /&gt;
: Get the &amp;quot;current_player&amp;quot; color&lt;br /&gt;
: Be careful using this method (see above).&lt;br /&gt;
&lt;br /&gt;
; isCurrentPlayerZombie()&lt;br /&gt;
: Check the &amp;quot;current_player&amp;quot; zombie status. If true, player is zombie, i.e. left or was kicked out of the game.&lt;br /&gt;
&lt;br /&gt;
; isSpectator()&lt;br /&gt;
: Check the &amp;quot;current_player&amp;quot; spectator status. If true, the user accessing the game is a spectator (not part of the game). For this user, the interface should display all public information, and no private information (like a friend sitting at the same table as players and just spectating the game).&lt;br /&gt;
&lt;br /&gt;
; getActivePlayerColor()&lt;br /&gt;
: This function does not seems to exist in API, if you need it here is implementation&lt;br /&gt;
      function getActivePlayerColor() {&lt;br /&gt;
        $player_id = self::getActivePlayerId();&lt;br /&gt;
        $players = self::loadPlayersBasicInfos();&lt;br /&gt;
        if( isset( $players[ $player_id ]) )&lt;br /&gt;
            return $players[ $player_id ][&#039;player_color&#039;];&lt;br /&gt;
        else&lt;br /&gt;
            return null;&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
== Accessing the database ==&lt;br /&gt;
&lt;br /&gt;
The main game logic should be the only point from which you should access the game database. You access your database using SQL queries with the methods below.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;IMPORTANT&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
BGA uses [http://dev.mysql.com/doc/refman/5.0/en/sql-syntax-transactions.html database transactions]. This means that your database changes WON&#039;T BE APPLIED to the database until your request ends normally (web request, not database request). Using transactions is in fact very useful for you; at any time, if your game logic detects that something is wrong (example: a disallowed move), you just have to throw an exception and all changes to the game situation will be removed. This also means that you need not (and in fact cannot) use your own transactions for multiple related database operations.&lt;br /&gt;
&lt;br /&gt;
; DbQuery( $sql )&lt;br /&gt;
: This is the generic method to access the database.&lt;br /&gt;
: It can execute any type of SELECT/UPDATE/DELETE/REPLACE/INSERT query on the database.&lt;br /&gt;
: You should use it for UPDATE/DELETE/REPLACE/INSERT queries. For SELECT queries, the specialized methods below are much better.&lt;br /&gt;
&lt;br /&gt;
; getUniqueValueFromDB( $sql )&lt;br /&gt;
: Returns a unique value from DB or null if no value is found.&lt;br /&gt;
: $sql must be a SELECT query.&lt;br /&gt;
: Raise an exception if more than 1 row is returned.&lt;br /&gt;
&lt;br /&gt;
; getCollectionFromDB( $sql, $bSingleValue=false )&lt;br /&gt;
: Returns an associative array of rows for a sql SELECT query.&lt;br /&gt;
: The key of the resulting associative array is the first field specified in the SELECT query.&lt;br /&gt;
: The value of the resulting associative array is an associative array with all the field specified in the SELECT query and associated values.&lt;br /&gt;
: First column must be a primary or alternate key.&lt;br /&gt;
: The resulting collection can be empty.&lt;br /&gt;
: If you specified $bSingleValue=true and if your SQL query request 2 fields A and B, the method returns an associative array &amp;quot;A=&amp;gt;B&amp;quot;&lt;br /&gt;
&lt;br /&gt;
Example 1:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::getCollectionFromDB( &amp;quot;SELECT player_id id, player_name name, player_score score FROM player&amp;quot; );&lt;br /&gt;
&lt;br /&gt;
Result:&lt;br /&gt;
array(&lt;br /&gt;
 1234 =&amp;gt; array( &#039;id&#039;=&amp;gt;1234, &#039;name&#039;=&amp;gt;&#039;myuser0&#039;, &#039;score&#039;=&amp;gt;1 ),&lt;br /&gt;
 1235 =&amp;gt; array( &#039;id&#039;=&amp;gt;1235, &#039;name&#039;=&amp;gt;&#039;myuser1&#039;, &#039;score&#039;=&amp;gt;0 )&lt;br /&gt;
)&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
Example 2:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::getCollectionFromDB( &amp;quot;SELECT player_id id, player_name name FROM player&amp;quot;, true );&lt;br /&gt;
&lt;br /&gt;
Result:&lt;br /&gt;
array(&lt;br /&gt;
 1234 =&amp;gt; &#039;myuser0&#039;,&lt;br /&gt;
 1235 =&amp;gt; &#039;myuser1&#039;&lt;br /&gt;
)&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
; getNonEmptyCollectionFromDB( $sql )&lt;br /&gt;
: Same as getCollectionFromDB($sdl), but raise an exception if the collection is empty. Note: this function does NOT have 2nd argument as previous one does.&lt;br /&gt;
&lt;br /&gt;
; getObjectFromDB( $sql )&lt;br /&gt;
: Returns one row for the sql SELECT query as an associative array or null if there is no result&lt;br /&gt;
: Raise an exception if the query return more than one row&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::getObjectFromDB( &amp;quot;SELECT player_id id, player_name name, player_score score FROM player WHERE player_id=&#039;$player_id&#039;&amp;quot; );&lt;br /&gt;
&lt;br /&gt;
Result:&lt;br /&gt;
array(&lt;br /&gt;
  &#039;id&#039;=&amp;gt;1234, &#039;name&#039;=&amp;gt;&#039;myuser0&#039;, &#039;score&#039;=&amp;gt;1 &lt;br /&gt;
)&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
; getNonEmptyObjectFromDB( $sql )&lt;br /&gt;
: Similar to previous one, but raise an exception if no row is found&lt;br /&gt;
&lt;br /&gt;
; getObjectListFromDB( $sql, $bUniqueValue=false )&lt;br /&gt;
: Return an array of rows for a sql SELECT query.&lt;br /&gt;
: The result is the same than &amp;quot;getCollectionFromDB&amp;quot; except that the result is a simple array (and not an associative array).&lt;br /&gt;
: The result can be empty.&lt;br /&gt;
: If you specified $bUniqueValue=true and if your SQL query request 1 field, the method returns directly an array of values.&lt;br /&gt;
&lt;br /&gt;
Example 1:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::getObjectListFromDB( &amp;quot;SELECT player_id id, player_name name, player_score score FROM player&amp;quot; );&lt;br /&gt;
&lt;br /&gt;
Result:&lt;br /&gt;
array(&lt;br /&gt;
 array( &#039;id&#039;=&amp;gt;1234, &#039;name&#039;=&amp;gt;&#039;myuser0&#039;, &#039;score&#039;=&amp;gt;1 ),&lt;br /&gt;
 array( &#039;id&#039;=&amp;gt;1235, &#039;name&#039;=&amp;gt;&#039;myuser1&#039;, &#039;score&#039;=&amp;gt;0 )&lt;br /&gt;
)&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
Example 2:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::getObjectListFromDB( &amp;quot;SELECT player_name name FROM player&amp;quot;, true );&lt;br /&gt;
&lt;br /&gt;
Result:&lt;br /&gt;
array(&lt;br /&gt;
 &#039;myuser0&#039;,&lt;br /&gt;
 &#039;myuser1&#039;&lt;br /&gt;
)&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
; getDoubleKeyCollectionFromDB( $sql, $bSingleValue=false )&lt;br /&gt;
: Return an associative array of associative array, from a SQL SELECT query.&lt;br /&gt;
: First array level correspond to first column specified in SQL query.&lt;br /&gt;
: Second array level correspond to second column specified in SQL query.&lt;br /&gt;
: If bSingleValue = true, keep only third column on result&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
; DbGetLastId()&lt;br /&gt;
: Return the PRIMARY key of the last inserted row (see PHP mysql_insert_id function).&lt;br /&gt;
&lt;br /&gt;
; DbAffectedRow()&lt;br /&gt;
: Return the number of row affected by the last operation&lt;br /&gt;
&lt;br /&gt;
; escapeStringForDB( $string )&lt;br /&gt;
: You must use this function on every string type data in your database that contains unsafe data.&lt;br /&gt;
: (unsafe = can be modified by a player).&lt;br /&gt;
: This method makes sure that no SQL injection will be done through the string used.&lt;br /&gt;
: Note: if you using standard types in ajax actions, like AT_alphanum it is sanitized before arrival,&lt;br /&gt;
: this is only needed if you manage to get unchecked string, like in the games where user has to enter text as a response.&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: see Editing [[Game database model: dbmodel.sql]] to know how to define your database model.&lt;br /&gt;
&lt;br /&gt;
== Use globals ==&lt;br /&gt;
&lt;br /&gt;
Sometimes, you want a single global integer value for your game, and you don&#039;t want to create a DB table specifically for it.&lt;br /&gt;
&lt;br /&gt;
You can do this with the BGA framework &amp;quot;global.&amp;quot; Your value will be stored in the &amp;quot;global&amp;quot; table in the database, and you can access it with simple methods.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;initGameStateLabels&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This method should be located at the beginning of &#039;&#039;yourgamename.php.&#039;&#039; This is where you define the globals used in your game logic, by assigning them IDs.&lt;br /&gt;
&lt;br /&gt;
You can define up to 80 globals, with IDs from 10 to 89 (inclusive). You must &#039;&#039;&#039;not&#039;&#039;&#039; use globals outside this range, as those values are used by other components of the framework.&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        self::initGameStateLabels( array( &lt;br /&gt;
                &amp;quot;my_first_global_variable&amp;quot; =&amp;gt; 10,&lt;br /&gt;
                &amp;quot;my_second_global_variable&amp;quot; =&amp;gt; 11&lt;br /&gt;
        ) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setGameStateInitialValue( $value_label, $value_value )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Initialize your global value. Must be called before any use of your global, so you should call this method from your &amp;quot;setupNewGame&amp;quot; method.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getGameStateValue( $value_label )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Retrieve the current value of a global.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setGameStateValue( $value_label, $value_value )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Set the current value of a global.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;incGameStateValue( $value_label, $increment )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Increment the current value of a global. If increment is negative, decrement the value of the global.&lt;br /&gt;
&lt;br /&gt;
Return the final value of the global.&lt;br /&gt;
&lt;br /&gt;
== Game states and active players ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Activate player handling ===&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;activeNextPlayer()&lt;br /&gt;
: Make the next player active in the natural player order.&lt;br /&gt;
: Note: you CANNOT use this method in a &amp;quot;activeplayer&amp;quot; or &amp;quot;multipleactiveplayer&amp;quot; state. You must use a &amp;quot;game&amp;quot; type game state for this.&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;activePrevPlayer()&lt;br /&gt;
: Make the previous player active (in the natural player order).&lt;br /&gt;
: Note: you CANNOT use this method in a &amp;quot;activeplayer&amp;quot; or &amp;quot;multipleactiveplayer&amp;quot; state. You must use a &amp;quot;game&amp;quot; type game state for this.&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;changeActivePlayer( $player_id )&lt;br /&gt;
: You can call this method to make any player active.&lt;br /&gt;
: Note: you CANNOT use this method in a &amp;quot;activeplayer&amp;quot; or &amp;quot;multipleactiveplayer&amp;quot; state. You must use a &amp;quot;game&amp;quot; type game state for this.&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;getActivePlayerId()&lt;br /&gt;
: Return the &amp;quot;active_player&amp;quot; id&lt;br /&gt;
: Note: it does NOT mean that this player is active right now, because state type could be &amp;quot;game&amp;quot; or &amp;quot;multipleactiveplayer&amp;quot;&lt;br /&gt;
: Note: avoid using this method in a &amp;quot;multipleactiveplayer&amp;quot; state because it does not mean anything.&lt;br /&gt;
&lt;br /&gt;
=== Multiple activate player handling ===&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;setAllPlayersMultiactive()&lt;br /&gt;
: All playing players are made active. Update notification is sent to all players (this will trigger &#039;&#039;&#039;onUpdateActionButtons&#039;&#039;&#039;).&lt;br /&gt;
: Usually, you use this method at the beginning of a game state (e.g., &amp;quot;stGameState&amp;quot;) which transitions to a &#039;&#039;multipleactiveplayer&#039;&#039; state in which multiple players have to perform some action. Do not use this method if you going to make some more changes in the active player list. (I.e., if you want to take away multipleactiveplayer status immediately afterwards, use setPlayersMultiactive instead.)&lt;br /&gt;
&lt;br /&gt;
Example of usage:&lt;br /&gt;
    &amp;lt;pre&amp;gt;&lt;br /&gt;
    function st_MultiPlayerInit() {&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;setAllPlayersMultiactive();&lt;br /&gt;
    }&lt;br /&gt;
    &amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
And this is the state declaration:&lt;br /&gt;
    &amp;lt;pre&amp;gt;&lt;br /&gt;
    2 =&amp;gt; array(&lt;br /&gt;
    		&amp;quot;name&amp;quot; =&amp;gt; &amp;quot;playerTurnPlace&amp;quot;,&lt;br /&gt;
    		&amp;quot;description&amp;quot; =&amp;gt; clienttranslate(&#039;Other player must place ships&#039;),&lt;br /&gt;
    		&amp;quot;descriptionmyturn&amp;quot; =&amp;gt; clienttranslate(&#039;${you} must place ships (click on YOUR SHIPS board to place)&#039;),&lt;br /&gt;
    		&amp;quot;type&amp;quot; =&amp;gt; &amp;quot;multipleactiveplayer&amp;quot;,&lt;br /&gt;
                &#039;action&#039; =&amp;gt; &#039;multiPlayerDoSomething&#039;,&lt;br /&gt;
                &#039;args&#039; =&amp;gt; &#039;arg_playerTurnPlace&#039;,&lt;br /&gt;
    	     	&amp;quot;possibleactions&amp;quot; =&amp;gt; array( &amp;quot;actionBla&amp;quot; ),&lt;br /&gt;
                &amp;quot;transitions&amp;quot; =&amp;gt; array( &amp;quot;next&amp;quot; =&amp;gt; 4, &amp;quot;last&amp;quot; =&amp;gt; 99)&lt;br /&gt;
    ),&lt;br /&gt;
    &amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;setAllPlayersNonMultiactive( $next_state )&lt;br /&gt;
: All playing players are made inactive. Transition to next state&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;setPlayersMultiactive( $players, $next_state, $bExclusive = false )&lt;br /&gt;
: Make a specific list of players active during a multiactive gamestate. Update notification is sent to all players whose state changed.&lt;br /&gt;
: &amp;quot;players&amp;quot; is the array of player id that should be made active.&lt;br /&gt;
: If &amp;quot;exclusive&amp;quot; parameter is not set or false it doesn&#039;t deactivate other previously active players. If its set to true, the players who will be multiactive at the end are only these in &amp;quot;$players&amp;quot; array&lt;br /&gt;
&lt;br /&gt;
: In case &amp;quot;players&amp;quot; is empty, the method trigger the &amp;quot;next_state&amp;quot; transition to go to the next game state.&lt;br /&gt;
: returns true if state transition happened, false otherwise&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;setPlayerNonMultiactive( $player_id, $next_state )&lt;br /&gt;
: During a multiactive game state, make the specified player inactive.&lt;br /&gt;
: Usually, you call this method during a multiactive game state after a player did his action. It is also possible to call it directly from multiplayer action handler.&lt;br /&gt;
: If this player was the last active player, the method trigger the &amp;quot;next_state&amp;quot; transition to go to the next game state.&lt;br /&gt;
: returns true if state transition happened, false otherwise&lt;br /&gt;
Example of usage (see state declaration of playerTurnPlace above):&lt;br /&gt;
    &amp;lt;pre&amp;gt;&lt;br /&gt;
    function actionBla($args) {&lt;br /&gt;
        self::checkAction(&#039;actionBla&#039;);&lt;br /&gt;
        // handle the action using $this-&amp;gt;getCurrentPlayerId()&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;setPlayerNonMultiactive( $this-&amp;gt;getCurrentPlayerId(), &#039;next&#039;);&lt;br /&gt;
    }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;getActivePlayerList()&lt;br /&gt;
: With this method you can retrieve the list of the active player at any time.&lt;br /&gt;
: During a &amp;quot;game&amp;quot; type gamestate, it will return a void array.&lt;br /&gt;
: During a &amp;quot;activeplayer&amp;quot; type gamestate, it will return an array with one value (the active player id).&lt;br /&gt;
: During a &amp;quot;multipleactiveplayer&amp;quot; type gamestate, it will return an array of the active players id.&lt;br /&gt;
: Note: you should only use this method in the latter case.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
;  $this-&amp;gt;gamestate-&amp;gt;updateMultiactiveOrNextState( $next_state_if_none )&lt;br /&gt;
: Sends update notification about multiplayer changes. All multiactive set* functions above do that, however if you want to change state manually using db queries for complex calculations, you have to call this yourself after. Do not call this if you calling one of the other setters above.&lt;br /&gt;
Example: you have player teams and you want to activate all players in one team&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        $sql = &amp;quot;UPDATE player SET player_is_multiactive=&#039;0&#039;&amp;quot;;&lt;br /&gt;
        self::DbQuery( $sql );&lt;br /&gt;
        $sql = &amp;quot;UPDATE player SET player_is_multiactive=&#039;1&#039; WHERE player_id=&#039;$player_id&#039; AND player_team=&#039;$team_no&#039;&amp;quot;;&lt;br /&gt;
        self::DbQuery( $sql );&lt;br /&gt;
        &lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;updateMultiactiveOrNextState( &#039;error&#039; );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
; updating database manually&lt;br /&gt;
: Use this helper function to change multiactive state without sending notification&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    /**&lt;br /&gt;
     * Changes values of multiactivity in db, does not sent notifications.&lt;br /&gt;
     * To send notifications after use updateMultiactiveOrNextState&lt;br /&gt;
     * @param number $player_id, player id &amp;lt;=0 or null - means ALL&lt;br /&gt;
     * @param number $value - 1 multiactive, 0 non multiactive&lt;br /&gt;
     */&lt;br /&gt;
    function dbSetPlayerMultiactive($player_id = -1, $value = 1) {&lt;br /&gt;
        if (! $value)&lt;br /&gt;
            $value = 0;&lt;br /&gt;
        else&lt;br /&gt;
            $value = 1;&lt;br /&gt;
        $sql = &amp;quot;UPDATE player SET player_is_multiactive = &#039;$value&#039; WHERE player_zombie = 0 and player_eliminated = 0&amp;quot;;&lt;br /&gt;
        if ($player_id &amp;gt; 0) {&lt;br /&gt;
            $sql .= &amp;quot; AND player_id = $player_id&amp;quot;;&lt;br /&gt;
        }&lt;br /&gt;
        self::DbQuery($sql);&lt;br /&gt;
    }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== States functions ===&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;nextState( $transition )&lt;br /&gt;
: Change current state to a new state. Important: the $transition parameter is the name of the transition, and NOT the name of the target game state, see [[Your game state machine: states.inc.php]] for more information about states.&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;checkAction( $actionName, $bThrowException=true )&lt;br /&gt;
: Check if the current player can perform a specific action in the current game state, and optionally throw an exception if they can&#039;t.&lt;br /&gt;
: The action is valid if it is listed in the &amp;quot;possibleactions&amp;quot; array for the current game state (see game state description).&lt;br /&gt;
: This method MUST be the first one called in ALL your PHP methods that handle player actions, in order to make sure a player doesn&#039;t perform an action not allowed by the rules at the point in the game.  It should not be called from methods where the current player is not necessarily the active player, otherwise it may fail with an &amp;quot;It is not your turn&amp;quot; exception.&lt;br /&gt;
: If &amp;quot;bThrowException&amp;quot; is set to &amp;quot;false&amp;quot;, the function returns &#039;&#039;&#039;false&#039;&#039;&#039; in case of failure instead of throwing an exception. This is useful when several actions are possible, in order to test each of them without throwing exceptions.&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;checkPossibleAction( $action )&lt;br /&gt;
: (rarely used)&lt;br /&gt;
: This works exactly like &amp;quot;checkAction&amp;quot; (above), except that it does NOT check if the current player is active.&lt;br /&gt;
: This is used specifically in certain game states when you want to authorize additional actions for players that are not active at the moment.&lt;br /&gt;
: Example: in &#039;&#039;Libertalia&#039;&#039;, you want to authorize players to change their mind about the card played. They are of course not active at the time they change their mind, so you cannot use &amp;quot;checkAction&amp;quot;; use &amp;quot;checkPossibleAction&amp;quot; instead.&lt;br /&gt;
&lt;br /&gt;
This is how PHP action looks that returns player to active state (only for multiplayeractive states). To be able to execute on js side do not checkAction on js side for this specific one.&lt;br /&gt;
&lt;br /&gt;
   function actionUnpass() {&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;checkPossibleAction(&#039;actionUnpass&#039;); // player chane mind about passing while others were thinking&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;setPlayersMultiactive(array ($this-&amp;gt;getCurrentPlayerId() ), &#039;error&#039;, false);&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
; $this-&amp;gt;gamestate-&amp;gt;state()&lt;br /&gt;
: Get an associative array of current game state attributes, see [[Your game state machine: states.inc.php]] for state attributes.&lt;br /&gt;
  $state=$this-&amp;gt;gamestate-&amp;gt;state(); if( $state[&#039;name&#039;] == &#039;myGameState&#039; ) {...}&lt;br /&gt;
&lt;br /&gt;
== Players turn order ==&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getNextPlayerTable()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return an associative array which associate each player with the next player around the table.&lt;br /&gt;
&lt;br /&gt;
In addition, key 0 is associated to the first player to play.&lt;br /&gt;
&lt;br /&gt;
Example: if three player with ID 1, 2 and 3 are around the table, in this order, the method returns:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
   array( &lt;br /&gt;
    1 =&amp;gt; 2, &lt;br /&gt;
    2 =&amp;gt; 3, &lt;br /&gt;
    3 =&amp;gt; 1, &lt;br /&gt;
    0 =&amp;gt; 1 &lt;br /&gt;
   );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getPrevPlayerTable()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Same as above, but the associative array associate the previous player around the table. However there no 0 index here.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getPlayerAfter( $player_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get player playing after given player in natural playing order.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getPlayerBefore( $player_id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get player playing before given player in natural playing order.&lt;br /&gt;
&lt;br /&gt;
Note: There is no API to modify this order, if you have custom player order you have to maintain it in your database&lt;br /&gt;
and have custom function to access it.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;createNextPlayerTable( $players, $bLoop=true )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Using $players array creates a map of current =&amp;gt; next as in example from getNextPlayerTable(), however you can use custom order here. &lt;br /&gt;
Parmeter $bLoop is true if last player points to first, false otherwise.&lt;br /&gt;
In any case index 0 points to first player (first element of $players array). $players is array of player ids in desired order.&lt;br /&gt;
&lt;br /&gt;
N.B: This function &#039;&#039;&#039;DOES NOT&#039;&#039;&#039; allow to change players turn order!&lt;br /&gt;
&lt;br /&gt;
Example of usage:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    function getNextPlayerTableCustom() {&lt;br /&gt;
        $starting = $this-&amp;gt;getStartingPlayer(); // custom function to get starting player&lt;br /&gt;
        $player_ids = $this-&amp;gt;getPlayerIdsInOrder($starting); // custom function to create players array starting from starting player&lt;br /&gt;
        return self::createNextPlayerTable($player_ids, false); // create next player table in custom order&lt;br /&gt;
    }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Notify players ==&lt;br /&gt;
&lt;br /&gt;
To understand notifications, please read [http://www.slideshare.net/boardgamearena/the-bga-framework-at-a-glance The BGA Framework at a glance] first.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;IMPORTANT&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Notifications are sent at the very end of the request, when it ends normally. It means that if you throw an exception for any reason (ex: move not allowed), no notifications will be sent to players.&lt;br /&gt;
Notifications sent between the game start (setupNewGame) and the end of the &amp;quot;action&amp;quot; method of the first active state will never reach their destination.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;notifyAllPlayers( $notification_type, $notification_log, $notification_args )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Send a notification to all players of the game.&lt;br /&gt;
&lt;br /&gt;
* notification_type:&lt;br /&gt;
A string that defines the type of your notification.&lt;br /&gt;
&lt;br /&gt;
Your game interface Javascript logic will use this to know what is the type of the received notification (and to trigger the corresponding method).&lt;br /&gt;
&lt;br /&gt;
* notification_log:&lt;br /&gt;
A string that defines what is to be displayed in the game log.&lt;br /&gt;
&lt;br /&gt;
You can use an empty string here (&amp;quot;&amp;quot;). In this case, nothing is displayed in the game log.&lt;br /&gt;
&lt;br /&gt;
If you define a real string here, you should use &amp;quot;clienttranslate&amp;quot; method to make sure it can be translate.&lt;br /&gt;
&lt;br /&gt;
You can use arguments in your notification_log strings, that refers to values defines in the &amp;quot;notification_args&amp;quot; argument (see below). &lt;br /&gt;
Note: Make sure you only use single quotes (&#039;), otherwise PHP will try to interpolate the variable and will ignore the values in the args array.&lt;br /&gt;
&lt;br /&gt;
* notification_args:&lt;br /&gt;
The arguments of your notifications, as an associative array.&lt;br /&gt;
&lt;br /&gt;
This array will be transmitted to the game interface logic, in order the game interface can be updated.&lt;br /&gt;
&lt;br /&gt;
Complete notifyAllPlayers example (from &amp;quot;Reversi&amp;quot;):&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::notifyAllPlayers( &amp;quot;playDisc&amp;quot;, clienttranslate( &#039;${player_name} plays a disc and turns over ${returned_nbr} disc(s)&#039; ),&lt;br /&gt;
 array(&lt;br /&gt;
        &#039;player_id&#039; =&amp;gt; $player_id,&lt;br /&gt;
        &#039;player_name&#039; =&amp;gt; self::getActivePlayerName(),&lt;br /&gt;
        &#039;returned_nbr&#039; =&amp;gt; count( $turnedOverDiscs ),&lt;br /&gt;
        &#039;x&#039; =&amp;gt; $x,&lt;br /&gt;
        &#039;y&#039; =&amp;gt; $y&lt;br /&gt;
     ) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
You can see in the example above the use of the &amp;quot;clienttranslate&amp;quot; method, and the use of 2 arguments &amp;quot;player_name&amp;quot; and &amp;quot;returned_nbr&amp;quot; in the notification log.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important&#039;&#039;&#039;: NO private data must be sent with this method, as a cheater could see it even it is not used explicitly by the game interface logic. If you want to send private information to a player, please use notifyPlayer below.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important&#039;&#039;&#039;: this array is serialized to be sent to the browsers, and will be saved with the notification to be able to replay the game later. If it is too big, it can make notifications slower / less reliable, and replay archives very big (to the point of failing). So as a general rule, you should send only the minimum of information necessary to update the client interface with no overhead in order to keep the notifications as light as possible.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important&#039;&#039;&#039;: When the game page is reloaded (i.e. F5 or when loading turn based game) all previous notifications are replayed as history notifications. These notifications do not trigger notification handlers and are used basically to build the game log. Because of that most of the notification arguments, expect i18n, player_id and all arguments used in the message, are removed from these history notifications. If you need additional arguments in history notifications you can add special field preserveArgsInHistory to notification arguments, like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
self::notifyAllPlayers( &amp;quot;playDisc&amp;quot;, clienttranslate( &#039;${player_name} plays a disc and turns over ${returned_nbr} disc(s)&#039; ),&lt;br /&gt;
 array(&lt;br /&gt;
        &#039;player_id&#039; =&amp;gt; $player_id,&lt;br /&gt;
        &#039;player_name&#039; =&amp;gt; self::getActivePlayerName(),&lt;br /&gt;
        &#039;returned_nbr&#039; =&amp;gt; count( $turnedOverDiscs ),&lt;br /&gt;
        &#039;x&#039; =&amp;gt; $x,&lt;br /&gt;
        &#039;y&#039; =&amp;gt; $y,&lt;br /&gt;
        &#039;preserveArgsInHistory&#039; =&amp;gt; [ &#039;x&#039;, &#039;y&#039; ]&lt;br /&gt;
     ) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
In this example, fields x and y will be preserved when replaying history notification at the game load.&lt;br /&gt;
&lt;br /&gt;
Note: you CAN use some HTML inside your notification log, however it not recommended for many reasons:&lt;br /&gt;
* Its bad architecture, ui elements leak into server now you have to manage ui in many places&lt;br /&gt;
* If you decided to change something in ui in future version, old games reply and tutorials may not work, since they use stored notifications&lt;br /&gt;
* When you read log preview for old games its unreadable (this is log before you enter the game reply, useful for troubleshooting or game analysis)&lt;br /&gt;
* Its more data to transfer and store in db&lt;br /&gt;
* Its nightmare for translators, at least don&#039;t put HTML tags inside the &amp;quot;clienttranslate&amp;quot; method. You can use a notification argument instead, and provide your HTML through this argument.&lt;br /&gt;
&lt;br /&gt;
If you still want to have pretty pictures in the log check this [[BGA_Studio_Cookbook#Inject_images_and_styled_html_in_the_log]].&lt;br /&gt;
&lt;br /&gt;
If your notification contains some phrases that build programmatically you may need to use recursive notifications. In this case the argument can be not only the string but&lt;br /&gt;
an array itself, which contains &#039;log&#039; and &#039;args&#039;, i.e.&lt;br /&gt;
&lt;br /&gt;
  $this-&amp;gt;notifyAllPlayers(&#039;playerLog&#039;,clienttranslate(&#039;Game moves ${token_name_rec}&#039;),&lt;br /&gt;
                   [&#039;token_name_rec&#039;=&amp;gt;[&#039;log&#039;=&amp;gt;&#039;${token_name} #${token_number}&#039;,&lt;br /&gt;
                                       &#039;args&#039;=&amp;gt; [&#039;token_name&#039;=&amp;gt;clienttranslate(&#039;Boo&#039;), &#039;token_number&#039;=&amp;gt;$number, &#039;i18n&#039;=&amp;gt;[&#039;token_name&#039;] ]&lt;br /&gt;
                                      ]&lt;br /&gt;
                   ]);&lt;br /&gt;
&lt;br /&gt;
Special handling of arguments:&lt;br /&gt;
* ${player_name}  - this will be wrapped in html and text shown using color of the corresponding player, some colors also have reserved background. This will apply recursively as well.&lt;br /&gt;
* ${player_name2} - same &lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;notifyPlayer( $player_id, $notification_type, $notification_log, $notification_args )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Same as above, except that the notification is sent to one player only.&lt;br /&gt;
&lt;br /&gt;
This method must be used each time some private information must be transmitted to a player.&lt;br /&gt;
&lt;br /&gt;
Important: the variable for player name must be ${player_name} in order to be highlighted with the player color in the game log. If you want a second player name in the log, name the variable ${player_name2}, etc.&lt;br /&gt;
&lt;br /&gt;
Note that spectators cannot be notified using this method, because their player ID is not available via loadPlayersBasicInfos() or otherwise. You must use notifyAllPlayers() for any notification that spectators should get.&lt;br /&gt;
&lt;br /&gt;
== About random and randomness ==&lt;br /&gt;
&lt;br /&gt;
A large number of board games rely on random, most often based on dice, cards shuffling, picking some item in a bag, and so on. This is very important to ensure a high level of randomness for each of these situations.&lt;br /&gt;
&lt;br /&gt;
Here&#039;s are a list of techniques you should use in these situations, from the best to the worst.&lt;br /&gt;
&lt;br /&gt;
=== Dice and bga_rand ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;bga_rand( min, max )&#039;&#039;&#039; &lt;br /&gt;
This is a BGA framework function that provides you a random number between &amp;quot;min&amp;quot; and &amp;quot;max&amp;quot; (inclusive), using the best available random method available on the system.&lt;br /&gt;
&lt;br /&gt;
This is the preferred function you should use, because we are updating it when a better method is introduced.&lt;br /&gt;
&lt;br /&gt;
As of now, bga_rand is based on the PHP function &amp;quot;random_int&amp;quot;, which ensures a cryptographic level of randomness.&lt;br /&gt;
&lt;br /&gt;
In particular, it is &#039;&#039;&#039;mandatory&#039;&#039;&#039; to use it for all &#039;&#039;&#039;dice throw&#039;&#039;&#039; (ie: games using other methods for dice throwing will be rejected by BGA during review).&lt;br /&gt;
&lt;br /&gt;
Note: rand() and mt_rand() are deprecated on BGA and should not be used anymore, as their randomness is not as good as &amp;quot;bga_rand&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
=== shuffle and cards shuffling ===&lt;br /&gt;
&lt;br /&gt;
To shuffle items, like a pile of cards, the best way is to use the BGA PHP [[Deck]] component and to use &amp;quot;shuffle&amp;quot; method. This ensures that the best available shuffling method is used, and that if in the future we improve it your game will be up to date.&lt;br /&gt;
&lt;br /&gt;
As of now, the Deck component shuffle method is based on PHP &amp;quot;shuffle&amp;quot; method, which has quite good randomness (even it is not as good as bga_rand). In consequence, we accept other shuffling methods during reviews, as long as they are based on PHP &amp;quot;shuffle&amp;quot; function (or similar, like &amp;quot;array_rand&amp;quot;).&lt;br /&gt;
&lt;br /&gt;
=== Other methods ===&lt;br /&gt;
&lt;br /&gt;
Mysql &amp;quot;RAND()&amp;quot; function has not enough randomness to be a valid method to get a random element on BGA. This function has been used in some existing games and has given acceptable results, but now it should be avoided and you should use other methods instead.&lt;br /&gt;
&lt;br /&gt;
== Game statistics ==&lt;br /&gt;
&lt;br /&gt;
There are 2 types of statistics:&lt;br /&gt;
* a &amp;quot;player&amp;quot; statistic is a statistic associated to a player&lt;br /&gt;
* a &amp;quot;table&amp;quot; statistic is a statistic not associated to a player (global statistic for this game).&lt;br /&gt;
&lt;br /&gt;
See [[Game statistics: stats.inc.php]] to see how you define statistics for your game.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;initStat( $table_or_player, $name, $value, $player_id = null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Create a statistic entry with a default value.&lt;br /&gt;
&lt;br /&gt;
This method must be called for each statistic of your game, in your setupNewGame method.&lt;br /&gt;
If you neglect to call this for a statistic, and also do not update the value during the course of a certain game using setStat or incStat, the value of the stat will be undefined rather than 0. This will result in it being ignored at the end of the game, as if it didn&#039;t apply to that particular game, and excluded from cumulative statistics. As a consequence - if do not want statistic to be applied, do not init it, or call set or inc on it.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;$table_or_player&#039; must be set to &amp;quot;table&amp;quot; if this is a table statistic, or &amp;quot;player&amp;quot; if this is a player statistic.&lt;br /&gt;
&lt;br /&gt;
&#039;$name&#039; is the name of your statistic, as it has been defined in your stats.inc.php file.&lt;br /&gt;
&lt;br /&gt;
&#039;$value&#039; is the initial value of the statistic. If this is a player statistic and if the player is not specified by &amp;quot;$player_id&amp;quot; argument, the value is set for ALL players.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setStat( $value, $name, $player_id = null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Set a statistic $name to $value.&lt;br /&gt;
&lt;br /&gt;
If &amp;quot;$player_id&amp;quot; is not specified, setStat consider it is a TABLE statistic.&lt;br /&gt;
&lt;br /&gt;
If &amp;quot;$player_id&amp;quot; is specified, setStat consider it is a PLAYER statistic.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;incStat( $delta, $name, $player_id = null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Increment (or decrement) specified statistic value by $delta value. Same behavior as setStat function.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getStat( $name, $player_id = null )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the value of statistic specified by $name. Useful when creating derivative statistics such as average.&lt;br /&gt;
&lt;br /&gt;
== Translations ==&lt;br /&gt;
&lt;br /&gt;
See [[Translations]]&lt;br /&gt;
&lt;br /&gt;
== Manage player scores and Tie breaker ==&lt;br /&gt;
&lt;br /&gt;
=== Normal scoring ===&lt;br /&gt;
&lt;br /&gt;
At the end of the game, players automatically get a rank depending on their score: the player with the biggest score is #1, the player with the second biggest score is #2, and so on...&lt;br /&gt;
&lt;br /&gt;
During the game, you update player&#039;s score directly by updating &amp;quot;player_score&amp;quot; field of &amp;quot;player&amp;quot; table in database.&lt;br /&gt;
&lt;br /&gt;
Examples:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
  // +2 points to active player&lt;br /&gt;
  self::DbQuery( &amp;quot;UPDATE player SET player_score=player_score+2 WHERE player_id=&#039;&amp;quot;.self::getActivePlayerId().&amp;quot;&#039;&amp;quot; );&lt;br /&gt;
&lt;br /&gt;
  // Set score of active player to 5&lt;br /&gt;
  self::DbQuery( &amp;quot;UPDATE player SET player_score=5 WHERE player_id=&#039;&amp;quot;.self::getActivePlayerId().&amp;quot;&#039;&amp;quot; );&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: don&#039;t forget to notify the client side in order the score control can be updated accordingly.&lt;br /&gt;
&lt;br /&gt;
=== Tie breaker ===&lt;br /&gt;
&lt;br /&gt;
Tie breaker is used when two players get the same score at the end of a game.&lt;br /&gt;
&lt;br /&gt;
Tie breaker is using &amp;quot;player_score_aux&amp;quot; field of &amp;quot;player&amp;quot; table. It is updated exactly like the &amp;quot;player_score&amp;quot; field.&lt;br /&gt;
&lt;br /&gt;
Tie breaker score is displayed only for players who are tied at the end of the game. Most of the time, it is not supposed to be displayed explicitly during the game.&lt;br /&gt;
&lt;br /&gt;
When you are using &amp;quot;player_score_aux&amp;quot; functionality, you must describe the formula to use in your gameinfos.inc.php file like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
         &#039;tie_breaker_description&#039; =&amp;gt; totranslate(&amp;quot;Describe here your tie breaker formula&amp;quot;),&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
This description will be used as a tooltip to explain to players how this auxiliary score has been calculated.&lt;br /&gt;
&lt;br /&gt;
=== Co-operative game ===&lt;br /&gt;
&lt;br /&gt;
To make everyone win/lose together in a full-coop game:&lt;br /&gt;
&lt;br /&gt;
Add the following in gameinfos.inc.php :&lt;br /&gt;
&#039;is_coop&#039; =&amp;gt; 1, // full cooperative&lt;br /&gt;
&lt;br /&gt;
Assign a score of zero to everyone if it&#039;s a loss.&lt;br /&gt;
Assign the same score &amp;gt; 0 to everyone if it&#039;s a win.&lt;br /&gt;
&lt;br /&gt;
=== Semi-coop ===&lt;br /&gt;
&lt;br /&gt;
If the game is not full-coop, then everyone loses = everyone is tied. I.e. set score to 0 to everybody.&lt;br /&gt;
&lt;br /&gt;
=== Only &amp;quot;winners&amp;quot; and &amp;quot;losers&amp;quot; ===&lt;br /&gt;
&lt;br /&gt;
For some games, there is only a group (or a single) &amp;quot;winner&amp;quot;, and everyone else is a &amp;quot;loser&amp;quot;, with no &amp;quot;end of game rank&amp;quot; (1st, 2nd, 3rd...).&lt;br /&gt;
&lt;br /&gt;
Examples:&lt;br /&gt;
* Coup&lt;br /&gt;
* Not Alone&lt;br /&gt;
* Werewolves&lt;br /&gt;
* Quantum&lt;br /&gt;
&lt;br /&gt;
In this case:&lt;br /&gt;
* Set the scores so that the winner has the best score, and the other players have the same (lower) score.&lt;br /&gt;
* Add the following lines to gameinfos.inc.php:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
// If in the game, all losers are equal (no score to rank them or explicit in the rules that losers are not ranked between them), set this to true &lt;br /&gt;
// The game end result will display &amp;quot;Winner&amp;quot; for the 1st player and &amp;quot;Loser&amp;quot; for all other players&lt;br /&gt;
&#039;losers_not_ranked&#039; =&amp;gt; true,&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Werewolves and Coup are implemented like this, as you can see here:&lt;br /&gt;
* https://boardgamearena.com/#!gamepanel?game=werewolves&amp;amp;section=lastresults&lt;br /&gt;
* https://boardgamearena.com/#!gamepanel?game=coupcitystate&amp;amp;section=lastresults&lt;br /&gt;
&lt;br /&gt;
Adding this has the following effects:&lt;br /&gt;
* On game results for this game, &amp;quot;Winner&amp;quot; or &amp;quot;Loser&amp;quot; is going to appear instead of the usual &amp;quot;1st, 2nd, 3rd, ...&amp;quot;.&lt;br /&gt;
* When a game is over, the result of the game will be &amp;quot;End of game: Victory&amp;quot; or &amp;quot;End of game: Defeat&amp;quot; depending on the result of the CURRENT player (instead of the usual &amp;quot;Victory of XXX&amp;quot;).&lt;br /&gt;
* When calculating ELO points, if there is at least one &amp;quot;Loser&amp;quot;, no &amp;quot;victorious&amp;quot; player can lose ELO points, and no &amp;quot;losing&amp;quot; player can win ELO point. Usually it may happened because being tie with many players with a low rank is considered as a tie and may cost you points. If losers_not_ranked is set, we prevent this behavior and make sure you only gain/loss ELO when you get the corresponding results.&lt;br /&gt;
&lt;br /&gt;
Important: this SHOULD NOT be used for cooperative games (see is_coop parameter), or for 2 players games (it makes no sense in this case).&lt;br /&gt;
&lt;br /&gt;
=== Solo ===&lt;br /&gt;
&lt;br /&gt;
If game supports solo variant, a negative or zero score means defeat, a positive score means victory.&lt;br /&gt;
&lt;br /&gt;
=== Player elimination ===&lt;br /&gt;
&lt;br /&gt;
In some games, this is useful to eliminate a player from the game in order he/she can start another game without waiting for the current game end.&lt;br /&gt;
&lt;br /&gt;
This case should be rare. Please don&#039;t use player elimination feature if some player just has to wait the last 10% of the game for game end. This feature should be used only in games where players are eliminated all along the game (typical examples: &amp;quot;Perudo&amp;quot; or &amp;quot;The Werewolves of Miller&#039;s Hollow&amp;quot;).&lt;br /&gt;
&lt;br /&gt;
Usage:&lt;br /&gt;
&lt;br /&gt;
* Player to eliminate should NOT be active anymore (preferably use the feature in a &amp;quot;game&amp;quot; type game state).&lt;br /&gt;
* In your PHP code:&lt;br /&gt;
  self::eliminatePlayer( &amp;lt;player_to_eliminate_id&amp;gt; );&lt;br /&gt;
* the player is informed in a dialog box that he no longer have to played and can start another game if he/she wants too (whith buttons &amp;quot;stay at this table&amp;quot; &amp;quot;quit table and back to main site&amp;quot;). In any case, the player is free to start &amp;amp; join another table from now.&lt;br /&gt;
* When your game is over, all players who have been eliminated before receive a &amp;quot;notification&amp;quot; (the small &amp;quot;!&amp;quot; icon on the top right of the BGA interface) that indicate them that &amp;quot;the game has ended&amp;quot; and invite them to review the game results.&lt;br /&gt;
&lt;br /&gt;
=== Scoring Helper functions ===&lt;br /&gt;
&lt;br /&gt;
These functions should have been API but they are not, just add them to your php game and use for every game.&lt;br /&gt;
&lt;br /&gt;
    // get score&lt;br /&gt;
    function dbGetScore($player_id) {&lt;br /&gt;
        return $this-&amp;gt;getUniqueValueFromDB(&amp;quot;SELECT player_score FROM player WHERE player_id=&#039;$player_id&#039;&amp;quot;);&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
    // set score&lt;br /&gt;
    function dbSetScore($player_id, $count) {&lt;br /&gt;
        $this-&amp;gt;DbQuery(&amp;quot;UPDATE player SET player_score=&#039;$count&#039; WHERE player_id=&#039;$player_id&#039;&amp;quot;);&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
    // set aux score (tie breaker)&lt;br /&gt;
    function dbSetAuxScore($player_id, $score) {&lt;br /&gt;
        $this-&amp;gt;DbQuery(&amp;quot;UPDATE player SET player_score_aux=$score WHERE player_id=&#039;$player_id&#039;&amp;quot;);&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
    // increment score (can be negative too)&lt;br /&gt;
    function dbIncScore($player_id, $inc) {&lt;br /&gt;
        $count = $this-&amp;gt;dbGetScore($player_id);&lt;br /&gt;
        if ($inc != 0) {&lt;br /&gt;
            $count += $inc;&lt;br /&gt;
            $this-&amp;gt;dbSetScore($player_id, $count);&lt;br /&gt;
        }&lt;br /&gt;
        return $count;&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
== Reflexion time ==&lt;br /&gt;
&lt;br /&gt;
; function giveExtraTime( $player_id, $specific_time=null )&lt;br /&gt;
: Give standard extra time to this player.&lt;br /&gt;
: Standard extra time depends on the speed of the game (small with &amp;quot;slow&amp;quot; game option, bigger with other options).&lt;br /&gt;
: You can also specify an exact time to add, in seconds, with the &amp;quot;specified_time&amp;quot; argument (rarely used).&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Undo moves ==&lt;br /&gt;
&lt;br /&gt;
Please read our [[BGA Undo policy]] before.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important&#039;&#039;&#039;: Before using these methods, you must also add the following to your &amp;quot;gameinfos.inc.php&amp;quot; file, otherwise these methods are ineffective:&lt;br /&gt;
  &#039;db_undo_support&#039; =&amp;gt; true&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
; function undoSavepoint( )&lt;br /&gt;
: Save the whole game situation inside an &amp;quot;Undo save point&amp;quot;.&lt;br /&gt;
: There is only ONE undo save point available (see [[BGA Undo policy]]). Cannot use in multiactivate state or in game state where next state is multiactive.&lt;br /&gt;
: Note: this function does not actually do anything when it is called, it only raises the flag to store the database AFTER transaction is over. So the actual state will be saved when you exit the function  calling it (technically before first queued notification is sent, which matter if you transition to game state not to user state after), which may affect what you end up saved.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
; function undoRestorePoint()&lt;br /&gt;
: Restore the situation previously saved as an &amp;quot;Undo save point&amp;quot;.&lt;br /&gt;
: You must make sure that the active player is the same after and before the undoRestorePoint (ie: this is your responsibility to ensure that the player that is active when this method is called is exactly the same than the player that was active when the undoSavePoint method has been called).&lt;br /&gt;
&lt;br /&gt;
    function actionUndo() {&lt;br /&gt;
        self::checkAction(&#039;actionUndo&#039;);&lt;br /&gt;
        $this-&amp;gt;undoRestorePoint();&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;nextState(&#039;next&#039;); // transition to single player state (i.e. beginning of player actions for this turn)&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
== Managing errors and exceptions ==&lt;br /&gt;
&lt;br /&gt;
Note: when you throw an exception, all database changes and all notifications are cancelled immediately. This way, the game situation that existed before the request is completely restored.&lt;br /&gt;
&lt;br /&gt;
; throw new BgaUserException ( $error_message)&lt;br /&gt;
: Base class to notify a user error&lt;br /&gt;
: You must throw this exception when a player wants to do something that he is not allowed to do.&lt;br /&gt;
: The error message will be shown to the player as a &amp;quot;red message&amp;quot;, so it must be translated.&lt;br /&gt;
: Throwing such an exception is NOT considered a bug, so it is not traced in BGA error logs.&lt;br /&gt;
&lt;br /&gt;
Example from Gomoku:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     throw new BgaUserException( self::_(&amp;quot;There is already a stone on this intersection, you can&#039;t play there&amp;quot;) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
; throw new BgaVisibleSystemException ( $error_message)&lt;br /&gt;
: You must throw this exception when you detect something that is not supposed to happened in your code.&lt;br /&gt;
: The error message is shown to the user as an &amp;quot;Unexpected error&amp;quot;, in order that he can report it in the forum.&lt;br /&gt;
: The error message is logged in BGA error logs. If it happens regularly, we will report it to you.&lt;br /&gt;
&lt;br /&gt;
; throw new BgaSystemException ( $error_message)&lt;br /&gt;
: Base class to notify a system exception. The message will be hidden from the user, but show in the logs. Use this if the message contains technical information.&lt;br /&gt;
: You shouldn&#039;t use this type of exception except if you think the information shown could be critical. Indeed: a generic error message will be shown to the user, so it&#039;s going to be difficult for you to see what happened.&lt;br /&gt;
&lt;br /&gt;
== Zombie mode ==&lt;br /&gt;
&lt;br /&gt;
When a player leaves a game for any reason (expelled, quit), he becomes a &amp;quot;zombie player&amp;quot;. In this case, the results of the game won&#039;t count for statistics, but this is cool if the other players can finish the game anyway. That&#039;s why zombie mode exists: allow the other player to finish the game, even if the situation is not ideal.&lt;br /&gt;
&lt;br /&gt;
While developing your zombie mode, keep in mind that:&lt;br /&gt;
* Do not refer to the rules, because this situation is not planned by the rules.&lt;br /&gt;
* Try to figure that you are playing with your friends and one of them has to leave: how can we finish the game without killing the spirit of the game?&lt;br /&gt;
* The idea is NOT to develop an artificial intelligence for the game.&lt;br /&gt;
* Do not try to end the game early, even in a two-player game. The zombie is there to allow the game to continue, not to end it. Trying to end the game is not supported by the framework and will likely cause unexpected errors.&lt;br /&gt;
&lt;br /&gt;
Most of the time, the best thing to do when it is zombie player turn is to jump immediately to a state where he is not active anymore. For example, if he is in a game state where he has a choice between playing A and playing B, the best thing to do is NOT to choose A or B, but to pass. So, even if there&#039;s no &amp;quot;pass&amp;quot; action in the rules, add a &amp;quot;zombiepass&amp;quot; transitition in your game state and use it.&lt;br /&gt;
&lt;br /&gt;
Each time a zombie player must play, your &amp;quot;zombieTurn&amp;quot; method is called.&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* $state: the name of the current game state.&lt;br /&gt;
* $active_player: the id of the active player.&lt;br /&gt;
&lt;br /&gt;
Most of the time, your zombieTurn method looks like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    function zombieTurn( $state, $active_player )&lt;br /&gt;
    {&lt;br /&gt;
    	$statename = $state[&#039;name&#039;];&lt;br /&gt;
&lt;br /&gt;
        if( $statename == &#039;myFirstGameState&#039;&lt;br /&gt;
             ||  $statename == &#039;my2ndGameState&#039;&lt;br /&gt;
             ||  $statename == &#039;my3rdGameState&#039;&lt;br /&gt;
               ....&lt;br /&gt;
           )&lt;br /&gt;
        {&lt;br /&gt;
            $this-&amp;gt;gamestate-&amp;gt;nextState( &amp;quot;zombiePass&amp;quot; );&lt;br /&gt;
        }&lt;br /&gt;
        else&lt;br /&gt;
            throw new BgaVisibleSystemException( &amp;quot;Zombie mode not supported at this game state: &amp;quot;.$statename );&lt;br /&gt;
    }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note that in the example above, all corresponding game state should implement &amp;quot;zombiePass&amp;quot; as a transition.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Very important&#039;&#039;&#039;: your zombie code will be called when the player leaves the game. This action is triggered from the main site and propagated to the gameserver from a server, not from a browser. As a consequence, there is no current player associated to this action. In your zombieTurn function, you must &#039;&#039;&#039;never&#039;&#039;&#039; use getCurrentPlayerId() or getCurrentPlayerName(), otherwise it will fail with a &amp;quot;Not logged&amp;quot; error message.&lt;br /&gt;
&lt;br /&gt;
== Player color preferences ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
BGA players (Club members) may now choose their preferred color for playing. For example, if they are used to play green for every board game, they can select &amp;quot;green&amp;quot; in their BGA preferences page.&lt;br /&gt;
&lt;br /&gt;
Making your game compatible with colors preferences is very easy and requires only 1 line of PHP and 1 configuration change :&lt;br /&gt;
&lt;br /&gt;
On your gameinfos.inc.php file, add the following lines :&lt;br /&gt;
&lt;br /&gt;
  // Favorite colors support : if set to &amp;quot;true&amp;quot;, support attribution of favorite colors based on player&#039;s preferences (see reattributeColorsBasedOnPreferences PHP method)&lt;br /&gt;
  // NB: this parameter is used only to flag games supporting this feature; you must use (or not use) reattributeColorsBasedOnPreferences PHP method to actually enable or disable the feature.&lt;br /&gt;
  &#039;favorite_colors_support&#039; =&amp;gt; true,&lt;br /&gt;
&lt;br /&gt;
Then, on your main &amp;lt;your_game&amp;gt;.game.php file, find the &amp;quot;reloadPlayersBasicInfos&amp;quot; call in your &amp;quot;setupNewGame&amp;quot; method and replace :&lt;br /&gt;
&lt;br /&gt;
        $sql .= implode( $values, &#039;,&#039; );&lt;br /&gt;
        self::DbQuery( $sql );&lt;br /&gt;
        self::reloadPlayersBasicInfos();&lt;br /&gt;
&lt;br /&gt;
By :&lt;br /&gt;
&lt;br /&gt;
        $sql .= implode( $values, &#039;,&#039; );&lt;br /&gt;
        self::DbQuery( $sql );&lt;br /&gt;
        self::reattributeColorsBasedOnPreferences( $players, array(  /* LIST HERE THE AVAILABLE COLORS OF YOUR GAME INSTEAD OF THESE ONES */&amp;quot;ff0000&amp;quot;, &amp;quot;008000&amp;quot;, &amp;quot;0000ff&amp;quot;, &amp;quot;ffa500&amp;quot;, &amp;quot;773300&amp;quot; ) );&lt;br /&gt;
        self::reloadPlayersBasicInfos();&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
The &amp;quot;reattributeColorsBasedOnPreferences&amp;quot; method reattributes all colors, taking into account players color preferences and available colors.&lt;br /&gt;
&lt;br /&gt;
Note that you must update the colors to indicate the colors available for your game.&lt;br /&gt;
&lt;br /&gt;
2 important remarks :&lt;br /&gt;
* for some games (ex : Chess), the color has an influence on a mechanism of the game, most of the time by giving a special advantage to a player (ex : Starting the game). Color preference mechanism must NOT be used in such a case.&lt;br /&gt;
* your logic should NEVER consider that the first player has the color X, that the second player has the color Y, and so on. If this is the case, your game will NOT be compatible with reattributeColorsBasedOnPreferences as this method attribute colors to players based on their preferences and not based as their order at the table.&lt;br /&gt;
&lt;br /&gt;
Colours currently listed as a choice in preferences:&lt;br /&gt;
&lt;br /&gt;
* #ff0000 Red&lt;br /&gt;
* #008000 Green&lt;br /&gt;
* #0000ff Blue&lt;br /&gt;
* #ffa500 Yellow&lt;br /&gt;
* #000000 Black&lt;br /&gt;
* #ffffff White&lt;br /&gt;
* #e94190 Pink&lt;br /&gt;
* #982fff Purple&lt;br /&gt;
* #72c3b1 Cyan&lt;br /&gt;
* #f07f16 Orange&lt;br /&gt;
* #bdd002 Khaki green&lt;br /&gt;
* #7b7b7b Gray&lt;br /&gt;
&lt;br /&gt;
== Legacy games API ==&lt;br /&gt;
&lt;br /&gt;
For some very specific games (&amp;quot;legacy&amp;quot;, &amp;quot;campaign&amp;quot;), you need to keep some informations from a game to another.&lt;br /&gt;
&lt;br /&gt;
This should be an exceptional situation: the legacy API is costing resources on Board Game Arena databases, and is slowing down the game setup process + game end of game process. Please do not use it for things like:&lt;br /&gt;
* keeping a player preference/settings (=&amp;gt; player preferences and game options should be used instead)&lt;br /&gt;
* keeping a statistics, a score, or a ranking, while it is not planned in the physical board game, or while there is no added value compared to BGA statistics / rankings.&lt;br /&gt;
&lt;br /&gt;
You should use it for:&lt;br /&gt;
* legacy games: when some components of the game has been altered in a previous game and should be kept as it is.&lt;br /&gt;
* &amp;quot;campaign style&amp;quot; games: when a player is getting a &amp;quot;reward&amp;quot; at the end of a game, and should be able to use it in further games.&lt;br /&gt;
&lt;br /&gt;
Important: you cannot store more than 64k of data (serialized as JSON) per player per game. If you go over 64k, storeLegacyData function is going to FAIL, and there is a risk to create a major bug (= players blocked) in your game. You MUST make sure that no more than 64k of data is used for each player for your game. For example, if you are implementing a &amp;quot;campaign style&amp;quot; game and if you allow a player to start multiple campaign, you must LIMIT the number of different campaign so that the total data size to not go over the limit. We strongly recommend you to use this:&lt;br /&gt;
&lt;br /&gt;
  try &lt;br /&gt;
  {&lt;br /&gt;
  	$this-&amp;gt;storeLegacyTeamData( &#039;my_variable&#039;, $my_data );&lt;br /&gt;
  }&lt;br /&gt;
  catch( feException $e )&lt;br /&gt;
  {&lt;br /&gt;
  	if( $e-&amp;gt;getCode() == FEX_legacy_size_exceeded )&lt;br /&gt;
  	{&lt;br /&gt;
  		// Do something here to free some space in Legacy data (ex: by removing some variables)&lt;br /&gt;
  	}&lt;br /&gt;
  	else&lt;br /&gt;
  		throw $e;&lt;br /&gt;
  }&lt;br /&gt;
&lt;br /&gt;
The keys may only contain letters and numbers, underscore seems not to be allowed.&lt;br /&gt;
&lt;br /&gt;
; function storeLegacyData( $player_id, $key, $data, $ttl = 365 )&lt;br /&gt;
: Store some data associated with $key for the given user / current game&lt;br /&gt;
: In the opposite of all other game data, this data will PERSIST after the end of this table, and can be re-used&lt;br /&gt;
: in a future table with the same game.&lt;br /&gt;
: IMPORTANT: The only possible place where you can use this method is when the game is over at your table (last game action). Otherwise, there is a risk of conflicts between ongoing games.    &lt;br /&gt;
: TTL is a time-to-live: the maximum, and default, is 365 days.&lt;br /&gt;
: In any way, the total data (= all keys) you can store for a given user+game is 64k (note: data is store serialized as JSON data)&lt;br /&gt;
&lt;br /&gt;
; function retrieveLegacyData( $player_id, $key )&lt;br /&gt;
: Get data associated with $key for the current game&lt;br /&gt;
: This data is common to ALL tables from the same game for this player, and persist from one table to another.&lt;br /&gt;
: Note: calling this function has an important cost =&amp;gt; please call it few times (possibly: only ONCE) for each player for 1 game if possible&lt;br /&gt;
: Note: you can use &#039;%&#039; in $key to retrieve all keys matching the given patterns&lt;br /&gt;
&lt;br /&gt;
; function removeLegacyData( $player_id, $key )&lt;br /&gt;
: Remove some legacy data with the given key&lt;br /&gt;
: (useful to free some data to avoid going over 64k)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
; function storeLegacyTeamData( $key, $data, $ttl = 365 )&lt;br /&gt;
: Same as storeLegacyData, except that it stores some data for the whole team within the current table&lt;br /&gt;
: Ie: if players A, B and C are at a table, the legacy data will be saved for future table with (exactly) A, B and C on the table.&lt;br /&gt;
: This is useful for games which are intended to be played several time by the same team.&lt;br /&gt;
: Note: the data total size is still limited, so you must implement catch the FEX_legacy_size_exceeded exception if it happens&lt;br /&gt;
&lt;br /&gt;
; function retrieveLegacyTeamData($key)&lt;br /&gt;
: Same as retrieveLegacyData, except that it retrieves some data for the whole team within the current table (set by storeLegacyTeamData)&lt;br /&gt;
&lt;br /&gt;
; function removeLegacyTeamData()&lt;br /&gt;
: Same as removeLegacyData, except that it retrieves some data for the whole team within the current table (set by storeLegacyTeamData)&lt;br /&gt;
&lt;br /&gt;
== Language dependent games API ==&lt;br /&gt;
&lt;br /&gt;
This API is used for games that are heavily language dependent. Two most common use cases are:&lt;br /&gt;
* Games that have a language dependent component that are not necessarily translatable, typically a list of words. (Think of games like Codenames, Decrypto, Just One...)&lt;br /&gt;
* Games with massive communication where players would like to ensure that all participants speak the same language. (Think of games like Werewolf, The Resistance, maybe even dixit...)&lt;br /&gt;
&lt;br /&gt;
If this option is used, the table created will be limited only to users that have specific language in their profile. Player starting the game would be able to chose one of the languages he speaks.&lt;br /&gt;
&lt;br /&gt;
There is a new property language_dependency in gameinfos.inc.php which can be set like this:&lt;br /&gt;
  &#039;language_dependecy&#039; =&amp;gt; false,  //or if the property is missing, the game is not language dependent&lt;br /&gt;
  &#039;language_dependecy&#039; =&amp;gt; true, //all players at the table must speak the same language&lt;br /&gt;
  &#039;language_dependecy&#039; =&amp;gt; array( 1 =&amp;gt; &#039;en&#039;, 2 =&amp;gt; &#039;fr&#039;, 3 =&amp;gt; &#039;it&#039; ), //1-based list of supported languages&lt;br /&gt;
&lt;br /&gt;
In the gamename.game.php file, you can get the id of selected language with the method &#039;&#039;&#039;getGameLanguage&#039;&#039;&#039;.&lt;br /&gt;
; function getGameLanguage()&lt;br /&gt;
: Returns an index of the selected language as defined in gameinfos.inc.php.&lt;br /&gt;
&lt;br /&gt;
Languages currently available on BGA are:&lt;br /&gt;
  &#039;ar&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;العربية&amp;quot;, &#039;code&#039; =&amp;gt; &#039;ar_AE&#039; ),             // Arabic&lt;br /&gt;
  &#039;be&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;беларуская мова&amp;quot;, &#039;code&#039; =&amp;gt; &#039;be_BY&#039; ),     // Belarusian&lt;br /&gt;
  &#039;bn&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;বাংলা&amp;quot;, &#039;code&#039; =&amp;gt; &#039;bn_BD&#039; ),                // Bengali&lt;br /&gt;
  &#039;bg&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;български език&amp;quot;, &#039;code&#039; =&amp;gt; &#039;bg_BG&#039; ),      // Bulgarian&lt;br /&gt;
  &#039;ca&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;català&amp;quot;, &#039;code&#039; =&amp;gt; &#039;ca_ES&#039; ),              // Catalan&lt;br /&gt;
  &#039;cs&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;čeština&amp;quot;, &#039;code&#039; =&amp;gt; &#039;cs_CZ&#039; ),             // Czech&lt;br /&gt;
  &#039;da&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;dansk&amp;quot;, &#039;code&#039; =&amp;gt; &#039;da_DK&#039; ),               // Danish&lt;br /&gt;
  &#039;de&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;deutsch&amp;quot;, &#039;code&#039; =&amp;gt; &#039;de_DE&#039; ),             // German&lt;br /&gt;
  &#039;el&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Ελληνικά&amp;quot;, &#039;code&#039; =&amp;gt; &#039;el_GR&#039; ),            // Greek&lt;br /&gt;
  &#039;en&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;English&amp;quot;, &#039;code&#039; =&amp;gt; &#039;en_US&#039; ),             // English&lt;br /&gt;
  &#039;es&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;español&amp;quot;, &#039;code&#039; =&amp;gt; &#039;es_ES&#039; ),             // Spanish&lt;br /&gt;
  &#039;et&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;eesti keel&amp;quot;, &#039;code&#039; =&amp;gt; &#039;et_EE&#039; ),          // Estonian       &lt;br /&gt;
  &#039;fi&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;suomi&amp;quot;, &#039;code&#039; =&amp;gt; &#039;fi_FI&#039; ),               // Finnish&lt;br /&gt;
  &#039;fr&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;français&amp;quot;, &#039;code&#039; =&amp;gt; &#039;fr_FR&#039; ),            // French&lt;br /&gt;
  &#039;he&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;עברית&amp;quot;, &#039;code&#039; =&amp;gt; &#039;he_IL&#039; ),               // Hebrew       &lt;br /&gt;
  &#039;hi&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;हिन्दी&amp;quot;, &#039;code&#039; =&amp;gt; &#039;hi_IN&#039; ),                 // Hindi&lt;br /&gt;
  &#039;hr&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Hrvatski&amp;quot;, &#039;code&#039; =&amp;gt; &#039;hr_HR&#039; ),            // Croatian&lt;br /&gt;
  &#039;hu&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;magyar&amp;quot;, &#039;code&#039; =&amp;gt; &#039;hu_HU&#039; ),              // Hungarian&lt;br /&gt;
  &#039;id&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Bahasa Indonesia&amp;quot;, &#039;code&#039; =&amp;gt; &#039;id_ID&#039; ),    // Indonesian&lt;br /&gt;
  &#039;ms&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Bahasa Malaysia&amp;quot;, &#039;code&#039; =&amp;gt; &#039;ms_MY&#039; ),     // Malaysian&lt;br /&gt;
  &#039;it&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;italiano&amp;quot;, &#039;code&#039; =&amp;gt; &#039;it_IT&#039; ),            // Italian&lt;br /&gt;
  &#039;ja&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;日本語&amp;quot;, &#039;code&#039; =&amp;gt; &#039;ja_JP&#039; ),               // Japanese&lt;br /&gt;
  &#039;jv&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Basa Jawa&amp;quot;, &#039;code&#039; =&amp;gt; &#039;jv_JV&#039; ),           // Javanese                       &lt;br /&gt;
  &#039;ko&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;한국어&amp;quot;, &#039;code&#039; =&amp;gt; &#039;ko_KR&#039; ),               // Korean&lt;br /&gt;
  &#039;lt&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;lietuvių&amp;quot;, &#039;code&#039; =&amp;gt; &#039;lt_LT&#039; ),            // Lithuanian&lt;br /&gt;
  &#039;lv&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;latviešu&amp;quot;, &#039;code&#039; =&amp;gt; &#039;lv_LV&#039; ),            // Latvian&lt;br /&gt;
  &#039;nl&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;nederlands&amp;quot;, &#039;code&#039; =&amp;gt; &#039;nl_NL&#039; ),          // Dutch&lt;br /&gt;
  &#039;no&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;norsk&amp;quot;, &#039;code&#039; =&amp;gt; &#039;nb_NO&#039; ),               // Norwegian&lt;br /&gt;
  &#039;oc&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;occitan&amp;quot;, &#039;code&#039; =&amp;gt; &#039;oc_FR&#039; ),             // Occitan&lt;br /&gt;
  &#039;pl&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;polski&amp;quot;, &#039;code&#039; =&amp;gt; &#039;pl_PL&#039; ),              // Polish&lt;br /&gt;
  &#039;pt&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;português&amp;quot;,  &#039;code&#039; =&amp;gt; &#039;pt_PT&#039; ),          // Portuguese&lt;br /&gt;
  &#039;ro&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;română&amp;quot;,  &#039;code&#039; =&amp;gt; &#039;ro_RO&#039;  ),            // Romanian&lt;br /&gt;
  &#039;ru&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Русский язык&amp;quot;, &#039;code&#039; =&amp;gt; &#039;ru_RU&#039; ),        // Russian&lt;br /&gt;
  &#039;sk&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;slovenčina&amp;quot;, &#039;code&#039; =&amp;gt; &#039;sk_SK&#039; ),          // Slovak&lt;br /&gt;
  &#039;sl&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;slovenščina&amp;quot;, &#039;code&#039; =&amp;gt; &#039;sl_SI&#039; ),         // Slovenian       &lt;br /&gt;
  &#039;sr&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Српски&amp;quot;, &#039;code&#039; =&amp;gt; &#039;sr_RS&#039; ),              // Serbian       &lt;br /&gt;
  &#039;sv&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;svenska&amp;quot;, &#039;code&#039; =&amp;gt; &#039;sv_SE&#039; ),             // Swedish&lt;br /&gt;
  &#039;tr&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Türkçe&amp;quot;, &#039;code&#039; =&amp;gt; &#039;tr_TR&#039; ),              // Turkish       &lt;br /&gt;
  &#039;uk&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;Українська мова&amp;quot;, &#039;code&#039; =&amp;gt; &#039;uk_UA&#039; ),     // Ukrainian&lt;br /&gt;
  &#039;zh&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;中文 (漢)&amp;quot;,  &#039;code&#039; =&amp;gt; &#039;zh_TW&#039; ),           // Traditional Chinese (Hong Kong, Macau, Taiwan)&lt;br /&gt;
  &#039;zh-cn&#039; =&amp;gt; array( &#039;name&#039; =&amp;gt; &amp;quot;中文 (汉)&amp;quot;, &#039;code&#039; =&amp;gt; &#039;zh_CN&#039; ),         // Simplified Chinese (Mainland China, Singapore)&lt;br /&gt;
&lt;br /&gt;
== Debugging and Tracing ==&lt;br /&gt;
&lt;br /&gt;
To debug php code you can use some tracing functions available from the parent class such as debug, trace, error, warn, dump.&lt;br /&gt;
  &lt;br /&gt;
  self::debug(&amp;quot;Ahh!&amp;quot;);&lt;br /&gt;
  self::dump(&#039;my_var&#039;,$my_var);&lt;br /&gt;
&lt;br /&gt;
See [[Practical_debugging]] section for complete information about debugging interfaces and where to find logs.&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=BGA_Studio_Cookbook&amp;diff=7894</id>
		<title>BGA Studio Cookbook</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=BGA_Studio_Cookbook&amp;diff=7894"/>
		<updated>2021-04-09T20:36:36Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Rename preserveArgsInHistory to preserve and explain about avoiding 0 and 1 array indexes&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;{{Studio_Framework_Navigation}}&lt;br /&gt;
&lt;br /&gt;
This page is collection of design and implementation recipes for BGA Studio framework.&lt;br /&gt;
For tooling and usage recipes see [[Tools and tips of BGA Studio]].&lt;br /&gt;
If you have your own recipes feel free to edit this page.&lt;br /&gt;
&lt;br /&gt;
== Visual Effects, Layout and Animation ==&lt;br /&gt;
&lt;br /&gt;
=== Create pieces dynamically (using template) ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg_ggg.tpl, ggg.js&lt;br /&gt;
&lt;br /&gt;
Note: this method is recommended by BGA guildlines&lt;br /&gt;
&lt;br /&gt;
Declared js template with variables in .tpl file, like this&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&amp;lt;script type=&amp;quot;text/javascript&amp;quot;&amp;gt;&lt;br /&gt;
    // Javascript HTML templates&lt;br /&gt;
    var jstpl_ipiece = &#039;&amp;lt;div class=&amp;quot;${type} ${type}_${color} inlineblock&amp;quot; aria-label=&amp;quot;${name}&amp;quot; title=&amp;quot;${name}&amp;quot;&amp;gt;&amp;lt;/div&amp;gt;&#039;;&lt;br /&gt;
&amp;lt;/script&amp;gt;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Use it like this in .js file&lt;br /&gt;
  div = this.format_block(&#039;jstpl_ipiece&#039;, {&lt;br /&gt;
                                type : &#039;meeple&#039;,&lt;br /&gt;
                                color : &#039;ff0000&#039;,&lt;br /&gt;
                                name : &#039;Bob&#039;,&lt;br /&gt;
                            });&lt;br /&gt;
  &lt;br /&gt;
Then you do whatever you need to do with that div, this one specifically design to go to log entries, because it has embedded title (otherwise its a picture only) and no id.&lt;br /&gt;
&lt;br /&gt;
Note: you could have place this variable in js itself, but keeping it in .tpl allows you to have your js code be free of HTML. Normally it never happens but&lt;br /&gt;
it is good to strive for it.&lt;br /&gt;
Note: you can also use string concatenation, its less readable. You can also use dojo dom object creation api&#039;s but its brutally verbose and its more unreadable.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Create pieces dynamically (using string concatenation) ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js&lt;br /&gt;
&lt;br /&gt;
Note: Not recommended&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  div = &amp;quot;&amp;lt;div class=&#039;meeple &amp;quot;+color+&amp;quot;&#039;&amp;gt;&amp;lt;/div&amp;gt;&amp;quot;;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
=== Create all pieces statically ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg_ggg.tpl, ggg.css, ggg.view.php (optional) &lt;br /&gt;
&lt;br /&gt;
* Create ALL game pieces in html template (.tpl)&lt;br /&gt;
* ALL pieces should have unique id, and it should be meaningful, i.e. meeple_red_1&lt;br /&gt;
* Do not use inline styling&lt;br /&gt;
* Id of player&#039;s specific pieces should use some sort of &#039;color&#039; identification, since player id cannot be used in static layout, you can use english color name, hex 6 char value, or color &amp;quot;number&amp;quot; (1,2,3...)&lt;br /&gt;
* Pieces should have separated class for its color, type, etc, so it can be easily styled in groups. In example below you now can style all meeples, all red meeples or all red tokens, or all &amp;quot;first&amp;quot; meeples&lt;br /&gt;
&lt;br /&gt;
ggg.tpl:&lt;br /&gt;
&amp;lt;pre&amp;gt; &lt;br /&gt;
  &amp;lt;div id=&amp;quot;home_red&amp;quot; class=&amp;quot;home_red home&amp;quot;&amp;gt;&lt;br /&gt;
     &amp;lt;div id=&amp;quot;meeple_red_1&amp;quot; class=&amp;quot;meeple red n1&amp;quot;&amp;gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
     &amp;lt;div id=&amp;quot;meeple_red_2&amp;quot; class=&amp;quot;meeple red n2&amp;quot;&amp;gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
  &amp;lt;/div&amp;gt;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
ggg.css:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.meeple {&lt;br /&gt;
	width: 32px;&lt;br /&gt;
	height: 39px;&lt;br /&gt;
	background-image: url(img/78_64_stand_meeples.png);&lt;br /&gt;
	background-size: 352px;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.meeple.red {&lt;br /&gt;
	background-position: 30% 0%;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
* There should be straight forward mapping between server id and js id (or 1:1)&lt;br /&gt;
* You place objects in different zones of the layout, and setup css to take care of layout&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.home .meeple{&lt;br /&gt;
   display: inline-block;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
* If you need to have a temporary object that look like original you can use dojo.clone (and change id to some temp id)&lt;br /&gt;
* If there is lots of repetition or zone grid you can use template generator, but inject style declaration in css instead of inline style for flexibility&lt;br /&gt;
&lt;br /&gt;
Note:&lt;br /&gt;
* If you use this model you cannot use premade js components such as Stock and Zone&lt;br /&gt;
* You have to use alternative methods of animation (slightly altered) since default method will leave object with inline style attributes which you don&#039;t need&lt;br /&gt;
&lt;br /&gt;
=== Use thematic fonts ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.css&lt;br /&gt;
&lt;br /&gt;
Sometime game elements use specific fonts of text, if you want to match it up you can load some specific font (IMPORTANT: from some &#039;&#039;&#039;free font&#039;&#039;&#039; source. See notes below).&lt;br /&gt;
&lt;br /&gt;
[[File:Dragonline_font.png]]&lt;br /&gt;
&lt;br /&gt;
.css&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
/* latin-ext */&lt;br /&gt;
@font-face {&lt;br /&gt;
  font-family: &#039;Qwigley&#039;;&lt;br /&gt;
  font-style: normal;&lt;br /&gt;
  font-weight: 400;&lt;br /&gt;
  src: local(&#039;Qwigley&#039;), local(&#039;Qwigley-Regular&#039;), url(https://fonts.gstatic.com/s/qwigley/v6/2Dy1Unur1HJoklbsg4iPJ_Y6323mHUZFJMgTvxaG2iE.woff2) format(&#039;woff2&#039;);&lt;br /&gt;
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;&lt;br /&gt;
}&lt;br /&gt;
/* latin */&lt;br /&gt;
@font-face {&lt;br /&gt;
  font-family: &#039;Qwigley&#039;;&lt;br /&gt;
  font-style: normal;&lt;br /&gt;
  font-weight: normal;&lt;br /&gt;
  src: local(&#039;Qwigley&#039;), local(&#039;Qwigley-Regular&#039;), url(https://fonts.gstatic.com/s/qwigley/v6/gThgNuQB0o5ITpgpLi4Zpw.woff2) format(&#039;woff2&#039;);&lt;br /&gt;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;&lt;br /&gt;
}&lt;br /&gt;
@font-face {&lt;br /&gt;
  font-family: &#039;Qwigley&#039;;&lt;br /&gt;
  font-style: normal;&lt;br /&gt;
  font-weight: normal;&lt;br /&gt;
  src: local(&#039;Qwigley&#039;), local(&#039;Qwigley-Regular&#039;), url(http://ff.static.1001fonts.net/q/w/qwigley.regular.ttf) format(&#039;ttf&#039;);&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.zone_title {&lt;br /&gt;
	display: inline-block;&lt;br /&gt;
	position: absolute;&lt;br /&gt;
	font: italic 32px/32px &amp;quot;Qwigley&amp;quot;, cursive;	   &lt;br /&gt;
	height: 32px;&lt;br /&gt;
	width: auto;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;NB:&#039;&#039;&#039; if you need to include a font that&#039;s not available online, an extra action will be needed from an admin. Please include the font file(s) in your img directory, and mention it to admins when requesting your game to be moved to alpha. &#039;&#039;&#039;Please remember that the font has to be free, and include a .txt with all appropriate license information about the font.&#039;&#039;&#039;&lt;br /&gt;
You can look for free fonts (for example) on https://fonts.google.com or https://www.fontsquirrel.com/)&lt;br /&gt;
&lt;br /&gt;
=== Use player color in template ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg_ggg.tpl, ggg.view.php&lt;br /&gt;
&lt;br /&gt;
.view.php:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    function build_page($viewArgs) {&lt;br /&gt;
        // Get players &amp;amp; players number&lt;br /&gt;
        $players = $this-&amp;gt;game-&amp;gt;loadPlayersBasicInfos();&lt;br /&gt;
        $players_nbr = count($players);&lt;br /&gt;
        /**&lt;br /&gt;
         * ********* Place your code below: ***********&lt;br /&gt;
         */&lt;br /&gt;
        &lt;br /&gt;
        // Set PCOLOR to the current player color hex&lt;br /&gt;
        global $g_user;&lt;br /&gt;
        $cplayer = $g_user-&amp;gt;get_id();&lt;br /&gt;
        if (array_key_exists($cplayer, $players)) { // may be not set if spectator&lt;br /&gt;
            $player_color = $players [$cplayer] [&#039;player_color&#039;];&lt;br /&gt;
        } else {&lt;br /&gt;
            $player_color = &#039;ffffff&#039;; // spectator&lt;br /&gt;
        }&lt;br /&gt;
        $this-&amp;gt;tpl [&#039;PCOLOR&#039;] = $player_color;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Scale to fit for big boards ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg_ggg.tpl, ggg.js&lt;br /&gt;
&lt;br /&gt;
Lets say you have huge game board, and lets say you want it to be 1400px wide. Besides the board there will be side bar which is 240 and trim. &lt;br /&gt;
My display is 1920 wide so it fits, but there is big chance other people won&#039;t have that width. What do you do?&lt;br /&gt;
Easiest thing I came up with is to scale whole content to fit (everything you declare in .tpl file). Tested or firefox and chrome.&lt;br /&gt;
&lt;br /&gt;
ggg_ggg.tpl:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
   &amp;lt;div id=&amp;quot;thething&amp;quot; class=&amp;quot;thething&amp;quot; style=&amp;quot;width: 1400px;&amp;quot;&amp;gt;&lt;br /&gt;
            ... everything else you declare ...&lt;br /&gt;
   &amp;lt;/div&amp;gt;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
ggg.js:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    setup : function(gamedatas) {&lt;br /&gt;
          console.log(&amp;quot;Starting game setup&amp;quot;);&lt;br /&gt;
          ...&lt;br /&gt;
          this.interface_min_width = 740;&lt;br /&gt;
          this.interface_max_width = 1400;&lt;br /&gt;
          dojo.connect(window, &amp;quot;onresize&amp;quot;, this, dojo.hitch(this, &amp;quot;adaptViewportSize&amp;quot;));&lt;br /&gt;
    },&lt;br /&gt;
&lt;br /&gt;
    adaptViewportSize : function() {&lt;br /&gt;
        var pageid = &amp;quot;page-content&amp;quot;;&lt;br /&gt;
        var nodeid = &amp;quot;thething&amp;quot;;&lt;br /&gt;
&lt;br /&gt;
        var bodycoords = dojo.marginBox(pageid);&lt;br /&gt;
        var contentWidth = bodycoords.w;&lt;br /&gt;
&lt;br /&gt;
        var browserZoomLevel = window.devicePixelRatio; &lt;br /&gt;
        //console.log(&amp;quot;zoom&amp;quot;,browserZoomLevel);&lt;br /&gt;
        if (contentWidth &amp;gt;= this.interface_max_width || browserZoomLevel &amp;gt;1  || this.control3dmode3d) {&lt;br /&gt;
            dojo.style(nodeid,&#039;transform&#039;,&#039;&#039;);&lt;br /&gt;
            return;&lt;br /&gt;
        }&lt;br /&gt;
&lt;br /&gt;
        var percentageOn1 = contentWidth / this.interface_max_width;&lt;br /&gt;
        dojo.style(nodeid, &amp;quot;transform&amp;quot;, &amp;quot;scale(&amp;quot; + percentageOn1 + &amp;quot;)&amp;quot;);&lt;br /&gt;
    },&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: this method does not seems to work to retina resolution displays, if you know better way let me know&lt;br /&gt;
&lt;br /&gt;
=== Dynamic tooltips ===&lt;br /&gt;
&lt;br /&gt;
If you really need a dynamic tooltip you can use this technique. (Only use it if the static tooltips provided by the BGA framework are not sufficient.)&lt;br /&gt;
&lt;br /&gt;
            new dijit.Tooltip({&lt;br /&gt;
                connectId: [&amp;quot;divItemId&amp;quot;],&lt;br /&gt;
                getContent: function(matchedNode){&lt;br /&gt;
                    return &amp;quot;... calculated ...&amp;quot;; &lt;br /&gt;
                }&lt;br /&gt;
            });&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
This is an out-of-the-box djit.Tooltip. It has a &#039;&#039;getContent&#039;&#039; method which is called dynamically.&lt;br /&gt;
&lt;br /&gt;
The string function return becomes the innerHTML of the tooltip, so it can be anything. In this example matchedNode is a dojo node representing dom object with id of &amp;quot;divItemId&amp;quot; but there are more parameters which I am not posting here which allows more sophisticated subnode queries (i.e. you can attach tooltip to all nodes with class or whatever).&lt;br /&gt;
&lt;br /&gt;
[https://dojotoolkit.org/reference-guide/1.10/dijit/Tooltip.html dijit.Tooltip]&lt;br /&gt;
&lt;br /&gt;
It&#039;s not part of the BGA API so use at your own risk.&lt;br /&gt;
&lt;br /&gt;
=== Accessing images from js ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt; &lt;br /&gt;
     // your game resources&lt;br /&gt;
     &lt;br /&gt;
     var my_img = &#039;&amp;lt;img src=&amp;quot;&#039;+g_gamethemeurl+&#039;img/cards.jpg&amp;quot;/&amp;gt;&#039;;&lt;br /&gt;
     &lt;br /&gt;
     // shared resources&lt;br /&gt;
     var my_help_img = &amp;quot;&amp;lt;img class=&#039;imgtext&#039; src=&#039;&amp;quot; + g_themeurl + &amp;quot;img/layout/help_click.png&#039; alt=&#039;action&#039; /&amp;gt; &amp;lt;span class=&#039;tooltiptext&#039;&amp;gt;&amp;quot; +&lt;br /&gt;
                    text + &amp;quot;&amp;lt;/span&amp;gt;&amp;quot;;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Rendering text with players color and proper background ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js&lt;br /&gt;
&lt;br /&gt;
This example actually writes &amp;quot;You&amp;quot; but you can replace this with player name as easily, drop translating function in this case&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        /* Implementation of proper colored You with background in case of white or light colors  */&lt;br /&gt;
 &lt;br /&gt;
        divYou : function() {&lt;br /&gt;
            var color = this.gamedatas.players[this.player_id].color;&lt;br /&gt;
            var color_bg = &amp;quot;&amp;quot;;&lt;br /&gt;
            if (this.gamedatas.players[this.player_id] &amp;amp;&amp;amp; this.gamedatas.players[this.player_id].color_back) {&lt;br /&gt;
                color_bg = &amp;quot;background-color:#&amp;quot; + this.gamedatas.players[this.player_id].color_back + &amp;quot;;&amp;quot;;&lt;br /&gt;
            }&lt;br /&gt;
            var you = &amp;quot;&amp;lt;span style=\&amp;quot;font-weight:bold;color:#&amp;quot; + color + &amp;quot;;&amp;quot; + color_bg + &amp;quot;\&amp;quot;&amp;gt;&amp;quot; + __(&amp;quot;lang_mainsite&amp;quot;, &amp;quot;You&amp;quot;) + &amp;quot;&amp;lt;/span&amp;gt;&amp;quot;;&lt;br /&gt;
            return you;&lt;br /&gt;
        },&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Inject icon images in the log ===&lt;br /&gt;
&lt;br /&gt;
Here is an example of what was done for Terra Mystica which is simple and straightforward:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
//Define the proper message&lt;br /&gt;
		$message = clienttranslate(&#039;${player_name} gets ${power_income} via Structures&#039;);&lt;br /&gt;
		if ($price &amp;gt; 0) {&lt;br /&gt;
			self::DbQuery(&amp;quot;UPDATE player SET player_score = player_score - $price WHERE player_id = $player_id&amp;quot;);&lt;br /&gt;
			$message = clienttranslate(&#039;${player_name} pays ${vp_price} and gets ${power_income} via Structures&#039;);&lt;br /&gt;
		}&lt;br /&gt;
&lt;br /&gt;
// Notify&lt;br /&gt;
		self::notifyAllPlayers( &amp;quot;powerViaStructures&amp;quot;, $message, array(&lt;br /&gt;
			&#039;i18n&#039; =&amp;gt; array( ),&lt;br /&gt;
			&#039;player_id&#039; =&amp;gt; $player_id,&lt;br /&gt;
			&#039;player_name&#039; =&amp;gt; self::getUniqueValueFromDb( &amp;quot;SELECT player_name FROM player WHERE player_id = $player_id&amp;quot; ),&lt;br /&gt;
			&#039;power_tokens&#039; =&amp;gt; $power_tokens,&lt;br /&gt;
			&#039;vp_price&#039; =&amp;gt; self::getLogsVPAmount($price),&lt;br /&gt;
			&#039;power_income&#039; =&amp;gt; self::getLogsPowerAmount($power_income),&lt;br /&gt;
			&#039;newScore&#039; =&amp;gt; self::getUniqueValueFromDb( &amp;quot;SELECT player_score FROM player WHERE player_id = $player_id&amp;quot; ),&lt;br /&gt;
			&#039;counters&#039; =&amp;gt; $this-&amp;gt;getGameCounters(null),&lt;br /&gt;
		) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
With some functions to have the needed html added inside the substitution variable, such as:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
function getLogsPowerAmount( $amount ) {&lt;br /&gt;
		return &amp;quot;&amp;lt;div class=&#039;tmlogs_icon&#039; title=&#039;Power&#039;&amp;gt;&amp;lt;div class=&#039;power_amount&#039;&amp;gt;$amount&amp;lt;/div&amp;gt;&amp;lt;/div&amp;gt;&amp;quot;;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
Note: injecting html from php is not ideal but easy, if you want more clean solution, use method below but it is a lot more sophisticated.&lt;br /&gt;
&lt;br /&gt;
=== Inject images and styled html in the log ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js, ggg.game.php&lt;br /&gt;
&lt;br /&gt;
So you want nice pictures in the game log. What do you do? The first idea that comes to mind is to send html from php in notifications (see method above). &lt;br /&gt;
&lt;br /&gt;
This is a bad idea for many reasons:&lt;br /&gt;
&lt;br /&gt;
* It&#039;s bad architecture. ui elements leak into the server, and now you have to manage the ui in multiple places.&lt;br /&gt;
* If you decided to change something in the ui in future version, replay logs for old games and tutorials may not work, since they use stored notifications.&lt;br /&gt;
* Log previews for old games become unreadable. (This is the log state before you enter the game replay, which is useful for troubleshooting and game analysis.)&lt;br /&gt;
* It&#039;s more data to transfer and store in the db.&lt;br /&gt;
* It&#039;s a nightmare for translators.&lt;br /&gt;
&lt;br /&gt;
So what else can you do? I use this recipe for &#039;&#039;&#039;client side log injection&#039;&#039;&#039; to intercept log arguments (which come from the server) and replace them with html on the client side.&lt;br /&gt;
&lt;br /&gt;
[[File:clientloginjection.png|left]] &lt;br /&gt;
&lt;br /&gt;
ggg.js&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt; &lt;br /&gt;
&lt;br /&gt;
        /** Override this function to inject html into log items. This is a built-in BGA method.  */&lt;br /&gt;
&lt;br /&gt;
        /* @Override */&lt;br /&gt;
        format_string_recursive : function(log, args) {&lt;br /&gt;
            try {&lt;br /&gt;
                if (log &amp;amp;&amp;amp; args &amp;amp;&amp;amp; !args.processed) {&lt;br /&gt;
                    args.processed = true;&lt;br /&gt;
                    &lt;br /&gt;
&lt;br /&gt;
                    // list of special keys we want to replace with images&lt;br /&gt;
                    var keys = [&#039;place_name&#039;,&#039;token_name&#039;];&lt;br /&gt;
                    &lt;br /&gt;
                  &lt;br /&gt;
                    for ( var i in keys) {&lt;br /&gt;
                        var key = keys[i];&lt;br /&gt;
                        args[key] = this.getTokenDiv(key, args);                            &lt;br /&gt;
&lt;br /&gt;
                    }&lt;br /&gt;
                }&lt;br /&gt;
            } catch (e) {&lt;br /&gt;
                console.error(log,args,&amp;quot;Exception thrown&amp;quot;, e.stack);&lt;br /&gt;
            }&lt;br /&gt;
            return this.inherited(arguments);&lt;br /&gt;
        },&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important:&#039;&#039;&#039; In the &#039;&#039;format_string_recursive&#039;&#039; method, the &#039;args&#039; parameter will only contain arguments passed to it from the notify method in ggg.game.php (see below).&lt;br /&gt;
&lt;br /&gt;
The &#039;log&#039; parameter is the actual string that is inserted into the logs. You can perform additional js string manipulation on it.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
        getTokenDiv : function(key, args) {&lt;br /&gt;
            // ... implement whatever html you want here, example from sharedcode.js&lt;br /&gt;
            var token_id = args[key];&lt;br /&gt;
            var item_type = getPart(token_id,0);&lt;br /&gt;
            var logid = &amp;quot;log&amp;quot; + (this.globalid++) + &amp;quot;_&amp;quot; + token_id;&lt;br /&gt;
            switch (item_type) {&lt;br /&gt;
                case &#039;wcube&#039;:&lt;br /&gt;
                    var tokenDiv = this.format_block(&#039;jstpl_resource_log&#039;, {&lt;br /&gt;
                        &amp;quot;id&amp;quot; : logid,&lt;br /&gt;
                        &amp;quot;type&amp;quot; : &amp;quot;wcube&amp;quot;,&lt;br /&gt;
                        &amp;quot;color&amp;quot; : getPart(token_id,1),&lt;br /&gt;
                    });&lt;br /&gt;
                    return tokenDiv;&lt;br /&gt;
                    break;&lt;br /&gt;
                case &#039;meeple&#039;:&lt;br /&gt;
                    if ($(token_id)) {&lt;br /&gt;
                        var clone = dojo.clone($(token_id));&lt;br /&gt;
    &lt;br /&gt;
                        dojo.attr(clone, &amp;quot;id&amp;quot;, logid);&lt;br /&gt;
                        this.stripPosition(clone);&lt;br /&gt;
                        dojo.addClass(clone, &amp;quot;logitem&amp;quot;);&lt;br /&gt;
                        return clone.outerHTML;&lt;br /&gt;
                    }&lt;br /&gt;
                    break;&lt;br /&gt;
     &lt;br /&gt;
                default:&lt;br /&gt;
                    break;&lt;br /&gt;
            }&lt;br /&gt;
&lt;br /&gt;
            return &amp;quot;&#039;&amp;quot; + this.clienttranslate_string(this.getTokenName(token_id)) + &amp;quot;&#039;&amp;quot;;&lt;br /&gt;
       },&lt;br /&gt;
       getTokenName : function(key) {&lt;br /&gt;
           return this.gamedatas.token_types[key].name; // get name for the key, from static table for example&lt;br /&gt;
       },&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note that in this case the server simply injects token_id as a name, and the client substitutes it for the translated name or the picture.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
ggg.game.php:&lt;br /&gt;
&lt;br /&gt;
           $this-&amp;gt;notifyAllPlayers(&#039;playerLog&#039;,clienttranslate(&#039;Game moves ${token_name}&#039;),[&#039;token_name&#039;=&amp;gt;$token_id]);&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important:&#039;&#039;&#039; As noted above, only arguments actually passed by this method are available to the args parameter received in the client-side &#039;&#039;format_string_recursive&#039;&#039; method.&lt;br /&gt;
&lt;br /&gt;
Sometimes it is the case that you want to pass arguments that are not actually included in the output message. For example, suppose we have a method like this:&lt;br /&gt;
&lt;br /&gt;
           $this-&amp;gt;notifyAllPlayers(&#039;tokenPlaced&#039;,clienttranslate(&#039;Player placed ${token_name}&#039;),array(&lt;br /&gt;
              &#039;token_name&#039; =&amp;gt; $token_id,&lt;br /&gt;
              &#039;zone_played&#039; =&amp;gt; $zone);&lt;br /&gt;
&lt;br /&gt;
This will output &amp;quot;Player placed ${token_name}&amp;quot; in the log, and if we subscribe to a notification method activated by the &amp;quot;tokenPlaced&amp;quot; event in the client-side code, that method can make use of the &#039;zone_played&#039; argument. &lt;br /&gt;
&lt;br /&gt;
Now if you want to make some really cool things with game log, most probably you would need more arguments than are included in log message. The problem with that,&lt;br /&gt;
it will work at first, but if you reload game using F5 or when the game loads in turn based mode, you will loose your additional parameters, why? Because when game reloads it does not actually send same notifications, it sends special &amp;quot;hitstorical_log&amp;quot; notification where all  parameters not listed in the message are removed. In example above, field zone_played would be removed from historical log as it is not included in message of the notification. You can till preserve specific arguments in historical log by adding special field preserve to notification arguments like this:&lt;br /&gt;
 &lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
           $this-&amp;gt;notifyAllPlayers(&#039;tokenPlaced&#039;,clienttranslate(&#039;Player placed ${token_name}&#039;),array(&lt;br /&gt;
              &#039;token_name&#039; =&amp;gt; $token_id,&lt;br /&gt;
              &#039;zone_played&#039; =&amp;gt; $zone,&lt;br /&gt;
              &#039;preserve&#039; =&amp;gt; [ 2 =&amp;gt; &#039;zone_played&#039; ]&lt;br /&gt;
           );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Now you can use zone_player in format_string_recursive even in historical logs. Note that for this to work, you currently need to define your own indexes for the &#039;preserve&#039; array and avoid using 0 or 1.&lt;br /&gt;
&lt;br /&gt;
=== High-Definition Graphics ===&lt;br /&gt;
&lt;br /&gt;
Some users will have screens which can display text and images at a greater resolution than the usual 72 dpi, e.g. the &amp;quot;Retina&amp;quot; screens on the 5k iMac, all iPads, and high-DPI screens on laptops from many manufacturers. If you can get art assets at this size, they will make your game look extra beautiful. You &#039;&#039;could&#039;&#039; just use large graphics and scale them down, but that would increase the download time and bandwidth for users who can&#039;t display them. Instead, a good way is to prepare a separate graphics file at exactly twice the size you would use otherwise, and add &amp;quot;@2x&amp;quot; at the end of the filename, e.g. if pieces.png is 240x320, then pieces@2x.png is 480x640.&lt;br /&gt;
&lt;br /&gt;
There are two changes required in order to use the separate graphics files. First in your css, where you use a file, add a media query which overrides the original definition and uses the bigger version on devices which can display them. Ensuring that the &amp;quot;background-size&amp;quot; attribute is set means that the size of the displayed object doesn&#039;t change, but only is drawn at the improved dot pitch.&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.piece {&lt;br /&gt;
    position: absolute;&lt;br /&gt;
    background-image: url(&#039;img/pieces.png&#039;);&lt;br /&gt;
    background-size:240px 320px;&lt;br /&gt;
    z-index: 10;&lt;br /&gt;
}&lt;br /&gt;
@media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2), (min-resolution: 192dpi)&lt;br /&gt;
{&lt;br /&gt;
    .piece {&lt;br /&gt;
        background-image: url(&#039;img/pieces@2x.png&#039;);&lt;br /&gt;
    }&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Secondly, in your setup function in javascript, you must ensure than only the appropriate one version of the file gets pre-loaded (otherwise you more than waste the bandwidth saved by maintaining the standard-resolution file). Note that the media query is the same in both cases:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
            var isRetina = &amp;quot;(-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2), (min-resolution: 192dpi)&amp;quot;;&lt;br /&gt;
            if (window.matchMedia(isRetina).matches)&lt;br /&gt;
            {&lt;br /&gt;
                this.dontPreloadImage( &#039;pieces.png&#039; );&lt;br /&gt;
                this.dontPreloadImage( &#039;board.jpg&#039; );&lt;br /&gt;
            }&lt;br /&gt;
            else&lt;br /&gt;
            {&lt;br /&gt;
                this.dontPreloadImage( &#039;pieces@2x.png&#039; );&lt;br /&gt;
                this.dontPreloadImage( &#039;board@2x.jpg&#039; );&lt;br /&gt;
            }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Cool realistic shadow effect with CSS ===&lt;br /&gt;
&lt;br /&gt;
If you wish to make a shadow effect for game pieces that are not rectangle, do not use box-shadow but use filter, which is supported by recent major browsers.  This way, you can use the alpha channel of your element to drop a shadow.  This even work for transparent backgrounds, so that if you are using the &amp;quot;CSS-sprite&amp;quot; method, it will work!&lt;br /&gt;
&lt;br /&gt;
For instance:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.xxx-token {&lt;br /&gt;
    filter: drop-shadow(0px 0px 1px #000000);&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
==== Add option to disable shadows ====&lt;br /&gt;
&lt;br /&gt;
Keep in mind that drop-shadow are very GPU intensive. This becomes noticeable once you have about 40 components with drop-shadow filter. If that is your case, you can quite easily implement a user preference to disable shadows for users on slower machines:&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
gameoptions.inc.php&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
100 =&amp;gt; array(&lt;br /&gt;
			&#039;name&#039; =&amp;gt; totranslate(&#039;Shadows&#039;),&lt;br /&gt;
			&#039;needReload&#039; =&amp;gt; true, // after user changes this preference game interface would auto-reload&lt;br /&gt;
			&#039;values&#039; =&amp;gt; array(&lt;br /&gt;
					1 =&amp;gt; array( &#039;name&#039; =&amp;gt; totranslate( &#039;Enabled&#039; ), &#039;cssPref&#039; =&amp;gt; &#039;&#039; ),&lt;br /&gt;
					2 =&amp;gt; array( &#039;name&#039; =&amp;gt; totranslate( &#039;Disabled&#039; ), &#039;cssPref&#039; =&amp;gt; &#039;no-shadow&#039; )&lt;br /&gt;
			)&lt;br /&gt;
	),&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
[game].css&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.no-shadow * {&lt;br /&gt;
	filter: none !important; &lt;br /&gt;
} &lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
==== Shadows with clip-path ====&lt;br /&gt;
&lt;br /&gt;
For some reason, a shadow will not work together with clip-path on one element. To use both clip-path (when for example using .svg to cut out cardboard components from your .jpg spritesheet) and drop-shadow, you need to wrap the element into another one, and apply drop-shadow to the outer one, and clip-path to the inner one.&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&amp;lt;div class=&#039;my-token-wrap&#039;&amp;gt;&lt;br /&gt;
  &amp;lt;div class=&#039;my-token&#039;&amp;gt;&lt;br /&gt;
  &amp;lt;/div&amp;gt;&lt;br /&gt;
&amp;lt;/div&amp;gt;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.my-token-wrap {&lt;br /&gt;
    filter: drop-shadow(0px 0px 1px #000000);&lt;br /&gt;
}&lt;br /&gt;
.my-token-wrap .my-token {&lt;br /&gt;
    clip-path: url(#my-token-path);&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== Using the CSS classes from the state machine ===&lt;br /&gt;
&lt;br /&gt;
If you need to hide or show stuff depending on the state of your game, you can of course use javascript, but CSS is hand enough for that.  The #overall-content element does change class depending on the game state.  For instance, if you are in state &#039;&#039;playerTurn&#039;&#039;, it will have the class &#039;&#039;gamestate_playerTurn&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
So now, if you want to show the discard pile only during player turns, you may use:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
#discard_pile { display: none }&lt;br /&gt;
.gamestate_playerTurn #discard_pile { display: block }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
This can be used if you want to change sizing of elements, position, layout or visual appearance.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Game Model and Database design ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Database for The euro game ===&lt;br /&gt;
Lets say we have a game with workers, dice, tokens, board, resources, money and vp. Workers and dice can be placed in various zones on the board, and you can get resources, money, tokens and vp in your home zone. Also tokens can be flipped or not flipped.&lt;br /&gt;
&lt;br /&gt;
[[File:Madeira board.png]]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Now lets try to map it, we have&lt;br /&gt;
* (meeple,zone)&lt;br /&gt;
* (die, zone, sideup)&lt;br /&gt;
* (resource cube/money token/vp token,player home zone)&lt;br /&gt;
* (token, player home zone, flip state)&lt;br /&gt;
We can notice that resource and money are uncountable, and don&#039;t need to be track individually so we can replace our mapping to&lt;br /&gt;
* (resource type/money,player home zone, count)&lt;br /&gt;
And vp stored already for us in player table, so we can remove it from that list.&lt;br /&gt;
&lt;br /&gt;
Now when we get to encode it we can see that everything can be encoded as (object,zone,state) form, where object and zone is string and state is integer. The resource mapping is slightly different semantically so you can go with two table, or counting using same table with state been used as count for resources.&lt;br /&gt;
&lt;br /&gt;
So the piece mapping for non-grid based games can be in most case represented by (string: token_key, string: token_location, int: token_state), example of such database schema can be found here: [https://github.com/elaskavaia/bga-sharedcode/blob/master/dbmodel.sql dbmodel.sql] and class implementing access to it here [https://github.com/elaskavaia/bga-sharedcode/blob/master/modules/tokens.php table.game.php].&lt;br /&gt;
&lt;br /&gt;
Variant 1: Minimalistic&lt;br /&gt;
&lt;br /&gt;
 CREATE TABLE IF NOT EXISTS `token` (&lt;br /&gt;
  `token_key` varchar(32) NOT NULL,&lt;br /&gt;
  `token_location` varchar(32) NOT NULL,&lt;br /&gt;
  `token_state` int(10),&lt;br /&gt;
  PRIMARY KEY (`token_key`)&lt;br /&gt;
 ) ENGINE=InnoDB DEFAULT CHARSET=utf8;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable&amp;quot;&lt;br /&gt;
|+token&lt;br /&gt;
! token_key&lt;br /&gt;
! token_location&lt;br /&gt;
! token_state&lt;br /&gt;
|-&lt;br /&gt;
|meeple_red_1&lt;br /&gt;
|home_red&lt;br /&gt;
|0&lt;br /&gt;
|-&lt;br /&gt;
|dice_black_2&lt;br /&gt;
|board_guard&lt;br /&gt;
|1&lt;br /&gt;
|-&lt;br /&gt;
|dice_green_1&lt;br /&gt;
|board_action_mayor&lt;br /&gt;
|3&lt;br /&gt;
|-&lt;br /&gt;
|bread&lt;br /&gt;
|home_red&lt;br /&gt;
|5&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
Now how we represent resource counters such as bread?&lt;br /&gt;
Using same table from we simply add special counter token for bread and use state to indicate the count. Note to keep first column unique we have to add player identification for that counter, i.e. ff0000 is red player.&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable&amp;quot;&lt;br /&gt;
|+token&lt;br /&gt;
! token_key&lt;br /&gt;
! token_location&lt;br /&gt;
! token_state&lt;br /&gt;
|-&lt;br /&gt;
|bread_ff0000&lt;br /&gt;
|tableau_ff0000&lt;br /&gt;
|5&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
See php module for this table here https://github.com/elaskavaia/bga-sharedcode/blob/master/modules/tokens.php&lt;br /&gt;
&lt;br /&gt;
Variant 2: Additional resource table, resource count for each player id&lt;br /&gt;
&lt;br /&gt;
 CREATE TABLE IF NOT EXISTS `resource` (&lt;br /&gt;
  `player_id` int(10) unsigned NOT NULL,&lt;br /&gt;
  `resource_key` varchar(32) NOT NULL,&lt;br /&gt;
  `resource_count` int(10) signed NOT NULL,&lt;br /&gt;
  PRIMARY KEY (`player_id`,`resource_key`)&lt;br /&gt;
 ) ENGINE=InnoDB DEFAULT CHARSET=utf8;&lt;br /&gt;
&lt;br /&gt;
 ALTER TABLE resource ADD CONSTRAINT fk_player_id FOREIGN KEY (player_id) REFERENCES player(player_id);&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable&amp;quot;&lt;br /&gt;
|+resource&lt;br /&gt;
! player_id&lt;br /&gt;
! resource_key&lt;br /&gt;
! resource_count&lt;br /&gt;
|-&lt;br /&gt;
|123456&lt;br /&gt;
|bread&lt;br /&gt;
|5&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Variant 3: More normalised&lt;br /&gt;
&lt;br /&gt;
This version is similar to &amp;quot;card&amp;quot; table from hearts tutorial, you can also use exact cards database schema and Deck implementation for most purposes (even you not dealing with cards). &lt;br /&gt;
&lt;br /&gt;
 CREATE TABLE IF NOT EXISTS `token` (&lt;br /&gt;
  `token_id` int(10) unsigned NOT NULL AUTO_INCREMENT,&lt;br /&gt;
  `token_type` varchar(16) NOT NULL,&lt;br /&gt;
  `token_arg` int(11) NOT NULL,&lt;br /&gt;
  `token_location` varchar(32) NOT NULL,&lt;br /&gt;
  `token_state` int(10),&lt;br /&gt;
  PRIMARY KEY (`token_id`)&lt;br /&gt;
 ) ENGINE=InnoDB DEFAULT CHARSET=utf8;&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable&amp;quot;&lt;br /&gt;
|+token&lt;br /&gt;
! token_id&lt;br /&gt;
! token_type&lt;br /&gt;
! token_arg&lt;br /&gt;
! token_location&lt;br /&gt;
! token_state&lt;br /&gt;
|-&lt;br /&gt;
|22&lt;br /&gt;
|meeple&lt;br /&gt;
|123456&lt;br /&gt;
|home_123456&lt;br /&gt;
|0&lt;br /&gt;
|-&lt;br /&gt;
|23&lt;br /&gt;
|dice&lt;br /&gt;
|2&lt;br /&gt;
|board_guard&lt;br /&gt;
|1&lt;br /&gt;
|-&lt;br /&gt;
|26&lt;br /&gt;
|dice&lt;br /&gt;
|1&lt;br /&gt;
|board_action_mayor&lt;br /&gt;
|3&lt;br /&gt;
|-&lt;br /&gt;
|49&lt;br /&gt;
|bread&lt;br /&gt;
|0&lt;br /&gt;
|home_123456&lt;br /&gt;
|5&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
Advantages of this would be is a bit more straightforward to do some queries in db, disadvantage its hard to read (as you can compare with previous example, you&lt;br /&gt;
cannot just look at say, ah I know what it means). Another questionable advantage is it allows you to do id randomisation, so it hard to do crafted queries to &lt;br /&gt;
cheat, the down side of that you cannot understand it either, and handcraft db states for debugging or testing.&lt;br /&gt;
&lt;br /&gt;
=== Database for The card game ===&lt;br /&gt;
&lt;br /&gt;
Lets say you have a standard card game, player have hidden cards in hand, you can draw card from draw deck, play card on tableau and discard to discard pile.&lt;br /&gt;
We have to design database for such game.&lt;br /&gt;
&lt;br /&gt;
In real word to &amp;quot;save&amp;quot; the game we take a picture a play area, save cards from it, then put away draw deck, discard and hand of each player separately and mark it, also we will record current scoring (if any) and who&#039;s turn was it.&lt;br /&gt;
&lt;br /&gt;
* Framework handles state machine transition, so you don&#039;t have to worry about database design for that (i.e. who&#039;s turn it is, what phase of the game we are at, you still have to design it but part of state machine step)&lt;br /&gt;
* Also framework supports basic player information, color, order around the table, basic scoring, etc, so you don&#039;t have to worry about it either&lt;br /&gt;
* The only thing you need in our database is state of the &amp;quot;board&amp;quot;, which is &amp;quot;where each pieces is, and in what state&amp;quot;, or (position,rotation) pair.&lt;br /&gt;
&lt;br /&gt;
Lets see what we have for that:&lt;br /&gt;
* The card state is very simple, its usually &amp;quot;face up/face down&amp;quot;, &amp;quot;tapped/untapped&amp;quot;, &amp;quot;right side up/up side down&amp;quot;&lt;br /&gt;
* As position go we never need real coordinates x,y,z. We need to know what &amp;quot;zone&amp;quot; card was, and depending on the zone it may sometimes need an extra &amp;quot;z&amp;quot; or &amp;quot;x&amp;quot; as card order. The zone position usually static or irrelevant.&lt;br /&gt;
* So our model is: we have cards, which have some attributes, at any given point in time they belong to a &amp;quot;zone&amp;quot;, and can also have order and state&lt;br /&gt;
* Now for mapping we should consider what information changes and what information is static, later is always candidate for material file&lt;br /&gt;
* For dynamic information we should try to reduce amount of fields we need&lt;br /&gt;
**  we need at least a field for card, so its one&lt;br /&gt;
**  we need to know what zone cards belong to, its 2&lt;br /&gt;
**  and we have possibly few other fields, if you look closely at you game you may find out that most of the zone only need one attribute at a time, i.e. draw pile always have cards face down, hand always face up, also for hand and discard order does not matter at all (but for draw it does matter). So in majority of cases we can get away with one single extra integer field representing state or order&lt;br /&gt;
* In real database both card and zone will be integers as primary keys referring to additional tables, but in our case its total overkill, so they can be strings as easily&lt;br /&gt;
&lt;br /&gt;
Variant 1: Minimalistic&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
CREATE TABLE IF NOT EXISTS `card` (&lt;br /&gt;
  `card_key` varchar(32) unsigned NOT NULL,&lt;br /&gt;
  `card_location` varchar(32) NOT NULL,&lt;br /&gt;
  `card_state` int(11) NOT NULL,&lt;br /&gt;
  PRIMARY KEY (`card_id`)&lt;br /&gt;
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Variant 2: More normalised&lt;br /&gt;
&lt;br /&gt;
This version supported by Deck php class, so unless you want to rewrite db access layer go with this one&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
CREATE TABLE IF NOT EXISTS `card` (&lt;br /&gt;
  `card_id` int(10) unsigned NOT NULL AUTO_INCREMENT,&lt;br /&gt;
  `card_type` varchar(16) NOT NULL,&lt;br /&gt;
  `card_type_arg` int(11) NOT NULL,&lt;br /&gt;
  `card_location` varchar(16) NOT NULL,&lt;br /&gt;
  `card_location_arg` int(11) NOT NULL,&lt;br /&gt;
  PRIMARY KEY (`card_id`)&lt;br /&gt;
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: if you using this schema, some zones/locations have special semantic. The &#039;hand&#039; location is actually multiple locations - one per player, but player id is encoded as card_location_arg. If &#039;hand&#039; in your game is ordered, visible or can have some other card states, you cannot use hand location (replacement is hand_&amp;lt;player_id&amp;gt; or hand_&amp;lt;color_id&amp;gt;)&lt;br /&gt;
&lt;br /&gt;
== Code Organization ==&lt;br /&gt;
&lt;br /&gt;
=== Including your own JavaScript module ===&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js, modules/ggg_other.js&lt;br /&gt;
&lt;br /&gt;
* Create ggg_other.js in modules/ folder and sync&lt;br /&gt;
* Modify ggg.js to include it&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
  define([ &amp;quot;dojo&amp;quot;, &amp;quot;dojo/_base/declare&amp;quot;, &amp;quot;ebg/core/gamegui&amp;quot;, &amp;quot;ebg/counter&amp;quot;,&lt;br /&gt;
    // load my own module!!!&lt;br /&gt;
    g_gamethemeurl + &amp;quot;modules/ggg_other.js&amp;quot; ], function(dojo,&lt;br /&gt;
        declare) {&lt;br /&gt;
&lt;br /&gt;
=== Including your own JavaScript module (II) ===&lt;br /&gt;
&lt;br /&gt;
* Create ggg_other.js in modules/ folder and sync&lt;br /&gt;
&lt;br /&gt;
  define([], function () {&lt;br /&gt;
    return &amp;quot;value&amp;quot;;&lt;br /&gt;
  });&lt;br /&gt;
&lt;br /&gt;
* Modify ggg.js to include it&lt;br /&gt;
&lt;br /&gt;
  define([ &lt;br /&gt;
    &amp;quot;dojo&amp;quot;, &lt;br /&gt;
    &amp;quot;dojo/_base/declare&amp;quot;, &lt;br /&gt;
    &amp;quot;bgagame/modules/ggg_other&amp;quot;, &lt;br /&gt;
    &amp;quot;ebg/core/gamegui&amp;quot;, &lt;br /&gt;
    &amp;quot;ebg/counter&amp;quot;&lt;br /&gt;
  ], function(dojo, declare, other) {&lt;br /&gt;
  &lt;br /&gt;
  });&lt;br /&gt;
&lt;br /&gt;
  &lt;br /&gt;
This is maybe a little bit more the idea of the AMD Loader than the first option, although the first option should work as well.&lt;br /&gt;
&lt;br /&gt;
A little explanation to this:&lt;br /&gt;
The define function loads all the modules listed in the array and calls the following function with these loaded modules as parameters.&lt;br /&gt;
By putting your module at the third position in the array it is passed as the third parameter to the function. Be aware that the modules are resolved by position only, not by name. So you can load the module &#039;&#039;&#039;ggg_other&#039;&#039;&#039; and pass it as a parameter with the name &#039;&#039;&#039;other&#039;&#039;&#039;. &#039;&#039;&#039;gamegui&#039;&#039;&#039; and &#039;&#039;&#039;counter&#039;&#039;&#039; are passed in as well, but when the parameters are not defined they are just skipped. Because these modules put their content into the global scope it does not matter and you can use them from there.&lt;br /&gt;
&lt;br /&gt;
In the example above the string &amp;quot;value&amp;quot; is passed for the parameter &#039;&#039;&#039;other&#039;&#039;&#039;, but the function in your module can return whatever you want. It can be an object, an array, something you declared with dojo.declare, you can return even functions. &lt;br /&gt;
Your module can load other modules. Just put them in the array at the beginning and pass them as parameters to your function.&lt;br /&gt;
The advantage of passing the values as parameter is that you do not need to put these values in the global scope, so they can&#039;t be collisions with values defined in other scripts or the BGA Framework.&lt;br /&gt;
&lt;br /&gt;
The dojo toolkit provides good documentation to all of its components, the complete documentation for the AMD-Loader is here:&lt;br /&gt;
https://dojotoolkit.org/documentation/tutorials/1.10/modules/index.html It should be still correct, even as it seems to be only for version 1.10&lt;br /&gt;
&lt;br /&gt;
=== Including your own PHP module ===&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.game.php, modules/ggg_other.php&lt;br /&gt;
&lt;br /&gt;
* Create ggg_other.php in modules/ folder and sync&lt;br /&gt;
* Modify ggg.game.php to include it&lt;br /&gt;
&lt;br /&gt;
 require_once (&#039;modules/ggg_other.php&#039;);&lt;br /&gt;
&lt;br /&gt;
=== Creating a test class to run PHP locally ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.game.php, stubs&lt;br /&gt;
For this you need stubs of other method you can use this for example&lt;br /&gt;
https://github.com/elaskavaia/bga-sharedcode/raw/master/misc/module/table/table.game.php&lt;br /&gt;
&lt;br /&gt;
Create another php files, i.e ggg_test.php&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&amp;lt;?php&lt;br /&gt;
define(&amp;quot;APP_GAMEMODULE_PATH&amp;quot;, &amp;quot;misc/&amp;quot;); // include path to stubs, which defines &amp;quot;table.game.php&amp;quot; and other classes&lt;br /&gt;
require_once (&#039;eminentdomaine.game.php&#039;);&lt;br /&gt;
&lt;br /&gt;
class MyGameTest1 extends MyGame { // this is your game class defined in ggg.game.php&lt;br /&gt;
    function __construct() {&lt;br /&gt;
        parent::__construct();&lt;br /&gt;
        include &#039;../material.inc.php&#039;;// this is how this normally included, from constructor&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
    // override/stub methods here that access db and stuff&lt;br /&gt;
    function getGameStateValue($var) {&lt;br /&gt;
        if ($var == &#039;round&#039;)&lt;br /&gt;
            return 3;&lt;br /&gt;
        return 0;&lt;br /&gt;
    }&lt;br /&gt;
}&lt;br /&gt;
$x = new MyGameTest1(); // instantiate your class&lt;br /&gt;
$p = $x-&amp;gt;getGameProgression(); // call one of the methods to test&lt;br /&gt;
if ($p != 50)&lt;br /&gt;
    echo &amp;quot;Test1: FAILED&amp;quot;;&lt;br /&gt;
else&lt;br /&gt;
    echo &amp;quot;Test1: PASSED&amp;quot;;&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Run from command line like&lt;br /&gt;
 php7 ggg_test.php&lt;br /&gt;
&lt;br /&gt;
If you do it this way - you can also use local php debugger (i.e. integrated with IDE or command line).&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Avoiding code in dojo declare style ===&lt;br /&gt;
Dojo class declarations are rather bizzare and do not work with most IDEs.&lt;br /&gt;
If you want to write in plain JS with classes, you can stub all the dojo define/declare stuff&lt;br /&gt;
and hook your class into that, so the classes are outside of this mess.&lt;br /&gt;
&lt;br /&gt;
NOTE: this technique is for experienced developers, do not try it if you do not understand&lt;br /&gt;
the consequences.&lt;br /&gt;
&lt;br /&gt;
This is complete example of game .js class&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  // Testla is game name is has to be changed&lt;br /&gt;
class Testla {&lt;br /&gt;
	constructor(game) {&lt;br /&gt;
		console.log(&#039;game constructor&#039;);&lt;br /&gt;
		this.game = game;&lt;br /&gt;
		this.varfoo = new MyFoo(); // this example of class from custom module&lt;br /&gt;
	}&lt;br /&gt;
&lt;br /&gt;
	setup(gamedatas) {&lt;br /&gt;
		console.log(&amp;quot;Starting game setup&amp;quot;, this.varfoo);&lt;br /&gt;
		this.gamedatas = gamedatas;&lt;br /&gt;
		this.dojo.create(&amp;quot;div&amp;quot;, { class: &#039;whiteblock&#039;, innerHTML: _(&amp;quot;hello&amp;quot;) }, &#039;thething&#039;);&lt;br /&gt;
		console.log(&amp;quot;Ending game setup&amp;quot;);&lt;br /&gt;
	};&lt;br /&gt;
	onEnteringState(stateName, args) {&lt;br /&gt;
		console.log(&#039;onEnteringState : &#039; + stateName, args);&lt;br /&gt;
		this.game.addActionButton(&#039;b1&#039;,_(&#039;Click Me&#039;), (e)=&amp;gt;this.onButtonClick(e));&lt;br /&gt;
	};&lt;br /&gt;
	onLeavingState(stateName) {&lt;br /&gt;
		console.log(&#039;onLeavingState : &#039; + stateName, args);&lt;br /&gt;
	};&lt;br /&gt;
	onUpdateActionButtons(stateName, args) {&lt;br /&gt;
		console.log(&#039;onUpdateActionButtons : &#039; + stateName, args);&lt;br /&gt;
	};&lt;br /&gt;
	onButtonClick(event) {&lt;br /&gt;
		console.log(&#039;onButtonClick&#039;,event);&lt;br /&gt;
	};&lt;br /&gt;
};&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
define([&lt;br /&gt;
	&amp;quot;dojo&amp;quot;, &amp;quot;dojo/_base/declare&amp;quot;,&lt;br /&gt;
	&amp;quot;ebg/core/gamegui&amp;quot;,&lt;br /&gt;
	&amp;quot;ebg/counter&amp;quot;,&lt;br /&gt;
	g_gamethemeurl + &#039;/modules/foo.js&#039; // custom module if needed&lt;br /&gt;
],&lt;br /&gt;
	function(dojo, declare) {&lt;br /&gt;
                // testla is game name is has to be changed&lt;br /&gt;
		return declare(&amp;quot;bgagame.testla&amp;quot;, ebg.core.gamegui, {&lt;br /&gt;
			constructor: function() {&lt;br /&gt;
				this.xapp = new Testla(this);&lt;br /&gt;
				this.xapp.dojo = dojo;&lt;br /&gt;
			},&lt;br /&gt;
			setup: function(gamedatas) {&lt;br /&gt;
				this.xapp.setup(gamedatas);&lt;br /&gt;
			},&lt;br /&gt;
			onEnteringState: function(stateName, args) {&lt;br /&gt;
				this.xapp.onEnteringState(stateName, args.args);&lt;br /&gt;
			},&lt;br /&gt;
			onLeavingState: function(stateName) {&lt;br /&gt;
				this.xapp.onLeavingState(stateName, args);&lt;br /&gt;
			},&lt;br /&gt;
			onUpdateActionButtons: function(stateName, args) {&lt;br /&gt;
				this.xapp.onUpdateActionButtons(stateName, args);&lt;br /&gt;
			},&lt;br /&gt;
		});&lt;br /&gt;
	});&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
=== More readable JS: onEnteringState ===&lt;br /&gt;
&lt;br /&gt;
If you have a lot of states onEnteringState and friends become rather wild, you can do this trick to call some method dynamically.&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
     onEnteringState: function(stateName, args) {&lt;br /&gt;
       console.log(&#039;Entering state: &#039; + stateName, args);&lt;br /&gt;
&lt;br /&gt;
       // Call appropriate method&lt;br /&gt;
       var methodName = &amp;quot;onEnteringState_&amp;quot; + stateName;&lt;br /&gt;
       if (this[methodName] !== undefined) {             &lt;br /&gt;
          console.log(&#039;Calling &#039; + methodName, args.args);&lt;br /&gt;
          this[methodName](args.args);&lt;br /&gt;
       }&lt;br /&gt;
     },&lt;br /&gt;
&lt;br /&gt;
     onEnteringState_playerTurn: function(args) { // this is args directly, not args.args &lt;br /&gt;
         // process&lt;br /&gt;
     },&lt;br /&gt;
&lt;br /&gt;
     onEnteringState_playerSomethingElse: function(args) { &lt;br /&gt;
         // process&lt;br /&gt;
     },&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Note: since its ignores the undefined functions you don&#039;t have define function for each state, but on the other hand you cannot make typos.&lt;br /&gt;
Same applies to onUpdateActionButtons except you pass &#039;args&#039; to method, not args.args, and for onLeavingState where you don&#039;t pass anything.&lt;br /&gt;
&lt;br /&gt;
=== Frameworks and Preprocessors ===&lt;br /&gt;
&lt;br /&gt;
* [[Using Vue]] - work-in-progress guide on using the modern framework Vue.js to create a game&lt;br /&gt;
* [[Using Typescript and Scss]] - How to auto-build Typescript and SCSS files to make your code cleaner&lt;br /&gt;
&lt;br /&gt;
== Assorted Stuff ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Out-of-turn actions: Un-pass ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js, ggg.game.php, ggg.action.php, states.inc.php&lt;br /&gt;
&lt;br /&gt;
In multiplayer game sometimes players passes but than they think more and want to un-Pass and redo their choice. &lt;br /&gt;
To re-active a player who passes some trickery required.&lt;br /&gt;
&lt;br /&gt;
Define a special action that does how and hook it up.&lt;br /&gt;
&lt;br /&gt;
In states.inc.php add an action to mmultipleactiveplayer state to &amp;quot;unpass&amp;quot;, lets call it &amp;quot;actionCancel&amp;quot;&lt;br /&gt;
&lt;br /&gt;
In ggg.action.php add action hook&lt;br /&gt;
    public function actionCancel() {&lt;br /&gt;
        self::setAjaxMode();&lt;br /&gt;
        $this-&amp;gt;game-&amp;gt;actionCancel();&lt;br /&gt;
        self::ajaxResponse();&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
In ggg.game.php add action handler&lt;br /&gt;
    function actionCancel() {&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;checkPossibleAction(&#039;actionCancel&#039;);&lt;br /&gt;
        $this-&amp;gt;gamestate-&amp;gt;setPlayersMultiactive(array ($this-&amp;gt;getCurrentPlayerId() ), &#039;error&#039;, false);&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
Finally to call this in client ggg.js you would do something like:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
 onUpdateActionButtons:  function(stateName, args) {&lt;br /&gt;
   if (this.isCurrentPlayerActive()) { &lt;br /&gt;
     // ...&lt;br /&gt;
   } else if (!this.isSpectator) { // player is NOT active but not spectatoe&lt;br /&gt;
       switch (stateName) {&lt;br /&gt;
          case &#039;playerTurnMuliPlayerState&#039;:&lt;br /&gt;
		this.addActionButton(&#039;button_unpass&#039;, _(&#039;Oh no!&#039;), &#039;onUnpass&#039;);&lt;br /&gt;
		break;&lt;br /&gt;
	}&lt;br /&gt;
   }&lt;br /&gt;
 }&lt;br /&gt;
				&lt;br /&gt;
 onUnpass: function(e) {&lt;br /&gt;
    this.ajaxcall(&amp;quot;/&amp;quot; + this.game_name + &amp;quot;/&amp;quot; +  this.game_name + &amp;quot;/actionCancel.html&amp;quot;, {}, this); // no checkAction!&lt;br /&gt;
 }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
Although be careful that if the turn comes back to the player while he is about to click cancel, the action buttons will be updated and the player will misclick which can be quite frustrating. To avoid this, move the cancel button to another position, like to the left of pagemaintitletext:&lt;br /&gt;
  dojo.place(&#039;button_unpass&#039;, &#039;pagemaintitletext&#039;, &#039;before&#039;);&lt;br /&gt;
Being out of the generalactions div, it won&#039;t be automatically destroyed like normal buttons, so you&#039;ll have to handle that yourself in onLeavingState. You might also want to change the button color to red (blue buttons for active player only, red buttons also for inactive players?)&lt;br /&gt;
&lt;br /&gt;
=== Multi Step Interactions: Select Worker/Place Worker - Using Selection ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js&lt;br /&gt;
&lt;br /&gt;
Simple way to implement something like that without extra states is to use &amp;quot;selection&amp;quot; mechanism. When user click on worker add some sort of class into that element i.e. &#039;selected&#039; (which also have to have some indication by css i.e. outline).&lt;br /&gt;
&lt;br /&gt;
Than user can click on placement zone, you can use dojo.query for &amp;quot;selected&amp;quot; element and use it along with zone id to send data to server. If proper worker is not selected yet can give a error message using this.showMessage(...) function.&lt;br /&gt;
&lt;br /&gt;
Extra code required to properly cleanup selection between states&lt;br /&gt;
&lt;br /&gt;
=== Multi Step Interactions: Select Worker/Place Worker - Using Client States ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js&lt;br /&gt;
&lt;br /&gt;
I don&#039;t think its documented feature but there is a way to do client-only states, which is absolutely wonderful for few reasons&lt;br /&gt;
* When player interaction is two step process, such as select worker, place worker, or place worker, pick one of two resources of your choice&lt;br /&gt;
* When multi-step process can result of impossible situation and has to be undone (by rules)&lt;br /&gt;
* When multi-step process is triggered from multiple states (such as you can do same thing as activated card action, pass action or main action)&lt;br /&gt;
&lt;br /&gt;
So lets do Select Worker/Place Worker&lt;br /&gt;
&lt;br /&gt;
Define your server state as usual, i.e. playerMainTurn -&amp;gt; &amp;quot;You must pick up a worker&amp;quot;.&lt;br /&gt;
Now define a client state, we only need &amp;quot;name&amp;quot; and &amp;quot;descriptionmyturn&amp;quot;, lets say &amp;quot;client_playerPicksLocation&amp;quot;. Always prefix names of client state with &amp;quot;client_&amp;quot; to avoid confusion. Now we have to do the following:&lt;br /&gt;
* Have a handler for onUpdateActionButtons for playerMainTurn to activate all possible workers he can pick&lt;br /&gt;
* When player clicks workers, remember the worker in one of the members of the main class, I usually use one called this.clientStateArgs.&lt;br /&gt;
* Transition to new client state&lt;br /&gt;
  onWorker: function(e) {&lt;br /&gt;
      var id = event.currentTarget.id;&lt;br /&gt;
      dojo.stopEvent(event);&lt;br /&gt;
      ... // do validity checks&lt;br /&gt;
      this.clientStateArgs.worker_id = id;&lt;br /&gt;
      this.setClientState(&amp;quot;client_playerPicksLocation&amp;quot;, {&lt;br /&gt;
                                descriptionmyturn : &amp;quot;${you} must select location&amp;quot;,&lt;br /&gt;
                            });&lt;br /&gt;
   }&lt;br /&gt;
* Have a handler for onUpdateActionButtons for client_playerPicksLocation to activate all possible locations this worker can go AND add Cancel button (see below)&lt;br /&gt;
* Have a location handler which will eventually send a server request, using stored this.clientStateArgs.worker_id as worker id&lt;br /&gt;
* The cancel button should call a method to restore server state, also if you doing it for more than one state you can add this universally using this.on_client_state check&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
        if (this.isCurrentPlayerActive()) {&lt;br /&gt;
          if (this.on_client_state &amp;amp;&amp;amp; !$(&#039;button_cancel&#039;)) {&lt;br /&gt;
               this.addActionButton(&#039;button_cancel&#039;, _(&#039;Cancel&#039;), dojo.hitch(this, function() {&lt;br /&gt;
                                             this.restoreServerGameState();&lt;br /&gt;
               }));&lt;br /&gt;
          }&lt;br /&gt;
        } &lt;br /&gt;
Note: usually I call my own function call this.cancelLocalStateEffects() which will do more stuff first then call restoreServerGameState(), same function is usually needs to be called when server request has failed (i.e. invalid move)&lt;br /&gt;
&lt;br /&gt;
Note: If you need more than 2 steps, you may have to do client side animation to reflect the new state, which gets trickier because you have to undo that also on cancellation.&lt;br /&gt;
&lt;br /&gt;
Code is available here [https://github.com/elaskavaia/bga-sharedcode/blob/master/sharedcode.js sharedcode.js] (its using playerTurnPlayCubes and client_selectCubeLocation).&lt;br /&gt;
&lt;br /&gt;
=== Assigning Player Order ===&lt;br /&gt;
Normally when game starts there is &amp;quot;natural&amp;quot; player order assigned randomly.&lt;br /&gt;
&lt;br /&gt;
If you want to deliberatly assign player order at the start of the game (for example, in a game with teams options), you can do so by retrieving the initialization-only player attribute &#039;&#039;&#039;player_table_order&#039;&#039;&#039; and using it to assign values to &#039;&#039;&#039;player_no&#039;&#039;&#039; (which is normally assigned at the start of a game in the order in which players come to the table). (See [https://en.doc.boardgamearena.com/Game_database_model:_dbmodel.sql#The_player_table Game database model] for more details.)&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Example:&#039;&#039;&#039;&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
                // Retrieve inital player order ([0=&amp;gt;playerId1, 1=&amp;gt;playerId2, ...])&lt;br /&gt;
		$playerInitialOrder = [];&lt;br /&gt;
		foreach ($players as $playerId =&amp;gt; $player) {&lt;br /&gt;
			$playerInitialOrder[$player[&#039;player_table_order&#039;]] = $playerId;&lt;br /&gt;
		}&lt;br /&gt;
		ksort($playerInitialOrder);&lt;br /&gt;
		$playerInitialOrder = array_flip(array_values($playerInitialOrder));&lt;br /&gt;
&lt;br /&gt;
		// Player order based on &#039;playerTeams&#039; option&lt;br /&gt;
		$playerOrder = [0, 1, 2, 3];&lt;br /&gt;
		switch (self::getGameStateValue(&#039;playerTeams&#039;)) {&lt;br /&gt;
			case self::TEAM_1_2:&lt;br /&gt;
				$playerOrder = [0, 2, 1, 3];&lt;br /&gt;
				break;&lt;br /&gt;
			case self::TEAM_1_4:&lt;br /&gt;
				$playerOrder = [0, 1, 3, 2];&lt;br /&gt;
				break;&lt;br /&gt;
			case self::TEAM_RANDOM:&lt;br /&gt;
				shuffle($playerOrder);&lt;br /&gt;
				break;&lt;br /&gt;
			default:&lt;br /&gt;
			case self::TEAM_1_3:&lt;br /&gt;
				// Default order&lt;br /&gt;
				break;&lt;br /&gt;
		}&lt;br /&gt;
&lt;br /&gt;
                // Create players&lt;br /&gt;
		// Note: if you added some extra field on &amp;quot;player&amp;quot; table in the database (dbmodel.sql), you can initialize it there.&lt;br /&gt;
		$sql =&lt;br /&gt;
			&#039;INSERT INTO player (player_id, player_color, player_canal, player_name, player_avatar, player_no) VALUES &#039;;&lt;br /&gt;
		$values = [];&lt;br /&gt;
&lt;br /&gt;
		foreach ($players as $playerId =&amp;gt; $player) {&lt;br /&gt;
			$color = array_shift($default_colors);&lt;br /&gt;
			$values[] =&lt;br /&gt;
				&amp;quot;(&#039;&amp;quot; .&lt;br /&gt;
				$playerId .&lt;br /&gt;
				&amp;quot;&#039;,&#039;$color&#039;,&#039;&amp;quot; .&lt;br /&gt;
				$player[&#039;player_canal&#039;] .&lt;br /&gt;
				&amp;quot;&#039;,&#039;&amp;quot; .&lt;br /&gt;
				addslashes($player[&#039;player_name&#039;]) .&lt;br /&gt;
				&amp;quot;&#039;,&#039;&amp;quot; .&lt;br /&gt;
				addslashes($player[&#039;player_avatar&#039;]) .&lt;br /&gt;
				&amp;quot;&#039;,&#039;&amp;quot; .&lt;br /&gt;
				$playerOrder[$playerInitialOrder[$playerId]] .&lt;br /&gt;
				&amp;quot;&#039;)&amp;quot;;&lt;br /&gt;
		}&lt;br /&gt;
		$sql .= implode(&#039;,&#039;, $values);&lt;br /&gt;
		self::DbQuery($sql);&lt;br /&gt;
		self::reattributeColorsBasedOnPreferences(&lt;br /&gt;
			$players,&lt;br /&gt;
			$gameinfos[&#039;player_colors&#039;]&lt;br /&gt;
		);&lt;br /&gt;
		self::reloadPlayersBasicInfos();&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Send different notifications to active player vs everybody else ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.js&lt;br /&gt;
&lt;br /&gt;
Hack alert. This is a hack. We were hoping for proper solution by bga framework.&lt;br /&gt;
&lt;br /&gt;
This will allow you to send notification with two message one for specific player and one for everybody else including spectators.&lt;br /&gt;
Note that this does not split the data - all data must be shared.&lt;br /&gt;
&lt;br /&gt;
Add this to .js file (if you already overriding it merge obviously)&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
/** @Override */&lt;br /&gt;
format_string_recursive: function(log, args) {&lt;br /&gt;
   if (typeof args.log_others != &#039;undefined&#039; &amp;amp;&amp;amp; typeof args.player_id != &#039;undefined&#039; &amp;amp;&amp;amp; this.player_id != args.player_id)&lt;br /&gt;
	log = args.log_others;&lt;br /&gt;
   return this.inherited(arguments); // you must call this to call super &lt;br /&gt;
},&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Example of usage (from eminentdomain)&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    $this-&amp;gt;notifyAllPlayers(&#039;tokenMoved&#039;, &lt;br /&gt;
             clienttranslate(&#039;${player_name} adds +2 Colonies to ${place_name}&#039;), // notification with show for player with player_id&lt;br /&gt;
             [&#039;player_id&#039;=&amp;gt;$player_id, // this is mandatory&lt;br /&gt;
             &#039;log_others&#039;=&amp;gt;clienttranslate(&#039;${player_name} adds +2 Colonies to an unknown planet&#039;), // notification will show for others&lt;br /&gt;
              ...&lt;br /&gt;
             ]);&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Send transient notifications without incrementing move ID ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Ingredients:&#039;&#039;&#039; ggg.php&lt;br /&gt;
&lt;br /&gt;
Hack alert. This is a hack.&lt;br /&gt;
&lt;br /&gt;
Use this if you need to send some transient notification that should not create a new move ID. The notification should be idempotent -- it should have no practical effect on the game state and would be &#039;&#039;&#039;safe to drop&#039;&#039;&#039; (e.g., it would not matter if a player never received this notification). For example, in a co-op game you want all players to see a real-time preview of some action, before the active player commits their turn.&lt;br /&gt;
&lt;br /&gt;
Doing this mainly affects the instant replay &amp;amp; archive modes. During replay, the BGA framework automatically inserts a 1.5-second pause between each &amp;quot;move&amp;quot;. With this hack, your transient notifications are not considered to be a &amp;quot;move&amp;quot;, so no pause gets added.&lt;br /&gt;
&lt;br /&gt;
; In ggg.php&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
$this-&amp;gt;not_a_move_notification = true; // note: do not increase the move counter&lt;br /&gt;
$this-&amp;gt;notifyAllPlayers(&#039;cardsPreview&#039;, &#039;&#039;, $args);&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=BGA_Code_Sharing&amp;diff=7835</id>
		<title>BGA Code Sharing</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=BGA_Code_Sharing&amp;diff=7835"/>
		<updated>2021-04-02T18:46:21Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Add Uptown&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;{{Studio_Framework_Navigation}}&lt;br /&gt;
&lt;br /&gt;
This page is for listing of externally hosted bga projects, tools and resources, as well as internal project&lt;br /&gt;
intended for sharing&lt;br /&gt;
&lt;br /&gt;
== Projects hosted not in studio ==&lt;br /&gt;
&lt;br /&gt;
See the table a link and nickname of the developer on bga (same as used for dev forum), and short description. See [[Tools_and_tips_of_BGA_Studio#Version_Control]] for some suggestions on how and where to publish your code externally. Also see the [https://github.com/topics/boardgamearena boardgamearena] tag on github.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Important notice about artwork on BGA Open Source projects: original hi-resolution images from publishers must not be published on the repositories. In addition, it is better to specify that the images derivated from publishers artwork are copyrighted and cannot be licensed under a free license like Creative Commons.&lt;br /&gt;
&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable&amp;quot;&lt;br /&gt;
|-&lt;br /&gt;
! NON-GAME PROJECTS&lt;br /&gt;
! CODE LINK&lt;br /&gt;
! DEVELOPER&lt;br /&gt;
|-&lt;br /&gt;
| Shared Code (not a game)&lt;br /&gt;
| https://github.com/elaskavaia/bga-sharedcode&lt;br /&gt;
| Victoria_La&lt;br /&gt;
|-&lt;br /&gt;
| BoardGameArena Workbench (not a game)&lt;br /&gt;
| https://github.com/danielholmes/bga-workbench&lt;br /&gt;
| Daniel Holmes (dhau)&lt;br /&gt;
|-&lt;br /&gt;
! GAME&lt;br /&gt;
! CODE LINK&lt;br /&gt;
! DEVELOPER&lt;br /&gt;
|-&lt;br /&gt;
| 99 (Trick-taking Card Game)&lt;br /&gt;
| https://github.com/ekelly/bga-ninetynine&lt;br /&gt;
| QuasarDukeDev&lt;br /&gt;
|-&lt;br /&gt;
| Assyria &lt;br /&gt;
| https://github.com/sebastien-prudhomme/bga-assyria&lt;br /&gt;
| daikinee &lt;br /&gt;
|-&lt;br /&gt;
| Bandido &lt;br /&gt;
| https://github.com/opheliehb/BandidoBGA&lt;br /&gt;
| ophelopede &amp;amp; Harkle &lt;br /&gt;
|-&lt;br /&gt;
| The Battle for Hill 218&lt;br /&gt;
| https://github.com/danielholmes/battle-for-hill-218&lt;br /&gt;
| Daniel Holmes (dhau)&lt;br /&gt;
|-&lt;br /&gt;
| Bonbons&lt;br /&gt;
| https://github.com/AntonioSoler/bga-bonbons&lt;br /&gt;
| Morgalad &lt;br /&gt;
|-&lt;br /&gt;
| Coinche&lt;br /&gt;
| https://github.com/drasill/bga-coinche&lt;br /&gt;
| Draasill&lt;br /&gt;
|-&lt;br /&gt;
| Coup: City State&lt;br /&gt;
| https://github.com/quietmint/bga-coupcitystate&lt;br /&gt;
| quietmint&lt;br /&gt;
|-&lt;br /&gt;
| Dungeon Roll&lt;br /&gt;
| https://github.com/MartinGoulet/bga-dungeonroll&lt;br /&gt;
| MGoulet&lt;br /&gt;
|-&lt;br /&gt;
| Egyptian Ratscrew&lt;br /&gt;
| https://github.com/0BuRner/bga-egyptianratscrew&lt;br /&gt;
| 0BuRner&lt;br /&gt;
|-&lt;br /&gt;
| Eruption&lt;br /&gt;
| https://github.com/AndyKerrison/bga-eruption&lt;br /&gt;
| Andy_K&lt;br /&gt;
|-&lt;br /&gt;
| A Fistful Of Gold&lt;br /&gt;
| https://bitbucket.org/Joel_L/fistfulofgold&lt;br /&gt;
| Brainchild&lt;br /&gt;
|-&lt;br /&gt;
| Florenza: The Card Game&lt;br /&gt;
| https://github.com/alberto-bottarini/bga-florenza&lt;br /&gt;
| tarini &lt;br /&gt;
|-&lt;br /&gt;
| Hearts &#039;&#039;&#039;(Tutorial)&#039;&#039;&#039;&lt;br /&gt;
| https://github.com/elaskavaia/bga-heartsla&lt;br /&gt;
| Victoria_La&lt;br /&gt;
|-&lt;br /&gt;
| Incan Gold&lt;br /&gt;
| https://github.com/AntonioSoler/bga-incangold&lt;br /&gt;
| Morgalad &lt;br /&gt;
|-&lt;br /&gt;
| Marco Polo&lt;br /&gt;
| https://github.com/rcitaliano/MarcoPolo&lt;br /&gt;
| rcitaliano&lt;br /&gt;
|-&lt;br /&gt;
| Nile&lt;br /&gt;
| https://github.com/AndyKerrison/bga-nile&lt;br /&gt;
| Andy_K&lt;br /&gt;
|-&lt;br /&gt;
| Noir: Killer vs Inspector&lt;br /&gt;
| https://bitbucket.org/chhuang76/bga_noirkvi&lt;br /&gt;
| ch huang&lt;br /&gt;
|-&lt;br /&gt;
| Penny Press&lt;br /&gt;
| https://github.com/AdamNovotny/bga-blooms&lt;br /&gt;
| A-dam&lt;br /&gt;
|-&lt;br /&gt;
| P.I.&lt;br /&gt;
| https://gitlab.com/fa81/bga-pi, https://github.com/hellp/bga-pi (mirror)&lt;br /&gt;
| Fabian Neumann (fa81)&lt;br /&gt;
|-&lt;br /&gt;
| Santorini&lt;br /&gt;
| https://github.com/AntonioSoler/bga-santorini&lt;br /&gt;
| Morgalad, quietmint, Tisaac&lt;br /&gt;
|-&lt;br /&gt;
| Tablut&lt;br /&gt;
| https://github.com/Lucas-C/tablut&lt;br /&gt;
| Lucas-C &amp;amp; ntaffore&lt;br /&gt;
|-&lt;br /&gt;
| Takara Island&lt;br /&gt;
| https://github.com/AntonioSoler/bga-takaraisland&lt;br /&gt;
| Morgalad&lt;br /&gt;
|-&lt;br /&gt;
| Taluva&lt;br /&gt;
| https://github.com/quietmint/bga-taluva&lt;br /&gt;
| Morgalad &amp;amp; quietmint&lt;br /&gt;
|-&lt;br /&gt;
| Teotihuacan: City of Gods&lt;br /&gt;
| https://github.com/Trompetenhut/bga-teotihuacan&lt;br /&gt;
| Trompetenhut&lt;br /&gt;
|-&lt;br /&gt;
| Uptown&lt;br /&gt;
| https://github.com/elliotkendall/bga-uptown&lt;br /&gt;
| SpottedShroom&lt;br /&gt;
|-&lt;br /&gt;
| Via Magica&lt;br /&gt;
| https://github.com/christopherburke/bga_viamagica&lt;br /&gt;
| CuriousTerran&lt;br /&gt;
|-&lt;br /&gt;
| Just Desserts&lt;br /&gt;
| https://github.com/mizutismask/bga-just-desserts&lt;br /&gt;
| mizutismask&lt;br /&gt;
|-&lt;br /&gt;
| The King&#039;s Guild&lt;br /&gt;
| https://github.com/AdamNovotny/BGG-KingsGuild&lt;br /&gt;
| A-dam&lt;br /&gt;
|-&lt;br /&gt;
| Get the MacGuffin&lt;br /&gt;
| https://github.com/mizutismask/bga-get-the-MacGuffin&lt;br /&gt;
| mizutismask&lt;br /&gt;
|-&lt;br /&gt;
| President&lt;br /&gt;
| https://github.com/quaresma95/president&lt;br /&gt;
| quaresma95&lt;br /&gt;
|-&lt;br /&gt;
| Hardback&lt;br /&gt;
| https://github.com/quietmint/bga-hardback&lt;br /&gt;
| quietmint&lt;br /&gt;
|-&lt;br /&gt;
| Dice Summoners&lt;br /&gt;
| https://github.com/eoincos/bga-dicesummoners&lt;br /&gt;
| eoincos&lt;br /&gt;
|-&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
== Projects on studio ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
Any developer can add themselves to a project as read-only from http://en.studio.boardgamearena.com/#!projects page (almost any project).&lt;br /&gt;
The list below are no-games which do not have bgg id and not showing up there.&lt;br /&gt;
&lt;br /&gt;
{| class=&amp;quot;wikitable&amp;quot;&lt;br /&gt;
|-&lt;br /&gt;
! NAME&lt;br /&gt;
! CODE LINK&lt;br /&gt;
! DEVELOPER&lt;br /&gt;
|-&lt;br /&gt;
| Shared Code&lt;br /&gt;
| http://en.studio.boardgamearena.com/#!studiogame?game=sharedcode&lt;br /&gt;
| Victoria_La&lt;br /&gt;
|-&lt;br /&gt;
| Original BGA template&lt;br /&gt;
| http://en.studio.boardgamearena.com/#!studiogame?game=template&lt;br /&gt;
| Victoria_La&lt;br /&gt;
|-&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
== Other useful resources ==&lt;br /&gt;
&lt;br /&gt;
Moved to [[Tools_and_tips_of_BGA_Studio]]&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Stock&amp;diff=7668</id>
		<title>Stock</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Stock&amp;diff=7668"/>
		<updated>2021-03-18T21:18:03Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Explain that it&amp;#039;s not possible to trigger on animation end actions with removeFromStock and removeFromStockById&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;{{Studio_Framework_Navigation}}&lt;br /&gt;
&lt;br /&gt;
== Overview ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Stock&#039;&#039;&#039; is a javascript component that you can use in your game interface to display a set of elements of the same size that need to be arranged in single or multiple lines.&lt;br /&gt;
&lt;br /&gt;
Stock is very flexible and is the most used component in BGA games.&lt;br /&gt;
&lt;br /&gt;
Examples of stock use cases:&lt;br /&gt;
&lt;br /&gt;
* Display a set of cards, typically hands (examples: &#039;&#039;Hearts&#039;&#039;, &#039;&#039;Seasons&#039;&#039;, &#039;&#039;The Boss&#039;&#039;, &#039;&#039;Race for the Galaxy&#039;&#039;).&lt;br /&gt;
* Display items in player panels (examples: &#039;&#039;Takenoko&#039;&#039;, &#039;&#039;Amyitis&#039;&#039;, ...)&lt;br /&gt;
* ... Many other situations. For example, black dice and cubes on cards in &#039;&#039;Troyes&#039;&#039; are displayed with stock components.&lt;br /&gt;
&lt;br /&gt;
Using stock:&lt;br /&gt;
&lt;br /&gt;
* Your items are arranged nicely and sorted by type.&lt;br /&gt;
* When adding or removing items to a set, all items slide smoothly to their new position in the set.&lt;br /&gt;
* Selecting and unselecting items are built-in functions.&lt;br /&gt;
* You don&#039;t have to worry about inserting/removing HTML code; the entire life cycle of the stock is managed by the component.&lt;br /&gt;
&lt;br /&gt;
== Using stock: a simple example ==&lt;br /&gt;
&lt;br /&gt;
Let&#039;s have a look on how the stock is used in the game &#039;&#039;Hearts&#039;&#039; to display a hand of standard cards.&lt;br /&gt;
&lt;br /&gt;
First, don&#039;t forget to add &amp;quot;ebg/stock&amp;quot; as a dependency in your js file:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
define([&lt;br /&gt;
    &amp;quot;dojo&amp;quot;,&amp;quot;dojo/_base/declare&amp;quot;,&lt;br /&gt;
    &amp;quot;ebg/core/gamegui&amp;quot;,&lt;br /&gt;
    &amp;quot;ebg/counter&amp;quot;,&lt;br /&gt;
    &amp;quot;ebg/stock&amp;quot;     /// &amp;lt;==== HERE&lt;br /&gt;
],&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The stock is initialized in the Javascript &amp;quot;setup&amp;quot; method like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Player hand&lt;br /&gt;
    this.playerHand = new ebg.stock();&lt;br /&gt;
    this.playerHand.create( this, $(&#039;myhand&#039;), this.cardwidth, this.cardheight );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Explanations:&lt;br /&gt;
* We create a new stock object for the player hand.&lt;br /&gt;
* As parameters of the &amp;quot;create&amp;quot; method, we provide the width/height of an item (a card), and the div container &amp;quot;myhand&amp;quot; - which is a simple empty &amp;quot;div&amp;quot; element defined in our HTML template (.tpl).&lt;br /&gt;
&lt;br /&gt;
Then, we must tell the stock what items it is going to display during its life: the 52 cards of a standard card game. Of course, we did not create 52 different images, but a &amp;quot;CSS sprite&amp;quot; image named &amp;quot;cards.jpg&amp;quot; with the cards arranged in 4 rows and 13 columns.&lt;br /&gt;
&lt;br /&gt;
Here&#039;s how we tell stock what items to display:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Specify that there are 13 images per row in the CSS sprite image&lt;br /&gt;
    this.playerHand.image_items_per_row = 13;&lt;br /&gt;
&lt;br /&gt;
    // Create card types:&lt;br /&gt;
    for( var color=1;color&amp;lt;=4;color++ )&lt;br /&gt;
    {&lt;br /&gt;
        for( var value=2;value&amp;lt;=14;value++ )&lt;br /&gt;
        {&lt;br /&gt;
            // Build card type id&lt;br /&gt;
            var card_type_id = this.getCardUniqueId( color, value );&lt;br /&gt;
            this.playerHand.addItemType( card_type_id, card_type_id, g_gamethemeurl+&#039;img/cards.jpg&#039;, card_type_id );&lt;br /&gt;
        }&lt;br /&gt;
    }&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Explanation:&lt;br /&gt;
&lt;br /&gt;
* First, we tell the stock component that our CSS sprite contains 13 items per row. This way, it can find the correct image for each card type id.&lt;br /&gt;
* Then for the 4x13 cards, we call the &amp;quot;addItemType&amp;quot; method that creates the type. The arguments are the type id, the weight of the card (for sorting purpose), the URL of our CSS sprite, and the position of our card image in the CSS sprite.&lt;br /&gt;
&lt;br /&gt;
Note: In this specific example we need to generate a unique ID for each type of card based on its color and value. This is the only purpose of &amp;quot;getCardUniqueId&amp;quot;.&lt;br /&gt;
&lt;br /&gt;
From now on, if we need to add a card - for example, the 5 of Hearts - to a player&#039;s hand, we can do this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
this.playerHand.addToStock( this.getCardUniqueId( 2 /* 2=hearts */, 5 ) );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
In reality, cards have some IDs, which are useful to manipulate them. This is the reason we are using &amp;quot;addToStockWithId&amp;quot; instead:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
this.playerHand.addToStockWithId( this.getCardUniqueId( 2 /* 2=hearts */, 5 ), my_card_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
If afterwards we want to remove this card from the stock:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
this.playerHand.removeFromStockById( my_card_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Complete stock component reference ==&lt;br /&gt;
&lt;br /&gt;
=== Creation ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;create( page, container_div, item_width, item_height ):&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
With create, you create a new stock component.&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* page: the container page. Usually: &amp;quot;this&amp;quot;.&lt;br /&gt;
* container_div: the container &amp;quot;div&amp;quot; element (an empty div element in your template, with an id).&lt;br /&gt;
* width and height (in pixels) for the stock component.&lt;br /&gt;
&lt;br /&gt;
(See &#039;&#039;Hearts&#039;&#039; example above).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;addItemType( type, weight, image, image_position ):&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Define a new type of item and add it to the stock.&lt;br /&gt;
&lt;br /&gt;
This is mandatory to define a new item type before adding it to the stock. Example: if you want to have a stock contain cubes of 3 different colors, you must add 3 item types (one for each color).&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* {int} type: id of the type to add. You can choose any positive integer. All item types must have distinct IDs.&lt;br /&gt;
* {int} 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 and their order might change randomly at any time.&lt;br /&gt;
* {string} image: URL of item image. Most of the time, you will use a CSS sprite for stock items, so you have to specify CSS sprite image here.&lt;br /&gt;
&lt;br /&gt;
Be careful: you must specify the image url as this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  g_gamethemeurl+&#039;img/yourimage.png&#039;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
* image_position: if &amp;quot;image&amp;quot; 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 &amp;quot;0&amp;quot; for the first cube image, 1 for the second, 2 for the third.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;Important&#039;&#039;: if there is more than one line of items in your CSS sprite,  you must specify how many items per line you have in your CSS sprite, see image_items_per_row below:&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;image_items_per_row&#039;&#039;&#039;&lt;br /&gt;
Class member to set number of columns in css sprite (or how many items per row). I.e. if you sprite is 4 cards horizonatall and 6 vertically, you have to set it to 4.&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Specify that there are 10 image items per row in images used in &amp;quot;myStockObject&amp;quot; control.&lt;br /&gt;
    this.myStockObject.image_items_per_row = 4;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Add/Remove items ===&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;addToStock( type, from )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Add an item to the stock, with the specified type, but without a unique ID.&lt;br /&gt;
&lt;br /&gt;
To make your life easier, in most cases we suggest you use &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039; in order to give an ID to the item added. &#039;&#039;&#039;addToStock&#039;&#039;&#039; is suitable when you are using a stock to control items that are generic game materials that don&#039;t need to be tracked individually (example: a bunch of money tokens).&lt;br /&gt;
&lt;br /&gt;
Parameters:&lt;br /&gt;
* type: ID of the item type to use (as specified in &amp;quot;addItemType&amp;quot;)&lt;br /&gt;
* from: OPTIONAL: if you specify an HTML item here, the item will appear on this item and will be slid to its position on the stock item.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
  // Add a money token to the &amp;quot;player money&amp;quot; stock.&lt;br /&gt;
  // The money token will appear on &amp;quot;player_id&amp;quot; player panel and will move to its position.&lt;br /&gt;
  this.playerMoney.addToStock( MONEY_TOKEN, &#039;overall_player_board_&#039;+player_id );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Important: for a given stock control, you must use either &#039;&#039;&#039;addToStock&#039;&#039;&#039; or &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039;, but NEVER BOTH OF THEM.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;addToStockWithId( type, id, from )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This is the same method as &#039;&#039;&#039;addToStock&#039;&#039;&#039;, except that it also associates an ID with the newly created item.&lt;br /&gt;
&lt;br /&gt;
This is especially useful:&lt;br /&gt;
&lt;br /&gt;
* When you need to know which item(s) have been selected by the user (see &#039;&#039;&#039;getSelectedItems&#039;&#039;&#039;).&lt;br /&gt;
* When you need to remove a specific item from the stock with &#039;&#039;&#039;removeFromStockById&#039;&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeFromStock( type, to, noupdate )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove an item of the specific type from the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;to&#039; is an optional parameter. If &amp;quot;to&amp;quot; contains the ID of an HTML element, the item removed from the Stock slides to this HTML element before it disappears. Note that this method does not expose the associated animation object, however, so it&#039;s not possible to trigger other actions when it finishes, for example. If you need to do that, use Dojo&#039;s slideToObject() instead.&lt;br /&gt;
&lt;br /&gt;
&#039;noupdate&#039; is an optional parameter. If set to &amp;quot;true&amp;quot; it will prevent the Stock display from changing. This is useful when multiple (but not all) items are removed at the same time, to avoid ghost items appearing briefly. If you pass noupdate you have to call updateDisplay() after all items are removed.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeFromStockById( id, to, noupdate )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove an item with a specific ID from the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;to&#039; is an optional parameter. If &amp;quot;to&amp;quot; contains the ID of an HTML element, the item removed from the Stock slides to this HTML element before it disappears. Note that this method does not expose the associated animation object, however, so it&#039;s not possible to trigger other actions when it finishes, for example. If you need to do that, use Dojo&#039;s slideToObject() instead.&lt;br /&gt;
&lt;br /&gt;
&#039;noupdate&#039; is an optional parameter. If set to &amp;quot;true&amp;quot; it will prevent the Stock display from changing. This is useful when multiple (but not all) items are removed at the same time, to avoid ghost items appearing briefly. If you pass noupdate you have to call updateDisplay() after all items are removed.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeAll()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove all items from the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;removeAllTo( to )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Remove all items from the stock. If &amp;quot;to&amp;quot; contains the ID of an HTML element, the item removed from the stock slides to this HTML element before it disappears.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Getters ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getPresentTypeList()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return an array with all the types of items present in the stock right now.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    this.myStockControl.removeAll();&lt;br /&gt;
    this.myStockControl.addToStock( 65 );&lt;br /&gt;
    this.myStockControl.addToStock( 34 );&lt;br /&gt;
    this.myStockControl.addToStock( 89 );&lt;br /&gt;
    this.myStockControl.addToStock( 65 );&lt;br /&gt;
    &lt;br /&gt;
    // The following returns: { 34:1,  65:1,  89:1  }&lt;br /&gt;
    var item_types = this.myStockControl.getPresentTypeList();&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;count():&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the total number of items in the stock right now.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getAllItems()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get all items (same format as getSelectedItems and getUnselectedItems).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getItemDivId(id)&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get the div id using the stock item id (to manipulate element properties directly).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getItemById(id)&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Get the Stock item with the id in parameter&lt;br /&gt;
ex : return the object { type:1,  id:  1001 }&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
=== Selection ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setSelectionMode( mode )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
For each stock control, you can specify a selection mode:&lt;br /&gt;
* 0: no item can be selected by the player.&lt;br /&gt;
* 1: a maximum of one item can be selected by the player at a time.&lt;br /&gt;
* 2 (default): multiple items can be selected by the player at the same time.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setSelectionAppearance( type )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
For each stock control, you can specify a selection highlighting type:&lt;br /&gt;
* &#039;border&#039;: there will be a red border around selected items (this is the default). The attribute &#039;apparenceBorderWidth&#039; can be used to manage the width of the border (in pixels).&lt;br /&gt;
* &#039;disappear&#039;: the selected item will fade out and disappear. This is useful when the selection has the effect of destroying the item.&lt;br /&gt;
* &#039;class&#039;: there will be an extra &#039;&#039;&#039;stockitem_selected&#039;&#039;&#039; css class added to the element when it is selected (and removed when unselected). The name of the class can be changed by using the &#039;&#039;&#039;selectionClass&#039;&#039;&#039; attribute. You can also override the default class in the css file for your game but beware of the &#039;&#039;&#039;!important&#039;&#039;&#039; keyword.&lt;br /&gt;
&lt;br /&gt;
By default this class definition is:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.stockitem_selected {&lt;br /&gt;
	border: 2px solid red ! important;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
If you want to override it (for example, to change the border color) add this in your &amp;lt;game&amp;gt;.css file:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
.stockitem_selected {&lt;br /&gt;
	border: 2px solid orange ! important;&lt;br /&gt;
}&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;isSelected( id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return a boolean indicating whether the specified item id has been selected.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;selectItem( id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Select the specified item.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;unselectItem( id )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Unselect the specified item.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;unselectAll()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Unselect all items of the stock.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;onChangeSelection&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
This callback method is called when the player selects/unselects an item of the stock.&lt;br /&gt;
&lt;br /&gt;
You can connect this to one of your methods like this:&lt;br /&gt;
&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    dojo.connect( this.myStockControl, &#039;onChangeSelection&#039;, this, &#039;onMyMethodToCall&#039; );&lt;br /&gt;
    &lt;br /&gt;
    (...)&lt;br /&gt;
    &lt;br /&gt;
    onMyMethodToCall: function( control_name, item_id )&lt;br /&gt;
    {&lt;br /&gt;
        // This method is called when myStockControl selected items changed&lt;br /&gt;
        var items = this.myStockControl.getSelectedItems();&lt;br /&gt;
        &lt;br /&gt;
        // (do something)&lt;br /&gt;
    },&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Nota bene: &lt;br /&gt;
- The &amp;quot;control_name&amp;quot; argument is the ID (the &amp;quot;DOM&amp;quot; id) of the &amp;quot;div&amp;quot; container of your stock control. Using &amp;quot;control_name&amp;quot;, you can use the same callback method for different Stock control and see which one trigger the method.&lt;br /&gt;
- The &amp;quot;item_id&amp;quot; argument is the stock ID (index) of the stock item that has just been selected/unselected.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getSelectedItems()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Return the list of selected items, as an array with the following format:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
[&lt;br /&gt;
   { type:1,  id:  1001 },&lt;br /&gt;
   { type:1,  id:  1002 },&lt;br /&gt;
   { type:3,  id:  1003 }&lt;br /&gt;
   ...&lt;br /&gt;
]&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;getUnselectedItems()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Same as the previous one, but return unselected item instead of seleted ones.&lt;br /&gt;
&lt;br /&gt;
=== Layout ===&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;resetItemsPosition()&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
If you moved an item from the stock control manually (ex: after a drag&#039;n&#039;drop) and want to reset their positions to their original ones, you can call this method.&lt;br /&gt;
Note: it is the same as updateDisplay() without arugment, not sure why there are two methods.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;updateDisplay(from)&#039;&#039;&#039;&lt;br /&gt;
Update the display completely (if &#039;from&#039; is defined: moves new items from this location).&lt;br /&gt;
&lt;br /&gt;
Example code if you change the underlying stock item, or otherwise want to make the stock item refresh:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    this.myStockControl.updateDisplay();&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;item_margin&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
By default, there is a margin of 5px between the items of a stock. You can change the member variable &amp;quot;item_margin&amp;quot; to change this.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
     this.myStockControl.item_margin=5;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;changeItemsWeight( newWeights )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
With this method you can change dynamically the weight of the item types in a stock control.&lt;br /&gt;
&lt;br /&gt;
Items are immediately re-sorted with the new weight.&lt;br /&gt;
&lt;br /&gt;
Example: with a stock control that contains classic cards, you can order them by value or by color. Using changeItemsWeight you can switch from one sort method to another when a player request this.&lt;br /&gt;
&lt;br /&gt;
newWeights is an associative array: item type id =&amp;gt; new weight.&lt;br /&gt;
&lt;br /&gt;
Example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Item type 1 gets a new weight of 10, 2 a new weight of 20, 3 a new weight of 30.&lt;br /&gt;
    this.myStockControl.changeItemsWeight( { 1: 10, 2: 20, 3: 30 } );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
Example2:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // Be careful with object initialisers with variables, use the bracket notation.&lt;br /&gt;
    // Item type 1 gets a new weight of 10&lt;br /&gt;
    var card_type = 1;&lt;br /&gt;
    this.myStockControl.changeItemsWeight( { [card_type]: 10 } );&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;centerItems&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Center the stock items in the middle of the stock container.&lt;br /&gt;
e.g. this.myStock.centerItems = true; &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;setOverlap( horizontal_percent, vertical_percent )&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Make items of the stock control &amp;quot;overlap&amp;quot; each other, to save space.&lt;br /&gt;
&lt;br /&gt;
By default, horizontal_overlap and vertical_overlap are 0.&lt;br /&gt;
&lt;br /&gt;
When horizontal_overlap=20, it means that a stock item will overlap to only show 20% of the width of all the previous items. horizontal_overlap can&#039;t be greater than 100.&lt;br /&gt;
&lt;br /&gt;
vertical_overlap works differently: one items on two are shifted up.&lt;br /&gt;
&lt;br /&gt;
See the games &amp;quot;Jaipur&amp;quot; or &amp;quot;Koryŏ&amp;quot; to see examples of use of this function.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;autowidth&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Stock does not play well if you attempt to inline-block it with other blocks, to fix that you have to set this flag which will calculate width properly&lt;br /&gt;
   mystock.autowidth = true;&lt;br /&gt;
&lt;br /&gt;
=== Customize apperance ===&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;extraClasses&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Can be set to a list of class names (separated by space) on stock object, so when div is created these are added, i.e.&lt;br /&gt;
&lt;br /&gt;
  this.playerHand.extraClasses=&#039;mycard&#039;;&lt;br /&gt;
&lt;br /&gt;
Note that it is the same list for all items.&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;onItemCreate&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Using onItemCreate, you can trigger a method each time a new item is added to the Stock, in order to customize it.&lt;br /&gt;
&lt;br /&gt;
Complete example:&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
    // During &amp;quot;setup&amp;quot; phase, we associate our method &amp;quot;setupNewCard&amp;quot; with the creation of a new stock item:&lt;br /&gt;
    this.myStockItem.onItemCreate = dojo.hitch( this, &#039;setupNewCard&#039; ); &lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
    // And here is our &amp;quot;setupNewCard&amp;quot;:&lt;br /&gt;
    setupNewCard: function( card_div, card_type_id, card_id )&lt;br /&gt;
    {&lt;br /&gt;
       // Add a special tooltip on the card:&lt;br /&gt;
       this.addTooltip( card_div.id, _(&amp;quot;Some nice tooltip for this item&amp;quot;), &#039;&#039; );&lt;br /&gt;
&lt;br /&gt;
       // Note that &amp;quot;card_type_id&amp;quot; contains the type of the item, so you can do special actions depending on the item type&lt;br /&gt;
&lt;br /&gt;
       // Add some custom HTML content INSIDE the Stock item:&lt;br /&gt;
       dojo.place( this.format_block( &#039;jstpl_my_card_content&#039;, {&lt;br /&gt;
                                ....&lt;br /&gt;
                           } ), card_div.id );&lt;br /&gt;
    }&lt;br /&gt;
&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;onItemDelete&#039;&#039;&#039;&lt;br /&gt;
&lt;br /&gt;
Function handler called when div is removed&lt;br /&gt;
&lt;br /&gt;
   this.myStock.onItemDelete = (card_div, card_type_id, card_id) =&amp;gt; { console.log(&amp;quot;card deleted from myStock: &amp;quot;+card_id); };&lt;br /&gt;
&lt;br /&gt;
== Tips when adding/removing items to/from Stock components ==&lt;br /&gt;
&lt;br /&gt;
Most cases will be one of the following situations:&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Situation A&#039;&#039;&#039;:&lt;br /&gt;
&lt;br /&gt;
When you add a card to a stock item, and this card is &#039;&#039;&#039;not&#039;&#039;&#039; coming from another stock:&lt;br /&gt;
&lt;br /&gt;
* Use &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039; with a &amp;quot;from&amp;quot; argument set to the element of your interface where the card should come from (i.e. div id). For example if you want to &amp;quot;reveal&amp;quot; card from player hand and it is not an interface element you can set from to be &#039;player_board_&#039;+activePlayerId (where activePlayerId is player who played that card).&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Situation B&#039;&#039;&#039;:&lt;br /&gt;
&lt;br /&gt;
When you add a card to a stock item, and this card is coming from another stock:&lt;br /&gt;
&lt;br /&gt;
* On the destination Stock, use &#039;&#039;&#039;addToStockWithId&#039;&#039;&#039; with a &amp;quot;from&amp;quot; argument which is the HTML id of the corresponding item in the source Stock. For example, if the source stock id is &amp;quot;myHand&amp;quot;, then the HTML id of card 48 is &amp;quot;myHand_item_48&amp;quot;.&lt;br /&gt;
* Then, remove the source item with &#039;&#039;&#039;removeFromStockById&#039;&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
(Note that it&#039;s important to do things in this order, because the source item must still exist when you use it as the origin of the slide.)&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;Situation C&#039;&#039;&#039;:&lt;br /&gt;
&lt;br /&gt;
When you move a card from a stock item to something that is not a stock item:&lt;br /&gt;
&lt;br /&gt;
* Insert the card as a classic HTML template (dojo.place / this.format_block).&lt;br /&gt;
* Place it on the Stock item with &#039;&#039;&#039;this.placeOnObject&#039;&#039;&#039;, using the Stock item HTML id (see above).&lt;br /&gt;
* Slide it to its new position with &#039;&#039;&#039;this.slideToObject&#039;&#039;&#039;.&lt;br /&gt;
* Remove the card from the Stock item with &#039;&#039;&#039;removeFromStockById&#039;&#039;&#039;.&lt;br /&gt;
&lt;br /&gt;
Using the methods above, your cards should slide to, from, and between your Stock controls smoothly.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
You can customize this (showing the default value):&lt;br /&gt;
&amp;lt;pre&amp;gt;&lt;br /&gt;
&lt;br /&gt;
this.mystock.jstpl_stock_item= &amp;quot;&amp;lt;div id=\&amp;quot;${id}\&amp;quot; class=\&amp;quot;stockitem\&amp;quot; style=\&amp;quot;top:${top}px;left:${left}px;width:${width}px;height:${height}px;z-index:${position};background-image:url(&#039;${image}&#039;);\&amp;quot;&amp;gt;&amp;lt;/div&amp;gt;&amp;quot;;&lt;br /&gt;
&amp;lt;/pre&amp;gt;&lt;br /&gt;
To produce a different type of stock item&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Gamehelpuptown&amp;diff=7625</id>
		<title>Gamehelpuptown</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Gamehelpuptown&amp;diff=7625"/>
		<updated>2021-03-14T18:55:50Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Explain the difference between Uptown and its re-release, Blockers!&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== How to Play Uptown ==&lt;br /&gt;
=== Objective ===&lt;br /&gt;
The goal of Uptown is to place your colored tiles in such a way that at the end of the game, they&#039;re connected in as few groups as possible. A group is a collection of tiles which are all touching at least one other member of the group on at least one side (not just on a corner).&lt;br /&gt;
&lt;br /&gt;
If one or more players has the same number of groups at the end of the game, the player who has captured the fewest of their opponents&#039; tiles wins. See below for more about capturing.&lt;br /&gt;
&lt;br /&gt;
=== Playing the Game ===&lt;br /&gt;
Below the board you can see the five tiles that are in your rack and available to place. On your turn, click one of these tiles, then click the space on the board where you want to place it. To be a legal move, the tile you&#039;re playing must match the board space where you&#039;re trying to place it. You can only place tiles with a letter on them (A-I) in the row with a matching label. You can only place tiles with a number (1-9) in the matching column. You can only place tiles with a symbol in the area of the board with matching symbols on it. The dollar sign ($) tile is wild and you can place it anywhere.&lt;br /&gt;
&lt;br /&gt;
Your supply includes one tile of each letter, number, and symbol. The game ends when each player has drawn all of their tiles and placed all but four. Therefore, you there are four tiles you will not need to play. You can see how many tiles are left for you and your opponents to draw by looking at the number in the user information area in the top right corner of the page.&lt;br /&gt;
&lt;br /&gt;
=== Capturing ===&lt;br /&gt;
If you wish to place a tile on a square where an opponent has already placed one of their tiles, you may do so. However, you may not split an opponent&#039;s tiles into more groups than they already had. You may also never capture one of your own tiles.&lt;br /&gt;
&lt;br /&gt;
You can see any tiles that your opponents have captured displayed below their names. Tiles that you have captured appear below your rack of tiles. At the end of the game, if one or more players has the same number of groups, the player with fewest captured tiles wins.&lt;br /&gt;
&lt;br /&gt;
=== Uptown vs. Blockers! ===&lt;br /&gt;
Uptown was originally published with a small print run in 2007. In 2011 it was rebranded and re-released as Blockers! In addition to a new abstract theme, Blockers! changed the end of game scoring rules. Instead of the number of captured tiles being a tie breaker, the largest number of captures tiles of a single color gets added to a player&#039;s score. So if a player were to end the game with one group and three captured blue tiles, they would lose to a player with two groups and only a single capture in each color.&lt;br /&gt;
&lt;br /&gt;
Currently the version on BGA implements the original Uptown scoring. It may eventually support the option of using the Blockers! rules instead.&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
	<entry>
		<id>https://en.doc.boardgamearena.com/index.php?title=Gamehelpuptown&amp;diff=7596</id>
		<title>Gamehelpuptown</title>
		<link rel="alternate" type="text/html" href="https://en.doc.boardgamearena.com/index.php?title=Gamehelpuptown&amp;diff=7596"/>
		<updated>2021-03-10T22:32:15Z</updated>

		<summary type="html">&lt;p&gt;Elliot K: Created page with &amp;quot;== How to Play Uptown == === Objective === The goal of Uptown is to place your colored tiles in such a way that at the end of the game, they&amp;#039;re connected in as few groups as p...&amp;quot;&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== How to Play Uptown ==&lt;br /&gt;
=== Objective ===&lt;br /&gt;
The goal of Uptown is to place your colored tiles in such a way that at the end of the game, they&#039;re connected in as few groups as possible. A group is a collection of tiles which are all touching at least one other member of the group on at least one side (not just on a corner).&lt;br /&gt;
&lt;br /&gt;
If one or more players has the same number of groups at the end of the game, the player who has captured the fewest of their opponents&#039; tiles wins. See below for more about capturing.&lt;br /&gt;
&lt;br /&gt;
=== Playing the Game ===&lt;br /&gt;
Below the board you can see the five tiles that are in your rack and available to place. On your turn, click one of these tiles, then click the space on the board where you want to place it. To be a legal move, the tile you&#039;re playing must match the board space where you&#039;re trying to place it. You can only place tiles with a letter on them (A-I) in the row with a matching label. You can only place tiles with a number (1-9) in the matching column. You can only place tiles with a symbol in the area of the board with matching symbols on it. The dollar sign ($) tile is wild and you can place it anywhere.&lt;br /&gt;
&lt;br /&gt;
Your supply includes one tile of each letter, number, and symbol. The game ends when each player has drawn all of their tiles and placed all but four. Therefore, you there are four tiles you will not need to play. You can see how many tiles are left for you and your opponents to draw by looking at the number in the user information area in the top right corner of the page.&lt;br /&gt;
&lt;br /&gt;
=== Capturing ===&lt;br /&gt;
If you wish to place a tile on a square where an opponent has already placed one of their tiles, you may do so. However, you may not split an opponent&#039;s tiles into more groups than they already had. You may also never capture one of your own tiles.&lt;br /&gt;
&lt;br /&gt;
You can see any tiles that your opponents have captured displayed below their names. Tiles that you have captured appear below your rack of tiles. At the end of the game, if one or more players has the same number of groups, the player with fewest captured tiles wins.&lt;/div&gt;</summary>
		<author><name>Elliot K</name></author>
	</entry>
</feed>