Board Game Arena - Contribucións do/a usuario/a [gl]

Gamehelpdragonkeeper

2018-03-06T20:51:07Z

Morgalad:

Type of mechanics

Dragon Keeper could be considered as a cooperative game, but with all the players being traitors. Each participant plays for himself, but they can be defeated together!

This game consists in collecting and placing tiles. At each of your turns, you get a tile and give one to the preceding player. The tile that the following player will get depends on the position of the tile you have given, thus creating a strong interaction. The original guilds are secret, so you must deduce which ones are your opponents, to penalize them as much as possible.

Gamehelpdragonkeeper

2018-03-06T20:50:45Z

Morgalad: Created page with "Type of mechanics dk boite photo rondeDragon Keeper could be considered as a cooperative game, but with all the players being traitors. Each participant plays for himself, b..."

Type of mechanics

dk boite photo rondeDragon Keeper could be considered as a cooperative game, but with all the players being traitors. Each participant plays for himself, but they can be defeated together!

This game consists in collecting and placing tiles. At each of your turns, you get a tile and give one to the preceding player. The tile that the following player will get depends on the position of the tile you have given, thus creating a strong interaction. The original guilds are secret, so you must deduce which ones are your opponents, to penalize them as much as possible.

3D

2017-07-07T15:20:08Z

Morgalad: /* Setting the default point of view and enabling 3d by default */

= Overview =

Board Game Arena is using CSS 3D features to provide a basic 3D view of the games.

This is not a "100% real" 3D as this is very difficult to play with real 3D model with CSS, but most of the time it provides a satisfying 3D view of the game.

The objective of 3D is to provide a nice view of the game : 90% of the time, 2D is more suitable for playing. So we don't force developers to make sure games can be played in 3D : this is just a "bonus".

= Enabling 3D =

3D is enabled by default for your game.

You can click on the "3D" button at the top right and see your game in 3D.

If you don't want to allow players to use 3D with your game, you can add this to you "gameinfos.inc.php" file :

'enable_3d' => false,

= Detecting 3D =

When 3D is "on", BGA adds CSS class "mode_3d" to the body element.

In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".

.mode_3d .board {
overflow: visible;
}

In Javascript, you can detect 3D by using the following :

if( this.control3dmode3d )
{
// Only executed in 3d mode
}

= Built-in 3D enhancements =

BGA is doing some built-in 3D enhancements with your 3D adaptations, so your adaptation will have some 3D effects without any efforts :

* When executing a slideToObject, a slideToObjectPos or a slideTemporaryObject, BGA is moving the objects vertically (up, then down).
* It also happens when moving elements of a Stock module, or to a Zone module.

= Enhance your adaptation for 3D =

== Use Z axis ==

Using CSS transform: translateZ, you can translate your HTML elements along the Z axis. Example :

.floating_element {
transform: translateZ( 20px ); /* This element is going to float 20px above the surface */
}

The framework will add the following to all your divs:
transform-style: preserve-3d;

So they will keep their position in 3D space relative to other elemens with the transformation defined. Note that some CSS artifacts can break the css inheritance of the "preserve-3d" like "overflow:auto"

At any moment, you can know the Z position of an element from javascript using :

this.getComputedTranslateZ( html_element );

== Use pre-build BGA 3D CSS classes ==

By adding the following classes to your objects, they will look nicer in 3D:

* thickness: add a (3px) black thickness to your HTML element.

* roundthickness: (to be used with thickness) if your element is a circle, you should add roundthickness so your element thickness can be a circle too.

* whitethickness: (to be used with thickness) if you prefer to have a whitethickness instead of black.

* floatingabove: make your element "float" 10px above the surface, with a nice shadow.

* roundfloatingabove: (to be used with floatingabove) if your element is a circle, use roundfloatingabove in addition to floatingabove.

Note: if you found some generic CSS that may help some other developers for 3D enhancements, please send it to us so we can add it there.

== Setting the default point of view and enabling 3d by default ==

Your game may require to use 3D mode enabled by default and also with a certain custom default PoinOfView. You can achieve this setting in your constructor section of your game:

