This is a documentation for Board Game Arena: play board games online !

BgaAutofit: Difference between revisions

From Board Game Arena
Jump to navigation Jump to search
(Created page with "{{Studio_Framework_Navigation}} == Overview == '''bga-autofit''' is a javascript component that you can use in your game interface to make text fit some fixed-size boxes. The main usage is to make translated text on game cards fix the dedicated space of the card image. Category:Studio")
 
No edit summary
Line 1: Line 1:
{{Studio_Framework_Navigation}}
{{Studio_Framework_Navigation}}
Demo : https://x.boardgamearena.net/data/game-libs/bga-autofit/1.x/demo/index.html Doc : https://x.boardgamearena.net/data/game-libs/bga-autofit/1.x/docs/index.html


== Overview ==
== Overview ==
'''bga-autofit''' is a javascript component that you can use in your game interface to make text fit some fixed-size boxes.
The main usage is to make translated text on game cards fix the dedicated space of the card image.


== Usage ==
Load the lib:
<pre>
define([
    "dojo","dojo/_base/declare",
    "ebg/core/gamegui",
    "ebg/counter",
    getLibUrl('bga-autofit', '1.x'),
],
function (dojo, declare, gamegui, counter, BgaAutofit) { // note that the index of `BgaAutofit` must match the index of the define array
</pre>


'''bga-autofit''' is a javascript component that you can use in your game interface to make text fit some fixed-size boxes.
At the end of your game setup:
<pre>
    BgaAutofit.init();
</pre>
 
On any HTML element with fixed size that contain text to be fitted into:
<pre>
    <div class="my-class-for-fixed-size bga-autofit">${text}</div>
</pre>


The main usage is to make translated text on game cards fix the dedicated space of the card image.
== Changelog ==
'''1.0.0''': Initial version


[[Category:Studio]]
[[Category:Studio]]

Revision as of 10:47, 18 June 2025


Game File Reference



Useful Components

Official

  • Deck: a PHP component to manage cards (deck, hands, picking cards, moving cards, shuffle deck, ...).
  • PlayerCounter and TableCounter: PHP components to manage counters.
  • Draggable: a JS component to manage drag'n'drop actions.
  • Counter: a JS component to manage a counter that can increase/decrease (ex: player's score).
  • ExpandableSection: a JS component to manage a rectangular block of HTML than can be displayed/hidden.
  • Scrollmap: a JS component to manage a scrollable game area (useful when the game area can be infinite. Examples: Saboteur or Takenoko games).
  • Stock: a JS component to manage and display a set of game elements displayed at a position.
  • Zone: a JS component to manage a zone of the board where several game elements can come and leave, but should be well displayed together (See for example: token's places at Can't Stop).
  • bga-animations : a JS component for animations.
  • bga-cards : a JS component for cards.
  • bga-dice : a JS component for dice.
  • bga-autofit : a JS component to make text fit on a fixed size div.
  • bga-score-sheet : a JS component to help you display an animated score sheet at the end of the game.

Unofficial



Game Development Process



Guides for Common Topics



Miscellaneous Resources

Demo : https://x.boardgamearena.net/data/game-libs/bga-autofit/1.x/demo/index.html Doc : https://x.boardgamearena.net/data/game-libs/bga-autofit/1.x/docs/index.html

Overview

bga-autofit is a javascript component that you can use in your game interface to make text fit some fixed-size boxes.

The main usage is to make translated text on game cards fix the dedicated space of the card image.

Usage

Load the lib:

define([
    "dojo","dojo/_base/declare",
    "ebg/core/gamegui",
    "ebg/counter",
    getLibUrl('bga-autofit', '1.x'),
],
function (dojo, declare, gamegui, counter, BgaAutofit) { // note that the index of `BgaAutofit` must match the index of the define array

At the end of your game setup:

    BgaAutofit.init();

On any HTML element with fixed size that contain text to be fitted into:

    <div class="my-class-for-fixed-size bga-autofit">${text}</div>

Changelog

1.0.0: Initial version