roll20-character-sheets-tester/Vaesen/vaesen_sheet.html

    <div>
        <button type="action" name="act_main" >PC</button>
        <button type="action" name="act_NPC" >NPC</button>
    </div>
    
    <input type="hidden" class="sheet-tabstoggle" name="attr_sheetTab" value="main">
    
    <div class="sheet-main">
        <div class="header-image">
        </div>
        
        <div class="charactername">
            <input class="nametext"  Type="text" name="attr_character_name"><label class="attriblabel">Name</label>    
        </div>
        
        <div class="leftstats">
            <input class="medtext" Type="text" name="attr_Age"><label class="attriblabel">Age/Age Group</label>
            <input class="medtext" Type="text" name="attr_Archetype"><label class="attriblabel">Archetype</label>
            <input class="medtext" type="text" name="attr_Motivation"><Label class="attriblabel">Motivation</Label>
        </div>
        
        <div class="rightstats">
            <textarea class="vaesentextarea" name="attr_trauma"></textarea><Label class="attriblabel">Trauma</Label>
            <textarea class="vaesentextarea" name="attr_darksecret"></textarea><label class="attriblabel">Dark Secret</label>
        </div>
        
        <div class="leftbody">
            <hr class="break">      
            <h2 class="areaheader">Relationships</h2>
            <table>
                <fieldset class="repeating_Relationships">
                    <input class="tinytext" type="text" name="attr_RelationPC">
                    <input class="medtext" type="text" name="attr_Relation" >
                </fieldset>
            </table>
            <hr class="minorbreak">
            <h2 class="areaheader">Talents</h2>
 
            <fieldset class="repeating_Talents">
                <input class="medtext" type="text" name="attr_Talent1" >
            </fieldset>
        </div>
        
        <div class="rightbody">
            <HR class="break"> 
            <h2 class="areaheader">Insights & Defects</h2>
            <fieldset class="repeating_insights">
                <input class="medtext" type="text" name="attr_insights" >
            </fieldset>
            <hr class="minorbreak">
            <h2 class="areaheader">Advantages</h2>
            <fieldset class="repeating_advantages">
                <input class="medtext" type="text" name="attr_advantages" >
            </fieldset>    
          </div>
        
        <div class="wideequipment">
            <hr class="break">
            <img class="graphicrule">
            <h2 class="areaheader">Equipment</h2>
            
            <br>
            <fieldset class="repeating_equipment">
                <input class="longtext" type="text" name="attr_equipment" >
                <input class="attribtext"type="number" name="attr_equbonus">
                <button type="action" name="act_equip">Use</button>
            </fieldset>
            <hr class="minorbreak">
            <h2 class="areaheader">Mementos</h2>
            <fieldset class="repeating_mementos">
                <input class="longtext" type="text" name="attr_Mementos" >
            </fieldset>   
            <hr class="minorbreak">
            <h2 class="areaheader">Armor</h2>
            <table class="table2">
                <th>Name</th><th>Protect</th><th>Agility</th>
                <tr>
                  <td><input class="longtext" Type="text" name="attr_armor"></td>
                  <td><input class="attribtext" Type="number" name="attr_armorprotection"></td>
                  <td><input class="atrribtext" Type="number" name="attr_armoragility" value="0"><button type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=@{armor} Check}}{{attribvalue=@{armorprotection}}}{{bonus=@{equipedbonus}}}{{result=[[(@{armorprotection}+@{equipedbonus})d6>6]]}}" name="roll_protection"></button></td>
                </tr>
            </table>
            <hr class="minorbreak">
            <h2 class="areaheader">Weapons</h2>
            <table>
                <tr>
                    <TD class="medtext" >Name</TD><td class="attribtext">  Dmg</td><td class="shorttext">  Type</td><td class="attribtext">  Bonus</td>
                </tr>
            </table>
            <fieldset class="repeating_weapons"> 
                <input class="medtext" type="text" name="attr_weapon">
                <input class="attribtext" type="number" name="attr_damage">
                <select class="shorttext" name="attr_weatype" class="dtype">
                    <option value="@{closecombat}+@{physique}" selected="selected">Melee</option>
                    <option value="@{rangedcombat}+@{precision}">Ranged</option>
                </select>
                <input class="attribtext" type="number" name="attr_bonus">
                <button type="roll" value="&{template:vaesen-attack}{{playername=@{character_name}}}{{attribname=@{weapon} attack!}}{{attribvalue=@{weatype}}}{{weabonus=@{bonus}}}{{bonus=@{equipedbonus}}}{{damage=@{damage}}}{{result=[[(@{weatype}+@{bonus}+@{equipedbonus})d6>6]]}}" name="roll_attack"></button>
            </fieldset>
        </div>
        
        <div class="rightcolumn">
            <table class="attribtable">
                <tr>
                    <h2 class="areaheader">Attributes</h3>
                    <th></th>
                </tr>
                <tr>
                    <td>Physique</td>
                    <td><input type="number" value="1" name="attr_Physique"></td><td><button type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Physique Check}}{{attribvalue=@{physique}}}{{bonus=@{equipedbonus}}}{{result=[[(@{physique}+@{equipedbonus})d6>6]]}}" name="roll_Physique"></button></td>
                </tr>
                <tr>
                    <td>Precision</td>
                    <td><input type="number" value="1" name="attr_Precision"></td><td><button type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Precision Check}}{{attribvalue=@{precision}}}{{bonus=@{equipedbonus}}}{{result=[[(@{precision}+@{equipedbonus})d6>6]]}}" name="roll_Precision"></button></td>

                </tr>
                <tr>
                    <td>Logic</td>
                    <td><input type="number" value="1" name="attr_Logic"></td><td><button type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Logic Check}}{{attribvalue=@{logic}}}{{bonus=@{equipedbonus}}}{{result=[[(@{logic}+@{equipedbonus})d6>6]]}}" name="roll_Logic"></button></td>
                </tr>
                <tr>
                    <td>Empathy</td>
                    <td><input type="number" value="1" name="attr_Empathy"></td><td><button type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Empathy Check}}{{attribvalue=@{empathy}}}{{bonus=@{equipedbonus}}}{{result=[[(@{empathy}+@{equipedbonus})d6>6]]}}" name="roll_Empathy"></button></td>
                </tr>
            </table>
            <HR class="break">
            <table>
                <TR>
                    <td><H2 class="biglabel">Resources</H2></td>
                    <td><input type="text" name="attr_Resources" class="resourcetext"></td>
                </tr>
            </table>
            <HR class="break">
            <h2 class="biglabel">Physical Condtion</h2>
            <select name="attr_PhysicalCondition">
                <option value="0" selected="selected">Healthy</option>
                <option value="1">Exhausted</option>
                <option value="2">Battered</option>
                <option value="3">Wounded</option>
                <option value="4">Broken</option>
            </select>
            <BR>
            <h2 class="biglabel">Mental Condition</h2>
            <select name="attr_MentalCondition">
                <option value="0" selected="selected">Healthy</option>
                <option value="1">Angry</option>
                <option value="2">Frightened</option>
                <option value="3">Hopeless</option>
                <option value="4">Broken</option>
             </select>
             <HR class="break">
             <table class="attribtable">
                <tr>
                  <h2 class="areaheader">Skills</h2>
                  <th></th>
                </tr>
                <tr>
                    <td>Agility</td>
                    <td><input type="number" value="0" name="attr_agility"></td><td><button type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Agility Check}}{{attribvalue=@{physique}}}{{skillvalue=@{agility}}}{{bonus=@{equipedbonus}}}{{agility=@{armoragility}}}{{result=[[(@{physique}+@{agility}+@{equipedbonus}-@{armoragility})d6>6]]}}" name="roll_Physique"></button></td>    
                </tr>
                <tr>
                    <td>Close Combat</td>
                    <td><input type="number" value="0" name="attr_closecombat"></td><td><button name="closecombat_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Close Combat Check}}{{attribvalue=@{physique}}}{{skillvalue=@{closecombat}}}{{bonus=@{equipedbonus}}}{{result=[[(@{physique}+@{closecombat}+@{equipedbonus})d6>6]]}}" name="roll_Physique"></button></td>    
                </tr>
                <tr>
                    <td>Force</td>
                    <td><input type="number" value="0" name="attr_force"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Force Check}}{{attribvalue=@{physique}}}{{skillvalue=@{force}}}{{bonus=@{equipedbonus}}}{{result=[[(@{physique}+@{force}+@{equipedbonus})d6>6]]}}" name="roll_Force"></button></td>    
                </tr>
                <tr>
                    <td>Medicine</td>
                    <td><input type="number" value="0" name="attr_medicine"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Medicine Check}}{{attribvalue=@{precision}}}{{skillvalue=@{medicine}}}{{bonus=@{equipedbonus}}}{{result=[[(@{precision}+@{medicine}+@{equipedbonus})d6>6]]}}" name="roll_Medicine"></button></td>    
                </tr>
                <tr>
                  <td>Ranged Combat</td>
                  <td><input type="number" value="0" name="attr_rangedcombat"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Ranged Combat Check}}{{attribvalue=@{precision}}}{{skillvalue=@{rangedcombat}}}{{bonus=@{equipedbonus}}}{{result=[[(@{precision}+@{rangedcombat}+@{equipedbonus})d6>6]]}}" name="roll_RangedCombat"></button></td>    
                </tr>
                <tr>
                  <td>Stealth</td>
                  <td><input type="number" value="0" name="attr_stealth"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Stealth Check}}{{attribvalue=@{precision}}}{{skillvalue=@{stealth}}}{{bonus=@{equipedbonus}}}{{result=[[(@{precision}+@{stealth}+@{equipedbonus})d6>6]]}}" name="roll_Stealth "></button></td>    
                </tr>
                <tr>
                  <td>Investigation</td>
                  <td><input type="number" value="0" name="attr_investigation"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Investigation Check}}{{attribvalue=@{logic}}}{{skillvalue=@{investigation}}}{{bonus=@{equipedbonus}}}{{result=[[(@{logic}+@{investigation}+@{equipedbonus})d6>6]]}}" name="roll_Investigation "></button></td>
                </tr>
                <tr>
                  <td>Learning</td></td>
                  <td><input type="number" value="0" name="attr_learning"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Learning Check}}{{attribvalue=@{logic}}}{{skillvalue=@{learning}}}{{bonus=@{equipedbonus}}}{{result=[[(@{logic}+@{learning}+@{equipedbonus})d6>6]]}}" name="roll_Learning "></button></td>
                </tr>
                <tr>
                  <td>Vigilance</td>
                  <td><input type="number" value="0" name="attr_vigilance"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Vigilance Check}}{{attribvalue=@{logic}}}{{skillvalue=@{vigilance}}}{{bonus=@{equipedbonus}}}{{result=[[(@{logic}+@{vigilance}+@{equipedbonus})d6>6]]}}" name="roll_Vigilance "></button></td>
                </tr>
                <tr>
                  <td>Inspiration</td></td>
                  <td><input type="number" value="0" name="attr_inspiration"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Inspiration Check}}{{attribvalue=@{empathy}}}{{skillvalue=@{inspiration}}}{{bonus=@{equipedbonus}}}{{result=[[(@{empathy}+@{inspiration}+@{equipedbonus})d6>6]]}}" name="roll_Inspiration "></button></td>
                </tr>
                <tr>
                  <td>Manipulation</td></td>
                  <td><input type="number" value="0" name="attr_manipulation"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Manipulation Check}}{{attribvalue=@{empathy}}}{{skillvalue=@{manipulation}}}{{bonus=@{equipedbonus}}}{{result=[[(@{empathy}+@{manipulation}+@{equipedbonus})d6>6]]}}" name="roll_Manipulation "></button></td>
                </tr>
                <tr>
                  <td>Observation</td></td>
                  <td><input type="number" value="0" name="attr_observation"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-skill}{{playername=@{character_name}}}{{skillname=Observation Check}}{{attribvalue=@{empathy}}}{{skillvalue=@{observation}}}{{bonus=@{equipedbonus}}}{{result=[[(@{empathy}+@{observation}+@{equipedbonus})d6>6]]}}" name="roll_Observation "></button></td>
                </tr>
              </table>
              <HR class="break">
                <h2 class="areaheader">Experience</h2>
                <input type="checkbox" name="attr_experience_1" value="1" class="vaesen_exp_check" title="@{experience_1}"/><span title="1" ></span>
                <input type="checkbox" name="attr_experience_2" value="1" class="vaesen_exp_check" title="@{experience_2}"/><span title="2" ></span>
                <input type="checkbox" name="attr_experience_3" value="1" class="vaesen_exp_check" title="@{experience_3}"/><span title="3" ></span>
                <input type="checkbox" name="attr_experience_4" value="1" class="vaesen_exp_check" title="@{experience_4}"/><span title="4" ></span>
                <input type="checkbox" name="attr_experience_5" value="1" class="vaesen_exp_check" title="@{experience_5}"/><span title="5" ></span>
                <input type="checkbox" name="attr_experience_6" value="1" class="vaesen_exp_check" title="@{experience_6}"/><span title="6" ></span>
                <input type="checkbox" name="attr_experience_7" value="1" class="vaesen_exp_check" title="@{experience_7}"/><span title="7" ></span>
                <input type="checkbox" name="attr_experience_8" value="1" class="vaesen_exp_check" title="@{experience_8}"/><span title="8" ></span>
                <input type="checkbox" name="attr_experience_9" value="1" class="vaesen_exp_check" title="@{experience_9}"/><span title="9" ></span>
                <input type="checkbox" name="attr_experience_10" value="1" class="vaesen_exp_check" title="@{experience_10}"/><span title="10" ></span>
                <hr class="break">
                <table>
                    <TR>
                        <td><H2 class="biglabel">Bonus Dice</H2></td>
                        <td><input type="text" name="attr_equipedbonus" class="resourcetext" value="0"></td>
                    </tr>
                </table>
            <button class="widebutton" type="action" name="act_increasebonus">+</button>
            <button class="widebutton" type="action" name="act_decreasebonus">-</button>
            <button type="action" name="act_clearequ">Clear</button>
        </div>
    </div>
    <div class="sheet-NPC">
        <div class="NPCName">
            <input class="nametext"  Type="text" name="attr_character_name"><label class="attriblabel">Name</label>
            <hr class="break">
        </div>
        <div class="LeftNPC">
            <table class="attribtable">
                <tr>
                    <h2 class="areaheader">Attributes</h3>
                    <th></th>
                </tr>
                <tr>
                    <td>Might</td>
                    <td><input type="number" value="1" name="attr_NPCmight"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Might Check}}{{attribvalue=@{NPCmight}}}{{bonus=@{equipedbonus}}}{{result=[[(@{NPCmight}+@{equipedbonus})d6>6]]}}" name="roll_might "></button></td>
                </tr>
                <tr>
                    <td>Body Control</td>
                    <td><input type="number" value="1" name="attr_NPCbodycontrol"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Body Control Check}}{{attribvalue=@{NPCbodycontrol}}}{{bonus=@{equipedbonus}}}{{result=[[(@{NPCbodycontrol}+@{equipedbonus})d6>6]]}}" name="roll_bodycontrol "></button></td>
                </tr>
                <tr>
                    <td>Magic</td></td>
                    <td><input type="number" value="1" name="attr_NPCmagic"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Magic Check}}{{attribvalue=@{NPCmagic}}}{{bonus=@{equipedbonus}}}{{result=[[(@{NPCmagic}+@{equipedbonus})d6>6]]}}" name="roll_magic "></button></td>
                </tr>
                <tr>
                    <td>Manipulation</td>
                    <td><input type="number" value="1" name="attr_NPCmanipulation"></td><td><button name="force_roll" type="roll" value="&{template:vaesen-attrib}{{playername=@{character_name}}}{{attribname=Manipulation Check}}{{attribvalue=@{NPCmanipulation}}}{{bonus=@{equipedbonus}}}{{result=[[(@{NPCmanipulation}+@{equipedbonus})d6>6]]}}" name="roll_manipulation"></button></td>
                </tr>
                <tr>
                    <td>Fear</td>
                    <td><input type="number" value="1" name="attr_NPCfear"></td>
                </tr>
            </table>
            <hr class="break">
        </div>
        <div class="RightNPC">
            <h2 class="areaheader">Conditions</h2>
            <fieldset class="repeating_NPCCondtions">
                 <input type="checkbox" name=attr_NPCConditionCheck><input class="shorttext" type="text" name="attr_NPCConditions" >
            </fieldset>
            <hr class="break">
            <table>
                <TR>
                    <td><H2 class="biglabel">Bonus Dice</H2></td>
                    <td><input type="text" name="attr_equipedbonus" class="resourcetext" value="0"></td>
                </tr>
            </table>
            <button class="widebutton" type="action" name="act_increasebonus">+</button>
            <button class="widebutton" type="action" name="act_decreasebonus">-</button>
            <button type="action" name="act_clearequ">Clear</button>
        </div>
        <div class="NPCAbilities">
                <h2 class="areaheader">Abilities</h2>
                <fieldset class="repeating_NPCAbilities">
                 <input class="medtext" type="text" name="attr_NPCAbilities" >
             </fieldset>
        </div>
    </div>
