Revision as of 08:54, 12 January 2020

Main Article: Building Character Sheets

This page is about the <button> and it's known options for usage in creating character sheets.

The <button> have three roll20-specific types that can be used in character sheets; type="roll", type="action", type="compendium".

Roll Button

Example:

<button type="roll" value="/roll 1d20 + @{Bluff}" name="roll_BluffCheck"></button>

the type-attribute should be set to roll
the roll macro is defined in the value-attribute. See Macros for how to write them
the optional name-attribute allows the roll to be referenced in external Macros and Abilities. The name must be prefixed with roll_ for this to work, and each roll button should have a unique name. Buttons in repeating sections automatically gain a unique prefix/suffix in their name.

To call a named roll button in the chat, it works similarly like calling a defined Ability macro from the A & A tab, e.g. %{Bob|BluffCheck}. This will call the "BluffCheck" button of the character named "Bob".

Action Button

Example:

<button type="action" name="act_reduce"></button>

Action buttons can be used as events to trigger Sheetworkers.

the type-attribute must be set to action
the name-attribute must be defined, and have a act_ prefix to function

Two common uses:

Swap between sheet tabs/visible areas (CSS Wizardry Example)
Increment stats, such as ammo usage

Adjust Stats Examples

Made by GiGs and expanded here. Each step is expanded and commented for clarity.

Add one to the level stat , when a button is clicked.

Create an action button on the sheet:

<button type="action" name="act_add">

Then add this code the the sheetworker section of the sheet:

on('clicked:add', function() {
    getAttrs(['level'], function(values) {
        // get the level stat, and coerce into a numerical value.
        const level = +values.level || 0; 
        // increase by 1
        const newlevel = level +1;
        // save the updated attribute to the sheet
        setAttrs({
           level: newlevel 
        });
   });
});

Reducing several stats with one button press.

Create an action button on the sheet:

<button type="action" name="act_reduce">

Then add this code the the sheetworker section of the sheet:

on('clicked:reduce', function() {
    // make an array of the attributes you plan to adjust, for ease of use later
    const attributes = ['list of attributes to adjust'];
    getAttrs(attributes, function(values) {
        const settings = {}; // make a variable to hold the changed attributes
        // loop through the attributes, get the value, then subtract 1
        attributes.forEach(att => {  // in each go through the loop, "att" becomes the next attribute
            let tempattribute = +values.att || 0;
            tempattribute -= 1;
            // store the changed attribute in the settings variable:
            settings[att] = tempattribute;
        });
        // save the updated attributes to the sheet
        setAttrs(settings);
   });
});

Compendium Button

Main Article: Compendium Button

The compendium button can be used to open a compendium entry directly from a character sheet, in the same way as if you clicked on an entry in the in-app compendium. This can be used as a more convenient way to access rules and descriptions, for example, for a spell, the compendium button can be used to easily view the full description for that spell.