roll20-character-sheets/d20age/d20age.html

<!-- HIDDEN INPUTS -->
<input type="hidden" name="attr_sheetTab" value="character" />
<input type="hidden" name="attr_weaponEncumbrance" value="0" />
<input type="hidden" name="attr_attackBonus" value="0" />
<input type="hidden" name="attr_descendingArmorClass" value="" />

<!-- SHEET SELECTOR -->
<div class="sheet-button-select">
  <button type="action" name="act_character">Personagem</button>
  <button type="action" name="act_equipment">Equipamento</button>
  <button type="action" name="act_magic">Magia</button>
  <button type="action" name="act_retainers">Auxiliares</button>
  <button type="action" name="act_notes">Notas</button>
</div>
<!-- END OF SHEET SELECTOR -->
<!-- CHARACTER SHEET -->
<div class="sheet-character">
  <div class="logo-and-header">
    <img
      src="https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/d20age/images/d20agelogo.png"
      alt="logo d20age"
    />
    <!-- Header -->
    <div class="header">
      <div class="header-line">
        <label for="attr_name">
          NOME:
          <input type="text" name="attr_name" id="name-input" />
        </label>
      </div>
      <div class="header-line">
        <label for="attr_title">
          TÍTULO:
          <input type="text" name="attr_title" />
        </label>
        <label for="attr_class">
          CLASSE:
          <input type="text" name="attr_class" />
        </label>
      </div>
      <div class="header-line">
        <label for="attr_alignment">
          ALINHAMENTO:
          <input type="text" name="attr_alignment" />
        </label>
        <label for="attr_level">
          NÍVEL:
          <input type="text" name="attr_level" />
        </label>
      </div>
      <div class="header-line">
        <label for="attr_xp">
          XP:
          <input type="text" name="attr_xp" />
        </label>
        <label for="attr_xpBonus" class="header-label">
          XP(+%):
          <input type="text" name="attr_xpBonus" />
        </label>
        <label for="attr_xpTarget">
          XP(META):
          <input type="text" name="attr_xpTarget" />
        </label>
      </div>
    </div>
    <!-- End of Header -->
  </div>
  <!-- Attributes, saves and avatar -->
  <div class="attributes-saves-and-avatar">
    <!-- Attributes -->
    <div class="attributes">
      <div class="attributes-container">
        <h3>Atributos</h3>
        <div class="attributes-content">
          <div class="attributes-line">
            <label>
              <span>for:</span>
              <input type="text" name="attr_str" class="attribute-input" />
            </label>
            <input
              hidden
              readonly
              id="ability-strength-modifier"
              name="attr_strMod"
              value="0"
            />
            <input
              readonly
              id="ability-strength-modifier"
              name="attr_maskedStrMod"
              value="0"
            />
          </div>

          <div class="attributes-line">
            <label>
              <span>int:</span>
              <input type="text" name="attr_int" class="attribute-input" />
            </label>
            <input
              hidden
              readonly
              id="ability-intelligence-modifier"
              name="attr_intMod"
              value="0"
            />
            <input
              readonly
              id="ability-intelligence-modifier"
              name="attr_maskedIntMod"
              value="0"
            />
          </div>

          <div class="attributes-line">
            <label>
              <span>sab:</span>
              <input type="text" name="attr_wis" class="attribute-input" />
            </label>
            <input
              hidden
              readonly
              id="ability-wisdom-modifier"
              name="attr_wisMod"
              value="0"
            />
            <input
              readonly
              id="ability-wisdom-modifier"
              name="attr_maskedWisMod"
              value="0"
            />
          </div>

          <div class="attributes-line">
            <label>
              <span>des:</span>
              <input type="text" name="attr_dex" class="attribute-input" />
            </label>
            <input
              hidden
              readonly
              id="ability-dexterity-modifier"
              name="attr_dexMod"
              value="0"
            />
            <input
              readonly
              id="ability-dexterity-modifier"
              name="attr_maskedDexMod"
              value="0"
            />
          </div>

          <div class="attributes-line">
            <label>
              <span>con:</span>
              <input type="text" name="attr_con" class="attribute-input" />
            </label>
            <input
              hidden
              readonly
              id="ability-constitution-modifier"
              name="attr_conMod"
              value="0"
            />
            <input
              readonly
              id="ability-constitution-modifier"
              name="attr_maskedConMod"
              value="0"
            />
          </div>

          <div class="attributes-line">
            <label>
              <span>car:</span>
              <input type="text" name="attr_cha" class="attribute-input" />
            </label>
            <input
              hidden
              readonly
              id="ability-charisma-modifier"
              name="attr_chaMod"
              value="0"
            />
            <input
              readonly
              id="ability-charisma-modifier"
              name="attr_maskedChaMod"
              value="0"
            />
          </div>
        </div>
      </div>
    </div>
    <!-- End of Attributes -->
    <!-- Saves -->
    <div class="saves">
      <div class="saves-container">
        <h3>Salvaguardas</h3>
        <div class="saves-content">
          <div class="saves-line">
            <input type="text" name="attr_saveDeath" />
            <button
              type="roll"
              name="attr_rollSaveDeath"
              value="&{template:default} {{name=@{character_name} salvaguarda contra Morte}} {{resultado=[[ [[1d20]]>@{saveDeath} ]]}} {{alvo=[[@{saveDeath}]]}}"
              class="save-button"
            >
              MORTE
            </button>
          </div>
          <div class="saves-line">
            <input type="text" name="attr_saveContact" />
            <button
              type="roll"
              name="attr_rollSaveContact"
              value="&{template:default} {{name=@{character_name} salvaguarda contra Contato}} {{resultado=[[ [[1d20]]>@{saveContact} ]]}} {{alvo=[[@{saveContact}]]}}"
              class="save-button"
            >
              CONTATO
            </button>
          </div>
          <div class="saves-line">
            <input type="text" name="attr_saveParalysis" />
            <button
              type="roll"
              name="attr_rollSaveParalysis"
              value="&{template:default} {{name=@{character_name} salvaguarda contra Paralisia}} {{resultado=[[ [[1d20]]>@{saveParalysis} ]]}} {{alvo=[[@{saveParalysis}]]}}"
              class="save-button"
            >
              PARALISIA
            </button>
          </div>
          <div class="saves-line">
            <input type="text" name="attr_saveIrruption" />
            <button
              type="roll"
              name="attr_rollSaveIrruption"
              value="&{template:default} {{name=@{character_name} salvaguarda contra Irrupção}} {{resultado=[[ [[1d20]]>@{saveIrruption} ]]}} {{alvo=[[@{saveIrruption}]]}}"
              class="save-button"
            >
              IRRUPÇÃO
            </button>
          </div>
          <div class="saves-line">
            <input type="text" name="attr_saveSpell" />
            <button
              type="roll"
              name="attr_rollSaveSpell"
              value="&{template:default} {{name=@{character_name} salvaguarda contra Feitiço}} {{resultado=[[ [[1d20]]>@{saveSpell} ]]}} {{alvo=[[@{saveSpell}]]}}"
              class="save-button"
            >
              FEITIÇO
            </button>
          </div>
        </div>
      </div>
    </div>
    <!-- End of Saves -->
    <!-- Avatar -->
    <div class="avatarContainer">
      <!-- <h3>Arte</h3> -->
      <div class="art-container">
        <div class="tape"></div>
        <div class="art" name="attr_character_avatar"></div>
      </div>
    </div>
    <!-- End of Avatar -->
  </div>
  <!-- End of Attributes, saves and avatar -->
  <!-- Movement and Thac0 -->
  <div class="movement-and-thac0">

    <!-- Abilities -->
    <div class="abilities-container">
      <div class="abilities">
        <h3>Habilidades</h3>
        <div class="abilities-content">
          <textarea name="attr_abilities"></textarea>
    
        </div>
      </div>
    </div>
    <!-- End of Abilities -->

    
    <!-- Thac0 -->
    <div class="thac0">
      <div class="thac0-and-ab">
        <label>Taco:<input type="text" name="attr_thac0" value="19" /></label>
        <label
          >Bônus de Ataque:<input type="text" name="attr_ba" value="0"
        /></label>
      </div>
      <div class="thac0-grid">
        <div>
          <span>0</span>
          <input readonly name="attr_attackMatrix0" />
        </div>
        <div>
          <span>1</span>
          <input readonly name="attr_attackMatrix1" />
        </div>
        <div>
          <span>2</span>
          <input readonly name="attr_attackMatrix2" />
        </div>
        <div>
          <span>3</span>
          <input readonly name="attr_attackMatrix3" />
        </div>
        <div>
          <span>4</span>
          <input readonly name="attr_attackMatrix4" />
        </div>
        <div>
          <span>5</span>
          <input readonly name="attr_attackMatrix5" />
        </div>
        <div>
          <span>6</span>
          <input readonly name="attr_attackMatrix6" />
        </div>
        <div>
          <span>7</span>
          <input readonly name="attr_attackMatrix7" />
        </div>
        <div>
          <span>8</span>
          <input readonly name="attr_attackMatrix8" />
        </div>
        <div>
          <span>9</span>
          <input readonly name="attr_attackMatrix9" />
        </div>
      </div>
    </div>
    <!-- End of Thac0 -->
  </div>
  <!-- End of Movement and Thac0 -->
  <!-- Languages and Defenses -->
  <div class="languages-and-defenses">
    <!-- Movement -->
    
   <div class="movement">
     <h3>Deslocamento e Carga</h3>
     <div class="movement-content">
       <div class="movement-line">
         <label>BASE <input type="text" name="attr_moveBase" /></label>
       </div>
       <div class="movement-line">
         <label
           >EXPLORAÇÃO/CORRIDA
           <input type="text" name="attr_movExplorationOrRunning"
         /></label>
       </div>
       <div class="movement-line">
         <label>VIAGEM <input type="text" name="attr_moveTravel" /></label>
       </div>
       <div class="movement-line">
         <label>CARGA</label>

         <select name="attr_encumbrance">
           <option value="light">Leve</option>
           <option value="medium" selected>Média</option>
           <option value="heavy" selected>Pesada</option>
         </select>
       </div>
     </div>
   </div>
   <!-- End of Movement -->
    <!-- Languages -->
    <div class="languages-container">
      <div class="languages">
        <h3>Idiomas</h3>
        <div class="languages-content">
          <textarea name="attr_languages"></textarea>
          <div class="literate">
            <label
              >Letrado
              <input type="checkbox" name="attr_literate" />
            </label>
          </div>
        </div>
      </div>
    </div>
    <!-- End of Languages -->
    <!-- Defenses -->
    <div class="defenses">
      <label id="ac-option">
        <span>Opção de CA</span>
        <select name="attr_armorClassType">
          <option value="aac">Ascendente</option>
          <option value="dac" selected>Descendente</option>
        </select>
      </label>
      <div class="defenses-line">
        <label>CA<input readonly type="text" name="attr_ac" /></label>
      </div>
      <div class="defenses-line">
        <label>PV MÁXIMO<input type="text" name="attr_pvMax" /></label>
      </div>
      <div class="defenses-line">
        <label>PV ATUAL<input type="text" name="attr_pvCurrent" /></label>
      </div>
    </div>
    <!-- End of Defenses -->
  </div>
  <!-- End of Languages and Defenses -->
  <!-- Weapons -->
  <div class="weapons">
    <h3>Armas</h3>
    <fieldset class="repeating_weapons">
      <div class="weapon">
        <div class="weapon-grid">
          <div id="weapon-roll">
            <span>.</span>
            <input type="hidden" name="attr_bonusDamage" value="0" />
            <button
              type="roll"
              name="dacAttackRoll"
              class="attack-roll attack-roll-dac"
              value="&{template:simple} {{descendingArmorClass=@{descendingArmorClass}}}  {{roll=@{character_name} ataca com @{weaponName}}} {{ataque=[[1d20+@{dexMod}+@{weaponAttackBonus}+@{attackBonus}]]}} {{dano=[[@{weaponDamageDie}+@{weaponDamageBonus}+@{bonusDamage}]]}} {{descrição=@{weaponDescription}}} {{attackMatrix9=@{attackMatrix9}}} {{attackMatrix8=@{attackMatrix8}}} {{attackMatrix7=@{attackMatrix7}}} {{attackMatrix6=@{attackMatrix6}}} {{attackMatrix5=@{attackMatrix5}}} {{attackMatrix4=@{attackMatrix4}}} {{attackMatrix3=@{attackMatrix3}}} {{attackMatrix2=@{attackMatrix2}}} {{attackMatrix1=@{attackMatrix1}}} {{attackMatrix0=@{attackMatrix0}}}"
            ></button>
          </div>
          <div id="weapon-name">
            <span>Nome</span>
            <input type="text" name="attr_weaponName" />
          </div>
          <div id="weapon-attack-type">
            <span>Tipo de Ataque</span>
            <select name="attr_attackType">
              <option value="melee">Corpo a Corpo</option>
              <option value="ranged">A Distância</option>
            </select>
          </div>
          <div id="weapon-attack-bonus">
            <span>+Atq</span>
            <input type="number" name="attr_weaponAttackBonus" value="0" />
          </div>
          <div id="weapon-damage-die">
            <span>Dado de Dano</span>
            <input
              type="text"
              name="attr_weaponDamageDie"
              value="1d6"
              class="input-as-number"
            />
          </div>
          <div id="weapon-damage-bonus">
            <span>+Dano</span>
            <input type="number" name="attr_weaponDamageBonus" value="0" />
          </div>
          <div id="weapon-weight">
            <span>Peso</span>
            <input type="number" min="0" name="attr_weaponWeight" value="0" />
          </div>
        </div>
        <input
          id="weapon-description"
          type="text"
          name="attr_weaponDescription"
          class="weapon-description"
          placeholder="Descrição"
          value=""
        />
      </div>
    </fieldset>
  </div>
  <!-- End of Weapons -->