if (!dojo.hasClass("ebd-body", "mode_3d")) {
dojo.addClass("ebd-body", "mode_3d");
dojo.addClass("ebd-body", "enableTransitions");
$("globalaction_3d").innerHTML = "2D"; // controls the upper right button
this.control3dxaxis = 30; // rotation in degrees of x axis (it has a limit of 0 to 80 degrees in the frameword so users cannot turn it upsidedown)
this.control3dzaxis = 0; // rotation in degrees of z axis
this.control3dxpos = 100; // center of screen in pixels
this.control3dypos = 300; // center of screen in pixels
this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,
this.control3dmode3d = true ; // is the 3d enabled
$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";
}

3D

2017-07-07T15:19:27Z

Morgalad: /* Setting the default point of view and enabling 3d by default */

3D

2017-07-07T15:18:56Z

Morgalad:

3D

2017-06-22T15:44:43Z

Morgalad: /* Use Z axis */

2017-02-11T12:29:05Z

Morgalad: Created page with " == Dependency == At first, don't forget to add "ebg/counter" as a dependency: // in you game js define([ "dojo","dojo/_base/declare", "ebg/core/gamegui", ..."

== Dependency ==

At first, don't forget to add "ebg/counter" as a dependency:

// in you game js
define([
"dojo","dojo/_base/declare",
"ebg/core/gamegui",
"ebg/counter" /// <==== HERE
],

== updateCounters(counters) ==

Useful for updating game counters in the player panel (such as resources).
'counters' arg is an associative array [counter_name_value => [ 'counter_name' => counter_name_value, 'counter_value' => counter_value_value], ... ]
All counters must be referenced in this.gamedatas.counters and will be updated.
DOM objects referenced by 'counter_name' will have their innerHTML updated with 'counter_value'.

== Players panels ==

=== Adding stuff to player's panel ===

At first, create a new "JS template" string in your template (tpl) file:

(from Gomoku example)
<pre>
var jstpl_player_board = '\<div class="cp_board">\
<div id="stoneicon_p${id}" class="gmk_stoneicon gmk_stoneicon_${color}"></div><span id="stonecount_p${id}">0</span>\
</div>';
</pre>

Then, you add this piece of code in your JS file to add this template to each player panel:

<pre>
// Setting up player boards
for( var player_id in gamedatas.players )
{
var player = gamedatas.players[player_id];

// Setting up players boards if needed
var player_board_div = $('player_board_'+player_id);
dojo.place( this.format_block('jstpl_player_board', player ), player_board_div );
}
</pre>

(Note: the code above is of course from your "setup" function in your Javascript).

Very often, you have to distinguish current player and others players. In this case, you just have to create another JS template (ex: jstpl_otherplayer_board) and use it when "player_id" is different than "this.player_id".

Gamehelpincangold

2017-02-10T19:57:36Z

Morgalad:

Brief explanation of the game:

Players run 5 times a expedition into a temple (you reshuffle and draw a row of cards)

A card is drawn, could be gems or a hazard:

-gems are picked from the box, then split among the live players and the rest are left on the card (floor of the tunnel)

-then players vote secretly with a faced down card to explore or to return to the camp.

-the leavers may pick and split the gems left on the floor while returning to the camp, then their gems are safely stored in their tent (these gems cannot be lost now).

-There are 5 types of hazard cards and 3 copies of each: mummy, snakes, spiders... when the 2nd of a kind is drawn the remaining players on the temple drop the pouches with the gems they have collected in this run
and flee to the camp.

-The remaining players repeat this process until they decide to retreat or they are kicked off the temple by a hazard

Gamehelpincangold

2017-02-10T19:56:54Z

Morgalad: Created page with "Brief explanation of the game: Players run 5 times a expedition into a temple (you reshuffle and draw a row of cards) A card is drawn, could be gems or a hazard: -gems are p..."

Brief explanation of the game:

Players run 5 times a expedition into a temple (you reshuffle and draw a row of cards)

A card is drawn, could be gems or a hazard:
-gems are picked from the box, then split among the live players and the rest are left on the card (floor of the tunnel)
-then players vote secretly with a faced down card to explore or to return to the camp.
-the leavers may pick and split the gems left on the floor while returning to the camp, then their gems are safely stored in their tent (these gems cannot be lost now).
-There are 5 types of hazard cards and 3 copies of each: mummy, snakes, spiders... when the 2nd of a kind is drawn the remaining players on the temple drop the pouches with the gems they have collected in this run and flee to the camp.
-The remaining players repeat this process until they decide to retreat or they are kicked off the temple by a hazard