<rolltemplate class="sheet-rolltemplate-vaesen-attrib">
    <div class="sheet-vaesen-container">
	    <div class="sheet-vaesen-header">
	        {{playername}}
        </div>
        <div class="sheet-vaesen-subheader">
	        {{attribname}}
        </div>
        <div class="sheet-vaesen-type">Attribute Dice: {{attribvalue}}</div>
        <div class="sheet-vaesen-type">
            Extra Dice: {{bonus}}
        </div>
        <div class="sheet-vaesen-result">{{result}}</div>
    </div>
</rolltemplate>
<rolltemplate class="sheet-rolltemplate-vaesen-skill">
    <div class="sheet-vaesen-container">
	    <div class="sheet-vaesen-header">
	        {{playername}}
        </div>
        <div class="sheet-vaesen-subheader">
            {{skillname}}
        </div>
        <div class="sheet-vaesen-type">
            Atrribute Dice: {{attribvalue}}
        </div>
        <div class="sheet-vaesen-type">
            Skill Dice: {{skillvalue}}
        </div>
        <div class="sheet-vaesen-type">
            Extra Dice: {{bonus}}
        </div>
        {{#agility}}
        <div class="sheet-vaesen-type">
            Armor Penalty: {{agility}}
        </div>
        {{/agility}}
        <div class="sheet-vaesen-result">{{result}}</div>
    </div>
</rolltemplate>
<rolltemplate class="sheet-rolltemplate-vaesen-attack">
    <div class="sheet-vaesen-container">
	    <div class="sheet-vaesen-header">
	        {{playername}}
        </div>
        <div class="sheet-vaesen-subheader">
	        {{attribname}}
        </div>
        <div class="sheet-vaesen-type">Attribute Dice: {{attribvalue}}</div>
        <div class="sheet-vaesen-type">
            Weapon Bonus: {{weabonus}}
        </div>
        <div class="sheet-vaesen-type">
            Extra Dice: {{bonus}}
        </div>
        <div class="sheet-vaesen-subheader">
	        Damage: {{damage}}
        </div>
        <div class="sheet-vaesen-result">{{result}}</div>
    </div>
</rolltemplate>


    
<script type="text/worker">

const buttonlist = ["main","NPC"];

on("clicked:clearequ", function() {
    let resetvalue=0;
    setAttrs({
        "equipedbonus": resetvalue
    });
});

on("clicked:repeating_equipment:equip", function(eventInfo) {
    getAttrs(["repeating_equipment_equbonus"], function(values){
        let newbonus=parseInt(values.repeating_equipment_equbonus)||0;
        setAttrs({
            "equipedbonus": newbonus
        });
    });
});

on("clicked:increasebonus", function(eventInfo) {
    getAttrs(["equipedbonus"], function(values){
        let newbonus=parseInt(values.equipedbonus)+1||0;
        setAttrs({
            "equipedbonus": newbonus
        });
    });
});

on("clicked:decreasebonus", function(eventInfo) {
    getAttrs(["equipedbonus"], function(values){
        let newbonus=parseInt(values.equipedbonus)-1||0;
        if (newbonus < 0) {
            newbonus=0;
        }
        setAttrs({
            "equipedbonus": newbonus
        });
    });
});


buttonlist.forEach(button => {
    on(`clicked:${button}`, function() {
        setAttrs({
            sheetTab: button
        });
    });
});
</script>