</div>
<!-- END OF CHARACTER SHEET -->
<!-- MAGIC SHEET -->
<div class="sheet-magic">
  <div class="magic-per-circle">
    <label>
      <span>1</span>
      <input
        type="number"
        min="0"
        name="attr_magicCircle1Available"
        title="Magias Disponíveis"
        value="0"
      />
      /
      <input
        type="number"
        min="0"
        id="magic-circle-1-total"
        name="attr_magicCircle1Total"
        title="Magias Totais"
        value="0"
      />
    </label>
    <label class="inline-flex">
      <span>2</span>
      <input
        type="number"
        min="0"
        name="attr_magicCircle2Available"
        title="Magias Disponíveis"
        value="0"
      />
      /
      <input
        type="number"
        min="0"
        id="magic-circle-2-total"
        name="attr_magicCircle2Total"
        title="Magias Totais"
        value="0"
      />
    </label>
    <label class="inline-flex">
      <span>3</span>
      <input
        type="number"
        min="0"
        name="attr_magicCircle3Available"
        title="Magias Disponíveis"
        value="0"
      />
      /
      <input
        type="number"
        min="0"
        id="magic-circle-3-total"
        name="attr_magicCircle3Total"
        title="Magias Totais"
        value="0"
      />
    </label>
    <label class="inline-flex">
      <span>4</span>
      <input
        type="number"
        min="0"
        name="attr_magicCircle4Available"
        title="Magias Disponíveis"
        value="0"
      />
      /
      <input
        type="number"
        min="0"
        id="magic-circle-4-total"
        name="attr_magicCircle4Total"
        title="Magias Totais"
        value="0"
      />
    </label>
    <label class="inline-flex">
      <span>5</span>
      <input
        type="number"
        min="0"
        name="attr_magicCircle5Available"
        title="Magias Disponíveis"
        value="0"
      />
      /
      <input
        type="number"
        min="0"
        id="magic-circle-5-total"
        name="attr_magicCircle5Total"
        title="Magias Totais"
        value="0"
      />
    </label>
  </div>
  <div>
    <fieldset class="repeating_magic">
      <div class="magic-grid">
        <span class="magic-roll"></span>
        <span class="magic-memorized">Mem.</span>
        <span class="magic-name">Nome</span>
        <span class="magic-circle">Círculo</span>
        <span class="magic-effect">Efeito</span>
      </div>
      <div class="magic-grid">
        <div class="magic-roll">
          <button
            type="roll"
            name="magicCast"
            value="&{template:simple} {{roll=@{character_name} conjura @{magicName}}} {{efeito=[[0+@{magicEffect}]]}} {{efeitoEspelho=@{magicEffect}}} {{descrição=@{magicDescription}}}"
          ></button>
        </div>
        <input
          type="number"
          min="0"
          name="attr_magicMemorized"
          checked
          title="Memorizadas"
          value="0"
          class="magic-memorized"
        />
        <input type="text" name="attr_magicName" class="magic-name" />
        <input
          type="number"
          min="1"
          name="attr_magicCircle"
          value="1"
          class="magic-circle"
        />
        <input
          type="text"
          class="magic-effect"
          name="attr_magicEffect"
          value=""
        />
      </div>
      <textarea
        type="text"
        name="attr_magicDescription"
        class="magic-description"
        placeholder="Descrição"
      />
    </fieldset>
  </div>
