https://en.doc.boardgamearena.com/api.php?action=feedcontributions&feedformat=atom&user=FenadorukBoard Game Arena - User contributions [en]2026-11-06T22:13:01ZUser contributionsMediaWiki 1.43.11https://en.doc.boardgamearena.com/index.php?title=Gamehelpriviera&diff=31930Gamehelpriviera2026-10-20T22:43:25Z<p>Fenadoruk: </p>
<hr />
<div>== Goal ==<br />
Score 40 points over several rounds, or win instantly with a Grand Slam by playing all 10 cards from your hand in a single round.<br />
<br />
== Setup ==<br />
You get 10 cards and one Last Chance card, which you can use once per game. With 2 to 4 players, one colour is removed for the whole game, along with all its cards and its die.<br />
<br />
== A turn ==<br />
# '''Roll:''' all coloured dice are rolled.<br />
# '''Play a card:''' play one card from your hand that matches the dice in one of two ways:<br />
#* Same value and colour as one die.<br />
#* Value equal to the sum of two dice, and colour matching one of those two dice.<br />
# '''No valid card?''' You may use your Last Chance to skip the turn and stay in. Otherwise, you crash: you lose all your cards for the round and score 0.<br />
# '''Stop or More:'''<br />
#* '''Stop:''' bank the points on the cards in front of you and sit out the rest of the round.<br />
#* '''More:''' stay in for the next turn and keep pushing your luck.<br />
<br />
The round ends when every player has stopped or crashed. If you stopped, add your banked points to your score. If anyone reaches 40 points, the highest score wins, and ties share the victory.<br />
<br />
== Card powers ==<br />
''Optional, but you must still be in the round to use them.''<br />
<br />
* '''1:''' Immediately play one extra valid card, using the dice on the table. If you play another 1, you can use this power again.<br />
* '''2:''' On the next turn, the die of this card's colour is reserved for you. Opponents can't use it.<br />
* '''9:''' After the next roll, turn one die up or down by 1 (6 wraps to 1, and 1 wraps to 6).<br />
* '''10:''' Swap 2 cards from your hand with 2 random cards from an opponent's hand.<br />
* '''11:''' Add the golden die to the next roll for everyone. It can be part of a sum but never used alone.<br />
<br />
When several players use powers at the same step, they resolve clockwise from the Start token holder. The Start token passes clockwise every turn.<br />
<br />
== Differences from the physical game ==<br />
In the rulebook, players take their turns one after another, clockwise from the Start token holder. On BGA, this is simultaneous to make turn-based games faster:<br />
<br />
* '''Playing a card:''' You pick your card secretly while everyone else does the same, and all cards are revealed together. You won't see what others are playing that turn before you choose. For example, you won't know whether someone else is already playing an 11.<br />
* '''Card 1 bonus plays:''' If you played a 1, you pick your extra card at the same time as anyone else who played a 1, and those cards are also revealed together.<br />
* '''Stop or More:''' You decide at the same time as everyone else, and all choices are revealed together. You can't wait to see what others decide.<br />
* '''Grand Slam:''' Since cards are revealed together, two players could empty their hands on the same reveal. If that happens, they share the win.<br />
<br />
BGA also adds one option that isn’t in the physical game:<br />
<br />
* '''Reroll busting first-time rolls (on by default):''' On the first roll of each round, if any player has no playable card, the dice are rerolled automatically, up to 2 times. You only see the final roll. Turn this option off when creating a table to play exactly like the physical game.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpriviera&diff=31911Gamehelpriviera2026-10-19T12:23:23Z<p>Fenadoruk: </p>
<hr />
<div>== Goal ==<br />
Score 40 points over several rounds, or win instantly with a Grand Slam by playing all 10 cards from your hand in a single round.<br />
<br />
== Setup ==<br />
You get 10 cards and one Last Chance card, which you can use once per game. With 2 to 4 players, one colour is removed for the whole game, along with all its cards and its die.<br />
<br />
== A turn ==<br />
# '''Roll:''' all coloured dice are rolled.<br />
# '''Play a card:''' play one card from your hand that matches the dice in one of two ways:<br />
#* Same value and colour as one die.<br />
#* Value equal to the sum of two dice, and colour matching one of those two dice.<br />
# '''No valid card?''' You may use your Last Chance to skip the turn and stay in. Otherwise, you crash: you lose all your cards for the round and score 0.<br />
# '''Stop or More:'''<br />
#* '''Stop:''' bank the points on the cards in front of you and sit out the rest of the round.<br />
#* '''More:''' stay in for the next turn and keep pushing your luck.<br />
<br />
The round ends when every player has stopped or crashed. If you stopped, add your banked points to your score. If anyone reaches 40 points, the highest score wins, and ties share the victory.<br />
<br />
== Card powers ==<br />
''Optional, but you must still be in the round to use them.''<br />
<br />
* '''1:''' Immediately play one extra valid card, using the dice on the table. If you play another 1, you can use this power again.<br />
* '''2:''' On the next turn, the die of this card's colour is reserved for you. Opponents can't use it.<br />
* '''9:''' After the next roll, turn one die up or down by 1 (6 wraps to 1, and 1 wraps to 6).<br />
* '''10:''' Swap 2 cards from your hand with 2 random cards from an opponent's hand.<br />
* '''11:''' Add the golden die to the next roll for everyone. It can be part of a sum but never used alone.<br />
<br />
When several players use powers at the same step, they resolve clockwise from the Start token holder. The Start token passes clockwise every turn.<br />
<br />
== Differences from the physical game ==<br />
In the rulebook, players take their turns one after another, clockwise from the Start token holder. On BGA, this is simultaneous to make turn-based games faster:<br />
<br />
* '''Playing a card:''' You pick your card secretly while everyone else does the same, and all cards are revealed together. You won't see what others are playing that turn before you choose. For example, you won't know whether someone else is already playing an 11.<br />
* '''Card 1 bonus plays:''' If you played a 1, you pick your extra card at the same time as anyone else who played a 1, and those cards are also revealed together.<br />
* '''Stop or More:''' You decide at the same time as everyone else, and all choices are revealed together. You can't wait to see what others decide.<br />
* '''Grand Slam:''' Since cards are revealed together, two players could empty their hands on the same reveal. If that happens, they share the win.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpriviera&diff=31903Gamehelpriviera2026-10-17T07:24:54Z<p>Fenadoruk: Created page with "== Goal == Score 40 points over several rounds, or win instantly with a Grand Slam by playing all 10 cards from your hand in a single round. == Setup == You get 10 cards and one Last Chance card, which you can use once per game. With 2 to 4 players, one colour is removed for the whole game, along with all its cards and its die. == A turn == # '''Roll:''' all coloured dice are rolled. # '''Play a card:''' play one card from your hand that matches the dice in one of two..."</p>
<hr />
<div>== Goal ==<br />
Score 40 points over several rounds, or win instantly with a Grand Slam by playing all 10 cards from your hand in a single round.<br />
<br />
== Setup ==<br />
You get 10 cards and one Last Chance card, which you can use once per game. With 2 to 4 players, one colour is removed for the whole game, along with all its cards and its die.<br />
<br />
== A turn ==<br />
# '''Roll:''' all coloured dice are rolled.<br />
# '''Play a card:''' play one card from your hand that matches the dice in one of two ways:<br />
#* Same value and colour as one die.<br />
#* Value equal to the sum of two dice, and colour matching one of those two dice.<br />
# '''No valid card?''' You may use your Last Chance to skip the turn and stay in. Otherwise, you crash: you lose all your cards for the round and score 0.<br />
# '''Stop or More:'''<br />
#* '''Stop:''' bank the points on the cards in front of you and sit out the rest of the round.<br />
#* '''More:''' stay in for the next turn and keep pushing your luck.<br />
<br />
The round ends when every player has stopped or crashed. If you stopped, add your banked points to your score. If anyone reaches 40 points, the highest score wins, and ties share the victory.<br />
<br />
== Card powers ==<br />
''Optional, but you must still be in the round to use them.''<br />
<br />
* '''1:''' Immediately play one extra valid card, using the dice on the table. If you play another 1, you can use this power again.<br />
* '''2:''' On the next turn, the die of this card's colour is reserved for you. Opponents can't use it.<br />
* '''9:''' After the next roll, turn one die up or down by 1 (6 wraps to 1, and 1 wraps to 6).<br />
* '''10:''' Swap 2 cards from your hand with 2 random cards from an opponent's hand.<br />
* '''11:''' Add the golden die to the next roll for everyone. It can be part of a sum but never used alone.<br />
<br />
When several players use powers at the same step, they resolve clockwise from the Start token holder. The Start token passes clockwise every turn.<br />
<br />
== Differences from the physical game ==<br />
In the rulebook, players take their turns one after another, clockwise from the Start token holder. On BGA, this is simultaneous to make turn-based games faster:<br />
<br />
* '''Playing a card:''' You pick your card secretly while everyone else does the same, and all cards are revealed together. You won't see what others are playing that turn before you choose. For example, you won't know whether someone else is already playing an 11.<br />
* '''Card 1 bonus plays:''' If you played a 1, you pick your extra card at the same time as anyone else who played a 1, and those cards are also revealed together.<br />
* '''Card 2:''' Multiple players can reserve the same die. If so, that die is reserved for all of them.<br />
* '''Stop or More:''' You decide at the same time as everyone else, and all choices are revealed together. You can't wait to see what others decide.<br />
* '''Grand Slam:''' Since cards are revealed together, two players could empty their hands on the same reveal. If that happens, they share the win.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=BGA_Studio_Cookbook&diff=26457BGA Studio Cookbook2025-09-11T16:14:22Z<p>Fenadoruk: /* Animation */</p>
<hr />
<div><br />
<br />
This page is a cookbook of design and implementation recipes for BGA Studio framework.<br />
For tooling and usage recipes see [[Tools and tips of BGA Studio]].<br />
If you have your own recipes feel free to edit this page.<br />
<br />
__TOC__<br />
<br />
== Visual Effects, Layout and Animation ==<br />
<br />
=== DOM manipulatons ===<br />
<br />
==== Create pieces dynamically (using template) ====<br />
<br />
'''Ingredients:''' ggg_ggg.tpl, ggg.js<br />
<br />
Note: this method is recommended by BGA guildlines<br />
<br />
Declared js template with variables in .tpl file, like this<br />
<pre><br />
<script type="text/javascript"><br />
// Javascript HTML templates<br />
var jstpl_ipiece = '<div class="${type} ${type}_${color} inlineblock" aria-label="${name}" title="${name}"></div>';<br />
</script><br />
</pre><br />
<br />
Use it like this in .js file<br />
div = this.format_block('jstpl_ipiece', {<br />
type : 'meeple',<br />
color : 'ff0000',<br />
name : 'Bob',<br />
});<br />
<br />
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.<br />
<br />
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<br />
it is good to strive for it.<br />
Note: you can also use string concatenation, its less readable. You can also use dojo dom object creation api's but its brutally verbose and its more unreadable.<br />
<br />
<br />
==== Create pieces dynamically (using string concatenation) ====<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
<br />
<pre><br />
div = "<div class='meeple_"+color+"'></div>";<br />
</pre><br />
<br />
or modern way<br />
<br />
<pre><br />
div = `<div class='meeple_${color}'></div>`;<br />
</pre><br />
<br />
==== Create all pieces statically ====<br />
<br />
'''Ingredients:''' ggg_ggg.tpl, ggg.css, ggg.view.php (optional) <br />
<br />
* Create ALL game pieces in html template (.tpl)<br />
* ALL pieces should have unique id, and it should be meaningful, i.e. meeple_red_1<br />
* Do not use inline styling<br />
* Id of player's specific pieces should use some sort of 'color' identification, since player id cannot be used in static layout, you can use english color name, hex 6 char value, or color "number" (1,2,3...)<br />
* 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 "first" meeples<br />
<br />
ggg.tpl:<br />
<pre> <br />
<div id="home_red" class="home_red home"><br />
<div id="meeple_red_1" class="meeple red n1"></div><br />
<div id="meeple_red_2" class="meeple red n2"></div><br />
</div><br />
</pre><br />
<br />
ggg.css:<br />
<br />
<pre><br />
.meeple {<br />
width: 32px;<br />
height: 39px;<br />
background-image: url(img/78_64_stand_meeples.png);<br />
background-size: 352px;<br />
}<br />
<br />
.meeple.red {<br />
background-position: 30% 0%;<br />
}<br />
</pre><br />
<br />
* There should be straight forward mapping between server id and js id (or 1:1)<br />
* You place objects in different zones of the layout, and setup css to take care of layout<br />
<br />
<pre><br />
.home .meeple{<br />
display: inline-block;<br />
}<br />
</pre><br />
* If you need to have a temporary object that look like original you can use dojo.clone (and change id to some temp id)<br />
* 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<br />
<br />
Note:<br />
* If you use this model you cannot use premade js components such as Stock and Zone<br />
* You have to use alternative methods of animation (slightly altered) since default method will leave object with inline style attributes which you don't need<br />
<br />
==== Use player color in template ====<br />
<br />
NOTE: view.php is deprecated, its best to generate html from .js<br />
<br />
'''Ingredients:''' ggg_ggg.tpl, ggg.view.php<br />
<br />
.view.php:<br />
<pre><br />
function build_page($viewArgs) {<br />
// Get players & players number<br />
$players = $this->game->loadPlayersBasicInfos();<br />
$players_nbr = count($players);<br />
/**<br />
* ********* Place your code below: ***********<br />
*/<br />
<br />
// Set PCOLOR to the current player color hex<br />
$cplayer = $this->getCurrentPlayerId();<br />
if (array_key_exists($cplayer, $players)) { // may be not set if spectator<br />
$player_color = $players [$cplayer] ['player_color'];<br />
} else {<br />
$player_color = 'ffffff'; // spectator<br />
}<br />
$this->tpl ['PCOLOR'] = $player_color;<br />
</pre><br />
<br />
=== Status bar ===<br />
<br />
==== Changing state prompt ====<br />
<br />
State prompt is message displayed for player which usually comes from state description.<br />
Sometimes you want to change it without changing state (one way is change state but locally, see client states above).<br />
<br />
Simple way just change the html<br />
<pre><br />
setMainTitle: function(text) {<br />
$('pagemaintitletext').innerHTML = text;<br />
},<br />
// usage<br />
onMeeple: function(event) {<br />
//... <br />
this.setMainTitle(_('You must select where meeple is going'));<br />
},<br />
</pre><br />
<br />
This however will not work with parameters and will not draw You in color, if you want this its more sophisticated:<br />
<br />
<pre><br />
setDescriptionOnMyTurn : function(text) {<br />
this.gamedatas.gamestate.descriptionmyturn = text;<br />
var tpl = dojo.clone(this.gamedatas.gamestate.args);<br />
if (tpl === null) {<br />
tpl = {};<br />
}<br />
var title = "";<br />
if (this.isCurrentPlayerActive() && text !== null) {<br />
tpl.you = this.divYou(); <br />
}<br />
title = this.format_string_recursive(text, tpl);<br />
<br />
if (!title) {<br />
this.setMainTitle("&nbsp;");<br />
} else {<br />
this.setMainTitle(title);<br />
}<br />
},<br />
</pre><br />
<br />
Note: this method uses '''setMainTitle''' defined above and '''divYou''' defined in another section of this wiki.<br />
<br />
<br />
<br />
=== Animation ===<br />
<br />
==== Attach to new parent without destroying the object ====<br />
<br />
BGA function attachToNewParent for some reason destroys the original, if you want similar function that does not you can use this<br />
ggg.js<br />
<br />
<pre><br />
/**<br />
* This method will attach mobile to a new_parent without destroying, unlike original attachToNewParent which destroys mobile and<br />
* all its connectors (onClick, etc)<br />
*/<br />
attachToNewParentNoDestroy: function (mobile_in, new_parent_in, relation, place_position) {<br />
<br />
const mobile = $(mobile_in);<br />
const new_parent = $(new_parent_in);<br />
<br />
var src = dojo.position(mobile);<br />
if (place_position)<br />
mobile.style.position = place_position;<br />
dojo.place(mobile, new_parent, relation);<br />
mobile.offsetTop;//force re-flow<br />
var tgt = dojo.position(mobile);<br />
var box = dojo.marginBox(mobile);<br />
var cbox = dojo.contentBox(mobile);<br />
var left = box.l + src.x - tgt.x;<br />
var top = box.t + src.y - tgt.y;<br />
<br />
mobile.style.position = "absolute";<br />
mobile.style.left = left + "px";<br />
mobile.style.top = top + "px";<br />
box.l += box.w - cbox.w;<br />
box.t += box.h - cbox.h;<br />
mobile.offsetTop;//force re-flow<br />
return box;<br />
},<br />
</pre><br />
<br />
==== Animation on oversurface ====<br />
If you use non-absolute position for your game elements (i.e you use layouts) - you cannot really use BGA animation functions. After years of fidding with different options I use<br />
techique which I call animation on oversurface that works when parents use different zoom, rotation, etc<br />
<br />
* You need another layer on top of everything - oversurface<br />
* We create copy of the object on oversurface - to move<br />
* We move the real object on final position - but make it invisible for now<br />
* We move the phantom to final position applying required zoom and rotation (using css animation), then destroy it<br />
* When animation is done we make original object visible in new position<br />
<br />
The code is bit complex it can be found here<br />
<br />
https://codepen.io/VictoriaLa/pen/gORvdJo<br />
<br />
Game using it: century, ultimaterailroads<br />
<br />
==== Scroll element into view ====<br />
Ingredients: game.js<br />
<br />
This function will scroll given node (div) into view and respect replays and archive mode<br />
<br />
<pre><br />
scrollIntoViewAfter: function (node, delay) {<br />
if (this.instantaneousMode || this.inSetup) {<br />
return;<br />
}<br />
if (typeof g_replayFrom != "undefined") {<br />
$(node).scrollIntoView();<br />
return;<br />
}<br />
if (!delay) delay = 0;<br />
setTimeout(() => {<br />
$(node).scrollIntoView({ behavior: "smooth", block: "center" });<br />
}, delay);<br />
},<br />
</pre><br />
<br />
==== Set Auto-click timer for buttons (setAutoClick) ====<br />
<br />
Sets up auto-click for a button after a timeout, with the new progress-bar animation. Works in both JS and TS. You can pass the optional parameters (see code comments) or simply call as:<br />
<pre>this.setAutoClick(document.getElementById('someID');</pre><br />
<br />
<b>JavaScript</b><br />
<pre><br />
/**<br />
* Sets up auto-click functionality for a button after a timeout period<br />
* @param button - The button HTML element to auto-click<br />
* @param timeoutDuration - Optional base duration in ms before auto-click occurs (default: 5000)<br />
* @param randomIncrement - Optional random additional ms to add to timeout (default: 2000)<br />
* @param autoClickID - Optional ID for the auto-click events, multiple buttons can therefore point to the same autoClick event<br />
* @param onAnimationEnd - Optional callback that returns boolean to control if click should occur (default: true)<br />
*/<br />
setAutoClick: function(button, timeoutDuration = 5000, randomIncrement = 2000, autoClickID = null, onAnimationEnd = () => true) {<br />
const totalDuration = timeoutDuration + Math.random() * randomIncrement;<br />
this.setAutoClick.timeouts = this.setAutoClick.timeouts || {};<br />
<br />
if(!autoClickID){<br />
this.setAutoClick.autoClickIncrement = this.setAutoClick.autoClickIncrement || 1;<br />
autoClickID = 'auto-click-' + this.setAutoClick.autoClickIncrement++;<br />
}<br />
this.setAutoClick.timeouts[autoClickID] = this.setAutoClick.timeouts[autoClickID] || [];<br />
<br />
button.style.setProperty('--bga-autoclick-timeout-duration', `${totalDuration}ms`);<br />
button.classList.add('bga-autoclick-button');<br />
<br />
const stopDoubleTrigger = () => {<br />
if(!this.setAutoClick.timeouts[autoClickID]) return;<br />
this.setAutoClick.timeouts[autoClickID].forEach(timeout => clearTimeout(timeout));<br />
delete this.setAutoClick.timeouts[autoClickID];<br />
}<br />
button.addEventListener('click', stopDoubleTrigger, true);<br />
<br />
this.setAutoClick.timeouts[autoClickID].push(<br />
setTimeout(() => {<br />
stopDoubleTrigger();<br />
if (!document.body.contains(button)) return;<br />
const customEventResult = onAnimationEnd();<br />
if (customEventResult) button.click();<br />
}, totalDuration)<br />
);<br />
},<br />
</pre><br />
<br />
<b>TypeScript</b><br />
<pre><br />
/**<br />
* Sets up auto-click functionality for a button after a timeout period<br />
* @param button - The button HTML element to auto-click<br />
* @param timeoutDuration - Optional base duration in ms before auto-click occurs (default: 5000)<br />
* @param randomIncrement - Optional random additional ms to add to timeout (default: 2000)<br />
* @param autoClickID - Optional ID for the auto-click events, multiple buttons can therefore point to the same autoClick event<br />
* @param onAnimationEnd - Optional callback that returns boolean to control if click should occur (default: true)<br />
*/<br />
public setAutoClick(button: HTMLDivElement, timeoutDuration: number = 5000, randomIncrement: number = 2000, autoClickID: string = null, onAnimationEnd: () => boolean = () => true){<br />
const fn = this.setAutoClick as typeof this.setAutoClick & {<br />
timeouts?: Record<string, number[]>;<br />
autoClickIncrement?: number;<br />
};<br />
fn.timeouts = fn.timeouts || {};<br />
<br />
const totalDuration = timeoutDuration + Math.random() * randomIncrement;<br />
<br />
if(!autoClickID){<br />
fn.autoClickIncrement = fn.autoClickIncrement || 1;<br />
autoClickID = 'auto-click-' + fn.autoClickIncrement++;<br />
}<br />
<br />
fn.timeouts[autoClickID] = fn.timeouts[autoClickID] || [];<br />
<br />
button.style.setProperty('--bga-autoclick-timeout-duration', `${totalDuration}ms`);<br />
button.classList.add('bga-autoclick-button');<br />
<br />
const stopDoubleTrigger = () => {<br />
if(!fn.timeouts[autoClickID]) return;<br />
fn.timeouts[autoClickID].forEach(timeout => clearTimeout(timeout));<br />
delete fn.timeouts[autoClickID];<br />
}<br />
button.addEventListener('click', stopDoubleTrigger, true);<br />
<br />
fn.timeouts[autoClickID].push(<br />
setTimeout(() => {<br />
stopDoubleTrigger();<br />
if (!document.body.contains(button)) return;<br />
const customEventResult = onAnimationEnd();<br />
if (customEventResult) button.click();<br />
}, totalDuration)<br />
);<br />
}<br />
</pre><br />
<br />
=== Logs ===<br />
<br />
==== Inject icon images in the log ====<br />
<br />
Here is an example of what was done for Terra Mystica which is simple and straightforward:<br />
<br />
<pre><br />
//Define the proper message<br />
$message = clienttranslate('${player_name} gets ${power_income} via Structures');<br />
if ($price > 0) {<br />
$this->DbQuery("UPDATE player SET player_score = player_score - $price WHERE player_id = $player_id");<br />
$message = clienttranslate('${player_name} pays ${vp_price} and gets ${power_income} via Structures');<br />
}<br />
<br />
// Notify<br />
$this->notify->all( "powerViaStructures", $message, array(<br />
'i18n' => array( ),<br />
'player_id' => $player_id,<br />
'player_name' => $this->getUniqueValueFromDb( "SELECT player_name FROM player WHERE player_id = $player_id" ),<br />
'power_tokens' => $power_tokens,<br />
'vp_price' => $this->getLogsVPAmount($price),<br />
'power_income' => $this->getLogsPowerAmount($power_income),<br />
'newScore' => $this->getUniqueValueFromDb( "SELECT player_score FROM player WHERE player_id = $player_id" ),<br />
'counters' => $this->getGameCounters(null),<br />
) );<br />
</pre><br />
<br />
With some functions to have the needed html added inside the substitution variable, such as:<br />
<br />
<pre><br />
function getLogsPowerAmount( $amount ) {<br />
return "<div class='tmlogs_icon' title='Power'><div class='power_amount'>$amount</div></div>";<br />
}<br />
</pre><br />
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.<br />
<br />
==== Inject images and styled html in the log ====<br />
<br />
{{InfoBox|title=Warning — Translation|maxWidth=500|color=#c00|body='''In order to prevent interference with the translation process, keep in mind that you must only apply modifications to the args object, and not try to substitute the keys (the <code>${player_name}</code> parts of your string) in the log string.'''}}<br />
<br />
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). <br />
<br />
This is a bad idea for many reasons:<br />
<br />
* It's bad architecture. ui elements leak into the server, and now you have to manage the ui in multiple places.<br />
* 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.<br />
* 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.)<br />
* It's more data to transfer and store in the db.<br />
* It's a nightmare for translators.<br />
<br />
So what else can you do? You can use client side log injection to intercept log arguments (which come from the server) and replace them with html on the client side. Here are three different method you can use to achieve this.<br />
<br />
===== Define <code>this.bgaFormatText()</code> method =====<br />
<br />
'''Ingredients:''' ggg.js, ggg.game.php<br />
<br />
I use this recipe for '''client side log injection''' to intercept log arguments (which come from the server) and replace them with html on the client side.<br />
<br />
[[File:clientloginjection.png|left]] <br />
<br />
ggg.js<br />
<br />
<pre> <br />
<br />
/** Declare this function to inject html into log items. */<br />
<br />
bgaFormatText : function(log, args) {<br />
try {<br />
if (log && args && !args.processed) {<br />
args.processed = true;<br />
<br />
<br />
// list of special keys we want to replace with images<br />
const keys = ['place_name','token_name'];<br />
<br />
<br />
for (let i in keys) {<br />
const key = keys[i];<br />
if (args[key]) args[key] = this.getTokenDiv(key, args); <br />
<br />
}<br />
}<br />
} catch (e) {<br />
console.error(log,args,"Exception thrown", e.stack);<br />
}<br />
return { log, args };<br />
},<br />
</pre><br />
<br />
<br />
'''Important:''' In the ''bgaFormatText'' method, the 'args' parameter will only contain arguments passed to it from the notify method in Game.php (see below).<br />
<br />
The 'log' parameter is the actual string that is inserted into the logs. You can perform additional js string manipulation on it.<br />
<br />
<br />
<pre><br />
getTokenDiv : function(key, args) {<br />
// ... implement whatever html you want here, example from sharedcode.js<br />
var token_id = args[key];<br />
var item_type = getPart(token_id,0);<br />
var logid = "log" + (this.globalid++) + "_" + token_id;<br />
switch (item_type) {<br />
case 'wcube':<br />
var tokenDiv = this.format_block('jstpl_resource_log', {<br />
"id" : logid,<br />
"type" : "wcube",<br />
"color" : getPart(token_id,1),<br />
});<br />
return tokenDiv;<br />
<br />
case 'meeple':<br />
if ($(token_id)) {<br />
var clone = dojo.clone($(token_id));<br />
<br />
dojo.attr(clone, "id", logid);<br />
this.stripPosition(clone);<br />
dojo.addClass(clone, "logitem");<br />
return clone.outerHTML;<br />
}<br />
break;<br />
<br />
default:<br />
break;<br />
}<br />
<br />
return "'" + this.clienttranslate_string(this.getTokenName(token_id)) + "'";<br />
},<br />
getTokenName : function(key) {<br />
return this.gamedatas.token_types[key].name; // get name for the key, from static table for example<br />
},<br />
</pre><br />
<br />
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.<br />
<br />
<br />
Game.php:<br />
<br />
$this->notify->all('playerLog', clienttranslate('Game moves ${token_name}'), ['token_name'=>$token_id]);<br />
<br />
'''Important:''' As noted above, only arguments actually passed by this method are available to the args parameter received in the client-side ''bgaFormatText'' method.<br />
<br />
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:<br />
<br />
$this->notify->all('tokenPlaced', clienttranslate('Player placed ${token_name}'), array(<br />
'token_name' => $token_id,<br />
'zone_played' => $zone);<br />
<br />
This will output "Player placed ${token_name}" in the log, and if we subscribe to a notification method activated by the "tokenPlaced" event in the client-side code, that method can make use of the 'zone_played' argument. <br />
<br />
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,<br />
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 "hitstorical_log" 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:<br />
<br />
<pre><br />
$this->notify->all('tokenPlaced', clienttranslate('Player placed ${token_name}'), array(<br />
'token_name' => $token_id,<br />
'zone_played' => $zone,<br />
'preserve' => [ 'zone_played' ]<br />
);<br />
</pre><br />
<br />
Now you can use zone_played in bgaFormatText even in historical logs.<br />
<br />
===== Use <code>:formatFunction</code> option provided by <code>dojo.string.substitute</code> =====<br />
<br />
'''Ingredients:''' ggg.js, ggg.game.php, ggg_ggg.tpl, ggg.css<br />
<br />
The above method will work in most of the cases, but if you use dotted keys such as <code>${card.name}</code> (which is supported by the framework, for private state args), the key won't be substituted because the <code>key in arg</code> test will fail. If so you need to rely either on this way, or the one after.<br />
<br />
'''WARNING:''' using this method on an already advanced project will require you to go through all your notifications to change keys !<br />
<br />
Under the hood, the '''this.format_string_recursive()''' function calls the '''dojo.string.substitute''' method which substitutes <code>${keys}</code> with the value provided. If you take a look at the [https://dojotoolkit.org/reference-guide/1.7/dojo/string.html#substitute documentation] and [https://github.com/dojo/dojo/blob/c3ceb017cfa25b703f5662dc83d1c8aae9bc5d81/string.js#L163 source code] you can notice that the key can be suffixed with a colon (<code>:</code>) followed by a function name. This will allow you to specify directly in the substitution string which keys need HTML injection.<br />
<br />
First of all, you need to define your formatting function in the ggg.js file:<br />
<pre><br />
[[ggg.js]]<br />
getTokenDiv : function(value, key) {<br />
//This is only an example implementation, you need to write your own.<br />
//The method should return HTML code<br />
switch (key) {<br />
case 'html_injected_argument1':<br />
return this.format_block('jstpl_HTMLLogElement1',{value: value});<br />
case 'html_injected_argument2':<br />
return this.format_block('jstpl_HTMLLogElement2',{value: value});<br />
...<br />
}<br />
}<br />
</pre><br />
<br />
Obviously you need to define the appropriate templates in the ggg_ggg.tpl file:<br />
<pre><br />
[[ggg_ggg.tpl]]<br />
let jstpl_HTMLLogElement1 = '<div class="log-element log-element-1-${value}"></div>';<br />
let jstpl_HTMLLogElement2 = '<div class="log-element log-element-2-${value}"></div>';<br />
...<br />
</pre><br />
And the appropriate classes in ggg.css.<br />
<br />
Then you need to add the <code>dojo/aspect</code> module at the top of the ggg.js file:<br />
<br />
<nowiki>[[ggg.js]]</nowiki><br />
define([<br />
"dojo", "dojo/_base/declare",<br />
'''<span style="color:green;">"dojo/aspect",</span> //MUST BE IN THIRD POSITION''' (see [[#Including your own JavaScript module (II)|below]])<br />
"ebg/core/gamegui",<br />
"ebg/counter",<br />
], function (dojo, declare, <span style="color:green;">'''aspect'''</span>) {<br />
...<br />
<br />
And you also need to add the following code in your <code>contructor</code> method in the ggg.js:<br />
<br />
<nowiki>[[ggg.js]]</nowiki><br />
constructor: function(){<br />
<br />
// ... skipped code ...<br />
let gameObject = this; //Needed as the this object in aspect.before will not refer to the game object in which the formatting function resides<br />
aspect.before(dojo.string, "substitute", function(template, map, transform) { //This allows you to modify the arguments of the dojo.string.substitute method before they're actually passed to it<br />
return [template, map, transform, gameObject];<br />
});<br />
<br />
Now you're all set to inject HTML in your logs. To actually achieve this, you must specify the function name with the key like so:<br />
<br />
<nowiki>[[ggg.game.php]]</nowiki><br />
$this->notify->all("notificationName", clienttranslate("This log message contains ${plainTextArgument} and the following will receive HTML injection: ${html_injected_argument1:getTokenDiv}"), [<br />
"plainTextArgument" => "some plain text here",<br />
"html_injected_argument1" => "some value used by getTokenDiv",<br />
]);<br />
<br />
You're not limited writing only one function, you can write as many functions as you like, and have them each inject a specific type of HTML. You just need to specify the relevant function name after the column in the substitution key.<br />
<br />
===== Use <code>transform</code> argument of <code>dojo.string.substitute</code> =====<br />
<br />
'''Ingredients:''' ggg.js, ggg.game.php, ggg_ggg.tpl, ggg.css<br />
<br />
This method is also relying on the use of <code>dojo.string.substitute</code> by the framework, and will use the <code>transform</code> argument, which, accordting to [https://github.com/dojo/dojo/blob/c3ceb017cfa25b703f5662dc83d1c8aae9bc5d81/string.js#L163 source code] and [https://dojotoolkit.org/reference-guide/1.7/dojo/string.html#substitute documentation] will be run on all the messages going through dojo.string.substitute.<br />
<br />
'''WARNING:''' This method will be applied to all strings that go through dojo.string.substitute. As such you must take extra care not to substitute keys that may be used by the framework (i.e. ${id}). In order to do so, a good practise would be to prefix all keys that need substitution with a trigram of the game name.<br />
<br />
Since all the keys will be fed to the tranform function, by default, it must return the value, substituted or not per your needs. You can define the function like this in the ggg.js file:<br />
<br />
<nowiki>[[ggg.js]]</nowiki><br />
getTokenDiv : function(value, key) {<br />
//This is only an example implementation, you need to write your own.<br />
//The method should return HTML code<br />
switch (key) {<br />
case 'html_injected_argument1':<br />
return this.format_block('jstpl_HTMLLogElement1',{value: value});<br />
case 'html_injected_argument2':<br />
return this.format_block('jstpl_HTMLLogElement2',{value: value});<br />
...<br />
default:<br />
return value; //Needed otherwise regular strings won't appear since since the value isn't returned by the function<br />
}<br />
}<br />
<br />
The templates must be defined in the ggg_ggg.tpl file and the corresponding CSS classes in the ggg.css file.<br />
<br />
You need to add the following code at the beginning of the ggg.js file:<br />
<nowiki>[[ggg.js]]</nowiki><br />
define([<br />
"dojo", "dojo/_base/declare",<br />
'''<span style="color:green;">"dojo/aspect",</span> //MUST BE IN THIRD POSITION''' (see [[#Including your own JavaScript module (II)|below]])<br />
"ebg/core/gamegui",<br />
"ebg/counter",<br />
], function (dojo, declare, <span style="color:green;">'''aspect'''</span>) {<br />
...<br />
And the following code to the <code>constructor</code> method in ggg.js:<br />
<nowiki>[[ggg.js]]</nowiki><br />
constructor: function(){<br />
// ... skipped code ...<br />
let transformFunction = dojo.hitch(this, "getTokenDiv"); //Needed as the this object in aspect.before will not refer to the game object in which the formatting function resides<br />
aspect.before(dojo.string, "substitute", function(template, map, transform) {<br />
if (undefined === transform) { //Check for a transform function presence, just in case<br />
return [template, map, transformFunction];<br />
}<br />
});<br />
Then you're all set for log injection, no need to change anything on the PHP side.<br />
<br />
==== Processing logs on re-loading ====<br />
<br />
You rarely need to process logs when reloading, but if you want to do something fancy you may have to do it after logs are loaded. <br />
Logs are loaded asyncronously so you have to listen for logs to be fully loaded.<br />
Unfortunately there is no direct way of doing it so this is the hack.<br />
<br />
'''Hack alert''' - this extends undocumented function and may be broken when framework is updated<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
<pre><br />
/*<br />
* [Undocumented] Override BGA framework functions to call onLoadingLogsComplete when loading is done<br />
@Override<br />
*/<br />
setLoader: function(image_progress, logs_progress) {<br />
this.inherited(arguments); // required, this is "super()" call, do not remove<br />
//console.log("loader", image_progress, logs_progress)<br />
if (!this.isLoadingLogsComplete && logs_progress >= 100) {<br />
this.isLoadingLogsComplete = true; // this is to prevent from calling this more then once<br />
this.onLoadingLogsComplete();<br />
}<br />
},<br />
<br />
onLoadingLogsComplete: function() {<br />
console.log('Loading logs complete');<br />
// do something here<br />
},<br />
</pre><br />
<br />
====Overriding format_string_recursive to inject HTML into log, including adding tooltips to log====<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
I'm using cards as an example but this will work with any type of resource or game element. The first step is to override format_string_recursive. You can find info about this in this [https://bga-devs.github.io/blog/posts/translations-summary/ excellent guide]. We will replace the return line from the guide with this:<br />
return this.logInject(text);<br />
The purpose of logInject() is to catch pre-coded text from your notifications, siphon out the meaningful info so that you can manipulate it on the front end, and then replace that pre-coded text in the log with whatever html you desire, as well as adding a tooltip to the element you're injecting. Here is a simplified version of logInject():<br />
logInject: function (log_entry) {<br />
const card_regex = /\[\w+-*\w* *\w*\(\d+\)\]/g; // this will catch a card name in the log formatted like so: [card_name(card_type_arg)] -You may need to adjust the regex to catch your card names<br />
const cards_to_replace = log_entry.matchAll(card_regex);<br />
for (let card of cards_to_replace) {<br />
const match = card[0];<br />
const left_parenthesis = match.indexOf('(');<br />
const card_type_arg = match.slice(left_parenthesis+1, match.length-2);<br />
const card_span = this.getHTMLForLog(card_type_arg, 'card');<br />
log_entry = log_entry.replace(match, card_span);<br />
}<br />
return log_entry;<br />
}<br />
getHTMLForLog() takes the card_type_arg and uses it to create the <nowiki><span> to be injected into the log that you can then attach a tooltip to:</nowiki><br />
getHTMLForLog: function (item, type) { // in this example, item refers to the card_type_arg<br />
switch(type) {<br />
case 'card':<br />
this.log_span_num++; // adds a unique num to the span id so that duplicate card names in the log have unique ids<br />
const card_name = this.gamedatas['cards'][item]['description']; // or wherever you store your translated card name<br />
const item_type = 'card_tt';<br />
return `<nowiki><span id="${this.log_span_num}_item_${item}" class="${item_type} item_tooltip">${card_name}</span></nowiki>`;<br />
}<br />
}<br />
If you only want to add some HTML to your log and don't care about the tooltips, you can remove the item_tooltip class from the above and stop here. If you want tooltips, you'll need a function to add them:<br />
addTooltipsToLog: function() {<br />
<nowiki> </nowiki> const item_elements = dojo.query('.item_tooltip:not(.tt_processed)');<br />
<nowiki> </nowiki> Array.from(item_elements).forEach(ele => {<br />
<nowiki> </nowiki> const ele_id = ele.id;<br />
<nowiki> </nowiki> ele.classList.add('tt_processed'); // prevents tooltips being re-added to previous log entries<br />
<nowiki> </nowiki> if (ele.classList.contains('card_tt')) {<br />
<nowiki> </nowiki> const card_type_arg = ele_id.slice(-3).replace(/^\D+/g, <nowiki>''</nowiki>); // extracts the card_type_arg from the span id<br />
<nowiki> </nowiki> this.cardTooltip(ele_id, card_type_arg)<br />
<nowiki> </nowiki> }<br />
<nowiki> </nowiki> });<br />
}<br />
cardTooltip() is just however you want to create and add your tooltip. Mine is below:<br />
cardTooltip: function (ele, card_type_arg) {<br />
const card = this.gamedatas.cards[card_type_arg];<br />
const bg_pos = card['x_y'];<br />
const skill = dojo.string.substitute("${skill}", { skill: card['skill'] });<br />
const description = dojo.string.substitute("${description}", { description: card['description'] });<br />
const html = `<nowiki><div style="margin-bottom: 5px; display: inline;"><strong>${description}</strong></nowiki><nowiki></div></nowiki><br />
<nowiki><span style="font-size: 10px; margin-left: 5px;">${skill}</span></nowiki><br />
<nowiki><div class="asset asset_tt" style="background-position: -${bg_pos[0]}% -${bg_pos[1]}%; margin-bottom: 5px;"></div></nowiki>`;<br />
this.addTooltipHTML(ele, html, 1000);<br />
}<br />
And finally, you need to connect addTooltipsToLog to the notifqueue so it is called whenever the log is updated. This is in my JS setup:<br />
dojo.connect(this.notifqueue, 'addToLog', () => {<br />
this.addTooltipsToLog();<br />
});<br />
You can expand this to cover multiple types of tooltips. For example, I have it set up for cards: formatted in log as [card_name(card_type_arg)], hexes: formatted as {pitch_name(pitch_type_arg)}, objectives: formatted as ==objective_name(objective_type_arg)==, etc.<br />
<br />
===Player Panel===<br />
<br />
====Inserting non-player panel====<br />
'''This should be avoided. The new guideline is to avoid it in new games and remove it from old games.'''<br />
<br />
'''Ingredients:''' ggg.js, ggg_ggg.tpl<br />
<br />
If you want to insert non-player panel on the right side (for example to hold extra preferences, zooming controls, etc)<br />
<br />
this can go pretty much anywhere in template it will be moved later<br />
<br />
ggg_ggg.tpl:<br />
<pre><br />
<div class='player_board_config' id="player_board_config"><br />
<!-- here is whatever you want, buttons just example --><br />
<button id="zoom-out" class=" fa fa-search-minus fa-2x config-control"></button><br />
<button id="zoom-in" class=" fa fa-search-plus fa-2x config-control"></button><br />
<button id="show-settings" class="fa fa-cog fa-2x config-control "></button><br />
</div><br />
</pre><br />
<br />
some hackery required in js<br />
<br />
ggg.js:<br />
<pre><br />
/* @Override */<br />
updatePlayerOrdering() {<br />
this.inherited(arguments);<br />
dojo.place('player_board_config', 'player_boards', 'first');<br />
},<br />
</pre><br />
<br />
===Images and Icons ===<br />
<br />
==== Accessing images from js ====<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
<br />
<pre> <br />
// your game resources<br />
<br />
var my_img = '<img src="'+g_gamethemeurl+'img/cards.jpg"/>';<br />
<br />
// shared resources<br />
var my_help_img = "<img class='imgtext' src='" + g_themeurl + "img/layout/help_click.png' alt='action' /> <span class='tooltiptext'>" +<br />
text + "</span>";<br />
</pre><br />
<br />
====High-Definition Graphics====<br />
<br />
Some users will have screens which can display text and images at a greater resolution than the usual 72 dpi, e.g. the "Retina" 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 ''could'' just use large graphics and scale them down, but that would increase the download time and bandwidth for users who can'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 "@2x" at the end of the filename, e.g. if pieces.png is 240x320, then pieces@2x.png is 480x640.<br />
<br />
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 "background-size" attribute is set means that the size of the displayed object doesn't change, but only is drawn at the improved dot pitch.<br />
<pre><br />
.piece {<br />
position: absolute;<br />
background-image: url('img/pieces.png');<br />
background-size:240px 320px;<br />
z-index: 10;<br />
}<br />
@media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2), (min-resolution: 192dpi)<br />
{<br />
.piece {<br />
background-image: url('img/pieces@2x.png');<br />
}<br />
}<br />
</pre><br />
<br />
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:<br />
<pre><br />
var isRetina = "(-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2), (min-resolution: 192dpi)";<br />
if (window.matchMedia(isRetina).matches)<br />
{<br />
this.dontPreloadImage( 'pieces.png' );<br />
this.dontPreloadImage( 'board.jpg' );<br />
}<br />
else<br />
{<br />
this.dontPreloadImage( 'pieces@2x.png' );<br />
this.dontPreloadImage( 'board@2x.jpg' );<br />
}<br />
</pre><br />
<br />
====Using CSS to create different colors of game pieces if you have only white piece====<br />
<br />
<pre><br />
background-color: #${color}; <br />
background-blend-mode: multiply;<br />
background-image: url( 'img/mypiece.png');<br />
mask: url('img/mypiece.png');<br />
-webkit-mask: url('img/mypiece.png');<br />
</pre><br />
<br />
where ${color} - is color you want<br />
<br />
Note: piece has to be white (shades of gray). Sprite can be used too, just add add background-position as usual.<br />
<br />
==== Accessing player avatar URLs ====<br />
<br />
<pre><br />
getPlayerAvatar(playerId) {<br />
let avatarURL = '';<br />
<br />
if (null != $('avatar_' + playerId)) {<br />
let smallAvatarURL = dojo.attr('avatar_' + playerId, 'src');<br />
avatarURL = smallAvatarURL.replace('_32.', '_184.');<br />
}<br />
else {<br />
avatarURL = 'https://x.boardgamearena.net/data/data/avatar/default_184.jpg';<br />
}<br />
<br />
return avatarURL;<br />
},<br />
</pre><br />
<br />
Note: This gets avatar URLs at 184x184 resolution. You can also use 92, 50, and 32 depending on which resolution you want.<br />
<br />
====Adding Image buttons====<br />
<br />
Its pretty trivial but just in case you need a working function:<br />
<br />
ggg.js:<br />
<pre><br />
addImageActionButton: function (id, div_html, handler) { // div_html is string not node<br />
this.addActionButton(id, div_html, handler, '', false, 'gray'); <br />
dojo.style(id, "border", "none"); // remove ugly border<br />
dojo.addClass(id, "bgaimagebutton"); // add css class to do more styling<br />
return $(id); // return node for chaining<br />
},<br />
<br />
</pre><br />
Example of usage:<br />
<pre><br />
this.addImageActionButton('button_coin',"<div class='coin'></div>", ()=>{ alert('Ha!'); });<br />
</pre><br />
<br />
=== Other Fluff===<br />
<br />
====Use thematic fonts====<br />
<br />
'''Ingredients:''' ggg.css<br />
<br />
Sometime game elements use specific fonts of text, if you want to match it up you can load some specific font (IMPORTANT: from some '''free font''' source. See notes below).<br />
<br />
[[File:Dragonline_font.png]]<br />
<br />
.css<br />
<pre><br />
/* latin-ext */<br />
@font-face {<br />
font-family: 'Qwigley';<br />
font-style: normal;<br />
font-weight: 400;<br />
src: local('Qwigley'), local('Qwigley-Regular'), url(https://fonts.gstatic.com/s/qwigley/v6/2Dy1Unur1HJoklbsg4iPJ_Y6323mHUZFJMgTvxaG2iE.woff2) format('woff2');<br />
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;<br />
}<br />
/* latin */<br />
@font-face {<br />
font-family: 'Qwigley';<br />
font-style: normal;<br />
font-weight: normal;<br />
src: local('Qwigley'), local('Qwigley-Regular'), url(https://fonts.gstatic.com/s/qwigley/v6/gThgNuQB0o5ITpgpLi4Zpw.woff2) format('woff2');<br />
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;<br />
}<br />
@font-face {<br />
font-family: 'Qwigley';<br />
font-style: normal;<br />
font-weight: normal;<br />
src: local('Qwigley'), local('Qwigley-Regular'), url(http://ff.static.1001fonts.net/q/w/qwigley.regular.ttf) format('ttf');<br />
}<br />
<br />
.zone_title {<br />
display: inline-block;<br />
position: absolute;<br />
font: italic 32px/32px "Qwigley", cursive; <br />
height: 32px;<br />
width: auto;<br />
}<br />
</pre><br />
<br />
'''NB:''' if you need to include a font that'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. '''Please remember that the font has to be free, and include a .txt with all appropriate license information about the font.'''<br />
You can look for free fonts (for example) on https://fonts.google.com or https://www.fontsquirrel.com/)<br />
<br />
'''Content Security Policy'''<br />
<br />
BGA runs a Content Security Policy which will limit the origins from which you can load external fonts, in order to prevent license abuse.<br />
<br />
The CSP is a whitelist of allowed origins. To see the list, view the response headers of any page on Studio, and look for the "Content-Security-Policy" header.<br />
<br />
You will specifically want to check for the font-src token within these headers, and limit any external fonts to these sources.<br />
<br />
'''This list is subject to change''' but as of the time of writing, the only acceptabled external sites are use.typekit.net and fonts.gstatic.com.<br />
<br />
<br />
=== Scale to fit for big boards===<br />
<br />
'''Ingredients:''' ggg_ggg.tpl, ggg.js<br />
<br />
<br />
<br />
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. <br />
My display is 1920 wide so it fits, but there is big chance other people won't have that width. What do you do?<br />
<br />
You have to decide:<br />
* If board does not fit you want scale whole thing down, the best way is probably use viewport (see https://en.doc.boardgamearena.com/Your_game_mobile_version)<br />
*You can leave the board as is and make sure it is scrollable horizonatally<br />
*You add custom scale just for the board (can add user controls - and hook to transform: scale())<br />
<br />
I tried to auto-scale but this just does work, too many variables - browser zoom, 3d mode, viewport, custom bga scaling, devicePixelRatio - all create some impossible coctail of zooming...<br />
Here is scaling functing for custom user scaling<br />
<br />
ggg_ggg.tpl:<br />
<pre><br />
<div id="thething" class="thething"><br />
... everything else you declare ...<br />
</div><br />
</pre><br />
<br />
ggg.js:<br />
<pre><br />
onZoomPlus: function() {<br />
this.setZoom(this.zoom + 0.1);<br />
},<br />
onZoomMinus: function() {<br />
this.setZoom(this.zoom - 0.1);<br />
},<br />
<br />
setZoom: function (zoom) {<br />
zoom = parseInt(zoom) || 0;<br />
if (zoom === 0 || zoom < 0.1 || zoom > 10) {<br />
zoom = 1;<br />
}<br />
this.zoom = zoom;<br />
var inner = document.getElementById("thething");<br />
<br />
if (zoom == 1) {<br />
inner.style.removeProperty("transform");<br />
inner.style.removeProperty("width");<br />
} else {<br />
inner.style.transform = "scale(" + zoom + ")";<br />
inner.style.transformOrigin = "0 0";<br />
inner.style.width = 100 / zoom + "%";<br />
}<br />
localStorage.setItem(`${this.game_name}_zoom`, "" + this.zoom);<br />
this.onScreenWidthChange();<br />
},<br />
</pre><br />
<br />
===Dynamic tooltips===<br />
<br />
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.)<br />
<br />
new dijit.Tooltip({<br />
connectId: ["divItemId"],<br />
getContent: function(matchedNode){<br />
return "... calculated ..."; <br />
}<br />
});<br />
<br />
<br />
This is an out-of-the-box djit.Tooltip. It has a ''getContent'' method which is called dynamically.<br />
<br />
The string returned by getContent() 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 "divItemId" 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).<br />
<br />
[https://dojotoolkit.org/reference-guide/1.10/dijit/Tooltip.html dijit.Tooltip]<br />
<br />
It's not part of the BGA API so use at your own risk.<br />
<br />
===Rendering text with players color and proper background===<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
<br />
<pre><br />
/* Implementation of proper colored You with background in case of white or light colors */<br />
<br />
divYou: function() {<br />
var color = this.gamedatas.players[this.player_id].color;<br />
var color_bg = "";<br />
if (this.gamedatas.players[this.player_id] && this.gamedatas.players[this.player_id].color_back) {<br />
color_bg = "background-color:#" + this.gamedatas.players[this.player_id].color_back + ";";<br />
}<br />
var you = "<span style=\"font-weight:bold;color:#" + color + ";" + color_bg + "\">" + __("lang_mainsite", "You") + "</span>";<br />
return you;<br />
},<br />
<br />
/* Implementation of proper colored player name with background in case of white or light colors */<br />
<br />
divColoredPlayer: function(player_id) {<br />
var color = this.gamedatas.players[player_id].color;<br />
var color_bg = "";<br />
if (this.gamedatas.players[player_id] && this.gamedatas.players[player_id].color_back) {<br />
color_bg = "background-color:#" + this.gamedatas.players[player_id].color_back + ";";<br />
}<br />
var div = "<span style=\"color:#" + color + ";" + color_bg + "\">" + this.gamedatas.players[player_id].name + "</span>";<br />
return div;<br />
},<br />
</pre><br />
<br />
===Cool realistic shadow effect with CSS===<br />
<br />
====Rectangles and circles====<br />
<br />
It is often nice to have a drop shadow around tiles and tokens, to separate them from the table visually. It is very easy to add a shadow to rectangular elements, just add this to your css:<br />
<br />
<pre><br />
.xxx-tile {<br />
box-shadow: 3px 3px 3px #000000a0;<br />
}<br />
</pre><br />
<br />
box-shadow obeys '''border-radius''' of the element, so it will look good for rounded rectangles, and hence also circles (if border-radius is set appropriately).<br />
<br />
box-shadow also supports various other parameters and can be used to achieve effects such as glowing, borders, inner shadows etc. If you need to animate a box-shadow, you may be able to get better performance (avoiding redraws) if you attach the shadow to another element (possibly an ::after pseudo-element) and change only the '''opacity''' of that element.<br />
<br />
==== Irregular Shapes ====<br />
<br />
If you wish to make a shadow effect for game pieces that are not a rectangle, but your game pieces are drawn from rectangles in a PNG image, you can apply the shadow to the piece using any art package and save it inside the image. This usually will yield the best performance. Remember to account for the size of the shadow when you lay out images in the sprite sheet.<br />
<br />
However that sometimes will not be an option, for example if the image needs to be rotated while the shadow remains offset in the same direction. In this case, one option is to 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 "CSS-sprite" method, it will work!<br />
<br />
For instance:<br />
<br />
<pre><br />
.xxx-token {<br />
filter: drop-shadow(0px 0px 1px #000000);<br />
}<br />
</pre><br />
<br />
Beware that some browsers still do not always draw drop-shadow correctly. In particular, Safari frequently leaves bits of shadow behind when objects move around the screen. In Chrome, shadows sometimes flicker badly if another element is animating close by. Some of these correctness issues can be solved by adding '''isolation: isolate; will-change: filter;''' to affected elements, but this significantly affects redraw performance.<br />
<br />
Beware of performance issues - particularly on Safari (MacOS, iPhone and iPad). 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:<br />
<br />
gameoptions.inc.php<br />
<pre><br />
100 => array(<br />
'name' => totranslate('Shadows'),<br />
'needReload' => true, // after user changes this preference game interface would auto-reload<br />
'values' => array(<br />
1 => array( 'name' => totranslate( 'Enabled' ), 'cssPref' => '' ),<br />
2 => array( 'name' => totranslate( 'Disabled' ), 'cssPref' => 'no-shadow' )<br />
)<br />
),<br />
</pre><br />
<br />
[game].css<br />
<pre><br />
.no-shadow * {<br />
filter: none !important; <br />
} <br />
</pre>For Safari, it is usually better to simply disable drop-shadow completely: [[Game interface stylesheet: yourgamename.css#Warning: using drop-shadow]].<br />
<br />
====Shadows with clip-path====<br />
<br />
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.<br />
<br />
<pre><br />
<div class='my-token-wrap'><br />
<div class='my-token'><br />
</div><br />
</div><br />
</pre><br />
<pre><br />
.my-token-wrap {<br />
filter: drop-shadow(0px 0px 1px #000000);<br />
}<br />
.my-token-wrap .my-token {<br />
clip-path: url(#my-token-path);<br />
}<br />
</pre><br />
<br />
<br />
=== Using the CSS classes from the state machine ===<br />
<br />
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 ''playerTurn'', it will have the class ''gamestate_playerTurn''.<br />
<br />
So now, if you want to show the discard pile only during player turns, you may use:<br />
<br />
<pre><br />
#discard_pile { display: none }<br />
.gamestate_playerTurn #discard_pile { display: block }<br />
</pre><br />
<br />
This can be used if you want to change sizing of elements, position, layout or visual appearance.<br />
<br />
==Game Model and Database design ==<br />
<br />
<br />
===Database for The euro game ===<br />
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.<br />
<br />
[[File:Madeira board.png]]<br />
<br />
<br />
Now lets try to map it, we have<br />
*(meeple,zone)<br />
*(die, zone, sideup)<br />
*(resource cube/money token/vp token,player home zone)<br />
*(token, player home zone, flip state)<br />
We can notice that resource and money are uncountable, and don't need to be track individually so we can replace our mapping to<br />
*(resource type/money,player home zone, count)<br />
And vp stored already for us in player table, so we can remove it from that list.<br />
<br />
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.<br />
<br />
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].<br />
<br />
Variant 1: Minimalistic<br />
<br />
CREATE TABLE IF NOT EXISTS `token` (<br />
`token_key` varchar(32) NOT NULL,<br />
`token_location` varchar(32) NOT NULL,<br />
`token_state` int(10),<br />
PRIMARY KEY (`token_key`)<br />
) ENGINE=InnoDB DEFAULT CHARSET=utf8;<br />
<br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
!token_state<br />
|-<br />
|meeple_red_1<br />
|home_red<br />
|0<br />
|-<br />
|dice_black_2<br />
|board_guard<br />
|1<br />
|-<br />
|dice_green_1<br />
|board_action_mayor<br />
|3<br />
|-<br />
|bread<br />
|home_red <br />
| 5<br />
|}<br />
<br />
Now how we represent resource counters such as bread?<br />
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.<br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
!token_state<br />
|-<br />
|bread_ff0000<br />
|tableau_ff0000<br />
|5<br />
|}<br />
<br />
<br />
See php module for this table here https://github.com/elaskavaia/bga-sharedcode/blob/master/modules/tokens.php<br />
<br />
Variant 2: Additional resource table, resource count for each player id<br />
<br />
CREATE TABLE IF NOT EXISTS `resource` (<br />
`player_id` int(10) unsigned NOT NULL,<br />
`resource_key` varchar(32) NOT NULL,<br />
`resource_count` int(10) signed NOT NULL,<br />
PRIMARY KEY (`player_id`,`resource_key`)<br />
) ENGINE=InnoDB DEFAULT CHARSET=utf8;<br />
<br />
ALTER TABLE resource ADD CONSTRAINT fk_player_id FOREIGN KEY (player_id) REFERENCES player(player_id);<br />
<br />
{| class="wikitable"<br />
|+resource<br />
!player_id<br />
!resource_key<br />
!resource_count<br />
|-<br />
| 123456<br />
|bread<br />
|5<br />
|}<br />
<br />
<br />
<br />
Variant 3: More normalised<br />
<br />
This version is similar to "card" table from hearts tutorial, you can also use exact cards database schema and Deck implementation for most purposes (even you not dealing with cards). <br />
<br />
CREATE TABLE IF NOT EXISTS `token` (<br />
`token_id` int(10) unsigned NOT NULL AUTO_INCREMENT,<br />
`token_type` varchar(16) NOT NULL,<br />
`token_arg` int(11) NOT NULL,<br />
`token_location` varchar(32) NOT NULL,<br />
`token_state` int(10),<br />
PRIMARY KEY (`token_id`)<br />
) ENGINE=InnoDB DEFAULT CHARSET=utf8;<br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_id<br />
!token_type<br />
!token_arg<br />
!token_location<br />
!token_state<br />
|-<br />
|22<br />
|meeple<br />
|123456<br />
|home_123456<br />
|0<br />
|-<br />
|23<br />
|dice<br />
|2<br />
|board_guard<br />
|1<br />
|-<br />
|26 <br />
|dice<br />
|1<br />
|board_action_mayor<br />
|3<br />
|-<br />
|49<br />
|bread<br />
|0<br />
|home_123456<br />
|5<br />
|}<br />
<br />
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<br />
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 <br />
cheat, the down side of that you cannot understand it either, and handcraft db states for debugging or testing.<br />
<br />
=== Database for The card game===<br />
<br />
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.<br />
We have to design database for such game.<br />
<br />
In real word to "save" 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's turn was it.<br />
<br />
*Framework handles state machine transition, so you don't have to worry about database design for that (i.e. who's turn it is, what phase of the game we are at, you still have to design it but part of state machine step)<br />
*Also framework supports basic player information, color, order around the table, basic scoring, etc, so you don't have to worry about it either<br />
*The only thing you need in our database is state of the "board", which is "where each pieces is, and in what state", or (position,rotation) pair.<br />
<br />
Lets see what we have for that: <br />
*The card state is very simple, its usually "face up/face down", "tapped/untapped", "right side up/up side down"<br />
*As position go we never need real coordinates x,y,z. We need to know what "zone" card was, and depending on the zone it may sometimes need an extra "z" or "x" as card order. The zone position usually static or irrelevant.<br />
*So our model is: we have cards, which have some attributes, at any given point in time they belong to a "zone", and can also have order and state<br />
* Now for mapping we should consider what information changes and what information is static, later is always candidate for material file<br />
*For dynamic information we should try to reduce amount of fields we need<br />
**we need at least a field for card, so its one<br />
**we need to know what zone cards belong to, its 2<br />
**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<br />
*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<br />
<br />
Variant 1: Minimalistic<br />
<br />
<pre><br />
CREATE TABLE IF NOT EXISTS `card` (<br />
`card_key` varchar(32) unsigned NOT NULL,<br />
`card_location` varchar(32) NOT NULL,<br />
`card_state` int(11) NOT NULL,<br />
PRIMARY KEY (`card_id`)<br />
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;<br />
</pre><br />
<br />
<br />
Variant 2: More normalised<br />
<br />
This version supported by Deck php class, so unless you want to rewrite db access layer go with this one<br />
<br />
<pre><br />
CREATE TABLE IF NOT EXISTS `card` (<br />
`card_id` int(10) unsigned NOT NULL AUTO_INCREMENT,<br />
`card_type` varchar(16) NOT NULL,<br />
`card_type_arg` int(11) NOT NULL,<br />
`card_location` varchar(16) NOT NULL,<br />
`card_location_arg` int(11) NOT NULL,<br />
PRIMARY KEY (`card_id`)<br />
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;<br />
</pre><br />
<br />
Note: if you using this schema, some zones/locations have special semantic. The 'hand' location is actually multiple locations - one per player, but player id is encoded as card_location_arg. If 'hand' in your game is ordered, visible or can have some other card states, you cannot use hand location (replacement is hand_<player_id> or hand_<color_id>)<br />
<br />
==Game Elements==<br />
<br />
<br />
===Resource===<br />
<br />
A game resource, such as "wood," is usually infinite and represented by a count allocated to a specific player or supply.<br />
<br />
If a resource can be placed on location, use the "Meeple" model described below.<br />
<br />
For a working example, you can check out: [https://codepen.io/VictoriaLa/pen/emYgLzR CodePen Example] (ui only).<br />
<br />
====Representation in Database====<br />
In a minimalistic "tokens" database, it would look like this (e.g., the red player has 3 wood):<br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
! token_state<br />
|-<br />
|wood_ff0000<br />
|<br />
|3<br />
|-<br />
|wood_supply<br />
|<br />
|40<br />
|}<br />
<br />
<br />
The second row you need to store the resource in the supply (if it's counted).<br />
<br />
If you don't like this solution can use bga_globals table for this or create your own resource table.<br />
<br />
Its not recommened to extend player table to store this information.<br />
<br />
<br />
====Representation in Material File (material.inc.php)====<br />
In the material file, you can define some information about resources. For instance, you can specify that it's of type "resource" and call it "Wood" in English, along with a tooltip:<br />
<pre><br />
$this->token_types = [<br />
...<br />
'wood' => [<br />
'name' => clienttranslate('Wood'),<br />
'tooltip' => clienttranslate('Game resource used for building houses'),<br />
'type' => 'resource',<br />
'max' => 40<br />
]<br />
];<br />
</pre><br />
<br />
====HTML Representation====<br />
In HTML, this would look something like this within the player panel. Using the data attribute instead of a CDATA value is much more flexible:<br />
<pre><br />
<div id="wood_ff0000" class="resource wood" data-value="3"></div><br />
</pre><br />
<br />
==== JavaScript Handling ====<br />
When you get the object from the server, one of the tokens will be sent in the array like this:<br />
<pre><br />
token = {<br />
key: 'wood_ff0000',<br />
location: '-',<br />
state: '3'<br />
}<br />
</pre><br />
<br />
You can create a corresponding `<div>` in the `setup()` method of `game.js` as follows:<br />
<pre><br />
const playerColor = token.key.split('_')[1];<br />
const resType = token.key.split('_')[0];<br />
const tokenInfo = this.gamedatas.token_types[resType]; // token_types is the structure from the material file sent to the client<br />
const div = `<div id="${token.key}" class="${resType} ${tokenInfo.type} ${token.key}" data-value="${token.state}"></div>`;<br />
<br />
if (playerColor != 'supply') {<br />
document.querySelector(`#player_board_${this.getPlayerIdByColor(playerColor)} > .player-board-game-specific-content`).insertAdjacentHTML('beforeend',div);<br />
this.addTooltip(token.key, _(tokenInfo.name) + " " + _(tokenInfo.tooltip), "");<br />
}<br />
</pre><br />
<br />
<br />
When you receive an update notification (assuming you get the same "token" object), you can simply update the `data-value`:<br />
<pre><br />
document.querySelector(`#${token.key}`).dataset.value = token.state;<br />
</pre><br />
<br />
To display the resource in the game log, you can format it like this:<br />
<pre><br />
Player gains <div class="resource wood" data-value="1"></div><br />
</pre><br />
For more on injecting icon images in the log, see: [[BGA_Studio_Cookbook#Inject_icon_images_in_the_log]]<br />
<br />
====Graphic Representation (.css)====<br />
To properly display the resource image, it is preferable to use an image sprite that includes all resources, <br />
usually it will be .png as these objects have shape. <br />
This how will .css look like with horizontal sprite image:<br />
<br />
<pre><br />
.resource {<br />
background-image: url(https://en.doc.boardgamearena.com/images/d/d3/Cubes.png);<br />
background-repeat: no-repeat;<br />
background-size: cover; /* auto-scale */<br />
aspect-ratio: 1/1; /* that will keep heigh in sync */<br />
width: 32px; /* default size, specific location should override */<br />
}<br />
<br />
.wood {<br />
/* Since the sprite is a horizontal row of 11 cubes and 9 is the brown cube position */<br />
background-position: calc(100% / (11 - 1) * 9) 0%;<br />
}<br />
</pre><br />
<br />
<br />
To show a text overlay with the resource value, you can use the following CSS:<br />
<pre><br />
.resource[data-value]:after {<br />
content: attr(data-value);<br />
width: 100%;<br />
height: 100%;<br />
position: absolute;<br />
font-size: xx-large;<br />
text-align: center;<br />
text-shadow: 2px 0 2px #fff, 0 -2px 2px #fff, 0 2px 2px #fff, -2px 0 2px #fff;<br />
}<br />
</pre><br />
<br />
<br />
This solution is fully scalable — you only need to specify the size where you want it displayed. <br />
For example:<br />
<pre><br />
.player_board_content > .resource {<br />
width: 40px;<br />
position: relative;<br />
}<br />
</pre><br />
<br />
Note: if you have that board that tracks the resource on resource tracker - you can show this IN ADDITION of showing resource on player panel.<br />
<br />
====Selection and Actions====<br />
It is best to put buttons with resource images on the status bar, rather than having the player click on the player panel.<br />
<br />
For animation:<br />
*Can use move animation to animate resourced gained or played from the board location to the player panel<br />
*Can use "vapor" animation to show resource gained from the board<br />
<br />
<br />
===Meeple===<br />
<br />
A meeple is a game piece, typically representing a "worker," depicted as a human-shaped figure in a specific color assigned to a player.<br />
<br />
The key distinction between meeples and traditional resources is that meeples are placed on locations and can exist <br />
in at least two states — standing or lying down. <br />
<br />
This concept also applies to similar pieces like "houses," "animeeples," "ships," and others.<br />
<br />
<br />
====Representation in Database====<br />
In a simplified "tokens" database, it might be represented like this <br />
(e.g., the red player's first meeple is on action spot 1, while the white meeple remains in supply):<br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
! token_state<br />
|-<br />
|meeple_ff0000_1<br />
|actionspot_1<br />
|1<br />
|-<br />
|meeple_ffffff_1<br />
| supply<br />
|0<br />
|} <br />
<br />
<br />
====Representation in Material File (material.inc.php)====<br />
<br />
Here we define some properties, for example name can be used in notification and as tooltip, type can be used to create the div by <br />
javascript, 'create' - can be used by server to create 8 meeples of this type in database and set location to 'supply_ff0000'<br />
<br />
<pre><br />
$this->token_types = [<br />
...<br />
'meeple_ff0000' => [<br />
'name' => clienttranslate('Red Worker'),<br />
'type' => 'meeple meeple_ff0000',<br />
'create' => 8,<br />
'location' => 'supply_ff0000'<br />
]<br />
];<br />
</pre><br />
<br />
====HTML Representation ====<br />
In HTML, this would look something like this. <br />
<pre><br />
<div id="meeple_ff0000_1" class="meeple meeple_ff0000" data-state="1"></div><br />
</pre><br />
<br />
====JavaScript Handling ====<br />
When you get the object from the server, each meeple object will be similar to this:<br />
<pre><br />
meeple = {<br />
key: 'meeple_ff0000_1',<br />
location: 'actionslot_1',<br />
state: '1'<br />
}<br />
</pre><br />
<br />
You can create a corresponding `<div>` in the `setup()` method of `game.js` as follows:<br />
<pre><br />
const playerColor = token.key.split('_')[1];<br />
const resType = token.key.split('_')[0];<br />
const tokenInfo = this.gamedatas.token_types[resType]; // token_types is the structure from the material file sent to the client<br />
const div = `<div id="${token.key}" class="${tokenInfo.type} ${token.key}" data-state="${token.state}"></div>`;<br />
<br />
$(token.location).insertAdjacentHTML('beforeend',div);<br />
this.addTooltip(token.key, _(tokenInfo.name) + " " + _(tokenInfo.tooltip), "");<br />
$(token.key).addEventListener('onclick',(ev)=>this.onMeepleClick(ev));<br />
<br />
</pre><br />
<br />
<br />
When you receive an update notification (assuming you get the same "token" object), you either create it if not exists or animate:<br />
<pre><br />
if ($(token.key)) {<br />
// exists<br />
$(token.key).dataset.state = token.state; // update state<br />
this.moveToken(token.key, token.location); // animate to new location (custom functon), see [[BGA_Studio_Cookbook#Animation]]<br />
} else {<br />
// crate meeple using code in previous section<br />
}<br />
<br />
</pre><br />
<br />
==== Graphic Representation (.css)====<br />
<br />
Use same sprite technique from Resource section above.<br />
<br />
When placed on the board it will look good with shadow, but its not recommended on mobile<br />
<br />
filter: drop-shadow(black 5px 5px 5px);<br />
<br />
<br />
To represent "laying down" meeple, you have to use a different sprite image, which you will apply based on data attribute<br />
<br />
<pre><br />
.meeple[data-state="1"] {<br />
background-image: url(...);<br />
}<br />
</pre><br />
<br />
You can also rotate you div, but it will look lame.<br />
Other options include changing its shading, adding overlay (i.e. sad face) and so on. <br />
<br />
<br />
====Selection and Actions====<br />
To show user that meeple is active it best to use drop-shadow as image as non-square, however this may be very slow.<br />
For simplier case use box shadow.<br />
<br />
<pre><br />
.active_slot {<br />
filter: drop-shadow(0px 0px 10px blue);<br />
cursor: pointer;<br />
}<br />
<br />
/* draw a circle around game element for selection */<br />
.active_slot_simple:after {<br />
content: " ";<br />
width: 110%;<br />
top: -5%;<br />
left: -5%;<br />
aspect-ratio: 1/1;<br />
position: absolute;<br />
border-radius: 50%;<br />
box-shadow: 0px 0px 4px 3px #64b4ff;<br />
}<br />
<br />
</pre><br />
<br />
See code example at https://codepen.io/VictoriaLa/pen/emYgLzR<br />
<br />
When a meeple is gained from the supply, you can display a meeple icon on the status bar button <br />
instead of showing the supply on the board.<br />
<br />
===Dice ===<br />
The 2D dice can use similar handing as meeple but it has 6 states instead of 2.<br />
<br />
IMPORTANT: Never roll dice using javascript. All dice rolling must be done using bga_rand() function in php.<br />
<br />
====Representation in Database====<br />
In a simplified "tokens" database, it might be represented like this <br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
!token_state<br />
|-<br />
|die_black<br />
|actionspot_1<br />
|1<br />
|-<br />
|die_red<br />
|supply <br />
|6<br />
|}<br />
<br />
<br />
====Representation in Material File (material.inc.php)====<br />
<br />
Similar to resource and meeple above<br />
<br />
====HTML Representation====<br />
<br />
<pre><br />
<div id="die_black" class="die" data-state="1"></div><br />
</pre><br />
<br />
<br />
====JavaScript Handling (.js)====<br />
See meeple section<br />
<br />
====Graphic Representation (.css)====<br />
For dice we would usually use N x 6 sprite, and since the sides are square - the .jpg format is better (it is smaller then png)<br />
<br />
<pre><br />
.die { <br />
background-image: url(https://en.doc.boardgamearena.com/images/c/c5/64_64_dice.jpg);<br />
background-size: 600%;<br />
background-repeat: no-repeat;<br />
aspect-ratio: 1/1;<br />
width: 64px;<br />
border-radius: 5%; /* looks better with rounded corders */<br />
}<br />
.die[data-state="3"] {<br />
background-position: calc(100% / 5 * 2) 0%;<br />
}<br />
</pre><br />
<br />
The 3D dice a bit tricker to create but its feasible, see https://codepen.io/VictoriaLa/pen/QWBBbwz for an example.<br />
<br />
Also multiple examples on N-sided dice can be found on [[BGA_Code_Sharing]]<br />
<br />
====Selection and Actions====<br />
Since it is a square its a lot easier to make a square selection highlight<br />
<br />
<pre><br />
.die.active_slot {<br />
box-shadow: 0px 0px 4px 4px blue;<br />
}<br />
</pre><br />
<br />
===Card===<br />
<br />
Cards are the most complex game resource, they can be located in various zones, stacked, tapped, put face down and can have arbitrary complete abilities.<br />
If you have square tiles - it can be treated the same as cards.<br />
<br />
====Representation in Database====<br />
<br />
In a simplified "tokens" database, it might be represented like this <br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
!token_state<br />
|-<br />
|card_project_123<br />
|tableau_ff0000<br />
|1<br />
|-<br />
|card_corp_p1<br />
| deck_corp<br />
|6<br />
|}<br />
<br />
Means project card is player red tableau and state 1 means it has been used for example,<br />
and second card of corproration file in in deck at position 6 from the top.<br />
<br />
When duplcates are in play you need to add extra unique disambigator in the key.<br />
<br />
Usually cards will have numeric id associated with type, but it this number is per expansition, so leave the space for expansion identifier in there also.<br />
<br />
Another option use [[Deck]] component.<br />
<br />
<br />
====Representation in Material====<br />
<br />
All the card properties which do not change during the game can be put in material file (or its alternative)<br />
<br />
This is example from terraforming mars<br />
<pre><br />
'card_main_81' => [ //<br />
'location' => 'deck_main',<br />
'create' => 'single',<br />
'num' => 81,<br />
'name' => clienttranslate('Ganymede Colony'),<br />
't' => 1,<br />
'r' => "city('Ganymede Colony')",<br />
'cost' => 20,<br />
'tags' => 'Space City Jovian',<br />
'vp' => 'tagJovian',<br />
'deck' => 'Basic',<br />
'text' => clienttranslate('Place a city tile ON THE RESERVED AREA [for Ganymede Colony].'),<br />
'text_vp' => clienttranslate('1 VP per Jovian tag you have.'),<br />
],<br />
</pre><br />
<br />
====HTML Representation====<br />
<br />
There is 2 main options:<br />
* Use exact cards images in english<br />
*Use cards images WITHOUT text<br />
<br />
The 3d option is completely redo the graphic layout that game designed did already, but I won't go there<br />
<br />
The first option is very simple and similar to other resources and meeple<br />
<br />
<pre><br />
<div id="card_project_123" class="card card_project card_project_123" data-state="1"></div><br />
</pre><br />
<br />
The second option means you can add translated text instead<br />
<pre><br />
<div id="card_project_123" class="card card_project card_project_123" data-state="1" data-cost="22"><br />
<div class="card_name">Ganymede Colony</div><br />
<div class="card_text">Place a city tile ON THE RESERVED AREA [for Ganymede Colony].</div><br />
<div class="card_cost"></div><br />
</div><br />
</pre><br />
<br />
In the example above card_cost is also rendered as this can change during the game (even printed value is the same),<br />
it would be rendered using data-cost attribute.<br />
<br />
Instead of using class you can also use state even if it is static<br />
<br />
<div id="card_H_10" class="card" data-suit="H" data-rank="10"> </div><br />
<br />
Note: to make flip animation you effectively need to make a "3d" card and provide both faces with separate graphics,<br />
which makes more complex div. See examples at [[BgaCards]].<br />
<br />
Note: you can also use [[Stock]] component that handles html, js, css, layout and selection at the same time. If do that skip sections below.<br />
<br />
====JavaScript Handling (.js)====<br />
You will get the server data which looks like this<br />
<br />
<pre><br />
card = {<br />
key: 'card_project_123',<br />
location: 'tableau_ff0000',<br />
state: '1'<br />
}<br />
</pre><br />
<br />
<br />
<pre><br />
createCard(token: Token) {<br />
// token_types is the structure from the material file sent to the client<br />
const tokenInfo = this.gamedatas.token_types[token.key]; <br />
const div = `<br />
<div id="${token.key}" class="${tokenInfo.type} ${token.key}" data-state="${token.state}"><br />
<div class="card_name">${_(tokenInfo.name)}</div><br />
<div class="card_text">${_(tokenInfo.text)}</div><br />
</div>`;<br />
<br />
$(token.location).insertAdjacentHTML('beforeend',div);<br />
this.addTooltipHtml(token.key, this.getTooptipHtmlForToken(token));<br />
$(token.key).addEventListener("onclick", (ev) => this.onCardClick(ev));<br />
}<br />
</pre><br />
<br />
When you receive an update notification (assuming you get the same "token" object), you either create it if not exists or animate:<br />
<pre><br />
if ($(token.key)) {<br />
// exists<br />
$(token.key).dataset.state = token.state; // update state<br />
$(token.key).dataset.cost = token.cost; // update cost (discounted cost)<br />
this.moveCard(token.key, token.location); // animate to new location (custom functon), see [[BGA_Studio_Cookbook#Animation]]<br />
} else {<br />
this.createCard(token);<br />
}<br />
</pre><br />
<br />
<br />
====Graphic Representation (.css)====<br />
<br />
For this html<br />
<pre><br />
<div id="game" class="classic_deck"><br />
<div id="hand" class="hand"><br />
<div id="card_H_10" class="card" data-suit='H' data-rank="10"> </div><br />
<div id="card_C_K" class="card" data-suit='C' data-rank="K"> </div><br />
</div><br />
</div><br />
</pre><br />
<br />
This is example css using sprite image of playing cards<br />
<pre><br />
.card {<br />
background-image: url('https://x.boardgamearena.net/data/others/cards/FULLREZ_CARDS_ORIGINAL_NORMAL.jpg'); /* don't do full url in your game, copy this file inside img folder */<br />
<br />
background-size: 1500% auto; /* this mean size of background is 15 times bigger than size of card, because its sprite */<br />
border-radius: 5%;<br />
width: 10em;<br />
height: 13.5em;<br />
box-shadow: 0.1em 0.1em 0.2em 0.1em #555;<br />
}<br />
<br />
<br />
.card[data-rank="10"] { /* 10 is column number 10 - 2 because we start from 0 and first card is sprite is 2. The multiplier is (15 - 1) is because we have 15 columns. -1 is because % in CSS is weird like that. */<br />
background-position-x: calc(100% / (15 - 1) * (10 - 2));<br />
}<br />
.card[data-rank="K"] { /* King will be number 13 in rank */<br />
background-position-x: calc(100% / (15 - 1) * (13 - 2));<br />
}<br />
.card[data-suit="H"] { /* Hears row position is 1 (because we count from 0). Multiplier (4 - 1) is because we have 4 rows and -1 is because % in CSS is weird like that. */<br />
background-position-y: calc(100% / (4 - 1) * (1));<br />
}<br />
.card[data-suit="C"] { /* Clubs row position is 2 */<br />
background-position-y: calc(100% / (4 - 1) * (2));<br />
}<br />
</pre><br />
See code at https://codepen.io/VictoriaLa/pen/mdMzRxa<br />
<br />
====Selection and Actions====<br />
<br />
Since it is a square its a lot easier to make a square selection highlight<br />
<br />
<pre><br />
.card.active_slot {<br />
box-shadow: 0px 0px 4px 4px blue;<br />
}<br />
</pre><br />
<br />
==== Card Layouts====<br />
There are two options - you use [[Stock]] component or don't, see [[Anti-Stock]] for details on how to do your own layouts.<br />
<br />
This is comprehensive example of various card layouts and animations<br />
https://thoun.github.io/bga-cards/demo/index.html<br />
<br />
===Hex Tiles===<br />
From data perspective hex tiles exactly the same as cards.<br />
From visualization there is a small trick.<br />
<br />
CSS:<br />
<pre><br />
.hex {<br />
width: var(--hex-width);<br />
aspect-ratio: 1 / 1.1193;<br />
border-radius: 30%;<br />
background-color: yellow; /* this is just for demo, use proper .png file for this */<br />
clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);<br />
}<br />
<br />
.hex.active_slot_simple {<br />
background-color: rgba(86, 207, 110, 0.4);<br />
}<br />
.hex.active_slot {<br />
filter: drop-shadow(0px 0px 10px blue);<br />
}<br />
</pre><br />
<br />
===Tetris Tiles===<br />
You can use clip-path for actual shape and svg path for outline<br />
See example at https://codepen.io/VictoriaLa/pen/OJmoZGw<br />
<br />
===Track===<br />
<br />
Tracker can be represented as "resource" in database - in this case its just number, or similar to "meeple" in which case<br />
the location will have the "number" associated with position on track<br />
<br />
In a simplified "tokens" database, it might be represented like this <br />
<br />
{| class="wikitable"<br />
|+token<br />
!token_key<br />
!token_location<br />
!token_state<br />
|-<br />
|tracker_o<br />
| scale_o_1<br />
|0<br />
|-<br />
|tracker_t <br />
| scale_t_10 <br />
|0<br />
|}<br />
<br />
<br />
The tracker location in this case may have some properties in material file, for example to trigger game effect when we land on this spot<br />
<br />
<pre><br />
'scale_t' => [<br />
'index_start' => 0,<br />
'max' => 20,<br />
'value_start' => -30,<br />
'value_step' => 2,<br />
'slot_type' => 'slot slot_t'<br />
],<br />
'scale_t_10' => [<br />
'r' => 'ocean',<br />
'param' => 't',<br />
'tooltp' => clienttranslate('Place an ocean'),<br />
'value' => 0<br />
],<br />
</pre><br />
<br />
The track in this case can be generated as series of slots (create in js)<br />
<pre><br />
for(let i=trackInfo.index_start,value = trackInfo.value_start;i<trackInfo.index_start+trackInfo.max;i++,value+=trackInfo.value_step) {<br />
$(trackInfo.key).insertAdjacentHTML('beforeend',`<div id="${trackInfo.key}_${i}" class="${trackInfo.slot_type} data-value=${value}"></div>`);<br />
this.addTooltip(`${trackInfo.key}_${i}`, _(tokenInfo.tooltip), "");<br />
}<br />
</pre><br />
<br />
Then use regular move animation to move tracker into position on track.<br />
<br />
==Code Organization==<br />
<br />
===Including your own JavaScript module===<br />
'''Ingredients:''' ggg.js, modules/ggg_other.js<br />
<br />
*Create ggg_other.js in modules/ folder and sync<br />
<pre><br />
define([<br />
"dojo", "dojo/_base/declare"<br />
], function( dojo, declare )<br />
{<br />
return declare("bgagame.other", null, { // null here if we don't want to inherit from anything<br />
constructor: function(){},<br />
mystuff: function(){},<br />
});<br />
<br />
});<br />
<br />
</pre><br />
*Modify ggg.js to include it<br />
<br />
<br />
define([ "dojo", "dojo/_base/declare", "ebg/core/gamegui", "ebg/counter",<br />
g_gamethemeurl + "modules/ggg_other.js" // load my own module!!!<br />
], function(dojo,<br />
declare) {<br />
<br />
<br />
use it<br />
<br />
foo = new bgagame.other();<br />
<br />
===Including your own JavaScript module (II) ===<br />
<br />
*Create ggg_other.js in modules/ folder and sync<br />
<br />
define([], function () {<br />
return "value";<br />
}); <br />
<br />
* Modify ggg.js to include it<br />
<br />
define([ <br />
"dojo", <br />
"dojo/_base/declare", <br />
"bgagame/modules/ggg_other", <br />
"ebg/core/gamegui", <br />
"ebg/counter"<br />
], function(dojo, declare, other) {<br />
<br />
});<br />
<br />
<br />
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.<br />
<br />
A little explanation to this:<br />
The define function loads all the modules listed in the array and calls the following function with these loaded modules as parameters.<br />
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 '''ggg_other''' and pass it as a parameter with the name '''other'''. '''gamegui''' and '''counter''' 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.<br />
<br />
In the example above the string "value" is passed for the parameter '''other''', 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. <br />
Your module can load other modules. Just put them in the array at the beginning and pass them as parameters to your function.<br />
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't be collisions with values defined in other scripts or the BGA Framework.<br />
<br />
The dojo toolkit provides good documentation to all of its components, the complete documentation for the AMD-Loader is here:<br />
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<br />
<br />
===Including your own PHP module===<br />
'''Ingredients:''' ggg.game.php, modules/ggg_other.php<br />
<br />
*Create ggg_other.php in modules/ folder and sync<br />
*Modify ggg.game.php to include it<br />
<br />
require_once ('modules/ggg_other.php');<br />
<br />
===Creating a test class to run PHP locally ===<br />
<br />
'''Ingredients:''' ggg.game.php, stubs<br />
For this you need stubs of other method you can use this for example<br />
https://github.com/elaskavaia/bga-sharedcode/raw/master/misc/module/table/table.game.php<br />
<br />
Create another php files, i.e ggg_test.php<br />
<pre><br />
<?php<br />
define("APP_GAMEMODULE_PATH", "misc/"); // include path to stubs, which defines "table.game.php" and other classes<br />
require_once ('eminentdomaine.game.php');<br />
<br />
class MyGameTest1 extends MyGame { // this is your game class defined in ggg.game.php<br />
function __construct() {<br />
parent::__construct();<br />
include '../material.inc.php';// this is how this normally included, from constructor<br />
}<br />
<br />
// override/stub methods here that access db and stuff<br />
function getGameStateValue($var) {<br />
if ($var == 'round')<br />
return 3;<br />
return 0;<br />
}<br />
}<br />
$x = new MyGameTest1(); // instantiate your class<br />
$p = $x->getGameProgression(); // call one of the methods to test<br />
if ($p != 50)<br />
echo "Test1: FAILED";<br />
else<br />
echo "Test1: PASSED";<br />
<br />
</pre><br />
<br />
Run from command line like<br />
php8.2 ggg_test.php<br />
<br />
If you do it this way - you can also use local php debugger (i.e. integrated with IDE or command line).<br />
<br />
===Avoiding code in dojo declare style===<br />
Dojo class declarations are rather bizzare and do not work with most IDEs.<br />
If you want to write in plain JS with classes, you can stub all the dojo define/declare stuff<br />
and hook your class into that, so the classes are outside of this mess.<br />
<br />
NOTE: this technique is for experienced developers, do not try it if you do not understand<br />
the consequences.<br />
<br />
This is complete example of game .js class<br />
<pre><br />
// Testla is game name is has to be changed<br />
class Testla {<br />
constructor(game) {<br />
console.log('game constructor');<br />
this.game = game;<br />
this.varfoo = new MyFoo(); // this example of class from custom module<br />
}<br />
<br />
setup(gamedatas) {<br />
console.log("Starting game setup", this.varfoo);<br />
this.gamedatas = gamedatas;<br />
this.dojo.create("div", { class: 'whiteblock', innerHTML: _("hello") }, 'thething');<br />
console.log("Ending game setup");<br />
};<br />
onEnteringState(stateName, args) {<br />
console.log('onEnteringState : ' + stateName, args);<br />
this.game.addActionButton('b1',_('Click Me'), (e)=>this.onButtonClick(e));<br />
};<br />
onLeavingState(stateName) {<br />
console.log('onLeavingState : ' + stateName, args);<br />
};<br />
onUpdateActionButtons(stateName, args) {<br />
console.log('onUpdateActionButtons : ' + stateName, args);<br />
};<br />
onButtonClick(event) {<br />
console.log('onButtonClick',event);<br />
};<br />
};<br />
<br />
<br />
define([<br />
"dojo", "dojo/_base/declare",<br />
"ebg/core/gamegui",<br />
"ebg/counter",<br />
g_gamethemeurl + '/modules/foo.js' // custom module if needed<br />
],<br />
function(dojo, declare) {<br />
// testla is game name is has to be changed<br />
return declare("bgagame.testla", ebg.core.gamegui, {<br />
constructor: function() {<br />
this.xapp = new Testla(this);<br />
this.xapp.dojo = dojo;<br />
},<br />
setup: function(gamedatas) {<br />
this.xapp.setup(gamedatas);<br />
},<br />
onEnteringState: function(stateName, args) {<br />
this.xapp.onEnteringState(stateName, args?.args);<br />
},<br />
onLeavingState: function(stateName) {<br />
this.xapp.onLeavingState(stateName, args);<br />
},<br />
onUpdateActionButtons: function(stateName, args) {<br />
this.xapp.onUpdateActionButtons(stateName, args);<br />
},<br />
});<br />
});<br />
<br />
</pre><br />
<br />
===More readable JS: onEnteringState===<br />
<br />
If you have a lot of states in onEnteringState or onUpdateActionButtons and friends - it becomes rather wild, you can do this trick to call some methods dynamically.<br />
<br />
<pre><br />
<br />
onEnteringState: function(stateName, args) {<br />
console.log('Entering state: ' + stateName, args);<br />
<br />
// Call appropriate method<br />
var methodName = "onEnteringState_" + stateName;<br />
if (this[methodName] !== undefined) { <br />
console.log('Calling ' + methodName, args.args);<br />
this[methodName](args.args);<br />
}<br />
},<br />
<br />
onEnteringState_playerTurn: function(args) { // this is args directly, not args.args <br />
// process<br />
},<br />
<br />
onEnteringState_playerSomethingElse: function(args) { <br />
// process<br />
},<br />
<br />
</pre><br />
<br />
Note: since its ignores the undefined functions you don't have define function for each state, but on the other hand you cannot make typos.<br />
Same applies to onUpdateActionButtons except you pass 'args' to method, not args.args, and for onLeavingState where you don't pass anything.<br />
<br />
=== Frameworks and Preprocessors=== <br />
<br />
*[[BGA Type Safe Template]] - Setting up a fully typed project using typescript and more!<br />
*[[Using Vue]] - work-in-progress guide on using the modern framework Vue.js to create a game<br />
* [[Using Typescript and Scss]] - How to auto-build Typescript and SCSS files to make your code cleaner<br />
<br />
<br />
===PHP Migration===<br />
<br />
'''Ingredients:''' */php, modules/*.php<br />
<br />
BGA recently migrated to from 7.4 to 8.2.<br />
New php has new rules and deprecations.<br />
<br />
There is a tool that can help you do the migration automation, which is php module called rector https://getrector.com/.<br />
Below is the recipe that converts variables in strings like ${var} (which is deprecated) to {$var}.<br />
<br />
1. Install the module<br />
composer global require --dev rector/rector<br />
2. Go to your project directory, commit your code first before this!<br />
<br />
3. Create a rector.php file on top level with the following content:<br />
<pre><br />
<?php<br />
<br />
use Rector\Config\RectorConfig;<br />
use Rector\Php82\Rector\Encapsed\VariableInStringInterpolationFixerRector;<br />
<br />
return RectorConfig::configure()<br />
->withPaths([<br />
__DIR__ <br />
])<br />
// A. whole set<br />
//->withPreparedSets(typeDeclarations: true)<br />
// B. or few rules<br />
->withRules([<br />
VariableInStringInterpolationFixerRector::class<br />
]);<br />
</pre><br />
4. Dry run (mine is on linux, not sure where global install on windows)<br />
~/.config/composer/vendor/bin/rector process --dry-run<br />
<br />
5. If happy re-run without --dry-run<br />
<br />
6. Can remove rector.php now (or can do different rules)<br />
<br />
==Backend==<br />
<br />
<br />
===Assigning Player Order===<br />
Normally when game starts there is "natural" player order assigned randomly.<br />
<br />
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 '''player_table_order''' and using it to assign values to '''player_no''' (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.)<br />
<br />
<br />
<div style="padding: 1em; background: #FFCDD2; color: #B71C1C"><br />
<b>WARNING:</b> To prevent unfair advantage (e.g. collusion), the random order must be the default option and <b>non-random options should be limited to friendly mode.</b><br />
</div><br />
<br />
<br />
'''Example:'''<br />
<pre><br />
// Retrieve inital player order ([0=>playerId1, 1=>playerId2, ...])<br />
$playerInitialOrder = [];<br />
foreach ($players as $playerId => $player) {<br />
$playerInitialOrder[$player['player_table_order']] = $playerId;<br />
}<br />
ksort($playerInitialOrder);<br />
$playerInitialOrder = array_flip(array_values($playerInitialOrder));<br />
<br />
// Player order based on 'playerTeams' option<br />
$playerOrder = [0, 1, 2, 3];<br />
switch ($this->getGameStateValue('playerTeams')) {<br />
case $this->TEAM_1_2:<br />
$playerOrder = [0, 2, 1, 3];<br />
break;<br />
case $this->TEAM_1_4:<br />
$playerOrder = [0, 1, 3, 2];<br />
break;<br />
case $this->TEAM_RANDOM:<br />
shuffle($playerOrder);<br />
break;<br />
default:<br />
case $this->TEAM_1_3:<br />
// Default order<br />
break;<br />
}<br />
<br />
// Create players<br />
// Note: if you added some extra field on "player" table in the database (dbmodel.sql), you can initialize it there.<br />
$sql =<br />
'INSERT INTO player (player_id, player_color, player_canal, player_name, player_avatar, player_no) VALUES ';<br />
$values = [];<br />
<br />
foreach ($players as $playerId => $player) {<br />
$color = array_shift($default_colors);<br />
$values[] =<br />
"('" .<br />
$playerId .<br />
"','$color','" .<br />
$player['player_canal'] .<br />
"','" .<br />
addslashes($player['player_name']) .<br />
"','" .<br />
addslashes($player['player_avatar']) .<br />
"','" .<br />
$playerOrder[$playerInitialOrder[$playerId]] .<br />
"')";<br />
}<br />
$sql .= implode(',', $values);<br />
$this->DbQuery($sql);<br />
$this->reattributeColorsBasedOnPreferences(<br />
$players,<br />
$gameinfos['player_colors']<br />
);<br />
$this->reloadPlayersBasicInfos();<br />
</pre><br />
<br />
===Send different notifications to active player vs everybody else===<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
Hack alert. This is a hack. We were hoping for proper solution by bga framework.<br />
<br />
This will allow you to send notification with two message one for specific player and one for everybody else including spectators.<br />
Note that this does not split the data - all data must be shared.<br />
<br />
Add this to .js file<br />
<pre><br />
bgaFormatText: function(log, args) {<br />
if (typeof args.log_others != 'undefined' && typeof args.player_id != 'undefined' && this.player_id != args.player_id) {<br />
log = args.log_others;<br />
}<br />
return { log, args }; // you must return this so the framework can handle the default formatting<br />
},<br />
</pre><br />
<br />
Example of usage (from eminentdomain)<br />
<pre><br />
$this->notify->all('tokenMoved', <br />
clienttranslate('${player_name} adds +2 Colonies to ${place_name}'), // notification with show for player with player_id<br />
['player_id'=>$player_id, // this is mandatory<br />
'log_others'=>clienttranslate('${player_name} adds +2 Colonies to an unknown planet'), // notification will show for others<br />
...<br />
]);<br />
</pre><br />
<br />
===Send transient notifications without incrementing move ID===<br />
<br />
'''Ingredients:''' ggg.php<br />
<br />
Hack alert. This is a hack.<br />
<br />
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 '''safe to drop''' (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.<br />
<br />
Doing this mainly affects the instant replay & archive modes. During replay, the BGA framework automatically inserts a 1.5-second pause between each "move". With this hack, your transient notifications are not considered to be a "move", so no pause gets added.<br />
<br />
;In ggg.php<br />
<pre><br />
$this->not_a_move_notification = true; // note: do not increase the move counter<br />
$this->notify->all('cardsPreview', '', $args);<br />
</pre><br />
<br />
Note: you cannot have code that send notification or even changes state after this, and you cannot reset this variable back either because it only takes effect when you exit action handling function<br />
<br />
<br />
==Assorted Stuff==<br />
<br />
<br />
===Out-of-turn actions: Un-pass===<br />
<br />
'''Ingredients:''' ggg.js, ggg.game.php, ggg.action.php, states.inc.php<br />
<br />
In multiplayer game sometimes players passes but than they think more and want to un-Pass and redo their choice. <br />
To re-active a player who passes some trickery required.<br />
<br />
Define a special action that does that and hook it up.<br />
<br />
In states.inc.php add an action to MULTIPLE_ACTIVE_PLAYER state to "unpass", lets call it "actionCancel"<br />
<br />
In ggg.action.php add action hook<br />
public function actionCancel() {<br />
$this->setAjaxMode();<br />
$this->game->actionCancel();<br />
$this->ajaxResponse();<br />
}<br />
<br />
In ggg.game.php add action handler<br />
function actionCancel() {<br />
$this->gamestate->checkPossibleAction('actionCancel');<br />
$this->gamestate->setPlayersMultiactive(array ($this->getCurrentPlayerId() ), 'error', false);<br />
}<br />
<br />
Finally to call this in client ggg.js you would do something like:<br />
<pre><br />
onUpdateActionButtons: function(stateName, args) {<br />
if (this.isCurrentPlayerActive()) { <br />
// ...<br />
} else if (!this.isSpectator) { // player is NOT active but not spectator<br />
switch (stateName) {<br />
case 'playerTurnMultiPlayerState':<br />
this.addActionButton('button_unpass', _('Oh no!'), 'onUnpass');<br />
break;<br />
}<br />
}<br />
}<br />
<br />
onUnpass: function(e) {<br />
this.bgaPerformAction("actionCancel", null, { checkAction: false }); // no checkAction!<br />
}<br />
</pre><br />
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:<br />
dojo.place('button_unpass', 'pagemaintitletext', 'before');<br />
Being out of the generalactions div, it won't be automatically destroyed like normal buttons, so you'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?)<br />
<br />
Note: same technique can be used to do other out-of-turn actions, such as re-arranging cards in hand, exchanging resources, etc (i.e. if permitted by rules, such as "at any time player can...")<br />
<br />
===Multi Step Interactions: Select Worker/Place Worker - Using Selection ===<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
Simple way to implement something like that without extra states is to use "selection" mechanism. When user click on worker add some sort of class into that element i.e. 'selected' (which also have to have some indication by css i.e. outline).<br />
<br />
Than user can click on placement zone, you can use dojo.query for "selected" 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.<br />
<br />
Extra code required to properly cleanup selection between states.<br />
Also when you do that sometimes you want to change the state prompt, see below 'Change state prompt'<br />
<br />
===Multi Step Interactions: Select Worker/Place Worker - Using Client States ===<br />
<br />
'''Ingredients:''' ggg.js<br />
<br />
I don't think its documented feature but there is a way to do client-only states, which is absolutely wonderful for few reasons<br />
*When player interaction is two step process, such as select worker, place worker, or place worker, pick one of two resources of your choice<br />
* When multi-step process can result of impossible situation and has to be undone (by rules)<br />
*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)<br />
<br />
So lets do Select Worker/Place Worker<br />
<br />
Define your server state as usual, i.e. playerMainTurn -> "You must pick up a worker".<br />
Now define a client state, we only need "name" and "descriptionmyturn", lets say "client_playerPicksLocation". Always prefix names of client state with "client_" to avoid confusion. Now we have to do the following:<br />
*Have a handler for onUpdateActionButtons for playerMainTurn to activate all possible workers he can pick<br />
*When player clicks workers, remember the worker in one of the members of the main class, I usually use one called this.clientStateArgs.<br />
*Transition to new client state<br />
onWorker: function(e) {<br />
var id = event.currentTarget.id;<br />
dojo.stopEvent(event);<br />
... // do validity checks<br />
this.clientStateArgs.worker_id = id;<br />
this.setClientState("client_playerPicksLocation", {<br />
descriptionmyturn : _("${you} must select location"),<br />
});<br />
}<br />
* Have a handler for onUpdateActionButtons for client_playerPicksLocation to activate all possible locations this worker can go AND add Cancel button (see below)<br />
*Have a location handler which will eventually send a server request, using stored this.clientStateArgs.worker_id as worker id<br />
*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<br />
<br />
<br />
if (this.isCurrentPlayerActive()) {<br />
if (this.on_client_state && !$('button_cancel')) {<br />
this.addActionButton('button_cancel', _('Cancel'), dojo.hitch(this, function() {<br />
this.restoreServerGameState();<br />
}));<br />
}<br />
} <br />
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)<br />
<br />
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.<br />
<br />
Code is available here [https://github.com/elaskavaia/bga-sharedcode/blob/master/sharedcode.js sharedcode.js] (its using playerTurnPlayCubes and client_selectCubeLocation).<br />
<br />
===Action Stack - Using Client States===<br />
<br />
Action stack required where game is very complex and use triggered effects that can "stack". It not always actual stack, it can be queue or random access.<br />
<br />
Examples:<br />
*Magic the Gathering - classic card game where effects go on Stack, that allows to counter spell and counter spell of counter spell (not on bga - it just example of mechanics)<br />
*Ultimate Railroads - action taking game where effects can be executed in any order<br />
*Lewis and Clark - card game where actions executed as queue<br />
<br />
There is two ways of implementing it - on the server or the client.<br />
For the server see article below.<br />
The requirement for client side stack implementation is - all action can be undone, which means<br />
* No dice rolls<br />
* No card drawn<br />
* No other players interaction<br />
<br />
No snippets are here, as this will be too complex but basically flow is:<br />
*You have a action/effect stack (queue/list) as js object attached to "this", i.e. this.unprocessed_actions<br />
*When player plays a card, worker, etc, you read the effect of that card from the material file (client copy), and place into stack<br />
*Then we call dispatch method which pulls the next action from the stack and change client state accordinly, i.e. this.setClientState("client_playerGainsCubes")<br />
* When players acts on it - the action is removed from the stack and added to "server action arguments" list, this is another object which be used to send ajax call, i.e. this.clientStateArgs<br />
*If nothing left in stack we can submit the ajax call assembling parameters from collected arguments (that can include action name)<br />
*This method allows cheap undo - by restoring server state you will wipe out all user actions (but if you need intermediate aninmation you have to handle it yourself)<br />
<br />
Code can be found in Ultimate Railroads game (but it is random access list - so it a bit complex) and Lewis and Clark (complexity - user can always deny part of any effect)<br />
<br />
<br />
===Action Stack - Using Server States===<br />
<br />
See definition of Action Stack above.<br />
<br />
To implement you usually need another db table that has the following fields: index of effect - which is used for sorted access, type - which is essense of the effect (i.e. collect resource), some extra arguments (i.e. resource type and resource count), and usually owner of the effect (i.e. player id)<br />
The flow is:<br />
* There is some initial player state, where player can play card for example<br />
*Player main action - pushes the card effect on stack, which also can cause triggered effects which also go on stack<br />
*After action processing is finished switch to game state which is "dispatcher"<br />
*Dispatcher pulls the top effect (whatever definition of the top is), changes the active player and changes the state to appropriate player state to collect response. The "top" can be choice of multiple actions, in this case player has to chose one before resolving the effect.<br />
*Player state knows about the stack and pulls arguments (argX) from the effect arguments of the db<br />
*Player action should clear up the top effect, and can possibly add more effects, then switch to "dispatcher" state again<br />
*If stack is empty, dispatcher can either pick next player itself or use another game state which responsible for picking next player<br />
<br />
Code can be found in Tapestry and Terraforming Mars.<br />
===Custom error/exception handling in JavaScript === <br />
<br />
;In ggg.php<br />
Throw \BgaUserException with some easy-to-identify prefix such as "!!!" and a custom error code. DO NOT TRANSLATE this message text. The exception will rollback database transaction and cancel all changes (including any notifications).<br />
<pre><br />
function foo(bool $didConfirm = false): void<br />
{<br />
// do processing for the user's move<br />
// afterwards, you determine this move will end the game<br />
// so you want to rollback the transaction and require the user to confirm the move first<br />
<br />
if ($gameIsEnding && !$didConfirm) {<br />
throw new \BgaUserException('!!!endGameConfirm', 9001);<br />
}<br />
}<br />
</pre><br />
<br />
;In ggg.js<br />
Override framework function showMessage to suppress the red banner message and gamelog message when you detect the "!!!" prefix<br />
<pre><br />
/* @Override */<br />
showMessage: function (msg, type) {<br />
if (type == "error" && msg && msg.startsWith("!!!")) {<br />
return; // suppress red banner and gamelog message<br />
}<br />
this.inherited(arguments);<br />
},<br />
</pre><br />
<br />
Deal with the error in your callback:<br />
<pre><br />
fooAction: function (didConfirm) {<br />
var data = {<br />
foo: "bar",<br />
didConfirm: !!didConfirm,<br />
};<br />
this.bgaPerformAction("fooAction", data).catch((error, errorMsg) => {<br />
if (error && errorMsg == "!!!endGameConfirm") {<br />
// your custom error handling goes here<br />
// for example, show a confirmation dialog and repeat the action with additional param<br />
this.confirmationDialog(<br />
_("Doing the foo action now will end the game"),<br />
() => this.fooAction(true)<br />
);<br />
}<br />
});<br />
},<br />
</pre><br />
<br />
For custom global error handling, you could modify ajaxcallwrapper:<br />
<pre><br />
ajaxcallwrapper: function (action, args, handler) {<br />
if (!args) args = {};<br />
args.lock = true;<br />
args.version = this.gamedatas.version;<br />
if (this.checkAction(action)) {<br />
this.bgaPerformAction(<br />
action,<br />
args<br />
).catch((error, errorMsg, errorCode) => {<br />
if (error && errorMsg == "!!!checkVersion") {<br />
this.infoDialog(<br />
_("A new version of this game is now available"),<br />
_("Reload Required"),<br />
() => {<br />
window.location.reload();<br />
},<br />
true<br />
);<br />
} else {<br />
if (handler) handler(error, errorMsg, errorCode);<br />
}<br />
}<br />
);<br />
}<br />
},<br />
</pre><br />
<br />
===Force players to refresh after new deploy===<br />
<br />
When you deploy a new version of your game, the PHP backend code is immediately updated but the JavaScript/HTML/CSS frontend code *does not update* for active players until they manually refresh the page (F5) in their browser. Obviously this is not ideal. In the best case, real-time tables don't see your shiny new enhancements. In the worst case, your old JS code isn't compatible with your new PHP code and the game breaks in strange ways (any bug reports filed will be false positives and unable to reproduce). To avoid any problems, you should force all players to immediately reload the page following a new deploy.<br />
<br />
By throwing a "visible" exception (simplest solution), you'll get something like this which instructs the user to reload:<br />
<br />
[[File:Force-refresh.png|950x950px]]<br />
<br />
Or, if you combine this technique with the above custom error handling technique, you could do something a bit nicer. You could show a dialog box and automatically refresh the page when the user clicks "OK":<br />
<br />
[[File:Reload-required.png|500x500px]]<br />
; In ggg.php<br />
Transmit the server version number in <code>getAllDatas()</code>.<br />
<pre><br />
protected function getAllDatas(): array<br />
{<br />
$players = $this->getCollectionFromDb("SELECT player_id id, player_score score FROM player");<br />
return [<br />
'players' => $players,<br />
'version' => intval($this->gamestate->table_globals[300]), // <-- ADD HERE<br />
...<br />
];<br />
}<br />
</pre><br />
<br />
Create a helper function to fail if the client and server versions mismatch. Note the version check uses <code>!=</code> instead of <code>&lt;</code> so it can support rollback to a previous deploy as well. ;-)<br />
<pre><br />
public function checkVersion(int $clientVersion): void<br />
{<br />
if ($clientVersion != intval($this->gamestate->table_globals[300])) {<br />
// Simplest way is to throw a "visible" exception<br />
// It's ugly but comes with a "click here" link to refresh<br />
throw new BgaVisibleSystemException($this->_("A new version of this game is now available. Please reload the page (F5)."));<br />
<br />
// For something prettier, throw a "user" exception and handle in JS<br />
// (see BGA cookbook section above on custom error handling)<br />
throw new \BgaUserException('!!!checkVersion');<br />
}<br />
}<br />
</pre><br />
<br />
Every action requires a parameter <code>int $version</code> and a call to <code>$this->checkVersion()</code> as the first line. The version check should happen before anything else, even before checking if the action is allowed (since possible actions could change between versions). If you are using auto-wired "act" action functions, modify each to start like this:<br />
<pre><br />
#[CheckAction(false)]<br />
public function actXxx(int $version, ...) {<br />
$this->checkVersion($version);<br />
$this->checkAction('actXxx'); // or $this->gamestate->checkPossibleAction('actXxx');<br />
...<br />
}<br />
</pre><br />
<br />
;In ggg.js<br />
Transmit the version (from gamedatas) as a parameter with every ajax call. For example, if you're already using a wrapper function for every ajax call, add it like this:<br />
<pre><br />
ajaxcallwrapper: function (action, args) {<br />
if (!args) args = {};<br />
args.version = this.gamedatas.version; // <-- ADD HERE<br />
this.bgaPerformAction(action, args);<br />
},<br />
</pre><br />
<br />
===Disable / lock table creation for new deploy===<br />
<br />
If you are deploying a major new game version, especially if it involves upgrading production game databases, you may have a lot of angry players if you break their tables. Depending on your changes, you may be able to restore the previous version and fix the tables easily.<br />
<br />
However, if a new deploy turns out bad and players created turn-based tables while it was live, it may be quite difficult to fix those tables, since they were created from a bad deploy.<br />
<br />
The solution? You can announce in your game group that you are locking table creation, and then in your new version, add an impossible startcondition to an existing option. <br />
Note: This only makes sense if you have a few games running in real time mode in the time of deployment, otherwise it won't achieve much, unless you wait at least a day for other turn based games to break (or not)<br />
<br />
Here is an example of an option with only 2 values (if you don't have options at all you have to create a fake option to use this method, if you have more values - you have to list them all): <br />
<br />
;In gameoptions.json<br />
<pre><br />
"startcondition": {<br />
"0": [ { "type": "minplayers", "value": 32, "message": "Maintenance in progress. Table creation is disabled." } ],<br />
"1": [ { "type": "minplayers", "value": 32, "message": "Maintenance in progress. Table creation is disabled." } ]<br />
},<br />
</pre><br />
;In gameoptions.inc.php (older method if you have it in php)<br />
<pre><br />
// TODO NEXT remove after testing deploy to upgrade, here 0 and 1 - replace with values of your option!<br />
'startcondition' => [<br />
0 => [ [ 'type' => 'minplayers', 'value' => 32, 'message' => totranslate('Maintenance in progress. Table creation is disabled.') ] ],<br />
1 => [ [ 'type' => 'minplayers', 'value' => 32, 'message' => totranslate('Maintenance in progress. Table creation is disabled.') ] ],<br />
],<br />
</pre><br />
<br />
* Be sure to click "Reload game options configuration" after making this change, then test in studio (test that you cannot create any table)<br />
* Deploy to production<br />
*Now, when a player attempts to create a new table, they will see a red error bar with your "Maintenance in progress" message.<br />
*Wait for screaming (if you have real times games in progress waiting 15 min probably ok, if you have only turn based games, probably a day)<br />
*Once you confirm the new deploy looks good, you can revert the change in gameoptions.inc.php and do another deploy.<br />
<br />
===Local Storage===<br />
<br />
There is not much you can store in localStorage (https://developer.mozilla.org/docs/Web/API/Window/localStorage), since most stuff should be stored either in game db or in user prefrences,<br />
but some stuff makes sense to store there, for example "zoom" level (if you use custom zooming). This setting really affect this specific host and specific browser, setting it localStorage makes most sense.<br />
<br />
game.js<br />
<pre><br />
setup: function (gamedatas) {<br />
let zoom = localStorage.getItem(`${this.game_name}_zoom`);<br />
this.setZoom(zoom);<br />
...<br />
},<br />
</pre><br />
In this case setZoom is custom function to actually set it.<br />
When zoom changed, for example when some buttons pressed, store current value (but sanitize it so it never so bad that game cannot be viewed<br />
<br />
<br />
<pre><br />
setZoom: function (zoom) {<br />
zoom = parseInt(zoom) || 0;<br />
if (zoom === 0 || zoom < 0.1 || zoom > 10) {<br />
zoom = 1;<br />
}<br />
this.zoom = zoom;<br />
localStorage.setItem(`${this.game_name}_zoom`, "" + this.zoom);<br />
... do actual zooming stuff<br />
},<br />
</pre><br />
<br />
<br />
===Capture client JavaScript errors in the "unexpected error" log===<br />
<br />
PHP (backend) errors are recorded in the "unexpected error" log, but JavaScript (frontend) errors are only available in the browser itself. This means you have no visibility about things that go wrong in the client... unless you make clients report their errors to the server.<br />
<br />
;In actions.php:<br />
<pre><br />
public function jsError()<br />
{<br />
$this->setAjaxMode(false);<br />
$this->game->jsError($_POST['userAgent'], $_POST['msg']);<br />
$this->ajaxResponse();<br />
}<br />
</pre> <br />
<br />
; In game.php:<br />
<pre><br />
public function jsError($userAgent, $msg): void<br />
{<br />
$this->error("JavaScript error from User-Agent: $userAgent\n$msg // ");<br />
}<br />
</pre><br />
<br />
;In game.js:<br />
<pre><br />
define(["dojo", "dojo/_base/declare", "ebg/core/gamegui", "ebg/counter"], function (dojo, declare) {<br />
const uniqJsError = {};<br />
...<br />
<br />
return declare("bgagame.nowboarding", ebg.core.gamegui, {<br />
...<br />
/* @Override */<br />
onScriptError(msg) {<br />
if (!uniqJsError[msg]) {<br />
uniqJsError[msg] = true;<br />
console.error("⛔ Reporting JavaScript error", msg);<br />
this.ajaxcall(<br />
"/" + this.game_name + "/" + this.game_name + "/jsError.html",<br />
{<br />
msg,<br />
userAgent: navigator.userAgent,<br />
},<br />
this,<br />
() => {},<br />
() => {},<br />
"post"<br />
);<br />
}<br />
this.inherited(arguments);<br />
},<br />
</pre><br />
<br />
==Algorithms ==<br />
<br />
===Generate permutations in lexicographic order===<br />
<br />
Use this when you have an array like [1, 2, 3, 4] and need to loop over some/all 24 permutations of possible ordering. This type of [https://www.php.net/manual/en/language.generators.syntax.php generator function] computes each possibility one at a time, making it vastly more efficient than either a normal iteration or recursive function that produce all possibilities up front.<br />
<br />
<pre><br />
function generatePermutations(array $array): Generator<br />
{<br />
// https://en.wikipedia.org/wiki/Permutation#Generation_in_lexicographic_order<br />
// Sort the array and this is the first permutation<br />
sort($array);<br />
yield $array;<br />
<br />
$count = count($array);<br />
do {<br />
// Find the largest index k where a[k] < a[k + 1]<br />
// End when no such index exists<br />
$found = false;<br />
for ($k = $count - 2; $k >= 0; $k--) {<br />
$kvalue = $array[$k];<br />
$knext = $array[$k + 1];<br />
if ($kvalue < $knext) {<br />
// Find the largest index l greater than k where a[k] < a[l]<br />
for ($l = $count - 1; $l > $k; $l--) {<br />
$lvalue = $array[$l];<br />
if ($kvalue < $lvalue) {<br />
// Swap a[k] and a[l]<br />
[$array[$k], $array[$l]] = [$array[$l], $array[$k]];<br />
<br />
// Reverse the sequence from a[k + 1] up to and including the final element<br />
$reverse = array_reverse(array_slice($array, $k + 1));<br />
array_splice($array, $k + 1, $count, $reverse);<br />
yield $array;<br />
<br />
// Restart with the new array to find the next permutation<br />
$found = true;<br />
break 2;<br />
}<br />
}<br />
}<br />
}<br />
} while ($found);<br />
}<br />
</pre><br />
<br />
Usage:<br />
<pre><br />
$cash = [4, 1, 2, 3, 4];<br />
foreach ($this->generatePermutations($cash) as $p) {<br />
// your code here to evaluate permutation $p<br />
// first iteration: $p = [1, 2, 3, 4, 4]<br />
// last (60th) iteration: $p = [4, 4, 3, 2, 1]<br />
// break from loop once you achieve your goal<br />
}<br />
</pre><br />
<br />
[[Category:Studio]]</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=25971Gamehelpauctionland2025-07-31T09:58:45Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup:'''<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
{| class="wikitable"<br />
|1st player<br />
|2nd player<br />
|3rd player<br />
|4th player<br />
|5th player<br />
|6th player<br />
|-<br />
|$7<br />
|$8<br />
|$9<br />
|$10<br />
|$11<br />
|$12<br />
|} For a 2-player game: <br />
{| class="wikitable"<br />
|1st player<br />
|2nd player<br />
|-<br />
|$10<br />
|$12<br />
|}<br />
Place money behind your screen.<br />
<br />
Create 3 rows of 5 tiles (6 tiles in a 5-6 player game) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack of tiles.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
1. '''Build Tile''': Select a tile from the market to add to your island.<br />
<br />
2. '''Auction Tile''': After building, select another tile and auction it off.<br />
<br />
3. '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
If you already took a tile from a Market Row, you may not take another one from that same row again until the end of your turn. This restriction applies per player: it does not affect other players. For example, if you took a tile from a row, the auction winner can still take a tile from that same row (see Bonus).<br />
<br />
If a player needs to take a tile from the market, and any row has only 1 tile left, immediately draw new tiles and refresh the rows back to the tile limit (5 tiles with 2-4 players, 6 tiles with 5-6 players). Do not arrange the tiles by their icon count.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any ❤️ icons. If they had only 1 ❤️, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.<br />
<br />
<br />
'''Tropical Treats expansion:'''<br />
<br />
For this expansion, please refer to the rulebook: https://drive.google.com/file/d/1DD24YzVmEZxE2K8FaAdEeuF6AFvsRLld/view</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=BGA_Code_Sharing&diff=23362BGA Code Sharing2024-11-30T13:40:10Z<p>Fenadoruk: /* Projects */</p>
<hr />
<div>{{Studio_Framework_Navigation}}<br />
<br />
This page is for listing of externally hosted bga projects, tools and resources, as well as internal project<br />
intended for sharing<br />
<br />
== Community shared components, pens, etc ==<br />
<br />
<br />
{| class="wikitable"<br />
|-<br />
! NAME<br />
! CODE LINK<br />
! DESCRIPTION<br />
|-<br />
! colspan="3" | Dice models and animation<br />
|-<br />
| Die: 4 sided <br />
| https://codepen.io/mrkiffie/pen/doVZgW ; https://codepen.io/VictoriaLa/pen/JjZNezr<br />
| code pen<br />
|-<br />
| Die: 6 sided <br />
| https://github.com/elaskavaia/bga-sharedcode ; https://codepen.io/VictoriaLa/pen/QWBBbwz<br />
| <br />
|-<br />
| Die: 8 sided <br />
| https://codepen.io/VictoriaLa/pen/YzMPeGq<br />
| code pen<br />
|-<br />
| Die: 12 sided (dodecahedron) <br />
| https://codepen.io/VictoriaLa/pen/xxLLxOP <nowiki/> https://codepen.io/hoursgoby/pen/GRwQzxo<br />
| Code pen<br />
|- <br />
| Die: 20 sided <br />
| https://codepen.io/vicentemundim/details/cenIh<br />
| Code pen<br />
|-<br />
|Dice<br />
|[https://github.com/thoun/bga-dice/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-dice/demo/index.html Demo] (not used yet)<br />
|Handle dice display and animation '''WORK IN PROGRESS''' Only d6 is started<br />
|-<br />
! colspan="3" | Moving object using CSS animation (mostly)<br />
|-<br />
| Phantom object move on oversurface <br />
| https://codepen.io/VictoriaLa/pen/gORvdJo<br />
| This technique creates clone of the object it moves it on another surface. It works well when parents that css transform applies such as scale and rotate<br />
|-<br />
| Move object directly using positioning <br />
| https://codepen.io/VictoriaLa/pen/dyzgKVX<br />
| This technique is modification of BGA framework method to allow mobile object not to have absolute position before or after the move (and uses css animation not dojo). Methods slideToObjectRelative, attachToNewObjectNoDestroy<br />
|-<br />
! colspan="3" | Responsive layout, zoom and navigation for game boards<br />
|-<br />
|Flex Layout<br />
|https://codepen.io/VictoriaLa/pen/XWjJJgG<br />
|Example on how to create flexible layout just by using css<br />
|-<br />
|Zoom<br />
|[https://github.com/thoun/bga-zoom/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-zoom/demo/index.html Demo] (visible on Knarr, Azul, Abyss, ...)<br />
|Allow the user to zoom on the game board. Include the controls to zoom, and handle the scale applied to the HTML element.<br />
|-<br />
|Jump to<br />
|[https://github.com/thoun/bga-jump-to/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-jump-to/demo/index.html Demo] (visible on Knarr, Elawa)<br />
|Add floating controls to quickly jump to a player's table<br />
|-<br />
! colspan="3" | Algorithms<br />
|-<br />
|Hex grid<br />
|tapestry,Tumbleweed,gaia project,Gold West<br />
|<br />
|-<br />
|Shortest path on hex grid<br />
|memoir 44<br />
| Dijkstra<br />
|-<br />
|Largest area on hex grid<br />
|tapestry, ...<br />
|<br />
|-<br />
|Largest area on square grid<br />
|king domino, ...<br />
|<br />
|-<br />
|Tetris pieces<br />
|patchwork, ...<br />
|Matrix manupations to rotate, flip and fit tetris pieces<br />
|-<br />
|Line of sights on hex grid<br />
|memoir 44<br />
|Find intersecting hexes on a line between two cells<br />
|-<br />
! colspan="3" | Alternative implementations of BGA modules<br />
|-<br />
|Scrollmap with zoom<br />
|https://github.com/yansnow78/bga_scrollmap<br />
|you can find it in cacao, ginkgopilis, sagani, bigmonster,dominoes, Carcassonne hunters and gatherers and many others. <nowiki>#</nowiki> improvements compare to scrollmap:<br />
- add zoom capabilities <br />
<br />
- add possibility to adjust pan delta to tile size when clicking on arrows<br />
<br />
- allow zoom with scroll wheel. only allow zoom with wheel if alt or ctrl or shift are pressed by default. add possibility to select which key need to be pressed when zooming with wheel<br />
<br />
- allow pan/scroll and pinch zoom on smartphone. only allow 2 fingers to start scrolling by default, one finger is for page scrolling<br />
<br />
- make clickable area of buttons a bit bigger on smartphone<br />
<br />
- improve animation between game board and player bards thanks to an animation_div<br />
<br />
- add support to long click on buttons (continuous scroll or zoom or enlarge/reduce until button released)<br />
|-<br />
|Scrollmap Plus <br />
|patchwork<br />
|Implementation with some bugs fixed, improved drag support and ability to use only one direction (i.e. only horizontal like carousel). Found in modules/extscrollmap.js<br />
|-<br />
|Cards<br />
|[https://github.com/thoun/bga-cards/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-cards/demo/index.html Demo] (visible on Knarr, King of Tokyo, Abyss, ...)<br />
|Alternative to BGA Stock component, using CSS transitions instead of dojo animations.<br />
|-<br />
! colspan="3" | Assorted stuff<br />
|-<br />
|Help<br />
|[https://github.com/thoun/bga-help/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-help/demo/index.html Demo] (visible on Knarr)<br />
|Add floating help buttons at the bottom left corner of the screen<br />
<br />
|}<br />
<br />
== Projects ==<br />
<br />
Add the game name, a link to repository 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] topic on github.<br />
<br />
'''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.<br />
'''<br />
<br />
{| class="wikitable"<br />
|-<br />
! NON-GAME PROJECTS<br />
! CODE LINK<br />
! DEVELOPER<br />
! COMMENT<br />
|-<br />
| Shared Code (not a game)<br />
| https://github.com/elaskavaia/bga-sharedcode<br />
| Victoria_La<br />
| Examples of various game components and PHP stubs of framework code to make IDE happy<br />
|-<br />
| Vanilla Typescipt template (not a game)<br />
| https://github.com/elaskavaia/bga-dojoless<br />
| Victoria_La<br />
| Project template for typescript and using minimal dojo, good for vscode - type checking, auto-complete, navigation<br />
|-<br />
| BoardGameArena Workbench (not a game)<br />
| https://github.com/danielholmes/bga-workbench<br />
| Daniel Holmes (dhau)<br />
|-<br />
|BGA-boilerplate<br />
|https://github.com/bga-devs/tisaac-boilerplate/<br />
|Tisaac (and Vincentt ?)<br />
|Main boilerplate with extended "basic" function and code structure<br />
|-<br />
|BGA Type Safe Template<br />
|https://github.com/NevinAF/bga-ts-template<br />
|NevinAF<br />
|Full typing of all BGA Framework components.<br />
|-<br />
! GAME<br />
! CODE LINK<br />
! DEVELOPER<br />
! COMMENT<br />
|-<br />
| 99 (Trick-taking Card Game)<br />
| https://github.com/ekelly/bga-ninetynine<br />
| QuasarDukeDev<br />
|-<br />
| Abandon All Artichokes<br />
| https://github.com/0-wiz-0/bga-abandonallartichokes<br />
| __wiz__, rojomojo<br />
|-<br />
| Assyria <br />
| https://github.com/sebastien-prudhomme/bga-assyria<br />
| daikinee <br />
|-<br />
| Aura<br />
| https://github.com/micahstairs/bga-aura<br />
| Micah Stairs (micahstairs)<br />
|-<br />
| Bandido <br />
| https://github.com/opheliehb/BandidoBGA<br />
| ophelopede & Harkle <br />
|-<br />
| The Battle for Hill 218<br />
| https://github.com/danielholmes/battle-for-hill-218<br />
| Daniel Holmes (dhau)<br />
|-<br />
| Bonbons<br />
| https://github.com/AntonioSoler/bga-bonbons<br />
| Morgalad <br />
|-<br />
|Big Monster<br />
|https://github.com/nmatton/bigmonster<br />
|nicotacotac<br />
|-<br />
| Bonsai<br />
| https://github.com/PhilipDavis/BGA-Bonsai<br />
| Philip Davis (pdw3)<br />
| Action stack for client-side undo system; generator functions to model complex turn workflows; infinite hex grid with auto resizing; all data in a single JSON blob; animated scorepad<br />
|-<br />
| Canosa<br />
| https://codeberg.org/halibut/Canosa<br />
| junibegood<br />
|-<br />
| Coinche<br />
| https://github.com/drasill/bga-coinche<br />
| Draasill<br />
|-<br />
|Copenhagen<br />
|https://github.com/JoeProgram/bga-copenhagen<br />
|JoeProgram<br />
|-<br />
| Coup: City State<br />
| https://github.com/quietmint/bga-coupcitystate<br />
| quietmint<br />
|-<br />
| Dice Summoners<br />
| https://github.com/eoincos/bga-dicesummoners<br />
| eoincos<br />
|-<br />
| Dungeon Roll<br />
| https://github.com/MartinGoulet/bga-dungeonroll<br />
| MGoulet<br />
|-<br />
| Egyptian Ratscrew<br />
| https://github.com/0BuRner/bga-egyptianratscrew<br />
| 0BuRner<br />
|-<br />
| Eruption<br />
| https://github.com/AndyKerrison/bga-eruption<br />
| Andy_K<br />
|-<br />
| A Fistful Of Gold<br />
| https://bitbucket.org/Joel_L/fistfulofgold<br />
| Brainchild<br />
|-<br />
| Fled<br />
| https://github.com/PhilipDavis/BGA-Fled<br />
| Philip Davis (pdw3)<br />
| All data in a single JSON blob<br />
|-<br />
|Flip Freighters<br />
|https://github.com/joesimpson/bga-flipfreighters<br />
|joesimpson<br />
|-<br />
| Florenza: The Card Game<br />
| https://github.com/alberto-bottarini/bga-florenza<br />
| tarini <br />
|-<br />
| For-Ex<br />
| https://github.com/Fnordistan/forex<br />
| AmadanNaBriona<br />
|-<br />
| Get the MacGuffin<br />
| https://github.com/mizutismask/bga-get-the-MacGuffin<br />
| mizutismask<br />
|-<br />
| Hardback<br />
| https://github.com/quietmint/bga-hardback<br />
| quietmint<br />
|-<br />
| Hearts '''(Tutorial)'''<br />
| https://github.com/elaskavaia/bga-heartsla<br />
| Victoria_La<br />
|<br />
|-<br />
| Homesteaders<br />
| https://github.com/npatron/bga-homesteaders<br />
| TheBoot<br />
|-<br />
| Incan Gold<br />
| https://github.com/AntonioSoler/bga-incangold<br />
| Morgalad <br />
|-<br />
| In the Year of the Dragon (10th Anniversary Edition)<br />
| https://github.com/Fnordistan/ityotd<br />
| AmadanNaBriona<br />
|-<br />
| Just Desserts<br />
| https://github.com/mizutismask/bga-just-desserts<br />
| mizutismask<br />
|<br />
|-<br />
| The King's Guild<br />
| https://github.com/AdamNovotny/BGG-KingsGuild<br />
| A-dam<br />
|-<br />
| The Lady and the Tiger (Doors)<br />
| https://github.com/Fnordistan/ladyandthetiger<br />
| AmadanNaBriona<br />
|-<br />
|Linkage<br />
|https://github.com/ShaPhi7/linkage<br />
|ShaPhi7<br />
|<br />
|-<br />
|Love Letter<br />
|https://github.com/ShaPhi7/loveletter<br />
|ShaPhi7<br />
|<br />
|-<br />
| Mapmaker: The Gerrymandering Game<br />
| https://github.com/gzhang01/bga-mapmaker<br />
| gkz<br />
|-<br />
| Marco Polo<br />
| https://github.com/rcitaliano/MarcoPolo<br />
| rcitaliano<br />
|<br />
|-<br />
| Nile<br />
| https://github.com/AndyKerrison/bga-nile<br />
| Andy_K<br />
|-<br />
|Ninjan<br />
|https://github.com/dorukkicikoglu/bga-ninjan<br />
|fenadoruk<br />
|-<br />
| Noir: Killer vs Inspector<br />
| https://bitbucket.org/chhuang76/bga_noirkvi<br />
| ch huang<br />
|-<br />
|Now Boarding<br />
|https://github.com/quietmint/bga-nowboarding<br />
|quietmint<br />
|-<br />
|Odin<br />
|https://github.com/dorukkicikoglu/bga-odin<br />
|fenadoruk<br />
|-<br />
| Penny Press<br />
| https://github.com/AdamNovotny/bga-blooms<br />
| A-dam<br />
|-<br />
| Perikles<br />
| https://github.com/Fnordistan/perikles<br />
| AmadanNaBriona<br />
|<br />
|-<br />
| P.I.<br />
| https://gitlab.com/fa81/bga-pi, https://github.com/hellp/bga-pi (mirror)<br />
| Fabian Neumann (fa81)<br />
|-<br />
| President<br />
| https://github.com/quaresma95/president<br />
| quaresma95<br />
|-<br />
| Santorini<br />
| https://github.com/AntonioSoler/bga-santorini<br />
| Morgalad, quietmint, Tisaac<br />
|-<br />
| Tablut<br />
| https://github.com/Lucas-C/tablut<br />
| Lucas-C & ntaffore<br />
|-<br />
| Takara Island<br />
| https://github.com/AntonioSoler/bga-takaraisland<br />
| Morgalad<br />
|-<br />
| Taluva<br />
| https://github.com/quietmint/bga-taluva<br />
| Morgalad & quietmint<br />
|-<br />
| Teotihuacan: City of Gods<br />
| https://github.com/Trompetenhut/bga-teotihuacan<br />
| Trompetenhut<br />
|-<br />
| Texas 42 (domino game, still under development)<br />
| https://github.com/ishermandom/bga-42<br />
| Stardust Spikes, Jason Turner-Maier, Ilya Sherman<br />
|-<br />
| Tic Tac Match<br />
| https://github.com/leocaseiro/bga-tictacmatch<br />
| Leo Caseiro<br />
|-<br />
| Trick of the Rails<br />
| https://github.com/Fnordistan/trickoftherails<br />
| AmadanNaBriona<br />
|-<br />
| Uptown<br />
| https://github.com/elliotkendall/bga-uptown<br />
| SpottedShroom<br />
|-<br />
| Via Magica<br />
| https://github.com/christopherburke/bga_viamagica<br />
| CuriousTerran<br />
|-<br />
|}<br />
<br />
== Projects on studio ==<br />
<br />
<br />
Any developer can add themselves to a project as read-only from https://studio.boardgamearena.com/#!projects page (almost any project).<br />
<br />
If it is not visible: a) it has no bgg id b) it is already published (use radio button to switch) c) it is an old game not developed on studio.<br />
<br />
== Other useful resources ==<br />
<br />
Moved to [[Tools_and_tips_of_BGA_Studio]]<br />
<br />
<br />
[[Category:Studio]]</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=BGA_Code_Sharing&diff=23361BGA Code Sharing2024-11-30T13:08:44Z<p>Fenadoruk: /* Projects */</p>
<hr />
<div>{{Studio_Framework_Navigation}}<br />
<br />
This page is for listing of externally hosted bga projects, tools and resources, as well as internal project<br />
intended for sharing<br />
<br />
== Community shared components, pens, etc ==<br />
<br />
<br />
{| class="wikitable"<br />
|-<br />
! NAME<br />
! CODE LINK<br />
! DESCRIPTION<br />
|-<br />
! colspan="3" | Dice models and animation<br />
|-<br />
| Die: 4 sided <br />
| https://codepen.io/mrkiffie/pen/doVZgW ; https://codepen.io/VictoriaLa/pen/JjZNezr<br />
| code pen<br />
|-<br />
| Die: 6 sided <br />
| https://github.com/elaskavaia/bga-sharedcode ; https://codepen.io/VictoriaLa/pen/QWBBbwz<br />
| <br />
|-<br />
| Die: 8 sided <br />
| https://codepen.io/VictoriaLa/pen/YzMPeGq<br />
| code pen<br />
|-<br />
| Die: 12 sided (dodecahedron) <br />
| https://codepen.io/VictoriaLa/pen/xxLLxOP <nowiki/> https://codepen.io/hoursgoby/pen/GRwQzxo<br />
| Code pen<br />
|- <br />
| Die: 20 sided <br />
| https://codepen.io/vicentemundim/details/cenIh<br />
| Code pen<br />
|-<br />
|Dice<br />
|[https://github.com/thoun/bga-dice/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-dice/demo/index.html Demo] (not used yet)<br />
|Handle dice display and animation '''WORK IN PROGRESS''' Only d6 is started<br />
|-<br />
! colspan="3" | Moving object using CSS animation (mostly)<br />
|-<br />
| Phantom object move on oversurface <br />
| https://codepen.io/VictoriaLa/pen/gORvdJo<br />
| This technique creates clone of the object it moves it on another surface. It works well when parents that css transform applies such as scale and rotate<br />
|-<br />
| Move object directly using positioning <br />
| https://codepen.io/VictoriaLa/pen/dyzgKVX<br />
| This technique is modification of BGA framework method to allow mobile object not to have absolute position before or after the move (and uses css animation not dojo). Methods slideToObjectRelative, attachToNewObjectNoDestroy<br />
|-<br />
! colspan="3" | Responsive layout, zoom and navigation for game boards<br />
|-<br />
|Flex Layout<br />
|https://codepen.io/VictoriaLa/pen/XWjJJgG<br />
|Example on how to create flexible layout just by using css<br />
|-<br />
|Zoom<br />
|[https://github.com/thoun/bga-zoom/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-zoom/demo/index.html Demo] (visible on Knarr, Azul, Abyss, ...)<br />
|Allow the user to zoom on the game board. Include the controls to zoom, and handle the scale applied to the HTML element.<br />
|-<br />
|Jump to<br />
|[https://github.com/thoun/bga-jump-to/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-jump-to/demo/index.html Demo] (visible on Knarr, Elawa)<br />
|Add floating controls to quickly jump to a player's table<br />
|-<br />
! colspan="3" | Algorithms<br />
|-<br />
|Hex grid<br />
|tapestry,Tumbleweed,gaia project,Gold West<br />
|<br />
|-<br />
|Shortest path on hex grid<br />
|memoir 44<br />
| Dijkstra<br />
|-<br />
|Largest area on hex grid<br />
|tapestry, ...<br />
|<br />
|-<br />
|Largest area on square grid<br />
|king domino, ...<br />
|<br />
|-<br />
|Tetris pieces<br />
|patchwork, ...<br />
|Matrix manupations to rotate, flip and fit tetris pieces<br />
|-<br />
|Line of sights on hex grid<br />
|memoir 44<br />
|Find intersecting hexes on a line between two cells<br />
|-<br />
! colspan="3" | Alternative implementations of BGA modules<br />
|-<br />
|Scrollmap with zoom<br />
|https://github.com/yansnow78/bga_scrollmap<br />
|you can find it in cacao, ginkgopilis, sagani, bigmonster,dominoes, Carcassonne hunters and gatherers and many others. <nowiki>#</nowiki> improvements compare to scrollmap:<br />
- add zoom capabilities <br />
<br />
- add possibility to adjust pan delta to tile size when clicking on arrows<br />
<br />
- allow zoom with scroll wheel. only allow zoom with wheel if alt or ctrl or shift are pressed by default. add possibility to select which key need to be pressed when zooming with wheel<br />
<br />
- allow pan/scroll and pinch zoom on smartphone. only allow 2 fingers to start scrolling by default, one finger is for page scrolling<br />
<br />
- make clickable area of buttons a bit bigger on smartphone<br />
<br />
- improve animation between game board and player bards thanks to an animation_div<br />
<br />
- add support to long click on buttons (continuous scroll or zoom or enlarge/reduce until button released)<br />
|-<br />
|Scrollmap Plus <br />
|patchwork<br />
|Implementation with some bugs fixed, improved drag support and ability to use only one direction (i.e. only horizontal like carousel). Found in modules/extscrollmap.js<br />
|-<br />
|Cards<br />
|[https://github.com/thoun/bga-cards/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-cards/demo/index.html Demo] (visible on Knarr, King of Tokyo, Abyss, ...)<br />
|Alternative to BGA Stock component, using CSS transitions instead of dojo animations.<br />
|-<br />
! colspan="3" | Assorted stuff<br />
|-<br />
|Help<br />
|[https://github.com/thoun/bga-help/ Repo]<nowiki> | </nowiki>[https://thoun.github.io/bga-help/demo/index.html Demo] (visible on Knarr)<br />
|Add floating help buttons at the bottom left corner of the screen<br />
<br />
|}<br />
<br />
== Projects ==<br />
<br />
Add the game name, a link to repository 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] topic on github.<br />
<br />
'''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.<br />
'''<br />
<br />
{| class="wikitable"<br />
|-<br />
! NON-GAME PROJECTS<br />
! CODE LINK<br />
! DEVELOPER<br />
! COMMENT<br />
|-<br />
| Shared Code (not a game)<br />
| https://github.com/elaskavaia/bga-sharedcode<br />
| Victoria_La<br />
| Examples of various game components and PHP stubs of framework code to make IDE happy<br />
|-<br />
| Vanilla Typescipt template (not a game)<br />
| https://github.com/elaskavaia/bga-dojoless<br />
| Victoria_La<br />
| Project template for typescript and using minimal dojo, good for vscode - type checking, auto-complete, navigation<br />
|-<br />
| BoardGameArena Workbench (not a game)<br />
| https://github.com/danielholmes/bga-workbench<br />
| Daniel Holmes (dhau)<br />
|-<br />
|BGA-boilerplate<br />
|https://github.com/bga-devs/tisaac-boilerplate/<br />
|Tisaac (and Vincentt ?)<br />
|Main boilerplate with extended "basic" function and code structure<br />
|-<br />
|BGA Type Safe Template<br />
|https://github.com/NevinAF/bga-ts-template<br />
|NevinAF<br />
|Full typing of all BGA Framework components.<br />
|-<br />
! GAME<br />
! CODE LINK<br />
! DEVELOPER<br />
! COMMENT<br />
|-<br />
| 99 (Trick-taking Card Game)<br />
| https://github.com/ekelly/bga-ninetynine<br />
| QuasarDukeDev<br />
|-<br />
| Abandon All Artichokes<br />
| https://github.com/0-wiz-0/bga-abandonallartichokes<br />
| __wiz__, rojomojo<br />
|-<br />
| Assyria <br />
| https://github.com/sebastien-prudhomme/bga-assyria<br />
| daikinee <br />
|-<br />
| Aura<br />
| https://github.com/micahstairs/bga-aura<br />
| Micah Stairs (micahstairs)<br />
|-<br />
| Bandido <br />
| https://github.com/opheliehb/BandidoBGA<br />
| ophelopede & Harkle <br />
|-<br />
| The Battle for Hill 218<br />
| https://github.com/danielholmes/battle-for-hill-218<br />
| Daniel Holmes (dhau)<br />
|-<br />
| Bonbons<br />
| https://github.com/AntonioSoler/bga-bonbons<br />
| Morgalad <br />
|-<br />
|Big Monster<br />
|https://github.com/nmatton/bigmonster<br />
|nicotacotac<br />
|-<br />
| Bonsai<br />
| https://github.com/PhilipDavis/BGA-Bonsai<br />
| Philip Davis (pdw3)<br />
| Action stack for client-side undo system; generator functions to model complex turn workflows; infinite hex grid with auto resizing; all data in a single JSON blob; animated scorepad<br />
|-<br />
| Canosa<br />
| https://codeberg.org/halibut/Canosa<br />
| junibegood<br />
|-<br />
| Coinche<br />
| https://github.com/drasill/bga-coinche<br />
| Draasill<br />
|-<br />
|Copenhagen<br />
|https://github.com/JoeProgram/bga-copenhagen<br />
|JoeProgram<br />
|-<br />
| Coup: City State<br />
| https://github.com/quietmint/bga-coupcitystate<br />
| quietmint<br />
|-<br />
| Dice Summoners<br />
| https://github.com/eoincos/bga-dicesummoners<br />
| eoincos<br />
|-<br />
| Dungeon Roll<br />
| https://github.com/MartinGoulet/bga-dungeonroll<br />
| MGoulet<br />
|-<br />
| Egyptian Ratscrew<br />
| https://github.com/0BuRner/bga-egyptianratscrew<br />
| 0BuRner<br />
|-<br />
| Eruption<br />
| https://github.com/AndyKerrison/bga-eruption<br />
| Andy_K<br />
|-<br />
| A Fistful Of Gold<br />
| https://bitbucket.org/Joel_L/fistfulofgold<br />
| Brainchild<br />
|-<br />
| Fled<br />
| https://github.com/PhilipDavis/BGA-Fled<br />
| Philip Davis (pdw3)<br />
| All data in a single JSON blob<br />
|-<br />
|Flip Freighters<br />
|https://github.com/joesimpson/bga-flipfreighters<br />
|joesimpson<br />
|-<br />
| Florenza: The Card Game<br />
| https://github.com/alberto-bottarini/bga-florenza<br />
| tarini <br />
|-<br />
| For-Ex<br />
| https://github.com/Fnordistan/forex<br />
| AmadanNaBriona<br />
|-<br />
| Get the MacGuffin<br />
| https://github.com/mizutismask/bga-get-the-MacGuffin<br />
| mizutismask<br />
|-<br />
| Hardback<br />
| https://github.com/quietmint/bga-hardback<br />
| quietmint<br />
|-<br />
| Hearts '''(Tutorial)'''<br />
| https://github.com/elaskavaia/bga-heartsla<br />
| Victoria_La<br />
|<br />
|-<br />
| Homesteaders<br />
| https://github.com/npatron/bga-homesteaders<br />
| TheBoot<br />
|-<br />
| Incan Gold<br />
| https://github.com/AntonioSoler/bga-incangold<br />
| Morgalad <br />
|-<br />
| In the Year of the Dragon (10th Anniversary Edition)<br />
| https://github.com/Fnordistan/ityotd<br />
| AmadanNaBriona<br />
|-<br />
| Just Desserts<br />
| https://github.com/mizutismask/bga-just-desserts<br />
| mizutismask<br />
|<br />
|-<br />
| The King's Guild<br />
| https://github.com/AdamNovotny/BGG-KingsGuild<br />
| A-dam<br />
|-<br />
| The Lady and the Tiger (Doors)<br />
| https://github.com/Fnordistan/ladyandthetiger<br />
| AmadanNaBriona<br />
|-<br />
|Linkage<br />
|https://github.com/ShaPhi7/linkage<br />
|ShaPhi7<br />
|<br />
|-<br />
|Love Letter<br />
|https://github.com/ShaPhi7/loveletter<br />
|ShaPhi7<br />
|<br />
|-<br />
| Mapmaker: The Gerrymandering Game<br />
| https://github.com/gzhang01/bga-mapmaker<br />
| gkz<br />
|-<br />
| Marco Polo<br />
| https://github.com/rcitaliano/MarcoPolo<br />
| rcitaliano<br />
|<br />
|-<br />
| Nile<br />
| https://github.com/AndyKerrison/bga-nile<br />
| Andy_K<br />
|-<br />
| Noir: Killer vs Inspector<br />
| https://bitbucket.org/chhuang76/bga_noirkvi<br />
| ch huang<br />
|-<br />
|Now Boarding<br />
|https://github.com/quietmint/bga-nowboarding<br />
|quietmint<br />
|-<br />
|Odin<br />
|https://github.com/dorukkicikoglu/bga-odin<br />
|fenadoruk<br />
|-<br />
| Penny Press<br />
| https://github.com/AdamNovotny/bga-blooms<br />
| A-dam<br />
|-<br />
| Perikles<br />
| https://github.com/Fnordistan/perikles<br />
| AmadanNaBriona<br />
|<br />
|-<br />
| P.I.<br />
| https://gitlab.com/fa81/bga-pi, https://github.com/hellp/bga-pi (mirror)<br />
| Fabian Neumann (fa81)<br />
|-<br />
| President<br />
| https://github.com/quaresma95/president<br />
| quaresma95<br />
|-<br />
| Santorini<br />
| https://github.com/AntonioSoler/bga-santorini<br />
| Morgalad, quietmint, Tisaac<br />
|-<br />
| Tablut<br />
| https://github.com/Lucas-C/tablut<br />
| Lucas-C & ntaffore<br />
|-<br />
| Takara Island<br />
| https://github.com/AntonioSoler/bga-takaraisland<br />
| Morgalad<br />
|-<br />
| Taluva<br />
| https://github.com/quietmint/bga-taluva<br />
| Morgalad & quietmint<br />
|-<br />
| Teotihuacan: City of Gods<br />
| https://github.com/Trompetenhut/bga-teotihuacan<br />
| Trompetenhut<br />
|-<br />
| Texas 42 (domino game, still under development)<br />
| https://github.com/ishermandom/bga-42<br />
| Stardust Spikes, Jason Turner-Maier, Ilya Sherman<br />
|-<br />
| Tic Tac Match<br />
| https://github.com/leocaseiro/bga-tictacmatch<br />
| Leo Caseiro<br />
|-<br />
| Trick of the Rails<br />
| https://github.com/Fnordistan/trickoftherails<br />
| AmadanNaBriona<br />
|-<br />
| Uptown<br />
| https://github.com/elliotkendall/bga-uptown<br />
| SpottedShroom<br />
|-<br />
| Via Magica<br />
| https://github.com/christopherburke/bga_viamagica<br />
| CuriousTerran<br />
|-<br />
|}<br />
<br />
== Projects on studio ==<br />
<br />
<br />
Any developer can add themselves to a project as read-only from https://studio.boardgamearena.com/#!projects page (almost any project).<br />
<br />
If it is not visible: a) it has no bgg id b) it is already published (use radio button to switch) c) it is an old game not developed on studio.<br />
<br />
== Other useful resources ==<br />
<br />
Moved to [[Tools_and_tips_of_BGA_Studio]]<br />
<br />
<br />
[[Category:Studio]]</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpninjan&diff=23260Gamehelpninjan2024-11-18T19:27:23Z<p>Fenadoruk: Created page with "Ninjas bring rocks, scissors, and paper to a fight in Ninjan to help you recruit the strongest ninjas possible. Each player starts with a hand of nine cards, with cards belonging to one of three suits — rock/paper/scissor — and being valued from -6 to 10. Place three random cards face up on the table in separate piles; these are your first targets. Each turn, each player chooses a card from their hand, then reveals them simultaneously. Going from high value to low,..."</p>
<hr />
<div>Ninjas bring rocks, scissors, and paper to a fight in Ninjan to help you recruit the strongest ninjas possible.<br />
<br />
Each player starts with a hand of nine cards, with cards belonging to one of three suits — rock/paper/scissor — and being valued from -6 to 10. Place three random cards face up on the table in separate piles; these are your first targets.<br />
<br />
Each turn, each player chooses a card from their hand, then reveals them simultaneously. Going from high value to low, breaking ties according to the RPS rule, players see whether they will claim one of the piles in the center of the table. If you play 8 rock, for example, you must claim one of the piles with a scissor card on top, placing these claimed cards face up in front of you, then starting a new pile with your 8 rock. If you cannot claim a card, place your played card on a pile, leaving all numbers in the pile visible.<br />
<br />
After nine rounds, sum the values of the cards you've claimed. Whoever has the highest score wins.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpodin&diff=22554Gamehelpodin2024-09-13T13:00:12Z<p>Fenadoruk: </p>
<hr />
<div>===Overview===<br />
<br />
Combine cards to make whole numbers e.g. 5-2-8 is 852, and play the highest value combos in order to empty your hand the fastest<br />
<br />
<br />
===Turn===<br />
<br />
The first player plays 1 card<br />
<br />
Following players can play 1 or more cards<br />
<br />
The value of the card(s) played must be greater than what is already on the table<br />
<br />
Values of multiple cards are combined in such a way to form a whole number of the highest value possible e.g. two cards will form a value in the 10s e.g. 3 and 4 make 43, three cards will form a value in the 100s e.g. 5-2-8 will form 852, and so on<br />
<br />
You can play the same quantity of cards as previously played, or exactly 1 more than it, i.e. if there are three cards out, you can play 3 or 4 cards with a higher combined value, but not 5 cards<br />
<br />
If you play more than one card, they must all be of the same numeral or same suit e.g. 888 or 5-3-1 of all blue<br />
<br />
Once you have played a valid card(s), take one of the cards from the play you just defeated into your hand and discard the rest of the old cards<br />
<br />
If you cannot or do not wish to play, you can pass, but you still get a turn when it next comes round to you<br />
<br />
<br />
===Round End===<br />
<br />
If you were the last to change the game state and it comes round to you to play again, you just won the round<br />
<br />
The play area is cleared and you may start again with a new single card as first player<br />
<br />
<br />
===Hand End===<br />
<br />
If you start the round, and all cards in your hand are the same suit or value, you can play your whole hand instead of just one card and end the hand<br />
<br />
Otherwise, when a player empties their hand the Hand is over<br />
<br />
Everyone gains 1 point per card still in their hand when this is triggered - Be mindful that on the BGA adaptation, you lose points instead of gaining them<br />
<br />
<br />
===Game End===<br />
<br />
Depending on the length of the game, the game ends when a player reaches or exceeds 10/15/20 points<br />
<br />
The player with the fewest points, wins!<br />
<br />
<br />
Summarised by https://boardgamearena.com/player?id=90078516</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21624Gamehelpauctionland2024-06-22T22:12:50Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup:'''<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
{| class="wikitable"<br />
|1st player<br />
|2nd player<br />
|3rd player<br />
|4th player<br />
|5th player<br />
|6th player<br />
|-<br />
|$10<br />
|$12<br />
|$14<br />
|$16<br />
|$18<br />
|$20<br />
|}<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
1. '''Build Tile''': Select a tile from the market to add to your island.<br />
<br />
2. '''Auction Tile''': After building, select another tile and auction it off.<br />
<br />
3. '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any ❤️ icons. If they had only 1 ❤️, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21622Gamehelpauctionland2024-06-22T21:49:10Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
{| class="wikitable"<br />
|1st player<br />
|2nd player<br />
|3rd player<br />
|4th player<br />
|5th player<br />
|6th player<br />
|-<br />
|$10<br />
|$12<br />
|$14<br />
|$16<br />
|$18<br />
|$20<br />
|}<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
1. '''Build Tile''': Select a tile from the market to add to your island.<br />
<br />
2. '''Auction Tile''': After building, select another tile and auction it off.<br />
<br />
3. '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach terrain touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (contiguous terrains of the same type count as one area, diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas; so try to keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any ❤️ icons. If they had only 1 ❤️, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21573Gamehelpauctionland2024-06-20T11:26:40Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
1. '''Build Tile''': Select a tile from the market to add to your island.<br />
<br />
2. '''Auction Tile''': After building, select another tile and auction it off.<br />
<br />
3. '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach terrain touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (contiguous terrains of the same type count as one area, diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas; so try to keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any ❤️ icons. If they had only 1 ❤️, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21499Gamehelpauctionland2024-06-11T10:21:19Z<p>Fenadoruk: minor corrections</p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
1. '''Build Tile''': Select a tile from the market to add to your island.<br />
<br />
2. '''Auction Tile''': After building, select another tile and auction it off.<br />
<br />
3. '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach terrain touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent terrains of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any ❤️ icons. If they had only 1 ❤️, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21493Gamehelpauctionland2024-06-10T09:33:28Z<p>Fenadoruk: minor edits. BGA interface is not updating :( why?</p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
1. '''Build Tile''': Select a tile from the market to add to your island.<br />
<br />
2. '''Auction Tile''': After building, select another tile and auction it off.<br />
<br />
3. '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21492Gamehelpauctionland2024-06-10T09:13:38Z<p>Fenadoruk: rules updated</p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21491Gamehelpauctionland2024-06-10T09:07:15Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful facing the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Other players score 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21490Gamehelpauctionland2024-06-10T09:04:42Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings) but don't sort them.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful facing the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Charlie scores 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21489Gamehelpauctionland2024-06-10T09:02:08Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the market size set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn. Refresh the market back to 8 tiles (or the market size set in game settings), don't sort them by icons.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the highest bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Charlie scores 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21488Gamehelpauctionland2024-06-10T08:58:20Z<p>Fenadoruk: Minor updates to the rules</p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the number set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
• '''Sell''' the auctioned tile to the highest bidder.<br />
<br />
• '''Buy back''' the tile by paying the winning bid plus $1 to the bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
• '''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
<br />
• '''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
<br />
• '''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
<br />
• '''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
'''Example:''' Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Charlie scores 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21487Gamehelpauctionland2024-06-10T08:47:25Z<p>Fenadoruk: </p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the number set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
# '''Sell''' the auctioned tile to the highest bidder.<br />
# '''Buy back''' the tile by paying the winning bid plus $1 to the bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
'''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
'''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
'''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
'''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
<br />
Example: Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie score 20 points. Charlie scores 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Gamehelpauctionland&diff=21482Gamehelpauctionland2024-06-09T20:59:18Z<p>Fenadoruk: Rules updated by Doruk Kicikoglu (game designer and BGA developer)</p>
<hr />
<div><br />
Build and auction tiles to create the most impressive paradise island!<br />
<br />
<br />
'''Setup''' [BGA handles this for you, feel free to skip this part]:<br />
<br />
Each player grabs a screen and some money. The player who last visited a new island starts the game and takes the gavel! Starting money is distributed as follows:<br />
<br />
- 1st player: $10<br />
<br />
- 2nd player: $12<br />
<br />
- 3rd player: $14<br />
<br />
- 4th player: $16<br />
<br />
- 5th player: $18<br />
<br />
- 6th player: $20<br />
<br />
Place money behind your screen. You can enable '''visible money''' in the game settings.<br />
<br />
Create a stack of tiles and deal 8 tiles (or the number set in game settings) into the middle to form the market. Sort them by the number of icons (Peace, Love & Music), with more icons closer to the stack.<br />
<br />
<br />
'''Turn summary:'''<br />
<br />
# '''Build Tile''': Select a tile from the market to add to your island. <br />
# '''Auction Tile''': After building, select another tile and auction it off.<br />
# '''End turn''': Pass the gavel to the player on your left. It’s now their turn.<br />
<br />
<br />
'''The Market:'''<br />
<br />
Whenever you take a tile from the market (for building, auctioning, or Bonus), place $1 on each skipped tile starting from the free tile. Earn the money on the selected tile and place it behind your screen.<br />
<br />
<br />
'''Building Tiles:'''<br />
<br />
New tiles placed after your first must share an edge with an existing tile on your island. You can expand your island in any direction as long as it doesn’t go beyond 4x4.<br />
<br />
Placing the 4th tile in a row or column earns you a Bonus tile (see Bonus Tiles).<br />
<br />
<br />
'''Auctioning Tiles:''' <br />
<br />
After building your tile, select a new tile following '''the market''' rules and put it on auction! It’s an open auction carried out simultaneously. Players can increase bids -even their own- any time as long as you have enough money to pay for it. The auction phase is over once all but one player has passed.<br />
<br />
In a 2-player game, the bidding player makes only 1 bid which concludes the auction phase.<br />
<br />
In the rare case that no one bids, the auctioneer takes the tile for free.<br />
<br />
<br />
'''Buy back:'''<br />
<br />
Once the auction phase is over, the auctioneer can either:<br />
<br />
# '''Sell''' the auctioned tile to the highest bidder.<br />
# '''Buy back''' the tile by paying the winning bid plus $1 to the bidder. i.e. Alex won the auction phase with a bid of $3, the auctioneer can pay $4 to Alex and build the tile.<br />
<br />
The auctioneer can still buy back even if their island is full. In that case, the auctioned tile is returned to the game box.<br />
<br />
Make sure you are not bidding so little that the auctioneer buys it back from you. Or maybe you want them to! After all, you're being paid without losing anything!<br />
<br />
<br />
'''Bonus Tiles:'''<br />
<br />
After adding a tile to your island in '''any''' phase or for '''any''' reason, check whether it was the 4th tile of a row or column. If so, you immediately earn a Bonus tile!<br />
<br />
Draw a new tile following '''the market rules''' and build it by following the '''building tiles''' rules. Each player can earn only 1 Bonus tile per turn. In other words, a Bonus tile cannot trigger another Bonus, but more than 1 player can draw a Bonus tile on a single turn.<br />
<br />
<br />
'''Game End:'''<br />
<br />
Once a player has filled their 4x4 island, the game will be over at the end of that turn. This means you still proceed to the '''auction phase''' if you haven’t already done so.<br />
<br />
<br />
'''SCORING'''<br />
<br />
'''Beaches:''' Imagine the table is the ocean! Count tiles with a beach zone touching the edge of your island. Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
If a beach is not on the edge but still adjacent to a gap (because your 4x4 island wasn’t filled up) it still scores. The table is the ocean and it’s a wonderful beach by the water!<br />
<br />
<br />
'''Theme Parks:''' Count tiles in your largest contiguous theme park area (diagonal connections don’t count). Score points based on the scoring table found in the game’s tooltips. <br />
<br />
<br />
'''Gardens & Houses:''' Multiply the number of garden areas by the number of house areas. Adjacent zones of the same type count as one area; so keep gardens separate from other gardens and likewise for the houses. '''It’s fine if a garden is touching a house.'''<br />
<br />
<br />
'''Icons:''' The positions of the icons don’t matter. Each icon type scores separately. The player with the highest number of an icon type scores 20 points, 2nd player scores 10 and 3rd player scores 5. Ties are friendly; all tying players score the same amount of points but you skip the next number for each tying player.<br />
<br />
You must have at least 1 icon of the type to score points from it.<br />
<br />
<br />
Example: Alex has 2 ☮️, 2 ❤️, 3 🎵. Bonnie-Beth has 3 ☮️, 2 ❤️, 3 🎵. Charlie has 3 ☮️and 3 🎵. Doruk has only 1 🎵.<br />
<br />
☮️ (A: 2, B: 3, C: 3, D: 0): Alex scores 5 points. Bonnie-Beth and Charlie score 20 each.<br />
<br />
❤️ (A: 2, B: 2, C: 0, D: 0): Alex and Bonnie-Beth score 20 points. Charlie scores 0 as they don’t have any love icons. If they had only 1 Love icon, it’d be 5 points for them!<br />
<br />
🎵 (A: 3, B: 3, C: 3, D: 1): Alex, Bonnie-beth and Charlie score 20 points. Doruk doesn’t score.<br />
<br />
<br />
Most points win. Money breaks ties.</div>Fenadorukhttps://en.doc.boardgamearena.com/index.php?title=Studio_logs&diff=19585Studio logs2024-01-17T09:21:47Z<p>Fenadoruk: /* BGA request&SQL logs */</p>
<hr />
<div>{{Studio_Framework_Navigation}}<br />
<br />
Logs allows you to check out what happened recently on server and to debug your game.<br />
<br />
BGA Studio logs are available directly from your game development interface. You can also navigate to them: https://studio.boardgamearena.com/1/mygame/mygame/logaccess.html?table=######, where you replace mygame and ###### accordingly.<br />
<br />
== BGA request&SQL logs ==<br />
<br />
This log is useful:<br />
* When you want to check what SQL requests has been built during a request.<br />
* When you want to debug your PHP code using "self::trace"<br />
* When you want to know why a request takes too much time.<br />
<br />
<br />
On this log, you can see:<br />
<br />
=== Your requests ===<br />
<br />
Example:<br />
<br />
20/06 21:50:56 [info] [T403] [4/mytest0] /cinco/cinco/exchange4Cards.html?id=4&lock=97d1c7a1-903a-4d1f-8206-de39ce8204fc&table=403&testuser=4&dojo.preventCache=1371757856044<br />
<br />
Note that the best way to check your Ajax request is to read the [[http://en.doc.boardgamearena.com/Tools_and_tips_of_BGA_Studio#Input.2FOutput_debugging_section Input/Output section]].<br />
<br />
=== Request responses ===<br />
<br />
Example:<br />
<br />
20/06 21:50:56 [notice] [T403] [4/mytest0] OK-0 169 d141 c8 e0 I9 A158 V0 T0 /cinco/cinco/exchange4Cards.html?id=4&lock=97d1c7a1-903a-4d1f-8206-de39ce8204fc&table=403&testuser=4&dojo.preventCache=1371757856044<br />
<br />
You can recognize a response because it contains [notice]. Usually, there is one response for each request.<br />
<br />
Let's details the beginning of the log:<br />
* 20/06 21:50:56: the date<br />
* [notice]<br />
* [T403]: this is a log from table 403<br />
* [4/mytest0]: this is use "mytest0", with id 4<br />
* OK-0: it means that the request ended up successfully, with no exception (expected or unexpected).<br />
* 169: this is the time taken to process the request (169ms).<br />
* d141: this is the total Database time used to process the request (141ms).<br />
<br />
=== SQL requests ===<br />
<br />
Example:<br />
20/06 21:50:56 [info] [T403] [4/mytest0] 0.26 SELECT player_tokenColor FROM player WHERE player_id ='4'<br />
<br />
All requests to Database are traced in this log. You can see here the time take by the request (0,26ms).<br />
<br />
=== Custom trace ===<br />
<br />
You can use special PHP methods in your PHP code to left some trace in this log:<br />
* self::trace( "your message here" ); // Display "your message here" in the log<br />
* self::dump( "My variable", $variable_to_dump ); // Display the content of $variable_to_dump in the log<br />
<br />
== BGA unexpected exceptions logs ==<br />
<br />
In this log you can check the last Unexpected exceptions from your game.<br />
<br />
Exceptions management on PHP side [[http://en.doc.boardgamearena.com/Main_game_logic:_yourgamename.game.php#Managing_errors_and_exceptions is described here]].<br />
<br />
The log displayed the complete stacktrace of the exception, so you can debug it.<br />
<br />
The SQL log is very verbose and sometimes it too hard to extract your tracing from it, in this case you can use error log for tracing temporarily.<br />
You can add debug statement using self::warn() which will appear in that the log. Do not leave these tracing method calls after you done debugging unless they<br />
are real warnings or errors (only the error log level will appear in production).<br />
<br />
<br />
[[Category:Studio]]</div>Fenadoruk