BgaDice - Revision history

Armandberger: add a new simple with a very sample case without gamedata use

2026-10-03T17:18:53Z

add a new simple with a very sample case without gamedata use

← Older revision		Revision as of 17:18, 3 October 2026
Line 60:		Line 60:
	</pre>		</pre>

			Example of usage for a simple d6 die:
			in your game.js setup
			// create the dice manager
			this.diceManager = new BgaDice.Manager({
			animationManager: this.animationManager,
			type: 'myverysimpledice',
			setupFaceDiv(die, element, face) {element.innerText = `${face}`;},

			});
			//create the set of dice with one die
			this.diceLineStock = new BgaDice.LineStock(this.diceManager, document.getElementById('mydicetray'));
			this.diceLineStock.addDice([{ id: 1, location: 'table', face: 6}]);

			make a roll on a event
			onMakeARoll (event) {
			const dice = this.diceLineStock.getDice();
			dice.forEach(die => die.face = Math.floor(Math.random() * 6) + 1);
			dice.forEach(die => { this.diceLineStock.rollDice(dice);});

			in yourgame.css
			.myverysimpledice .bga-dice_die-face {color: black; font-weight: bold; text-align: center;}
			.myverysimpledice-face-1, .myverysimpledice-face-2, .myverysimpledice-face-3, .myverysimpledice-face-4, .myverysimpledice-face-5, .myverysimpledice-face-6 { border: 1px solid black; line-height: calc(var(--size));background-color: white;}
			If you want to make a simple custom d6 die, just follow the previous example and change the css by something like
			//mycustomdice.png is a 300px * 50 px picture of all faces

			.myverysimpledice .bga-dice_die-face {background-image: url('img/mycustomdice.png');}
			.myverysimpledice-face-1 {background-position-x: 0px; }
			.myverysimpledice-face-2 {background-position-x: 250px; }
			.myverysimpledice-face-3 {background-position-x: 200px;}
			.myverysimpledice-face-4 {background-position-x: 150px;}
			.myverysimpledice-face-5 {background-position-x: 100px;}
			.myverysimpledice-face-6 {background-position-x: 50px;}
	Look at the demo page and the demo source code for a list of all possibilities!		Look at the demo page and the demo source code for a list of all possibilities!

Jiiru: /* Overview */

2026-09-09T10:26:14Z

Overview

← Older revision		Revision as of 10:26, 9 September 2026
Line 7:		Line 7:

	To see how its work and access examples of source code (via browser dev tools) see		To see how its work and access examples of source code (via browser dev tools) see
	'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/~~docs~~/index.html Demo]'''		'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/demo/index.html Demo]'''

	For comprehensive API docs see		For comprehensive API docs see
	'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/~~demo~~/index.html Doc]'''		'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/docs/index.html Doc]'''

	== Usage ==		== Usage ==

Nalka: Fix typo Demo VS Doc

2026-07-30T10:55:52Z

Fix typo Demo VS Doc

← Older revision		Revision as of 10:55, 30 July 2026
Line 7:		Line 7:

	To see how its work and access examples of source code (via browser dev tools) see		To see how its work and access examples of source code (via browser dev tools) see
	'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/docs/index.html ~~Doc~~]'''		'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/docs/index.html Demo]'''

	For comprehensive API docs see		For comprehensive API docs see
	'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/demo/index.html ~~Demo~~]'''		'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/demo/index.html Doc]'''

	== Usage ==		== Usage ==

Thoun at 09:00, 23 June 2026

2026-06-23T09:00:52Z

← Older revision		Revision as of 09:00, 23 June 2026
Line 18:		Line 18:
	const BgaDice = await importEsmLib('bga-dice', '1.x');		const BgaDice = await importEsmLib('bga-dice', '1.x');
	</pre>		</pre>
			This line should be placed on top of the JS file, before any class declaration.

	Legacy way;		Legacy way;

Thoun at 12:57, 16 June 2026

2026-06-16T12:57:40Z

← Older revision		Revision as of 12:57, 16 June 2026
Line 84:		Line 84:

	== Changelog ==		== Changelog ==
	'''1.0.2''': more logs for ~~card~~ element not matching a card / accept keyed objects in addition to arrays on inputs		'''1.0.2''': more logs for dice element not matching a card / accept keyed objects in addition to arrays on inputs

	'''1.0.1''': Fix documentation		'''1.0.1''': Fix documentation

Thoun at 09:06, 10 June 2026

2026-06-10T09:06:45Z

← Older revision		Revision as of 09:06, 10 June 2026
Line 84:		Line 84:

	== Changelog ==		== Changelog ==
			'''1.0.2''': more logs for card element not matching a card / accept keyed objects in addition to arrays on inputs

	'''1.0.1''': Fix documentation		'''1.0.1''': Fix documentation

Victoria La at 15:37, 21 December 2025

2025-12-21T15:37:35Z

← Older revision		Revision as of 15:37, 21 December 2025
Line 1:		Line 1:
	{{Studio_Framework_Navigation}}		{{Studio_Framework_Navigation}}

	~~'''<big>[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/demo/index.html Demo] [https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/docs/index.html Doc]</big>'''~~

	== Overview ==		== Overview ==
Line 8:		Line 6:
	The lib will handle associated animations (roll animation, moving between stocks).		The lib will handle associated animations (roll animation, moving between stocks).

	~~The API documentation is here:~~ [https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/docs/index.html Doc]		To see how its work and access examples of source code (via browser dev tools) see
			'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/docs/index.html Doc]'''

	~~The Demo site is here:~~ [https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/demo/index.html Demo]		For comprehensive API docs see
			'''[https://x.boardgamearena.net/data/game-libs/bga-dice/1.x/demo/index.html Demo]'''

	== Usage ==		== Usage ==

Nalka: Fix typo

2025-12-20T23:19:09Z

Fix typo

← Older revision		Revision as of 23:19, 20 December 2025
Line 54:		Line 54:

	async notif_rollDice(args) {		async notif_rollDice(args) {
	await this.~~dieStoc~~.rollDice(args.rolledDice); // similar form as above, but with a different face value.		await this.dieStock.rollDice(args.rolledDice); // similar form as above, but with a different face value.
	}		}

Thoun at 14:17, 19 December 2025

2025-12-19T14:17:48Z

← Older revision		Revision as of 14:17, 19 December 2025
Line 35:		Line 35:
	// create the animation manager, and bind it to the `gameui.bgaAnimationsActive()` function		// create the animation manager, and bind it to the `gameui.bgaAnimationsActive()` function
	this.animationManager = new BgaAnimations.Manager({		this.animationManager = new BgaAnimations.Manager({
	animationsActive: () => this.gameui.bgaAnimationsActive(),		animationsActive: () => this.bga.gameui.bgaAnimationsActive(),
	});		});

Thoun at 10:03, 16 December 2025

2025-12-16T10:03:02Z

← Older revision		Revision as of 10:03, 16 December 2025
Line 14:		Line 14:
	== Usage ==		== Usage ==
	Load the lib:		Load the lib:
			<pre>
			const BgaAnimations = await importEsmLib('bga-animations', '1.x'); // the library uses bga-animations so this is required!
			const BgaDice = await importEsmLib('bga-dice', '1.x');
			</pre>

			Legacy way;
	<pre>		<pre>
	define([		define([
Line 27:		Line 33:
	In your game setup:		In your game setup:
	<pre>		<pre>
	// create the animation manager, and bind it to the `~~game~~.bgaAnimationsActive()` function		// create the animation manager, and bind it to the `gameui.bgaAnimationsActive()` function
	this.animationManager = new BgaAnimations.Manager({		this.animationManager = new BgaAnimations.Manager({
	animationsActive: () => this.bgaAnimationsActive(),		animationsActive: () => this.gameui.bgaAnimationsActive(),
	});		});

Line 47:		Line 53:
	this.dieStock.addDice(gamedatas.dice); // dice should be something like [{ id: 1, face: 5, location: 'table' }]		this.dieStock.addDice(gamedatas.dice); // dice should be something like [{ id: 1, face: 5, location: 'table' }]

	notif_rollDice~~: async function~~(args) {		async notif_rollDice(args) {
	await this.dieStoc.rollDice(args.rolledDice); // similar form as above, but with a different face value.		await this.dieStoc.rollDice(args.rolledDice); // similar form as above, but with a different face value.
	}		}