</div>
<!-- END OF MAGIC SHEET -->
<!-- EQUIPMENT SHEET -->
<div class="sheet-equipment">
  <div class="encumbrance">
    <label>CARGA (cn)</label>
    <div>
      <span>Moedas</span>
      <input
        readonly
        min="0"
        name="attr_coinEncumbrance"
        value="0"
        class="encumbrance-input"
      />
    </div>
    <div>
      <span>Total</span>
      <input
        readonly
        min="0"
        name="attr_TotalEncumbrance"
        value="0"
        class="encumbrance-input"
      />
    </div>
    <div>
      <span>Auxiliares</span>
      <input
        readonly
        min="0"
        name="attr_retainerEncumbrance"
        value="0"
        class="encumbrance-input"
      />
    </div>
    <div>
      <span>Montaria</span>
      <input
        readonly
        min="0"
        name="attr_mountEncumbrance"
        value="0"
        class="encumbrance-input"
      />
    </div>
    <div>
      <span>Carroça</span>
      <input
        readonly
        min="0"
        name="attr_cartEncumbrance"
        value="0"
        class="encumbrance-input"
      />
    </div>
    <div>
      <span>Guardado</span>
      <input
        readonly
        min="0"
        name="attr_StowedEncumbrance"
        value="0"
        class="encumbrance-input"
      />
    </div>
  </div>
  <div class="armor">
    <div class="equipment-title-and-encumbrance">
      <h2>Armadura</h2>
      <label
        >cn
        <input
          readonly
          min="0"
          name="attr_armorEncumbrance"
          value="0"
          class="encumbrance-input"
        />
      </label>
    </div>
    <div class="equipment-grid">
      <span class="armor-name">Nome</span>
      <span class="armor-value">CA</span>
      <span class="armor-weight">Peso</span>
      <span class="armor-equiped">Equipada?</span>
    </div>
    <fieldset class="repeating_armor">
      <div class="equipment-line">
        <input type="text" name="attr_armorName" class="armor-name" />
        <input
          type="text"
          name="attr_armorValue"
          value="0"
          class="armor-value"
        />
        <input
          type="number"
          min="0"
          name="attr_armorWeight"
          value="0"
          class="armor-weight"
        />
        <input
          class="armor-equiped"
          type="checkbox"
          name="attr_armorWorn"
          checked
        />
      </div>
    </fieldset>
  </div>
  <div class="items">
    <div class="equipment-title-and-encumbrance">
      <h2>Itens</h2>
      <label
        >cn
        <input
          readonly
          min="0"
          name="attr_ItemsEncumbrance"
          value="0"
          class="encumbrance-input"
        />
      </label>
    </div>
    <div class="equipment-grid">
      <span class="item-quantity">Qtd</span>
      <span class="item-name">Nome</span>
      <span class="item-description">Descrição</span>
      <span class="item-weight">Peso</span>
    </div>
    <fieldset class="repeating_items">
      <div class="equipment-line">
        <input
          class="item-quantity"
          type="number"
          min="0"
          name="attr_ItemQuantity"
          value="1"
        />
        <input class="item-name" type="text" name="attr_ItemName" />
        <input
          class="item-description"
          type="text"
          name="attr_ItemDescription"
        />
        <input
          class="item-weight"
          type="number"
          min="0"
          name="attr_ItemWeight"
          value="0"
        />
      </div>
    </fieldset>
  </div>
  <div class="coins">
    <label>
      <span>PO</span>
      <input
        type="number"
        min="0"
        name="attr_GP"
        title="Peças de Ouro"
        value="0"
      />
    </label>
    <label class="inline-flex">
      <span>PP</span>
      <input
        type="number"
        min="0"
        name="attr_SP"
        title="Peças de Prata"
        value="0"
      />
    </label>
    <label class="inline-flex">
      <span>PC</span>
      <input
        type="number"
        min="0"
        name="attr_CP"
        title="Peças de Bronze"
        value="0"
      />
    </label>
  </div>
  <div class="retainer-items">
    <div class="equipment-title-and-encumbrance">
      <h2>Itens com Auxiliares</h2>
      <label
        >cn
        <input
          readonly
          min="0"
          name="attr_retainerEncumbrance"
          value="0"
          class="encumbrance-input"
        />
      </label>
    </div>
    <div class="equipment-grid">
      <span class="item-quantity">Qtd</span>
      <span class="item-name">Nome</span>
      <span class="item-description">Descrição</span>
      <span class="item-weight">Peso</span>
    </div>
    <fieldset class="repeating_retaineritems">
      <div class="equipment-line">
        <input
          class="item-quantity"
          type="number"
          min="0"
          name="attr_RetainerItemQuantity"
          value="1"
        />
        <input class="item-name" type="text" name="attr_RetainerItemName" />
        <input
          class="item-description"
          type="text"
          name="attr_RetainerItemDescription"
        />
        <input
          class="item-weight"
          type="number"
          min="0"
          name="attr_RetainerItemWeight"
          value="0"
        />
      </div>
    </fieldset>
  </div>
  <div class="mount-items">
    <div class="equipment-title-and-encumbrance">
      <h2>Itens na Montaria</h2>
      <label
        >cn
        <input
          readonly
          min="0"
          name="attr_mountEncumbrance"
          value="0"
          class="encumbrance-input"
        />
      </label>
    </div>
    <div class="equipment-grid">
      <span class="item-quantity">Qtd</span>
      <span class="item-name">Nome</span>
      <span class="item-description">Descrição</span>
      <span class="item-weight">Peso</span>
    </div>
    <fieldset class="repeating_mountitems">
      <div class="equipment-line">
        <input
          class="item-quantity"
          type="number"
          min="0"
          name="attr_MountItemQuantity"
          value="1"
        />
        <input class="item-name" type="text" name="attr_MountItemName" />
        <input
          class="item-description"
          type="text"
          name="attr_MountItemDescription"
        />
        <input
          class="item-weight"
          type="number"
          min="0"
          name="attr_MountItemWeight"
          value="0"
        />
      </div>
    </fieldset>
  </div>
  <div class="cart-items">
    <div class="equipment-title-and-encumbrance">
      <h2>Itens na Carroça</h2>
      <label
        >cn
        <input
          readonly
          min="0"
          name="attr_cartEncumbrance"
          value="0"
          class="encumbrance-input"
        />
      </label>
    </div>
    <div class="equipment-grid">
      <span class="item-quantity">Qtd</span>
      <span class="item-name">Nome</span>
      <span class="item-description">Descrição</span>
      <span class="item-weight">Peso</span>
    </div>
    <fieldset class="repeating_cartitems">
      <div class="equipment-line">
        <input
          class="item-quantity"
          type="number"
          min="0"
          name="attr_CartItemQuantity"
          value="1"
        />
        <input class="item-name" type="text" name="attr_CartItemName" />
        <input
          class="item-description"
          type="text"
          name="attr_CartItemDescription"
        />
        <input
          class="item-weight"
          type="number"
          min="0"
          name="attr_CartItemWeight"
          value="0"
        />
      </div>
    </fieldset>
  </div>
  <div class="stowed-items">
    <div class="equipment-title-and-encumbrance">
      <h2>Itens Guardados</h2>
      <label
        >cn
        <input
          readonly
          min="0"
          name="attr_stowedEncumbrance"
          value="0"
          class="encumbrance-input"
        />
      </label>
    </div>
    <div class="equipment-grid">
      <span class="item-quantity">Qtd</span>
      <span class="item-name">Nome</span>
      <span class="item-description">Descrição</span>
      <span class="item-weight">Peso</span>
    </div>
    <fieldset class="repeating_stoweditems">
      <div class="equipment-line">
        <input
          class="item-quantity"
          type="number"
          min="0"
          name="attr_StowedItemQuantity"
          value="1"
        />
        <input class="item-name" type="text" name="attr_StowedItemName" />
        <input
          class="item-description"
          type="text"
          name="attr_StowedItemDescription"
        />
        <input
          class="item-weight"
          type="number"
          min="0"
          name="attr_StowedItemWeight"
          value="0"
        />
      </div>
    </fieldset>
  </div>
