Files
2024-06-03 13:15:14 -04:00

2011 lines
125 KiB
HTML

<div class="mainContainer">
<div class="settings">
<div class="mainTitle">SETTINGS:</div>
<div class="settingsBody">
<div style="display: flex"><input name="attr_lock" class="toggle" type="checkbox"/><p>Lock controls</p></div>
<div class="containerFift" style="">
<p><b>Roll to GM: </b></p>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_gmRoll" value="" checked="checked"/><div> Disabled </div> </label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_gmRoll" value="/w gm " /><div> Enabled </div></label>
</div>
</div>
</div>
<div class="Main">
<div class="mainTitle">MAIN:</div>
<div class="Basics">
<div class="left">
<label><b>Name:</b> <input name="attr_character_name" type="text"/></label>
<label><b>Alter: </b><input name="attr_age" type="text"/></label>
<label><b>Rasse: </b><input name="attr_race" type="text"/></label>
<label><b>Beschreibung: </b><textarea name="attr_description" type="description"/></label>
</div>
<div class="avatar">
<img name="attr_character_avatar">
</div>
<div class="right">
<label><b>Behinderungen: </b><textarea name="attr_disability" type="text"/></label>
<label><b>Ticks: </b><textarea name="attr_ticks" type="text"/></label>
</div>
</div>
</div>
<div class="attributes">
<div class="mainTitle">ATTRIBUTES:</div>
<div class="containerThird">
<div class="containerElement" style="margin: 0px; padding: 0px;">
<b>STR</b> (Strength)
<div class="boxed" style="margin: 0px; padding: 0px;">
<div class="containerFift" style="background-color: lightgrey;margin: 0px; padding: 0px; outline: 0px">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:12%;"><input type="radio" name="attr_radio_strength" value="-1" /><div> -1 </div> </label>
<label class="clabl" style="width:10%;"><input type="radio" name="attr_radio_strength" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_strength" value="1" /><div> +1 </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_strength" value="2" /><div> +2 </div></label>
<label class="clabl" style="width:14%;"><input type="radio" name="attr_radio_strength" value="3" /><div> +3 </div></label>
<label class="clabl" style="width:14%;"><input type="radio" name="attr_radio_strength" value="4" /><div> +4 </div></label>
</div>
<div class="boxed" style="background-color: gainsboro">
<p>For each additional point in <b>STR: <br> severity in injury</b> can be <b>reduced</b><br> once every combat encounter</p>
</div>
</div>
</div>
<div class="containerElement" style="margin: 0px; padding: 0px;">
<b>REF</b> (Reflex)
<div class="boxed" style="margin: 0px; padding: 0px;">
<div class="containerFift" style="background-color: lightgrey;margin: 0px; padding: 0px; outline: 0px">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:12%;"><input type="radio" name="attr_radio_reflex" value="-1" /><div> -1 </div> </label>
<label class="clabl" style="width:10%;"><input type="radio" name="attr_radio_reflex" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_reflex" value="1" /><div> +1 </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_reflex" value="2" /><div> +2 </div></label>
<label class="clabl" style="width:14%;"><input type="radio" name="attr_radio_reflex" value="3" /><div> +3 </div></label>
<label class="clabl" style="width:14%;"><input type="radio" name="attr_radio_reflex" value="4" /><div> +4 </div></label>
</div>
<div class="boxed" style="background-color: gainsboro">
<p>For each additional point int <b>REF:<br> Turn Priority is Higher</b> at the <br> beginning of combat encounters</p>
</div>
</div>
</div>
<div class="containerElement" style="margin: 0px; padding: 0px;">
<b>INT</b> (Intelligence)
<div class="boxed" style="margin: 0px; padding: 0px;">
<div class="containerFift" style="background-color: lightgrey;margin: 0px; padding: 0px; outline: 0px">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:12%;"><input type="radio" name="attr_radio_intelligence" value="-1" /><div> -1 </div> </label>
<label class="clabl" style="width:10%;"><input type="radio" name="attr_radio_intelligence" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_intelligence" value="1" /><div> +1 </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_intelligence" value="2" /><div> +2 </div></label>
<label class="clabl" style="width:14%;"><input type="radio" name="attr_radio_intelligence" value="3" /><div> +3 </div></label>
<label class="clabl" style="width:14%;"><input type="radio" name="attr_radio_intelligence" value="4" /><div> +4 </div></label>
</div>
<div class="boxed" style="background-color: gainsboro">
<p>For each additional point in <b>INT:<br></b>Recive <b> 3 additional Skill Points<br></b> to spend in character creation</p>
</div>
</div>
</div>
</div>
</div>
<div class="skills">
<div class="mainTitle"> SKILLS: </div>
<div class="containerThird">
<div class="containerFiveRows">
<p class="largeText noPad"><b>STR</b> Based Skills
<div class="skill">
<p class="alignLeft noPad"><b>Endurance:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_endurance_type" value="STR" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_endurance_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_endurance_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_endurance_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_endurance_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_endurance_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_endurance_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="endurance" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_endurance_level" value="0" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Athletics:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_athletics_type" value="STR" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_athletics_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_athletics_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_athletics_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_athletics_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_athletics_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_athletics_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="athletics" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_athletics_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Grip:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_grip_type" value="STR" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_grip_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_grip_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_grip_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_grip_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_grip_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_grip_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="grip" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_grip_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Swim:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_swim_type" value="STR" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_swim_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_swim_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_swim_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_swim_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_swim_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_swim_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="swim" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_swim_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Throw:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_throw_type" value="STR" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_throw_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_throw_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_throw_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_throw_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_throw_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_throw_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="throw" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_throw_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
</div>
<div class="containerFiveRows">
<p class="largeText noPad"><b>REF</b> Based Skills
<div class="skill">
<p class="alignLeft noPad"><b>Perception:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_perception_type" value="REF" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_perception_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_perception_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_perception_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_perception_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_perception_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_perception_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="perception" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_perception_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Acrobatics:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_acrobatics_type" value="REF" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_acrobatics_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_acrobatics_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_acrobatics_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_acrobatics_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_acrobatics_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_acrobatics_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="acrobatics" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_acrobatics_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Ride/Pilot:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_ride_pilot_type" value="REF" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_ride_pilot_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_ride_pilot_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_ride_pilot_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_ride_pilot_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_ride_pilot_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_ride_pilot_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="ride_pilot" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_ride_pilot_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Sleight of Hand:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_sleight_of_hand_type" value="REF" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_sleight_of_hand_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_sleight_of_hand_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_sleight_of_hand_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_sleight_of_hand_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_sleight_of_hand_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_sleight_of_hand_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="sleight_of_hand" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_sleight_of_hand_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Stealth:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_stealth_type" value="REF" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_stealth_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_stealth_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_stealth_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_stealth_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_stealth_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_stealth_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="stealth" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_stealth_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
</div>
<div class="containerFiveRows">
<p class="largeText noPad"><b>INT</b> Based Skills
<div class="skill">
<p class="alignLeft noPad"><b>General Knowledge:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_general_knowledge_type" value="INT" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_general_knowledge_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_general_knowledge_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_general_knowledge_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_general_knowledge_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_general_knowledge_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_general_knowledge_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="general_knowledge" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_general_knowledge_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Deception:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_deception_type" value="INT" checked="checked" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_deception_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_deception_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_deception_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_deception_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_deception_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_deception_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="deception" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_deception_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Infiltration:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_infiltration_type" value="INT" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_infiltration_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_infiltration_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_infiltration_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_infiltration_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_infiltration_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_infiltration_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="infiltration" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_infiltration_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Persuasion:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_persuasion_type" value="INT" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_persuasion_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_persuasion_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_persuasion_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_persuasion_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_persuasion_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_persuasion_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="persuasion" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_persuasion_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="skill">
<p class="alignLeft noPad"><b>Survival:</b></p>
<div class="flex">
<input type="radio" name="attr_radio_survival_type" value="INT" checked="checked" style="display: none"/>
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_survival_level" value="-1" /><div> -1 </div> </label>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_survival_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_survival_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_survival_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_survival_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_survival_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="survival" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_skill_survival_level" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="vocations">
<div class="mainTitle"> VOCATIONS: </div>
<div class="containerThird">
<div class="containerVocation RED">
<div class="vocationMain Purple">
<div class="VocationSkillDescribtion flex">
<p class="alignLeft noPad"><b>Vocation: </b></p>
<input type="text" name="attr_input_vocation1_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:22%;"><input type="radio" name="attr_radio_vocation1_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:22%;"><input type="radio" name="attr_radio_vocation1_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:22%;"><input type="radio" name="attr_radio_vocation1_type" value="INT" /><div style="text-align: center"> INT </div></label>
</div>
<div class="flex">
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:25%;"><input type="radio" name="attr_radio_vocation1_level" value="1" checked="checked"/><div> +1 </div></label>
<label class="clabl boxed" style="width:25%;"><input type="radio" name="attr_radio_vocation1_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:25%;"><input type="radio" name="attr_radio_vocation1_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:25%;"><input type="radio" name="attr_radio_vocation1_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="vocation1" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_vocation1_value" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="containerVocationSkills BLUE">
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation1_skill1_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill1_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill1_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill1_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill1_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:12%;"><input type="radio" name="attr_radio_vocation1_skill1_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill1_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill1_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill1_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill1_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation1_skill1" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation1_skill2_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill2_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill2_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill2_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill2_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation1_skill2_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill2_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill2_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill2_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill2_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation1_skill2" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation1_skill3_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill3_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill3_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill3_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill3_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:12%;"><input type="radio" name="attr_radio_vocation1_skill3_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill3_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill3_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill3_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill3_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation1_skill3" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation1_skill4_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill4_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill4_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill4_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation1_skill4_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation1_skill4_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill4_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill4_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill4_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation1_skill4_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation1_skill4" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
</div>
</div>
<div class="containerVocation RED">
<div class="vocationMain Purple">
<div class="VocationSkillDescribtion flex">
<p class="alignLeft noPad"><b>Vocation: </b></p>
<input type="text" name="attr_input_vocation2_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_type" value="INT" /><div style="text-align: center"> INT </div></label>
</div>
<div class="flex">
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation2_level" value="0" checked="checked"/><div> 0 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="vocation2" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_vocation2_value" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="containerVocationSkills BLUE">
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation2_skill1_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill1_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill1_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill1_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill1_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation2_skill1_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill1_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill1_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill1_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill1_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation2_skill1" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text"name="attr_input_vocation2_skill2_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill2_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill2_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill2_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill2_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation2_skill2_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill2_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill2_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill2_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill2_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation2_skill2" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text"name="attr_input_vocation2_skill3_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill3_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill3_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill3_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill3_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation2_skill3_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill3_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill3_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill3_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill3_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation2_skill3" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text"name="attr_input_vocation2_skill4_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill4_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill4_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill4_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation2_skill4_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation2_skill4_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill4_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill4_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill4_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation2_skill4_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation2_skill4" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
</div>
</div>
<div class="containerVocation RED">
<div class="vocationMain Purple">
<div class="VocationSkillDescribtion flex">
<p class="alignLeft noPad"><b>Vocation: </b></p>
<input type="text" name="attr_input_vocation3_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:22%;"><input type="radio" name="attr_radio_vocation3_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:22%;"><input type="radio" name="attr_radio_vocation3_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:22%;"><input type="radio" name="attr_radio_vocation3_type" value="INT" /><div style="text-align: center"> INT </div></label>
</div>
<div class="flex">
<div class="skillSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation3_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_level" value="4" /><div> +4 </div></label>
</div>
<div class="skillSum boxed" style="width: 37.5%" style="align: right">
<button name="act_test" id="vocation3" type="action" class="buttonVocation">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
<input class="calcBox" name="attr_input_vocation3_value" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="containerVocationSkills BLUE">
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation3_skill1_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill1_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill1_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill1_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill1_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation3_skill1_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill1_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill1_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill1_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill1_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation3_skill1" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation3_skill2_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill2_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill2_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill2_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill2_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation3_skill2_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill2_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill2_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill2_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill2_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation3_skill2" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation3_skill3_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill3_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill3_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill3_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill3_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation3_skill3_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill3_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill3_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill3_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill3_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation3_skill3" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
<div class="VocationSkill Green">
<div class="VocationSkillDescribtion flex">
<input type="text" name="attr_input_vocation3_skill4_name"/>
</div>
<div class="VocationSkillType flex">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill4_type" value="STR" /><div style="text-align: center"> STR </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill4_type" value="REF" /><div style="text-align: center"> REF </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill4_type" value="INT" /><div style="text-align: center"> INT </div></label>
<label class="clabl" style="width:25%;"><input type="radio" name="attr_radio_vocation3_skill4_type" value="CBT" /><div style="text-align: center"> CBT </div></label>
</div>
<div class="skillVocationSelect noPad">
<input name="attr_lock" class="toggle" type="checkbox" style="display: none"/>
<label class="clabl boxed" style="width:10%;"><input type="radio" name="attr_radio_vocation3_skill4_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill4_level" value="1" /><div> +1 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill4_level" value="2" /><div> +2 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill4_level" value="3" /><div> +3 </div></label>
<label class="clabl boxed" style="width:22%;"><input type="radio" name="attr_radio_vocation3_skill4_level" value="4" /><div> +4 </div></label>
</div>
<div class="flex">
<div class="" style="width: 50%">
<button name="act_test" id="vocation3_skill4" type="action" class="button">
<p class="alignLeft noPad" style="font-size: large; font-family: dicefontd8"><b>0</b></p>
</button>
</div>
<div class="skillSum vocationskillresult">
<input class="calcBox" type="boxed" style="width: 100%;"/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="states">
<div class="mainTitle"> STATE: </div>
<div class="halved">
<div class="left">
<div class="injuries">
<div class="padding">
<p class=""><b>Injuries: </b></p>
<div class="skillSelect noPad" style="width: 100%; display: flex; height: 20%">
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="1" /><div> 1 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="2" /><div> 2 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="3" /><div> 3 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="4" /><div> 4 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="5" /><div> 5 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_injuries_level" value="6" /><div> 6 </div></label>
</div>
<div class="boxed auto">
<p>When the level of injury exceeds your <b>BASE ROLL (3) + ATTRIBUTE POINTS</b>, you fall <b>unconscious.</b></p>
</div>
</div>
<div class="padding">
<p class=""><b>Lingering Injuries: </b></p>
<div class="flex" >
<div class="boxed" style="width: 50%"><p><b>Injury:</b></p></div>
<div class="boxed" style="width: 50%"><p><b>Penalty:</b></p></div>
</div>
<div class="injuries" style="width: 100%">
<fieldset class="repeating_injuries flex">
<input type="text" name="attr_injuriy_name" value="Injury:">
<input type="text" name="attr_injuriy_penalty" value="Penalty:">
</fieldset>
</div>
</div>
</div>
</div>
<div class="midright">
<div class="midrightMain">
<div class="destiny">
<div class="headline"><p><b>Destiny Points: </b></p></div>
<div class="skillSelect noPad" style="width: 100%; display: flex">
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_throw" value="4" checked="checked"/><div> Disabled </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_throw" value="3" /><div> Enabled </div> </label>
</div>
<div class="skillSelect noPad" style="width: 100%; display: flex">
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_level" value="1" /><div> 1 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_level" value="2" /><div> 2 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_level" value="3" /><div> 3 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_level" value="4" /><div> 4 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_destiny_level" value="5" /><div> 5 </div></label>
</div>
</div>
<div class="commerce">
<div class="headline"><p><b>Commerce & Wealth Points: </b></p></div>
<div class="skillSelect noPad" style="width: 100%; display: flex">
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="1" /><div> 1 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="2" /><div> 2 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="3" /><div> 3 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="4" /><div> 4 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="5" /><div> 5 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="6" /><div> 6 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="7" /><div> 7 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_commerce_level" value="8" /><div> 8 </div></label>
</div>
<div class="skillSelect noPad" style="width: 100%; display: flex">
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="0" checked="checked"/><div> 0 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="1" /><div> 1 </div> </label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="2" /><div> 2 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="3" /><div> 3 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="4" /><div> 4 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="5" /><div> 5 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="6" /><div> 6 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="7" /><div> 7 </div></label>
<label class="clabl boxed flex-grow"><input type="radio" name="attr_radio_wealth_level" value="8" /><div> 8 </div></label>
</div>
</div>
</div>
<div class="equipment">
<div class="padding">
<p class=""><b>Inventory and Equipment: </b></p>
<div class="flex" >
<div class="boxed" style="width: 35%"><p><b>Name:</b></p></div>
<div class="boxed" style="width: 20%"><p><b>Place:</b></p></div>
<div class="boxed" style="width: 45%"><p><b>Description:</b></p></div>
</div>
<div style="width: 100%;">
<fieldset class="repeating_equipment flex" style="width: auto">
<input type="text" name="attr_item_name" value="Name:" style="width: 35%">
<select name="attr_item_location" style="width: 20%">
<option value="0" selected="selected">Body</option>
<option value="1">Backpack</option>
<option value="2">Stached</option>
</select>
<input type="text" name="attr_item_description" value="Description:" style="width: 45%">
</fieldset>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footnotes">
<div class="mainTitle">FOOTNOTES:</div>
<div class="Basics">
<p>This Charactersheet is in beta phase, the auto calc fields are missing and some designwork isn't finished. <br><b>This sheet should be in a playable state tho!</b></p>
</div>
</div>
<script type="text/worker">
//-------------------------------------------------------------------------------------
// orcsAsync
// Compensates for a defect in the underlying Roll20 system, where it "loses context"
// (forgets which player is active) during asynchronous methods and callbacks,
// resulting in error messages like:
//
// Error: Trying to do getAttrs when no character is active in sandbox.
//
// Include this script at the top of your character sheet's code setion to have
// setTimeout() and setInterval() just start working as expected; no additional setup
// required. Additionally, async-safe versions of the typical attribute functions will
// be available:
//
// getAttrsAsync
// setAttrsAsync
// getSectionIDsAsync
//
function isRunningOnServer() { return self.dispatchEvent == undefined; }
function setActiveCharacterId(charId){
var oldAcid=getActiveCharacterId();
var msg={"id":"0", "type":"setActiveCharacter", "data":charId};
if(isRunningOnServer()==false){ //if in a browser, use "dispatchEvent" to process the message
var ev = new CustomEvent("message");
ev.data=msg;
self.dispatchEvent(ev);
}else{ //otherwise, use the API (server) message processor, "onmessage"
self.onmessage({data:msg});
}
return oldAcid; //return what the value used to be, so calling code can be a little cleaner
}
var _sIn=setInterval;
setInterval=function(callback, timeout){
var acid=getActiveCharacterId();
_sIn(
function(){
var prevAcid=setActiveCharacterId(acid);
callback();
setActiveCharacterId(prevAcid);
}
,timeout);
}
var _sto=setTimeout
setTimeout=function(callback, timeout){
var acid=getActiveCharacterId();
_sto(
function(){
var prevAcid=setActiveCharacterId(acid);
callback();
setActiveCharacterId(prevAcid);
}
,timeout);
}
function getAttrsAsync(props){
var acid=getActiveCharacterId(); //save the current activeCharacterID in case it has changed when the promise runs
var prevAcid=null; //local variable defined here, because it needs to be shared across the promise callbacks defined below
return new Promise((resolve,reject)=>{
prevAcid=setActiveCharacterId(acid); //in case the activeCharacterId has changed, restore it to what we were expecting and save the current value to restore later
try{
getAttrs(props,(values)=>{ resolve(values); });
}
catch{ reject(); }
}).finally(()=>{
setActiveCharacterId(prevAcid); //restore activeCharcterId to what it was when the promise first ran
});
}
//use the same pattern for each of the following...
function setAttrsAsync(propObj, options){
var acid=getActiveCharacterId();
var prevAcid=null;
return new Promise((resolve,reject)=>{
prevAcid=setActiveCharacterId(acid);
try{
setAttrs(propObj,options,(values)=>{ resolve(values); });
}
catch{ reject(); }
}).finally(()=>{
setActiveCharacterId(prevAcid);
});
}
function getSectionIDsAsync(sectionName){
var acid = getActiveCharacterId();
var prevAcid=null;
return new Promise((resolve,reject)=>{
prevAcid = setActiveCharacterId(acid);
try{
getSectionIDs(sectionName,(values)=>{ resolve(values); });
}
catch{ reject(); }
}).finally(()=>{
setActiveCharacterId(prevAcid);
});
}
//------------------------------------------------------------------------------------------------
// orcsCharacter
// The core class for the orcsCharacter script. All other classes are instantiated
// via this object, or off of objects instantiated from this object.
class orcsCharacter{
// We use create() instead of "new" since we use this as a Proxy.
// var pc = orcsCharacter.create();
static create() {
var char = new orcsCharacter(); //create a new character object
char.preferNumeric = true;
char.proxy = new Proxy(char, orcsCharacter.#attrHandler); //wrap it in a proxy
return char.proxy;
}
_enforceDataType(val) {
if (!this.preferNumeric) return val;
var num = +val;
if (val == null || val == undefined) return 0;
if (isNaN(num)) return val;
return num;
}
//a simple helper, to get the value of a single attribute
static _getSingleAttrAsync(prop) {
var acid = getActiveCharacterId();
var prevAcid = null;
return new Promise((resolve, reject) => {
prevAcid = setActiveCharacterId(acid);
try {
getAttrs([prop], (values) => { resolve(values[prop]); });
}
catch { reject(); }
}).finally(() => {
setActiveCharacterId(prevAcid);
});
}
static #attrHandler = {
get: (obj, prop)=>{
switch(prop){
case "cacheAsync": //a method to create a cached attribute object
return (attributes) => { return orcsAttributeCache.createAsync(obj, attributes); };
case "getEmptyCache": //a method to create an empty cached attribute object
return () => { return orcsAttributeCache.create(); };
case "getRepeatingAsync": //a method to create a repeating section object
return async (sectionName) => {
return orcsRepeatingSection.createAsync(obj, sectionName);
};
case "cacheRepeatingAsync": //a method to create a cached repeating section object
return async (sectionName, attributes) => {
var rsc = await orcsRepeatingSectionCache.createAsync(obj,sectionName);
await rsc.cacheAsync(attributes);
return rsc;
};
case "cacheMultipleAsync": return async (attributes, sectionsRequestObject) => { return await orcsMultiCacheController.createAsync(obj, attributes, sectionsRequestObject); };
case "preferNumeric": return (flag)=>{ obj.preferNumeric = flag; };
//TODO needs test case
case "getRowFromEvent": //a method to lookup the passed in entry of a repeating section, from an event handler
return (eventInfo)=>{
var matches=eventInfo.sourceAttribute.match("repeating_([^_]*)_(.{20})_");
return orcsRepeatingSection.createRowProxy(matches[2], matches[1]);
};
}
return orcsCharacter._getSingleAttrAsync(prop).then(val => {return obj._enforceDataType(val);});
},
set: async (obj, prop, value) => {
prop = await Promise.resolve(prop); //if a user passed in a promise, resolve it first (Promise.resolve, returns a Promise, regardless of if it is or not)
var json='{"'+prop+'":"'+value.toString().replaceAll(/"/gi,'\\"')+'"}';
return setAttrsAsync(JSON.parse(json));
}
};
}class orcsAttributeCache{
_cache = { _isDirty: {} };
_parent;
_attributes;
_proxy;
static create(parent){
var retval = new orcsAttributeCache();
retval._parent = parent;
retval._proxy = new Proxy(retval, orcsAttributeCache.#attrHandler);
return retval._proxy;
}
static async createAsync(parent, attributes) {
var obj = new orcsAttributeCache();
obj._parent = parent;
obj._attributes = attributes;
var retval = new Proxy(obj, orcsAttributeCache.#attrHandler);
await obj.cacheAttrsAsync(attributes);
return retval;
}
async cacheAttrsAsync(attributes) {
//preload any initial values that were provided
if (attributes == null) return;
var atrbList = this.getAttributeRequestList();
atrbList = `[${atrbList}]`;
var values = await getAttrsAsync(JSON.parse(atrbList));
this.hydrateResponse(attributes, values);
}
getAttributeRequestList(attributes) {
if (attributes == null) attributes = this._attributes;
var atrbList = "";
attributes.forEach(attrib => {
if (atrbList != "") atrbList = atrbList + ",";
atrbList = atrbList + `"${attrib}"`;
});
return atrbList;
}
hydrateResponse(attributes, response) {
for (var attribute of attributes) {
var val = response[attribute];
if (val != null) this._proxy[attribute] = val;
}
this.clean();
}
getCommitJson() {
var json="";
for(var prop in this._cache._isDirty){
if (this._cache._isDirty[prop] != true) continue;
if(json!="") json+=",";
json+=('"'+prop+'":"'+this._cache[prop].toString().replaceAll(/"/gi,'\\"')+'"');
}
return JSON.parse("{" + json + "}");
}
clean() {
this._cache._isDirty = {};
}
commitAsync() {
var commitJson = this.getCommitJson();
this.clean();
return setAttrsAsync(json);
}
static #attrHandler = {
get: (obj, prop)=>{
switch(prop){
case "getProxyTarget": return () => { return obj; };
case "commitAsync": return () => { obj.commitAsync(); };
case "clean": return () => { obj.clean(); }
//case "cacheAttrsAsync":
// return (attributes) => {
// return orcsAttributeCache.cacheAttrsAsync(obj, attributes);
//}
case "getAttributeRequestList": return (attrs) => { return obj.getAttributeRequestList(attrs); }
case "getCommitJson": return () => { return obj.getCommitJson(); };
}
return obj._parent._enforceDataType(obj._cache[prop]);
},
set: (obj, prop, value) => {
obj._cache[prop] = value;
obj._cache._isDirty[prop] = true;
return value;
}
};
}
class orcsRepeatingSection extends Array{
_parent = null;
_sectionName = "";
static async createAsync(characterObj, sectionName) {
var retval = new orcsRepeatingSection();
retval._parent = characterObj;
retval._sectionName = sectionName;
await retval.hydrateAsync();
return retval;
}
createRowProxy(rowId) {
if (rowId == null) rowId = generateRowID();
return orcsRepeatingSectionRow.create(this, rowId);
}
addNew(attribs) {
var newRow = this.createRowProxy();
if(attribs==null) attribs={};
for (var prop in attribs) newRow[prop]=attribs[prop];
return newRow;
};
async hydrateAsync() {
var rowIds = await getSectionIDsAsync(this._key);
for(var rowId of rowIds){
this.push(this.createRowProxy(rowId));
}
}
get _key() { return `repeating_${this._sectionName}`; }
get _rootCharacterObj() { return this._parent; }
/* //TODO... Need a test case for this...
if (section == "eventRow") {
return (eventInfo)=>{
var matches=eventInfo.sourceAttribute.match("repeating_([^_]*)_(.{20})_");
return orcsRepeatingSection.createRowProxy(obj._charObj, matches[2], matches[1]);
};
};
}
};*/
}class orcsRepeatingSectionRow{
_parent;
_rowId;
static create(repeatingSection,rowId) {
var retval = new orcsRepeatingSectionRow();
retval._rowId = rowId;
retval._parent = repeatingSection;
return new Proxy(retval, orcsRepeatingSectionRow.#repeatingSectionRowHandler);
}
static #repeatingSectionRowHandler={
get: (obj,prop)=>{
switch (prop) {
case "delete": return () => { removeRepeatingRow(obj._key) };
case "_rowId": return obj._rowId;
}
return obj._rootCharacterObj.proxy[obj._propKey(prop)].then(val => {
return obj._rootCharacterObj._enforceDataType(val);
});
},
set: async (obj, prop, value) => {
return obj._rootCharacterObj.proxy[obj._propKey(prop)] = value;
}
};
get _rootCharacterObj() {
return this._parent._parent;
}
get _key() {
return this._parent._key+"_"+this._rowId;
}
_propKey(prop) {
return this._parent._key+"_"+this._rowId+"_"+prop;
}
}class orcsRepeatingSectionCache extends Array{
_parent = null;
_sectionName = "";
static create(characterObj, sectionName) {
var retval = new orcsRepeatingSectionCache();
retval._parent = characterObj;
retval._sectionName = sectionName;
return retval;
}
static async createAsync(characterObj, sectionName) {
var retval = new orcsRepeatingSectionCache();
retval._parent = characterObj;
retval._sectionName = sectionName;
await retval.initializeAsync();
return retval;
}
//initialization equates to: 1) retrieving a list of row IDs, and 2) populating the list of row proxies, one for each row ID
async initializeAsync() {
var rowIds = await getSectionIDsAsync(this._key);
for (var rowId of rowIds)
this.push(this.createRowProxy(rowId));
}
createRowProxy(rowId) {
if (rowId == null) rowId = generateRowID(); //if no rowID is supplied, then assume this is a new row
return orcsRepeatingSectionRowCache.create(this, rowId);
}
addNew(attribsAndValues) {
var newRow = this.createRowProxy();
if(attribsAndValues==null) attribsAndValues={};
for (var prop in attribsAndValues)
newRow[prop] = attribsAndValues[prop]; //set these rows individually, the values will be marked dirty and included in the next commit
this.push(newRow);
return newRow;
};
async commitAsync() {
var json = this.getCommitJson();
this.commitDeletedRows();
this.cleanAll();
return setAttrsAsync(json);
}
commitDeletedRows() {
this.map(i=>i).forEach(row => {
if (row._isDeleted) {
removeRepeatingRow(row.getProxyTarget()._key);
this.splice(this.indexOf(row), 1); //remove it from the underlying array too
}
});
}
//set all fields on all rows as clean, so they will not be generated on the next commit
cleanAll() {
this.forEach(row => row.clean());
}
//returns a json object of the field/values which are dirty and need to be updated
getCommitJson() {
var json = {};
//this.map(i=>i).forEach(row => {
this.forEach(row => {
json = { ...json, ...row.getProxyTarget().getCommitJson() };
});
return json;
}
//given a list of attributes, this function returns a string list key pointers to those values, in the format expected by getAttrs...
getAttributeRequestList(attributes) {
var atrbList = "";
this.forEach(row => {
attributes.forEach(attrib => {
if (atrbList != "") atrbList = atrbList + ",";
atrbList = atrbList + `"${row.getProxyTarget()._propKey(attrib)}"`;
});
});
return atrbList;
}
//given a list of attribute names and a response from getAttrs, this function will pick the appropriate values
//from the response which make sense for this section, assign them to the correct rows, and ignore the rest
hydrateResponse(attributes, response) {
this.forEach(row => {
attributes.forEach(attrib => {
row.getProxyTarget()._cache[attrib] = response[row.getProxyTarget()._propKey(attrib)];
});
row.clean();
});
}
//give a list of attribute names, this function will retrieve the values of those attributes for all rows and assign
//them accordingly
async cacheAsync(attributes) {
var atrbList = this.getAttributeRequestList(attributes);
atrbList = `[${atrbList}]`;
var values = await getAttrsAsync(JSON.parse(atrbList));
this.hydrateResponse(attributes,values);
}
get _key() { return `repeating_${this._sectionName}`; }
get _rootCharacterObj() {
return this._parent;
}
}
class orcsRepeatingSectionRowCache{
_parent; //the parent object is the orcsRepeatingSectionCache
_rowId; //the unique identifier for this row
_cache = {};//the cached values
_isDirty = {};//we track the values that have been changed
_isDeleted = false; //has this row been marked for deletion
_proxy = null; //the proxy which is exposed to users
static create(parent,rowId) {
var retval = new orcsRepeatingSectionRowCache();
retval._rowId = rowId;
retval._parent = parent;
retval._proxy = retval;
return new Proxy(retval, orcsRepeatingSectionRowCache.#repeatingSectionRowCacheHandler);
}
getCommitJson() {
if (this._isDeleted == true) return "";
var json = "";
for (var attrb in this._cache) {
if (this._isDirty[attrb] != true) continue;
if (json != "") json += ",";
json += ('"' + this._propKey(attrb) + '":"' + this._cache[attrb].toString().replaceAll(/"/gi, '\\"') + '"');
}
return JSON.parse('{' + json + '}');
}
clean() {
//for (var attrb in obj._cache) obj._isDirty[attrb] = false;
this._isDirty = [];
}
static #repeatingSectionRowCacheHandler={
get:(obj,prop)=>{
switch (prop) {
case "getProxyTarget": return () => { return obj; };
case "_rowId": return obj._rowId;
case "_isDeleted": return obj._isDeleted;
case "clean": return () => { return obj.clean() };
case "delete": return () => { obj._isDeleted = true; };
case "undelete": return ()=>{obj._isDeleted=false;};
}
return obj._rootCharacterObj._enforceDataType(obj._cache[prop]);
},
set: (obj, prop, value) => {
obj._isDirty[prop] = true;
return obj._cache[prop] = value;
}
}
get _rootCharacterObj() { return this._parent._parent; }
get _key() { return this._parent._key + "_" + this._rowId; }
_propKey(prop) { return this._key+"_"+prop; }
}
//-----------------------------------------------------------------------------
//orcsMultiCacheController
//Optimizes loading and saving attributes by combining the gets and sets of
//basic attributes and repeating sections
class orcsMultiCacheController {
attributes = null; //an orcsAttributeCache object
sections = {}; //on object of named orcsRepeatingSectionCache objects
_parent = {}; //the parent object, typically the root orcsCharacter object
_attributeNames = []; //an array of attribute names which this object is meant to cache
_sectionsRequestObject = {}; //an object of named repeating sections and arrays of the attributes to cache
static async createAsync(characterObj, attributeNames, sectionsRequestObject) {
//if the user asked for repeating sections, but not a list of attributes...
if (sectionsRequestObject == null && typeof attributeNames == "object" && Array.isArray(attributeNames) == false) {
sectionsRequestObject = attributeNames;
attributeNames = [];
}
var retval = new orcsMultiCacheController();
retval._parent = characterObj;
retval._attributeNames = attributeNames;
retval._sectionsRequestObject = sectionsRequestObject;
await retval.hydrateAsync();
return retval;
}
//create empty versions of all the cached objects which have been requested, then populate them from a single attribute request
async hydrateAsync() {
this.attributes = orcsAttributeCache.create(this._parent); //empty attributes object
//for repeating sections, we pull in the sectionIDs for existing rows, per section
//since we don't have an option to do multiple sections in a single call, we'll kick them all off together, running in parallel
var promises = [];
for (var sectionName in this._sectionsRequestObject) {
var section = orcsRepeatingSectionCache.create(this._parent, sectionName); //create an empty cached repeating section object
this.sections[sectionName] = section;
promises.push(section.initializeAsync()); //initialize it with row ids. Note we do NOT await, but let all run concurrently
}
await Promise.all(promises); //now we wait until all the parallel async calls return
//make a single call and get all values (base attributes and repeating section values) at once...
var values = await getAttrsAsync(JSON.parse("[" + this.getAttributeRequestList() + "]"));
//pull all returned attribute values into their coresponding objects
this.attributes.getProxyTarget().hydrateResponse(this._attributeNames, values); //character attributes
for (var sectionName in this.sections) {
this.sections[sectionName].hydrateResponse(this._sectionsRequestObject[sectionName], values); //repeating sections
}
}
//return a list of attributes required to populate/hydrate cached attributes and repeating sections
getAttributeRequestList() {
var list = this.attributes.getAttributeRequestList(this._attributeNames);
for (var sectionName in this._sectionsRequestObject) {
var section = this.sections[sectionName];
if (list != "") list = list + ",";
list = list + section.getAttributeRequestList(this._sectionsRequestObject[sectionName]);
};
return list;
}
//get all the JSON from all the objects and munge it together, then commit it at one time
async commitAsync() {
var json = this.attributes.getCommitJson();
for (var sectionName in this.sections) {
var section = this.sections[sectionName];
section.commitDeletedRows();
json = { ...json, ...section.getCommitJson() };
section.cleanAll();
}
return setAttrsAsync(json);
}
}var pc=orcsCharacter.create();
on("change:radio_injuries_level", async (eventInfo)=> {
console.log(eventInfo);
if (eventInfo.newValue == "0") return
let starred = "";
//
const skillBase = ["radio_strength","radio_reflex","radio_intelligence"];
const baseDie = 3;
const attributesLevel = await getAttrsAsync(skillBase);
const attributeLevel = Object.values(attributesLevel).reduce((a, b) => parseInt(a) + parseInt(b), 0);
let skillName = "Injury";
const injuryLevel = parseInt(eventInfo.newValue);
const skillThreshholdArray = await getAttrsAsync(["radio_destiny_throw", "radio_destiny_level"]);
let skillThreshhold= skillThreshholdArray["radio_destiny_throw"];
const skillDestinyLevel = skillThreshholdArray["radio_destiny_level"];
// if Destiny Throw active = Threashold lowerded from 4 to 3
if (skillThreshhold == 3) {
// if destiny levels are too low to use
if (skillDestinyLevel < 1) {
skillThreshhold = 4;
}else{
starred = "S";
}
}
const rollRequest = `\
@{gmRoll}\
&{template:injury}\
{{name=[[0]]}}\
{{gooddie=[[0]]}}\
{{baddie=[[0]]}}\
{{roll1=[[\
[[\
[[${baseDie}]] +\
[[${attributeLevel}]]\
]]d6>\
${skillThreshhold}\
-${injuryLevel}\
]]\
}}\
{{challangedie=[[0]]}}\
{{starred=[[0]]}}`;
console.log(rollRequest);
startRoll(rollRequest, (rollObject) => {
console.log(rollObject);
let goodDie = "";
let badDie = "";
const rollsArray = rollObject.results.roll1.dice;
rollsArray.forEach((item) => {
if (item>=skillThreshhold){
let encode = encodeRoll(item);
goodDie += encode;
}else{
let encode = encodeRoll(item);
badDie += encode;
}
});
let challangedie = "ERROR";
console.log(rollsArray);
console.log(goodDie);
console.log(badDie);
if (injuryLevel>0){
let dieDiff = injuryLevel - goodDie.length;
console.log(dieDiff);
challangedie = goodDie.substring(goodDie.length-injuryLevel, goodDie.length);
goodDie = goodDie.substring(0, goodDie.length-injuryLevel);
if (dieDiff>0){
challangedie += "@".repeat(dieDiff);
}
console.log(goodDie);
console.log(challangedie);
}
const wins = goodDie.length - injuryLevel;
// if Destiny Throw aktive // lower destiny level if threashold is a o k
if (skillThreshhold == 3){
setAttrs({"radio_destiny_level": skillDestinyLevel-1});
}
finishRoll(
rollObject.rollId,
{
name: skillName,
challangelevel: injuryLevel,
gooddie: goodDie,
baddie: badDie,
wins: wins,
challangedie: challangedie,
starred: starred
}
);
});
});
// ############################################
on("change:radio_endurance_level change:radio_athletics_level change:radio_grip_level change:radio_swim_level change:radio_throw_level change:radio_perception_level change:radio_acrobatics_level change:radio_ride_pilot_level change:radio_sleight_of_hand_level change:radio_stealth_level change:radio_general_knowledge_level change:radio_deception_level change:radio_infiltration_level change:radio_persuasion_level change:radio_survival_level", async (eventInfo)=>{
// Get all Info
console.log(eventInfo);
let targetAttr = "error";
switch(eventInfo.sourceAttribute) {
case "radio_endurance_level":
case "radio_athletics_level":
case "radio_grip_level":
case "radio_swim_level":
case "radio_throw_level":
targetAttr = "strength";
break;
case "radio_perception_level":
case "radio_acrobatics_level":
case "radio_ride_pilot_level":
case "radio_sleight_of_hand_level":
case "radio_stealth_level":
targetAttr = "reflex";
break;
case "radio_general_knowledge_level":
case "radio_deception_level":
case "radio_infiltration_level":
case "radio_persuasion_level":
case "radio_survival_level":
targetAttr = "intelligence";
break;
}
//attr_radio_strength
console.log(targetAttr);
let baseAttr = await getAttrsAsync(["radio_"+targetAttr]);
console.log(baseAttr);
// attr_input_skill_endurance
let target = eventInfo.sourceAttribute.replace("radio_","input_skill_")
console.log(target);
console.log(parseInt(eventInfo.newValue));
console.log(parseInt(baseAttr["radio_"+targetAttr]));
let value = parseInt(baseAttr["radio_"+targetAttr]) + parseInt(eventInfo.newValue);
console.log(value);
let setObject = {};
setObject[target] = value;
console.log(setObject);
await setAttrsAsync(setObject);
});
on("clicked:test", async (event)=>{
console.log(event);
// // constants
//
let starred = "";
const baseDie = 3;
/*
Base 3 + Associated Attribute + Skill Level + Assist - Challange Level
*/
// get Name of targeted VocationSkill
// get all ascociated Attribute Values
//
console.log(event.htmlAttributes.id);
const skillLevelArray = await getAttrsAsync(["radio_"+event.htmlAttributes.id+"_level"]);
const skillLevel = skillLevelArray["radio_"+event.htmlAttributes.id+"_level"];
const skillTypeArray = await getAttrsAsync(["radio_"+event.htmlAttributes.id+"_type"]);
const skillType = skillTypeArray["radio_"+event.htmlAttributes.id+"_type"];
let skillBase = ["radio_strength","radio_reflex","radio_intelligence"];
const skillNameArray = await getAttrsAsync(["input_"+event.htmlAttributes.id+"_name"]);
let skillName = skillNameArray["input_"+event.htmlAttributes.id+"_name"];
if (skillName === undefined) {skillName = event.htmlAttributes.id.toUpperCase()}
const skillThreshholdArray = await getAttrsAsync(["radio_destiny_throw", "radio_destiny_level"]);
let skillThreshhold= skillThreshholdArray["radio_destiny_throw"];
const skillDestinyLevel = skillThreshholdArray["radio_destiny_level"];
// if Destiny Throw aktive = Threashold lowerded from 4 to 3
if (skillThreshhold == 3){
// if destiny levels are too low to use
if (skillDestinyLevel < 1) {
skillThreshhold = 4;
}else{
starred = "S";
}
}
console.log(skillName);
switch(skillType) {
case "INT":
skillBase = ["radio_intelligence"];
break;
case "REF":
skillBase = ["radio_reflex"];
break;
case "STR":
skillBase = ["radio_strength"];
break;
case "CBT":
skillBase = ["radio_strength","radio_reflex","radio_intelligence"];
break;
}
const attributesLevel = await getAttrsAsync(skillBase);
const attributeLevel = Object.values(attributesLevel).reduce((a, b) => parseInt(a) + parseInt(b), 0);
console.log(`Skilllevel: ${skillLevel}`);
console.log(`Skill Base: ${skillBase}`);
console.log(attributesLevel);
console.log(attributeLevel);
const rollRequest = `\
@{gmRoll}\
&{template:test}\
{{name=[[0]]}}\
{{gooddie=[[0]]}}\
{{baddie=[[0]]}}\
{{roll1=[[\
[[\
[[${baseDie}]] +\
[[?{Mod|0}]] + \
[[${skillLevel}]] + \
[[${attributeLevel}]]\
]]d6>\
${skillThreshhold}\
-?{Challange Level|3}+?{Assist|0}\
]]\
}}\
{{assists=[[?{Assist|0}]]}}\
{{skilllevel=[[0]]}}\
{{mod=[[?{Mod|0}]]}}\
{{attributetype=[[0]]}}\
{{attributesum=[[0]]}}\
{{challangeLevel=[[?{Challange Level|3}]]}}\
{{challangedie=[[0]]}}\
{{starred=[[0]]}}\
`;
console.log(rollRequest);
startRoll(rollRequest, (rollObject) => {
console.log(rollObject);
console.log(rollObject.results.assists);
const assists = rollObject.results.assists.result;
console.log(assists);
console.log(rollObject.results.challangeLevel);
const challangeLevel = rollObject.results.challangeLevel.result;
console.log(challangeLevel);
const mod = rollObject.results.mod.result;
console.log(mod);
let goodDie = "";
let badDie = "";
const rollsArray = rollObject.results.roll1.dice;
rollsArray.forEach((item) => {
if (item>=skillThreshhold){
let encode = encodeRoll(item);
goodDie += encode;
}else{
let encode = encodeRoll(item);
badDie += encode;
}
});
let challangedie = "";
console.log(rollsArray);
console.log(goodDie);
console.log(badDie);
if (assists>0){
goodDie += "0".repeat(assists);
}
console.log(goodDie);
if (challangeLevel>0){
let dieDiff = challangeLevel - goodDie.length;
console.log(dieDiff);
challangedie = goodDie.substring(goodDie.length-challangeLevel, goodDie.length);
goodDie = goodDie.substring(0, goodDie.length-challangeLevel);
if (dieDiff>0){
challangedie += "@".repeat(dieDiff);
}
console.log(goodDie);
console.log(challangedie);
}
const wins = goodDie.length - challangeLevel;
// if Destiny Throw aktive // lower destiny level if threashold is a o k
if (skillThreshhold == 3){
setAttrs({"radio_destiny_level": skillDestinyLevel-1});
}
finishRoll(
rollObject.rollId,
{
name: skillName,
skilllevel: skillLevel,
assist: assists,
challangelevel: challangeLevel,
gooddie: goodDie,
baddie: badDie,
wins: wins,
attributetype: skillType,
attributesum: attributeLevel,
challangedie: challangedie,
mod: mod,
starred: starred
}
);
});
});
function encodeRoll(rollInt) {
let retnValue = "0";
switch(rollInt) {
case 1:
retnValue = "A";
break;
case 2:
retnValue = "B";
break;
case 3:
retnValue = "C";
break;
case 4:
retnValue = "D";
break;
case 5:
retnValue = "E";
break;
case 6:
retnValue = "F";
break;
}
return retnValue
}
</script>
<rolltemplate class="sheet-rolltemplate-injury">
<div class="sheet-template-container">
<div class="sheet-title-red">
<h4>{{computed::name}}</h4>
<h4 style="font-family: Pictos">{{computed::starred}}</h4>
</div>
<div class="sheet-diceDisplay">
<div class="sheet-goodAndChallangeDie">
<p class="sheet-goodDie">{{computed::gooddie}}</p>
<p class="sheet-challangedie">{{computed::challangedie}}</p>
<p class="sheet-badDie">{{computed::baddie}}</p>
</div>
</div>
<div class="sheet-resolution">
<p>Victory Level:</p>
<p>{{roll1}}</p>
</div>
</div>
</rolltemplate>
<rolltemplate class="sheet-rolltemplate-test">
<div class="sheet-template-container">
<div class="sheet-title">
<h4>{{computed::name}}</h4>
<h4 style="font-family: Pictos">{{computed::starred}}</h4>
</div>
<div class="sheet-infoBox">
<div>
<p>Skill Level: </p>
{{computed::skilllevel}}
</div>
<div>
<p>Attribut Typ: </P>
{{computed::attributetype}}
</div>
<div>
<p>Attribute Summe: </P>
{{computed::attributesum}}
</div>
<div>
<p>Bonus durch Assist: </p>
{{computed::assists}}
</div>
<div>
<p>Mod: </p>
{{computed::mod}}
</div>
<div>
<p>Challange Level: </p>
{{computed::challangeLevel}}
</div>
</div>
<div class="sheet-diceDisplay">
<div class="sheet-goodAndChallangeDie">
<p class="sheet-goodDie">{{computed::gooddie}}</p>
<p class="sheet-challangedie">{{computed::challangedie}}</p>
<p class="sheet-badDie">{{computed::baddie}}</p>
</div>
</div>
<div class="sheet-resolution">
<p>Victory Level:</p>
<p>{{roll1}}</p>
</div>
</div>
</rolltemplate>