Character Vault
Any Concept / Any System
Your System Come To Life
Roll20 for Android
Streamlined for your Tablet
Roll20 for iPad
Streamlined for your Tablet

Personal tools


From Roll20 Wiki

Jump to: navigation, search

Main Page: Sheet Author Tips#Frameworks

PUG is a template engine for generating HTML, where you can use various features & tool to write code more efficiently, such as using variables and loops, and has a simpler syntax.

//- Comment that only appears in PUG
- var pages = ["character", "skills", "inventory", "magic", "familiar", "background", "campaign", "vehicle", "settings"];
  span Page selection
    each tab in pages
      option(value=`${tab}`)= tab[0].toUpperCase() + tab.slice(1)

Result HTML:

     <span>Page selection</span><select name="attr_sheetTab">
        <option value="character">Character</option>
        <option value="skills">Skills</option>
        <option value="inventory">Inventory</option>
        <option value="magic">Magic</option>
        <option value="familiar">Familiar</option>
        <option value="background">Background</option>
        <option value="campaign">Campaign</option>
        <option value="vehicle">Vehicle</option>
        <option value="settings">Settings</option>

Examples, Sheets, & Sheet template made with PUG:

See Also