</div>
<!-- END OF EQUIPMENT SHEET -->
<!-- RETAINERS SHEET -->
<div class="sheet-retainers">
  <fieldset class="repeating_retainer">
    <div id="retainer">
      <div id="retainers-header-wrapper">
        <div class="retainers-header">
          <input
            id="retainer-name"
            type="text"
            name="attr_retainerName"
            placeholder="Nome"
          />
          <input
            id="retainer-profession"
            type="text"
            min="0"
            name="attr_retainerProfession"
            placeholder="Ofício"
          />
          <select id="retainer-kind" name="attr_retainerKind">
            <option value="follower" selected>Auxiliar</option>
            <option value="hireling">Profissional</option>
            <option value="mount">Montaria</option>
            <option value="animal">Animal</option>
          </select>
          <select id="retainer-loyalty" name="attr_retainerLoyalty">
            <option value="loyal">Leal</option>
            <option value="notLoyal" selected>Não Leal</option>
          </select>
        </div>
        <div id="retainers-header-filler"></div>
      </div>
      <div class="retainers-info">
        <div class="retainers-hd-moral-thac0-and-saves">
          <div class="retainers-hd-moral-and-thac0">
            <div>
              <span>DV</span>
              <input
                type="number"
                min="0"
                name="attr_retainerHD"
                placeholder="0"
              />
            </div>
            <div class="retainers-hd-and-moral">
              <button
                type="roll"
                value="&{template:default}{{name=Rolagem de Moral de @{retainerName}}}{{resultado MAIOR que Moral da criatura, ela foge/se rende = Resultado MENOR OU IGUAL a Moral da criatura, ela se mantém lutando}} {{Moral=@{retainerMoral}}} {{Resultado=[[2D6]]}}"
              >
                ML
              </button>
              <input
                type="number"
                min="0"
                name="attr_retainerMoral"
                placeholder="0"
              />
            </div>
            <div class="retainers-hd-and-moral">
              <span>Taco/BA</span>
              <input
                type="number"
                min="0"
                name="attr_retainerTaco"
                placeholder="0"
              />
            </div>
          </div>
          <div class="retainer-saves">
            <button
              type="roll"
              value="&{template:default}{{name=Rolagem de salvaguarda de @{retainerName}}}{{Resultado=[[1D20]]}}"
            >
              Salvaguardas
            </button>
            <input
              hidden
              id="retainer-name"
              type="text"
              name="attr_retainerName"
              placeholder="Nome"
            />
            <div>
              <span> M </span>
              <input
                type="number"
                min="0"
                name="attr_retainerDeathSave"
                placeholder="0"
              />
            </div>
            <div>
              <span> C </span>
              <input
                type="number"
                min="0"
                name="attr_retainerContactSave"
                placeholder="0"
              />
            </div>
            <div>
              <span> P </span>
              <input
                type="number"
                min="0"
                name="attr_retainerParalysisSave"
                placeholder="0"
              />
            </div>
            <div>
              <span> I </span>
              <input
                type="number"
                min="0"
                name="attr_retainerIrruptionSave"
                placeholder="0"
              />
            </div>
            <div>
              <span> F </span>
              <input
                type="number"
                min="0"
                name="attr_retainerSpellSave"
                placeholder="0"
              />
            </div>
          </div>
        </div>
        <label class="retainer-training-and-description">
          <span>Treinamento</span>
          <input type="text" name="attr_retainerTraining" />
        </label>
        <label class="retainer-training-and-description">
          <span>Descrição</span>
          <input type="text" name="attr_retainerDescription" />
        </label>
      </div>
    </div>
  </fieldset>
</div>
<!-- END OF RETAINERS SHEET -->
<!-- NOTES SHEET -->
<div class="sheet-notes">
  <textarea name="attr_notes" class="notes"></textarea>
</div>
<!-- END OF NOTES SHEET -->
<!-- ROLLTEMPLATES -->
<rolltemplate class="sheet-rolltemplate-simple">
  <table>
    <caption>
      {{roll}}
    </caption>
    <tbody>
      {{#efeitoEspelho}}
      <tr>
        <td>Efeito</td>
        <td>{{efeito}}</td>
      </tr>
      {{/efeitoEspelho}}
      {{#allprops() descendingArmorClass roll efeito efeitoEspelho descrição attackMatrix9 attackMatrix8 attackMatrix7 attackMatrix6 attackMatrix5 attackMatrix4 attackMatrix3 attackMatrix2 attackMatrix1 attackMatrix0}}
      <tr>
        <td>{{key}}</td>
        <td>{{value}}</td>
      </tr>
      {{/allprops() descendingArmorClass roll efeito efeitoEspelho descrição attackMatrix9 attackMatrix8 attackMatrix7 attackMatrix6 attackMatrix5 attackMatrix4 attackMatrix3 attackMatrix2 attackMatrix1 attackMatrix0}}
      {{#descrição}}
      <tr>
        <td>Descrição</td>
        <td>{{descrição}}</td>
      </tr>
      {{/descrição}}
    </tbody>
  </table>
  <div class="sheet-template-background">
    {{#descendingArmorClass}}
    <div class="sheet-template-tac0-line"><span>Tac0</span></div>
    <div class="sheet-template-grid">
      <div class="sheet-grid-headers">
        <span>0</span>
        <span>1</span>
        <span>2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>
        <span>6</span>
        <span>7</span>
        <span>8</span>
        <span>9</span>
      </div>
      <div class="sheet-grid-values">
        <span>{{attackMatrix0}}</span>
        <span>{{attackMatrix1}}</span>
        <span>{{attackMatrix2}}</span>
        <span>{{attackMatrix3}}</span>
        <span>{{attackMatrix4}}</span>
        <span>{{attackMatrix5}}</span>
        <span>{{attackMatrix6}}</span>
        <span>{{attackMatrix7}}</span>
        <span>{{attackMatrix8}}</span>
        <span>{{attackMatrix9}}</span>
      </div>
    </div>
    {{/descendingArmorClass}}
  </div>
</rolltemplate>
<!-- END OF ROLLTEMPLATES -->
<!-- SCRIPTS -->
<script type="text/worker">
    // Tabs
    const buttonlist = ["character", "magic", "equipment", "retainers", "notes"];
    buttonlist.forEach((button) => {
      on(`clicked:${button}`, function (event) {
        setAttrs({ sheetTab: button });
      });
    });

    const repeatingSum = (
      destination,
      section,
      fields,
      { multiplier = 1, callback = Function.prototype }
    ) => {
      if (!Array.isArray(fields)) fields = [fields];
      getSectionIDs(`repeating_${section}`, (idArray) => {
        const attrArray = idArray.reduce(
          (m, id) => [
            ...m,
            ...fields.map((field) => `repeating_${section}_${id}_${field}`),
          ],
          []
        );
        getAttrs(attrArray, (v) => {
          // getValue: if not a number, returns 1 if it is 'on' (checkbox), otherwise returns 0..
          const getValue = (section, id, field) =>
            parseFloat(v[`repeating_${section}_${id}_${field}`]) ||
            (v[`repeating_${section}_${id}_${field}`] === "on" ? 1 : 0);
          const sumTotal = idArray.reduce(
            (total, id) =>
              total +
              fields.reduce(
                (subtotal, field) => subtotal * getValue(section, id, field),
                1
              ),
            0
          );
          setAttrs({ [destination]: sumTotal * multiplier }, callback);
        });
      });
    };

    function getModifiers(value, modifiers = [-3, -2, -1, 0, 1, 2, 3]) {
      if (value <= 3) {
        return modifiers[0];
      } else if (value >= 4 && value <= 5) {
        return modifiers[1];
      } else if (value >= 6 && value <= 8) {
        return modifiers[2];
      } else if (value >= 9 && value <= 12) {
        return modifiers[3];
      } else if (value >= 13 && value <= 15) {
        return modifiers[4];
      } else if (value >= 16 && value <= 17) {
        return modifiers[5];
      } else {
      return modifiers[6];
      }
    }

    on("sheet:opened change:str", function () {
      getAttrs(["str"], function (values) {
        const strMod = getModifiers(values.str);
        let maskedStrMod = strMod;
        if (strMod > 0) maskedStrMod = `+${strMod}`;
        maskedStrMod = `(${maskedStrMod})`
        setAttrs({ strMod, maskedStrMod  });
      });
    });

    on("sheet:opened change:int", function () {
      getAttrs(["int"], function (values) {
        const intMod = getModifiers(values.int);
        let maskedIntMod = intMod;
        if (intMod > 0) maskedIntMod = `+${intMod}`;
        maskedIntMod = `(${maskedIntMod})`
        setAttrs({ intMod, maskedIntMod  });
      });
    });

    on("sheet:opened change:wis", function () {
      getAttrs(["wis"], function (values) {
        const wisMod = getModifiers(values.wis);
        let maskedWisMod = wisMod;
        if (wisMod > 0) maskedWisMod = `+${wisMod}`;
        maskedWisMod = `(${maskedWisMod})`
        setAttrs({ wisMod, maskedWisMod  });
      });
    });

    on("sheet:opened change:dex", function () {
      getAttrs(["dex"], function (values) {
        const dexMod = getModifiers(values.dex);
        let maskedDexMod = dexMod;
        if (dexMod > 0) maskedDexMod = `+${dexMod}`;
        maskedDexMod = `(${maskedDexMod})`
        setAttrs({ dexMod, maskedDexMod  });
      });
    });

    on("sheet:opened change:con", function () {
      getAttrs(["con"], function (values) {
        const conMod = getModifiers(values.con);
        let maskedConMod = conMod;
        if (conMod > 0) maskedConMod = `+${conMod}`;
        maskedConMod = `(${maskedConMod})`
        setAttrs({ conMod, maskedConMod  });
      });
    });

    on("sheet:opened change:cha", function () {
      getAttrs(["cha"], function (values) {
        const chaMod = getModifiers(values.cha);
        let maskedChaMod = chaMod;
        if (chaMod > 0) maskedChaMod = `+${chaMod}`;
        maskedChaMod = `(${maskedChaMod})`
        setAttrs({ chaMod, maskedChaMod  });
      });
    });

    on("sheet:opened change:armorClassType change:ba", function () {
      getAttrs(["armorClassType", "ba"], function (values) {
          const armorClassType = values.armorClassType;
          const ba = parseInt(values.ba) || 0;
          const dAC = 0;
          let attackBonus = 0; // Valor padrão para attackBonus
          // Define attackBonus com base no valor de armorClassType
          if (armorClassType === "aac") {
              attackBonus = ba;
          } else if (armorClassType === "dac") {
              attackBonus = 0;
          }
          // Atualiza o atributo attackBonus
          setAttrs({
              attackBonus: attackBonus
          });
      });
    });

    on("sheet:opened change:repeating_weapons:attackType change:strMod", function () {
        getSectionIDs("repeating_weapons", function (idArray) {
            idArray.forEach(function (id) {
                const attributes = [`repeating_weapons_${id}_attackType`, "strMod"];
                getAttrs(attributes, function (values) {
                    const attackType = values[`repeating_weapons_${id}_attackType`] || "";
                    const strMod = parseInt(values.strMod) || 0; // Global strMod
                    let bonusDamage = 0;
                    if (attackType.toLowerCase() === "melee") {
                        bonusDamage = strMod;
                    } else if (attackType.toLowerCase() === "ranged") {
                        bonusDamage = 0;
                    }
                    console.log(`Repeating weapon update - ID: ${id}, attackType: ${attackType}, bonusDamage: ${bonusDamage}`);
                    setAttrs({
                        [`repeating_weapons_${id}_bonusDamage`]: bonusDamage
                    });
                });
            });
        });
    });

    // Atualizar weaponEncumbrance com a soma de todos os weaponWeight em repeating_weapons
    on("change:repeating_weapons:weaponWeight remove:repeating_weapons", function () {
        getSectionIDs("repeating_weapons", function (ids) {
            let totalWeight = 0;
            // Iterar por todos os IDs da seção repeating_weapons
            ids.forEach(id => {
                getAttrs([`repeating_weapons_${id}_weaponWeight`], function (values) {
                    const weight = parseInt(values[`repeating_weapons_${id}_weaponWeight`]) || 0;
                    // Adiciona o peso ao total
                    totalWeight += weight;
                    // Atualizar o campo weaponEncumbrance com a soma
                    setAttrs({ weaponEncumbrance: totalWeight });
                });
            });
            // Caso não haja armas, zera o total
            if (ids.length === 0) {
                setAttrs({ weaponEncumbrance: 0 });
            }
        });
    });

    // Atualizar attr_coinEncumbrance quando os campos GP, SP ou CP mudarem
    on("sheet:opened change:GP change:SP change:CP", function () {
        getAttrs(["GP", "SP", "CP"], function (values) {
            const gp = parseInt(values.GP);
            const sp = parseInt(values.SP);
            const cp = parseInt(values.CP);
            // Soma os valores
            const total = gp + sp + cp;
            // Atualiza o campo attr_coinEncumbrance
            setAttrs({ coinEncumbrance: total });
        });
    });

    // Função genérica para calcular encumbrance
    function calculateEncumbrance(fieldsetName, weightField, quantityField, totalField) {
        on(`change:repeating_${fieldsetName}:${weightField} change:repeating_${fieldsetName}:${quantityField} remove:repeating_${fieldsetName}`, function () {
            getSectionIDs(`repeating_${fieldsetName}`, function (ids) {
                let totalWeight = 0;
                ids.forEach(id => {
                    getAttrs([`repeating_${fieldsetName}_${id}_${weightField}`, `repeating_${fieldsetName}_${id}_${quantityField}`], function (values) {
                        const weight = parseInt(values[`repeating_${fieldsetName}_${id}_${weightField}`]) || 0;
                        const quantity = parseInt(values[`repeating_${fieldsetName}_${id}_${quantityField}`]) || 0;
                        totalWeight += weight * quantity;
                        setAttrs({ [totalField]: totalWeight });
                    });
                });
                if (ids.length === 0) {
                    setAttrs({ [totalField]: 0 });
                }
            });
        });
    }

    // Chamadas para cada categoria
    calculateEncumbrance("items", "ItemWeight", "ItemQuantity", "ItemsEncumbrance");
    calculateEncumbrance("retaineritems", "RetainerItemWeight", "RetainerItemQuantity", "retainerEncumbrance");
    calculateEncumbrance("mountitems", "MountItemWeight", "MountItemQuantity", "mountEncumbrance");
    calculateEncumbrance("cartitems", "CartItemWeight", "CartItemQuantity", "cartEncumbrance");
    calculateEncumbrance("stoweditems", "StowedItemWeight", "StowedItemQuantity", "stowedEncumbrance");

    // Atualizar TotalEncumbrance com a soma de coinEncumbrance, ItemsEncumbrance, armorEncumbrance e weaponEncumbrance
    on("change:coinEncumbrance change:ItemsEncumbrance change:armorEncumbrance change:weaponEncumbrance", function () {
      // Obter os valores dos campos relevantes
      getAttrs(["coinEncumbrance", "ItemsEncumbrance", "armorEncumbrance", "weaponEncumbrance"], function (values) {
          const coin = parseInt(values.coinEncumbrance) || 0;
          const items = parseInt(values.ItemsEncumbrance) || 0;
          const armor = parseInt(values.armorEncumbrance) || 0;
          const weapons = parseInt(values.weaponEncumbrance) || 0;
          // Soma os valores
          const total = coin + items + armor + weapons;
          // Atualiza o campo TotalEncumbrance
          setAttrs({ TotalEncumbrance: total });
      });
    });

    on("sheet:opened change:thac0", function () {
      getAttrs(["thac0"], function (values) {
        const thac0 = parseInt(values.thac0) || 0;
        const updates = {};
        for (let i = 0; i <= 9; i++) {
            updates[`attackMatrix${i}`] = thac0 - i;
        }
        setAttrs(updates);
      });
    });

    // Atualizar armorEncumbrance com a soma de todos os armorWeight em repeating_armor
    on("change:repeating_armor:armorWeight remove:repeating_armor", function () {
        // Obter todos os valores de armorWeight
        getSectionIDs("repeating_armor", function (ids) {
            let totalWeight = 0;
            // Iterar por todos os IDs da seção repeating_armor
            ids.forEach(id => {
                getAttrs([`repeating_armor_${id}_armorWeight`], function (values) {
                    const weight = parseInt(values[`repeating_armor_${id}_armorWeight`]) || 0;
                    totalWeight += weight;
                    // Atualizar o campo armorEncumbrance quando a soma estiver completa
                    setAttrs({ armorEncumbrance: totalWeight });
                });
            });
            // Atualizar imediatamente o campo para o caso de não haver valores
            if (ids.length === 0) {
                setAttrs({ armorEncumbrance: 0 });
            }
        });
    });

    on("sheet:opened change:armorClassType change:repeating_armor:armorValue change:repeating_armor:armorWorn remove:repeating_armor", function () {
      getAttrs(["armorClassType"], function (values) {
          const armorClassType = values.armorClassType || "aac"; // Default para teste
          getSectionIDs("repeating_armor", function (ids) {
              let totalArmorValue = 0;
              const attributesToGet = ids.reduce((acc, id) => {
                  acc.push(`repeating_armor_${id}_armorValue`, `repeating_armor_${id}_armorWorn`);
                  return acc;
              }, []);
              getAttrs(attributesToGet, function (itemValues) {
                  ids.forEach((id) => {
                      const armorValue = parseInt(itemValues[`repeating_armor_${id}_armorValue`]) || 0;
                      const armorWorn = itemValues[`repeating_armor_${id}_armorWorn`] === "on";
                      if (armorWorn) {
                          totalArmorValue += armorValue;
                      }
                  });
                  let ac = 0;
                  if (armorClassType === "aac") {
                      ac = 10 + totalArmorValue;
                  } else if (armorClassType === "dac") {
                      ac = 9 - totalArmorValue;
                  }
                  // Atualizar o atributo attr_ac
                  setAttrs({ ac: ac });
              });
          });
      });
    });

    on("sheet:opened change:armorClassType", function () {
      getAttrs(["armorClassType"], function (values) {
          const armorClassType = values.armorClassType;
          let newDescendingArmorClass;
          if (armorClassType === "aac") {
              newDescendingArmorClass = "";
          } else if (armorClassType === "dac") {
              newDescendingArmorClass = "1";
          } else {
              newDescendingArmorClass = "";
          }
          setAttrs({
              descendingArmorClass: newDescendingArmorClass
          });
      });
  });
</script>
<!-- END OF SCRIPTS -->