Obsidian Portal - Campaign websites for Dungeons and Dragons and other tabletop RPGs

D&D 5e Character Sheet v.2 for 1280x800 tablet screen

Author: Solarbear

Slug: j5e1080

Type: GameCharacter

System: D&D 5E

DST Source Code

Note: This is the latest, unapproved DST code. Only the DST author can use an unapproved DST, and even then only they can see it. If it's a new DST, then it's invisible to everyone else. If modifying a previously approved DST, then everyone else uses the most recent approved version.

HTML Template

<div class="fullwidth valigntop">
<div class="fancybox basicbox">
	<h3 class="title">Basic Information</h3>
	<table width="100%">
	<col />
	<col width="115"/>
	<col width="115"/>
	<col width="115"/>
	<col width="115"/>
	<tr>
		<td align="center" valign="center" rowspan="10"><div class="dsf dsf_avatar_image readonly"></div></td>
		<td class="dsf dsf_name readonly"></td>
		<td class="dsf dsf_alignment"></td>
		<td class="dsf dsf_race"></td>
		<td class="dsf dsf_homeland"></td>
	</tr>
	<tr>
		<th>Character Name</th>
		<th>Alignment</th>
		<th>Race</th>
		<th>Homeland</th>
	</tr>
	<tr>
		<td class="dsf dsf_class"></td>
		<td class="dsf dsf_background"></td>
		<td class="dsf dsf_deity"></td>
		<td class="dsf dsf_faction"></td>
	</tr>
	<tr>
		<th>Class</th>
		<th>Background</th>
		<th>Diety</th>
		<th>Faction</th>
	</tr>
	<tr>
		<td class="dsf dsf_gender"></td>
		<td class="dsf dsf_age"></td>
		<td class="dsf dsf_height"></td>
		<td class="dsf dsf_weight"></td>
	</tr>
	<tr>
		<th>Gender</th>
		<th>Age</th>
		<th>Height</th>
		<th>Weight</th>
	</tr>
	<tr>
		<td class="dsf dsf_hair"></td>
		<td class="dsf dsf_skin"></td>
		<td class="dsf dsf_eyes"></td>
		<td class="dsf dsf_experience"></td>
	</tr>
	<tr>
		<th>Hair</th>
		<th>Skin</th>
		<th>Eyes</th>
		<th>Experience Points</th>
	</tr>
	<tr>
		<td colspan="4" class="dsf dsf_languages"></td>
	</tr>
	<tr>
		<th colspan="4">Languages</th>
	</tr>
	</table>
</div>
<br>

<div class="fullwidth">
<div class="fancybox probox">
	<h3 class="title">Proficiency</h3>
	<table width="100%">
	<tr>
		<td class="dsf dsf_proficiency"></td>
	</tr><tr>
		<th>Bonus</th>
	</tr>
	</table>
</div>
<div class="fancybox hpbox">
	<h3 class="title">Hit Points</h3>
	<table width="100%">
	<tr>
		<td class="dsf dsf_wounds"></td>
		<td class="collapse" rowspan="2">/</td>
		<td class="dsf dsf_hp"></td>
		<td class="collapse" rowspan="2">&nbsp;</td>
		<td class="dsf dsf_temporaryhp"></td>
		<td class="collapse" rowspan="2">&nbsp;</td>
		<td class="dsf dsf_hitdice"></td>
	</tr><tr>
		<th>Current</th>
		<th>Max</th>
		<th>Temp</th>
		<th>Hit Dice</th>
	</tr>
	</table>
</div>
<div class="fancybox deathbox">
	<h3 class="title">Death Saves</h3>
	<table width="100%">
	<tr>
		<td><b>Sucesses</b></td>
		<td><span class="dsf dsf_deathsuccess1_cs checkbox"></span></td>
		<td><span class="dsf dsf_deathsuccess2_cs checkbox"></span></td>
		<td><span class="dsf dsf_deathsuccess3_cs checkbox"></span></td>
	</tr><tr>
		<td><b>Failures</b></td>
		<td><span class="dsf dsf_deathfails1_cs checkbox"></span></td>
		<td><span class="dsf dsf_deathfails2_cs checkbox"></span></td>
		<td><span class="dsf dsf_deathfails3_cs checkbox"></span></td>
	</tr>
	</table>
</div>
<br>

<div class="fancybox speedbox">
	<h3 class="title">Movement</h3>
	<table width="100%">
	<tr>
		<td class="dsf dsf_speed"></td>
	</tr><tr>
		<th>Speed</th>
	</tr>
	</table>
</div>
<div class="fancybox acbox">
	<h3 class="title">Armor Class</h3>
	<table width="100%">
	<tr>
		<td  style="font-weight:bold"class="dsf dsf_ac readonly"></td>
		<td class="collapse" rowspan="2">=</td>
		<td class="dsf dsf_armor_bonus"></td>
		<td class="collapse" rowspan="2">+</td>
		<td class="dsf dsf_shield_bonus"></td>
		<td class="collapse" rowspan="2">+</td>
		<td class="dsf dsf_dextoac"></td>
		<td class="collapse" rowspan="2">+</td>
		<td class="dsf dsf_misc_mod"></td>
	</tr><tr>
		<th>Total</th>
		<th>Base (Armor)</th>
		<th>Shield</th>
		<th>Dex</th>
		<th>Misc</th>
	</tr>
	</table>
</div>
<div class="fancybox initbox">
	<h3 class="title">Initiative</h3>
	<table width="100%">
	<tr>
		<td style="font-weight:bold" class="dsf dsf_initative_total readonly"></td>
		<td class="collapse" rowspan="2">=</td>
		<td class="dsf dsf_dex_mod readonly"></td>
		<td class="collapse" rowspan="2">+</td>
		<td class="dsf dsf_misc_init_mod"></td>
	</tr><tr>
		<th>Total</th>
		<th>Dex</th>
		<th>Misc</th>
	</tr>
	</table>
</div>
</div>
<br>

<div class="fancybox armorbox">
	<h3 class="title">Equipment</h3>
	<div>
	<h4 class="title">Weapons</h4>
	<table width="100%">
	<tr>
		<th>Name</th>
		<th>Attack</th>
		<th>Damage</th>
		<th>Type</th>
		<th>Range</th>
		<th>Special Qualities</th>
	</tr><tr>
		<td class="dsf dsf_weapon1_name "></td>
		<td class="dsf dsf_weapon1_attack"></td>
		<td class="dsf dsf_weapon1_damage"></td>
		<td class="dsf dsf_weapon1_type"></td>
		<td class="dsf dsf_weapon1_range"></td>
		<td class="dsf dsf_weapon1_SQ"></td>
	</tr><tr>
		<td class="dsf dsf_weapon2_name "></td>
		<td class="dsf dsf_weapon2_attack"></td>
		<td class="dsf dsf_weapon2_damage"></td>
		<td class="dsf dsf_weapon2_type"></td>
		<td class="dsf dsf_weapon2_range"></td>
		<td class="dsf dsf_weapon2_SQ"></td>
	</tr><tr>
		<td class="dsf dsf_weapon3_name "></td>
		<td class="dsf dsf_weapon3_attack"></td>
		<td class="dsf dsf_weapon3_damage"></td>
		<td class="dsf dsf_weapon3_type"></td>
		<td class="dsf dsf_weapon3_range"></td>
		<td class="dsf dsf_weapon3_SQ"></td>
	</tr><tr>
		<td class="dsf dsf_weapon4_name "></td>
		<td class="dsf dsf_weapon4_attack"></td>
		<td class="dsf dsf_weapon4_damage"></td>
		<td class="dsf dsf_weapon4_type"></td>
		<td class="dsf dsf_weapon4_range"></td>
		<td class="dsf dsf_weapon4_SQ"></td>
	</tr>
	</table>
	<h4 class="title">Armor/Shield</h4>
	<table width="100%">
	<tr>
		<th>Type</th>
		<th>Name</th>
		<th>Base Armor</th>
		<th>Max Dex</th>
		<th>Special Qualities</th>
	</tr><tr>
		<th>Armor</th>
		<td class="dsf dsf_armor1_type"></td>
		<td class="dsf dsf_armor1_ac_bonus"></td>
		<td class="dsf dsf_armor1_max_dex"></td>
		<td class="dsf dsf_armor1_special_properties"></td>
	</tr><tr>
		<th>Shield</th>
		<td class="dsf dsf_armor4_type"></td>
		<td class="dsf dsf_armor4_ac_bonus"></td>
		<td class="dsf dsf_armor4_max_dex"></td>
		<td class="dsf dsf_armor4_special_properties"></td>
	</tr>
	</table>
	<h4 class="title">Magic Items</h4>
	<table width="100%">
	<tr>
		<th>Name</th>
		<th>Bonus</th>
		<th>Item Description</th>
	</tr><tr>
		<td class="dsf dsf_protitem1_type"></td>
		<td class="dsf dsf_protitem1_ac_bonus"></td>
		<td class="dsf dsf_protitem1_special_properties"></td>
	</tr><tr>
		<td class="dsf dsf_protitem2_type"></td>
		<td class="dsf dsf_protitem2_ac_bonus"></td>
		<td class="dsf dsf_protitem2_special_properties"></td>
	</tr><tr>
		<td class="dsf dsf_protitem3_type"></td>
		<td class="dsf dsf_protitem3_ac_bonus"></td>
		<td class="dsf dsf_protitem3_special_properties"></td>
	</tr><tr>
		<td class="dsf dsf_protitem4_type"></td>
		<td class="dsf dsf_protitem4_ac_bonus"></td>
		<td class="dsf dsf_protitem4_special_properties"></td>
	</tr><tr>
		<td class="dsf dsf_protitem5_type"></td>
		<td class="dsf dsf_protitem5_ac_bonus"></td>
		<td class="dsf dsf_protitem5_special_properties"></td>
	</tr>
	</table>
	</div>
</div>

<br>
<div class="fancybox spellbox">
	<h3 class="title">Spells</h3>
	<div class="newSpellsDialog"><b>New Spells Section:</b> <input type="checkbox" name="spontaneous" /><label for="spontaneous">Spontaneous Caster</label> <input type="checkbox" name="spellbook" /><label for="spellbook">Uses Spellbook</label> <input type="checkbox" name="domains" /><label for="domains">Domains</label> <input type="text" name="minSpellLevel" size="1" maxlength="1" value="0" />&mdash;<input type="text" name="maxSpellLevel" size="1" maxlength="1" value="9" /> Spell Levels<span class="ctlAddSpellSection addButton">+ Add</span></div>
	<div class="dsf dsf_ctlSpellSectionCount" style="display:none"></div>
</div>

<br>
<div class="fancybox biobox">
	<h3 class="title">Character Bio</h3>
	<table width="100%">
		<tr>
			<td class="dsf dsf_personality"></td>
		</tr><tr>
			<th>Personality Traits</th>
		</tr><tr>
			<td class="dsf dsf_ideals"></td>
		</tr><tr>
			<th>Ideals</th>
		</tr><tr>
			<td class="dsf dsf_bonds"></td>
		</tr><tr>
			<th>Bonds</th>
		</tr><tr>
			<td class="dsf dsf_flaws"></td>
		</tr><tr>
			<th>Flaws</th>
		</tr>
	</table>
	<br>
	<div class="dsf dsf_bio readonly"></div>
</div>
<br />
<br />
<div class="campaign">Campaign: <span class="dsf readonly dsf_campaign"></span></div>
<div class="player">Player: <span class="dsf readonly dsf_player"></span></div>
<div>D&D 5e Sheet by: <span class="dsf readonly dsf_dst_author"></span></div>
</div>&nbsp;

<div class="halfwidth valigntop">
<div class="fancybox statsbox">
	<h3 class="title">Abilities</h3>
	<table width="50%">
	<tr>
		<th>Name</th>
		<th>Score</th>
		<th>Modifier</th>
	</tr><tr>
		<th class="stat">Strength</th>
		<td class="dsf dsf_str"></td>
		<td class="dsf dsf_str_mod readonly"></td>
	</tr><tr>
		<th class="stat">Dexterity</th>
		<td class="dsf dsf_dex"></td>
		<td class="dsf dsf_dex_mod readonly"></td>
	</tr><tr>
		<th class="stat">Constitution</th>
		<td class="dsf dsf_con"></td>
		<td class="dsf dsf_con_mod readonly"></td>
	</tr><tr>
		<th class="stat">Intelligence</th>
		<td class="dsf dsf_int"></td>
		<td class="dsf dsf_int_mod readonly"></td>
	</tr><tr>
		<th class="stat">Wisdom</th>
		<td class="dsf dsf_wis"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
	</tr><tr>
		<th class="stat">Charisma</th>
		<td class="dsf dsf_cha"></td>
		<td class="dsf dsf_cha_mod readonly"></td>
	</tr>
	</table>
</div>

<div class="fancybox halfwidth skillbox">
	<h3 class="title">Saves & Skills</h3>
	<div class="dsf dsf_ctlSkillCount" style="display:none"></div>
	<div class="halfwidth">
		<h4 class="title">Saves</h4>
	</div>
	<table width="100%" class="skillTable" prefix="skill">
	<col width="15"/>
	<col />
	<col width="40"/>
	<col width="40"/>
	<col width="40"/>
	<tr>
		<th>Pr.</th>
		<th>Save</th>
		<th style="display:none;">ability</th>
		<th>Total</th>
		<th>Mod</th>
		<th>Misc</th>
	</tr><tr>
		<td><span class="dsf dsf_strsave_cs checkbox"></span></td>
		<td>Strength</td>
		<td style="display:none;">Str</td>
		<td style="font-weight:bold" class="dsf dsf_strsave_mod readonly"></td>
		<td class="dsf dsf_str_mod readonly"></td>
		<td class="dsf dsf_strsave_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_dexsave_cs checkbox"></span></td>
		<td>Dexterity</td>
		<td style="display:none;">Dex</td>
		<td style="font-weight:bold" class="dsf dsf_dexsave_mod readonly"></td>
		<td class="dsf dsf_dex_mod readonly"></td>
		<td class="dsf dsf_dexsave_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_consave_cs checkbox"></span></td>
		<td>Constitution</td>
		<td style="display:none;">Con</td>
		<td style="font-weight:bold" class="dsf dsf_consave_mod readonly"></td>
		<td class="dsf dsf_con_mod readonly"></td>
		<td class="dsf dsf_consave_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_intsave_cs checkbox"></span></td>
		<td>Intelligence</td>
		<td style="display:none;">Int</td>
		<td style="font-weight:bold" class="dsf dsf_intsave_mod readonly"></td>
		<td class="dsf dsf_int_mod readonly"></td>
		<td class="dsf dsf_intsave_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_wissave_cs checkbox"></span></td>
		<td>Wisdom</td>
		<td style="display:none;">Wis</td>
		<td style="font-weight:bold" class="dsf dsf_wissave_mod readonly"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
		<td class="dsf dsf_wissave_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_chasave_cs checkbox"></span></td>
		<td>Charisma</td>
		<td style="display:none;">Cha</td>
		<td style="font-weight:bold" class="dsf dsf_chasave_mod readonly"></td>
		<td class="dsf dsf_cha_mod readonly"></td>
		<td class="dsf dsf_chasave_misc_mod"></td>
	</tr>
	</table>
	<div class="dsf dsf_ctlNoncoreCount" style="display:none"></div>
	<div class="halfwidth">
	<h4 class="title">Skills</h4>
	</div>
	<table width="100%" class="noncoreTable" prefix="noncore">
	<col width="15"/>
	<col />
	<col />
	<col width="40"/>
	<col width="40"/>
	<col width="40"/>
	<tr>
		<th>Pr.</th>
		<th>Skill</th>
		<th style="display:none;">Ability</th>
		<th>Total</th>
		<th>Mod</th>
		<th>Misc</th>
	</tr><tr>
		<td><span class="dsf dsf_acrobatics_cs checkbox"></span></td>
		<td>Acrobatics (Dex)</td>
		<td style="display:none;">Dex</td>
		<td style="font-weight:bold" class="dsf dsf_acrobatics_mod readonly"></td>
		<td class="dsf dsf_dex_mod readonly"></td>
		<td class="dsf dsf_acrobatics_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_animalhandling_cs checkbox"></span></td>
		<td>Animal Handling (Wis)</td>
		<td style="display:none;">Wis</td>
		<td style="font-weight:bold" class="dsf dsf_animalhandling_mod readonly"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
		<td class="dsf dsf_animalhandling_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_arcana_cs checkbox"></span></td>
		<td>Arcana (Int)</td>
		<td style="display:none;">Int</td>
		<td style="font-weight:bold" class="dsf dsf_arcana_mod readonly"></td>
		<td class="dsf dsf_int_mod readonly"></td>
		<td class="dsf dsf_arcana_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_athletics_cs checkbox"></span></td>
		<td>Athletics (Str)</td>
		<td style="display:none;">Str</td>
		<td style="font-weight:bold" class="dsf dsf_athletics_mod readonly"></td>
		<td class="dsf dsf_str_mod readonly"></td>
		<td class="dsf dsf_athletics_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_deception_cs checkbox"></span></td>
		<td>Deception (Cha)</td>
		<td style="display:none;">Cha</td>
		<td style="font-weight:bold" class="dsf dsf_deception_mod readonly"></td>
		<td class="dsf dsf_cha_mod readonly"></td>
		<td class="dsf dsf_deception_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_history_cs checkbox"></span></td>
		<td>History (Int)</td>
		<td style="display:none;">Int</td>
		<td style="font-weight:bold" class="dsf dsf_history_mod readonly"></td>
		<td class="dsf dsf_int_mod readonly"></td>
		<td class="dsf dsf_history_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_insight_cs checkbox"></span></td>
		<td>Insight (Wis)</td>
		<td style="display:none;">Wis</td>
		<td style="font-weight:bold" class="dsf dsf_insight_mod readonly"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
		<td class="dsf dsf_insight_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_intimidation_cs checkbox"></span></td>
		<td>Intimidation (Cha)</td>
		<td style="display:none;">Cha</td>
		<td style="font-weight:bold" class="dsf dsf_intimidation_mod readonly"></td>
		<td class="dsf dsf_cha_mod readonly"></td>
		<td class="dsf dsf_intimidation_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_investigation_cs checkbox"></span></td>
		<td>Investigation (Int)</td>
		<td style="display:none;">Int</td>
		<td style="font-weight:bold" class="dsf dsf_investigation_mod readonly"></td>
		<td class="dsf dsf_int_mod readonly"></td>
		<td class="dsf dsf_investigation_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_medicine_cs checkbox"></span></td>
		<td>Medicine (Wis)</td>
		<td style="display:none;">Wis</td>
		<td style="font-weight:bold" class="dsf dsf_medicine_mod readonly"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
		<td class="dsf dsf_medicine_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_nature_cs checkbox"></span></td>
		<td>Nature (Int)</td>
		<td style="display:none;">Int</td>
		<td style="font-weight:bold" class="dsf dsf_nature_mod readonly"></td>
		<td class="dsf dsf_int_mod readonly"></td>
		<td class="dsf dsf_nature_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_perception_cs checkbox"></span></td>
		<td>Perception (Wis)</td>
		<td style="display:none;">Wis</td>
		<td style="font-weight:bold" class="dsf dsf_perception_mod readonly"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
		<td class="dsf dsf_perception_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_performance_cs checkbox"></span></td>
		<td>Performance (Cha)</td>
		<td style="display:none;">Cha</td>
		<td style="font-weight:bold" class="dsf dsf_performance_mod readonly"></td>
		<td class="dsf dsf_cha_mod readonly"></td>
		<td class="dsf dsf_performance_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_persuasion_cs checkbox"></span></td>
		<td>Persuasion (Cha)</td>
		<td style="display:none;">Cha</td>
		<td style="font-weight:bold" class="dsf dsf_persuasion_mod readonly"></td>
		<td class="dsf dsf_cha_mod readonly"></td>
		<td class="dsf dsf_persuasion_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_religion_cs checkbox"></span></td>
		<td>Religion (Int)</td>
		<td style="display:none;">Int</td>
		<td style="font-weight:bold" class="dsf dsf_religion_mod readonly"></td>
		<td class="dsf dsf_int_mod readonly"></td>
		<td class="dsf dsf_religion_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_slightofhand_cs checkbox"></span></td>
		<td>Sleight of Hand (Dex)</td>
		<td style="display:none;">Dex</td>
		<td style="font-weight:bold" class="dsf dsf_slightofhand_mod readonly"></td>
		<td class="dsf dsf_dex_mod readonly"></td>
		<td class="dsf dsf_slightofhand_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_stealth_cs checkbox"></span></td>
		<td>Stealth (Dex)</td>
		<td style="display:none;">Dex</td>
		<td style="font-weight:bold" class="dsf dsf_stealth_mod readonly"></td>
		<td class="dsf dsf_dex_mod readonly"></td>
		<td class="dsf dsf_stealth_misc_mod"></td>
	</tr><tr>
		<td><span class="dsf dsf_survival_cs checkbox"></span></td>
		<td>Survival (Wis)</td>
		<td style="display:none;">Wis</td>
		<td style="font-weight:bold" class="dsf dsf_survival_mod readonly"></td>
		<td class="dsf dsf_wis_mod readonly"></td>
		<td class="dsf dsf_survival_misc_mod"></td>
	</tr>
	</table>
</div>

<div class="fancybox halfwidth traitbox">
	<h3 class="title">Traits & Proficiencies<span class="ctlAddTrait addButton">+ Add</span></h3>
	<div class="dsf dsf_ctlTraitCount" style="display:none"></div>
	<table width="100%" class="traitTable" prefix="trait">
	<tr><th>Trait</th><th>Description</th></tr>
	</table>
</div>
<div class="fancybox halfwidth featbox">
	<h3 class="title">Feats<span class="ctlAddFeat addButton">+ Add</span></h3>
	<div class="dsf dsf_ctlFeatCount" style="display:none"></div>
	<table width="100%" class="featTable" prefix="feat">
	<tr><th>Feat</th><th>Description</th></tr>
	</table>
</div>
<div class="fancybox halfwidth abilitybox">
	<h3 class="title">Class Features<span class="ctlAddAbility addButton">+ Add</span></h3>
	<div class="dsf dsf_ctlAbilityCount" style="display:none"></div>
	<table width="100%" class="abilityTable" prefix="special_ability">
	<tr><th>Ability</th><th>Description</th></tr>
	</table>
</div>

<div class="fancybox halfwidth inventorybox">
	<h3 class="title">Inventory<span class="ctlAddInventory addButton">+ Add</span></h3>
	<div class="dsf dsf_ctlInventoryCount" style="display:none"></div>
		<div class="halfwidth">
		<h4 class="title">Money</h4>
		<table width="100%">
		<tr>
			<td style="text-align:center;" class="dsf dsf_wealth_total readonly"></td>
			<td style="text-align:center;" class="dsf dsf_pp"></td>
			<td style="text-align:center;" class="dsf dsf_gp"></td>
			<td style="text-align:center;" class="dsf dsf_ep"></td>
			<td style="text-align:center;" class="dsf dsf_sp"></td>
			<td style="text-align:center;" class="dsf dsf_cp"></td>
		</tr><tr>
			<th>Total</th>
			<th>PP</th>
			<th>GP</th>
			<th>EP</th>
			<th>SP</th>
			<th>CP</th>
		</tr>
		</table>
		</div>
		<div class="halfwidth">
		<h4 class="title">Carrying Capacity</h4>
		<table width="100%">
		<tr>
			<td style="text-align:center;"><span class="dsf dsf_light_load readonly"></span> lbs.</td>
			<td style="text-align:center;"><span class="dsf dsf_medium_load readonly"></span> lbs.</td>
			<td style="text-align:center;"><span class="dsf dsf_heavy_load readonly"></span> lbs.</td>
			<td style="text-align:center;"><span class="dsf dsf_lift_over_head readonly"></span> lbs.</td>
		</tr><tr>
			<th>Encumbered</th>
			<th>Heavily Encumbered</th>
			<th>Max Load</th>
			<th>Push/Drag/Lift</th>
		</tr>
		</table>
		</div>
		<div class="halfwidth">
		<h4 class="title">Items</h4>
		<table width="100%">
		</table>
		</div>
</div>
</div>

CSS

@import url(https://fonts.googleapis.com/css?family=Arapey%7CBitter);

.ds_j5e1080 .valigntop
{
	display: inline-block;
	/* IE 7 hack */
	*zoom:1;
	*display: inline;
	vertical-align: top;
}

.ds_j5e1080
{
	line-height: 12px;
	font-size: 10px !important;
}

.ds_j5e1080 th,
.ds_j5e1080 td
{
	font-family: 'Bitter',georgia,times,'times new roman',serif !important;
}

.ds_j5e1080 .dsf
{
	height: 12px;
	vertical-align: bottom;
}

.ds_j5e1080.editable span.dsf
{
	min-width: 20px;
	display: inline-block;
}

.ds_j5e1080 .noborder
{
	border: none !important;
}

.ds_j5e1080 table
{
	margin: 0;
	border-collapse: separate;
	border-spacing: 2px;
	background-color: transparent;
}

.ds_j5e1080 th
{
	font-size: 10px;
	padding: 0;
	text-align: center;
	background: none;
	vertical-align: top;
	line-height: 11px;
}

.ds_j5e1080 sup 
{ 
	font-size: 60% 
}

.ds_j5e1080 td
{
	padding: 5px 5px 0 5px;
	text-align: center;
	font-size: 12px;
}

.ds_j5e1080 td,
.ds_j5e1080 th
{
	margin: 0 3px;
}

.ds_j5e1080 h3.title
{
	font-family: Arapey,georgia,times,'times new roman',serif !important;
	background: #003c9f; /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover, #BC312C 0%, #000000 73%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#BC312C), color-stop(73%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover, #BC312C 0%,#000000 73%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover, #BC312C 0%,#000000 73%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover, #BC312C 0%,#000000 73%); /* IE10+ */
	background: radial-gradient(center, ellipse cover, #BC312C 0%,#000000 73%); /* W3C */
	font-size: 16px;
	height: 16px;
	width: 100%;
	color: #ddd !important;
	text-align: center;
	margin: 0 !important;
	padding: 0px 0px 8px 0px !important;
	border-top-left-radius: inherit;
	border-top-right-radius: inherit;
	text-shadow: 1px 1px 1px #000 !important;
}

.ds_j5e1080 input,
.ds_j5e1080 select
{
	margin: 0;
	width: auto;
	height: auto;
	display: inline;
}

.ds_j5e1080 h4.title
{
	font-family: Arapey,georgia,times,'times new roman',serif !important;
	background: #3c008f; /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover, #CA9630 0%, #000000 73%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#CA9630), color-stop(73%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* IE10+ */
	background: radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* W3C */
	font-size: 14px;
	height: 14px;
	width: 100%;
	color: #ddd !important;
	text-align: center;
	margin: 0 !important;
	padding: 0px 0px 6px 0px !important;
	border-top-left-radius: inherit;
	border-top-right-radius: inherit;
	text-shadow: 1px 1px 1px #000 !important;
}

.ds_j5e1080 .newSpellsDialog
{
	font-family: Arapey,georgia,times,'times new roman',serif !important;
	background: #008f00; /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover, #CA9630 0%, #000000 73%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#CA9630), color-stop(73%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* IE10+ */
	background: radial-gradient(center, ellipse cover, #CA9630 0%,#000000 73%); /* W3C */
	font-size: 14px;

	border-bottom-left-radius: inherit;
	border-bottom-right-radius: inherit;
	width: 100%;
	color: #ddd;
	text-align: center;
	margin: 0;
	padding: 2px 0;
	text-shadow: 1px 1px 1px #000;
}

.ds_j5e1080 .newSpellsDialog label
{
	display: inline;
	font: inherit;
}

.ds_j5e1080 .newSpellsDialog input
{
	padding: 0 2px;
	font: inherit;
}

.ds_j5e1080 .collapse
{
	width: 1px !important;
	padding: 0 !important;
	margin: 0 !important;
	border-spacing: 0 !important;
	border: none !important;
}

.ds_j5e1080 .addButton,
.ds_j5e1080 .removeButton
{
	display: none;
}

.ds_j5e1080.editable .addButton
{
	display: inline;
	float: right;
	min-width: 12px;
	height: 0px;
	margin: 3px 5px 3px 0px;
	padding: 0px 5px 0px 5px;
	border-radius: 8px;
	background-color: #722;
	color: #fff;
	cursor: pointer;
	font-weight: normal;
	font-size: 10px;
}

.ds_j5e1080.editable .removeButton
{
	display: inline;
	float: right;
	min-width: 12px;
	height: 0px;
	margin: 3px 5px 3px 0px;
	padding: 0px 5px 0px 5px;
	border-radius: 8px;
	background-color: #722;
	color: #fff;
	cursor: pointer;
	font-weight: normal;
	font-size: 10px;
}

.ds_j5e1080.editable .dsf
{
	background-color: #CDF;
	color: #000;
	border-radius: 2px;
}

.ds_j5e1080.editable .dsf.readonly,
.ds_j5e1080.editable .dsf.checkbox
{
	background-color: #fff;
	color: #000;
	border-radius: 0;
}

.ds_j5e1080 .fancybox
{
	padding: 0 0 2px 0;
	margin: 5px 0 0 0;
	display: inline-block;
	width: 950px;
	vertical-align: top;
	border: 1px solid black;
	box-shadow: 3px 3px 3px #999;
	border-radius: 20px / 8px;
	background: #FFF;
	color: #000;
}

.ds_j5e1080 .fancybox
{
	width: 630px;
}

.ds_j5e1080 .statsbox
{
	width: 315px;
	height: 163px;
}

.ds_j5e1080 .probox,
.ds_j5e1080 .hpbox,
.ds_j5e1080 .deathbox,
.ds_j5e1080 .speedbox,
.ds_j5e1080 .acbox,
.ds_j5e1080 .initbox
{
	height: 65px;
}

.ds_j5e1080 .acbox,
.ds_j5e1080 .hpbox
{
	width: 328px;
}

.ds_j5e1080 .probox,
.ds_j5e1080 .speedbox
{
	width: 115px;
}

.ds_j5e1080 .initbox,
.ds_j5e1080 .deathbox
{
	width: 175px;
}

.ds_j5e1080 .grapplebox
{
	width: 144px;
}

.ds_j5e1080 .halfwidth
{
	width: 315px;
	display: inline-block;
}

.ds_j5e1080 .fullwidth
{
	width: 630px;
	display: inline-block;
}

.ds_j5e1080 .quarterwidth
{
	width: 127px;
	display: inline-block;
	margin-top: 0;
}

.ds_j5e1080 .threequarterwidth
{
	width: 503px;
	display: inline-block;
	margin-top: 0;
}

.ds_j5e1080 .domain
{
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	margin-left: -1px;
	width: 181px;
	box-shadow: none;
}

.ds_j5e1080 .dcbox
{
	width: 127px;
	margin-right: -1px;
}

.ds_j5e1080 .spellSection
{
	margin-top: 5px;
	border-top-left-radius: inherit;
	border-top-right-radius: inherit;
}

.ds_j5e1080 .subbox.halfwidth
{
	width: 315px;
}

.ds_j5e1080 .inventorybox .item
{
	width: 310px;
	margin: 0 2px;
	display: inline-block;
}

.ds_j5e1080 .subbox
{
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	margin: 0 -1px 5px -1px;
	box-shadow: none;
}

.ds_j5e1080 .subbox + .subbox
{
	margin-left: -2px;

}

.ds_j5e1080 .statsbox table,
.ds_j5e1080 .savesbox table,
.ds_j5e1080 .attackbox table,
.ds_j5e1080 .armorbox table,
.ds_j5e1080 .weaponbox table,
.ds_j5e1080 .dcTable
{
	border-spacing: 0 !important;
	border-collapse: collapse;
	width: 99%;
	margin-bottom: 4px;
}

.ds_j5e1080 .armorbox table,
.ds_j5e1080 .weaponbox table
{
	margin-left: 3px;
	width: 623px;
}

.ds_j5e1080 .attackbox table
{
	margin-top: 8px;
}

.ds_j5e1080 .dcTable
{
	margin-left: 2px;
	width: 120px;
}

.ds_j5e1080 .statsbox th,
.ds_j5e1080 .savesbox th,
.ds_j5e1080 .armorbox th,
.ds_j5e1080 .featTable th,
.ds_j5e1080 .traitTable th,
.ds_j5e1080 .abilityTable th,
.ds_j5e1080 .skillTable th,
.ds_j5e1080 .noncoreTable th,
.ds_j5e1080 .weaponbox th,
.ds_j5e1080 .dcTable th,
.ds_j5e1080 .inventorybox td
{
	border: none;
	vertical-align: bottom;
	padding: 4px 2px;
}

.ds_j5e1080 .skillTable tr > td:first-child,
.ds_j5e1080 .noncoreTable tr > td:first-child
{
	text-align: left;
}

.ds_j5e1080 .statsbox th.stat,
.ds_j5e1080 .savesbox th.stat
{
	font-size: 12px;
	font-variant: small-caps;
	vertical-align: middle;
}

.ds_j5e1080 .statsbox td,
.ds_j5e1080 .savesbox td,
.ds_j5e1080 .attackbox td,
.ds_j5e1080 .armorbox td,
.ds_j5e1080 .weaponbox td,
.ds_j5e1080 .dcTable td
{
	border: 1px solid black;
	padding: 3px;
	vertical-align: middle;
}

.ds_j5e1080 .featTable td,
.ds_j5e1080 .abilityTable td,
.ds_j5e1080 .skillTable td,
.ds_j5e1080 .noncoreTable td,
.ds_j5e1080 .traitTable td,
.ds_j5e1080 .inventorybox td,
.ds_j5e1080 .probox td,
.ds_j5e1080 .hpbox td,
.ds_j5e1080 .speedbox td,
.ds_j5e1080 .acbox td,
.ds_j5e1080 .initbox td,
.ds_j5e1080 .dcbox td
{
	border-bottom: 1px solid black;
	padding: 3px;
	vertical-align: middle;
}

.ds_j5e1080 .basicbox th,
.ds_j5e1080 .biobox th
{
	border-top: 1px solid black;
	padding: 1px;
	vertical-align: middle;
}

.ds_j5e1080 .skillTable td,
.ds_j5e1080 .noncorelTable td
{
	font-size: 11px;
	line-height: 10px;
}

.ds_j5e1080 .spellList
{
	width: 240px;
	margin: 2px 1px 2px 2px;
	display: inline-block;
	border-bottom: 1px solid black;
}

.ds_j5e1080 .spellList .dsf
{
	width: 225px;
	display: inline-block;
	height: 100%;
}

.ds_j5e1080 .spellList .spellLevel
{
	width: 15px;
	display: inline-block;
}

.ds_j5e1080 .dsf_bio
{
	min-height: 100px;
	height: 100%;
	padding: 5px;
	border-bottom-left-radius: inherit !important;
	border-bottom-right-radius: inherit !important;
}

.ds_j5e1080 .sideways
{
	-webkit-transform: rotate(90deg); 
	-moz-transform: rotate(90deg);
	text-align: left;
	vertical-align: top;
	display: block;
	margin: 10px 0 15px 0;
	font-size: 10px;
}

.ds_j5e1080 .dsf_avatar_image
{
    display: block;
    height: 100%;
    vertical-align: center;
    horizontal-align: center;
}

Javascript

var $ = jQuery;
aisleten.characters.jeditablePlaceholder = "&nbsp;";

function j5e1080_dataPreLoad(options) {
	if ($.browser.msie)
	{
	}

	if(typeof dynamic_sheet_attrs == "undefined")
		dynamic_sheet_attrs = {};
	
	var containerId = "#" + options['containerId'];
	//Set defaults to keep the editing fields from making the form gross
	var defaults = {
		str: "10",
		dex: "10",
		con: "10",
		int: "10",
		wis: "10",
		cha: "10",
		armor_bonus: "10",
		proficiency: "2",
		languages: "common",
		
		ctlFeatCount: 2, //Default number on Takissis's sheet
		ctlAbilityCount: 2, //Default number on Takissis's sheet
		ctlInventoryCount: 5, //Due to poor numbering, the max number on Takissis's sheet
		ctlSkillCount: 0, //Start with no extra skill lines
		ctlNoncoreCount2: 0, //Start with no extra noncore lines
		ctlTraitCount: 2, //A little extra padding to fill space
		ctlWeaponCount: 2, //Two rows, primary and backup
		ctlSpellSectionCount: 0
	}

  dynamic_sheet_attrs = $.extend(defaults, dynamic_sheet_attrs);
  
  if (!options.isEditable)
  {
	//We're in read-only mode, so alter the sheet a little to make it more useful
	
	//Can't add if it's not an edit
	$(containerId + " .newSpellsDialog").hide();
	
	if (dynamic_sheet_attrs.ctlSpellSectionCount <= 0)
	{
		//Not a wielder, so hide that section
		$(containerId + " .spellbox").hide();
	}

	if (dynamic_sheet_attrs.ctlTraitCount <= 0)
	{
		//Not a wielder, so hide that section
		$(containerId + " .traitbox").hide();
	}

	if (dynamic_sheet_attrs.ctlFeatCount <= 0)
	{
		//Not a wielder, so hide that section
		$(containerId + " .featbox").hide();
	}

	if (dynamic_sheet_attrs.ctlAbilityCount <= 0)
	{
		//Not a wielder, so hide that section
		$(containerId + " .abilitybox").hide();
	}
  }
  else
  {
	//First, we ensure that all the dynamic tables show at least one row
	if (dynamic_sheet_attrs.ctlFeatCount < 2)
	{
		dynamic_sheet_attrs.ctlFeatCount = 2;
	}

	if (dynamic_sheet_attrs.ctlAbilityCount < 2)
	{
		dynamic_sheet_attrs.ctlAbilityCount = 2;
	}

	if (dynamic_sheet_attrs.ctlTraitCount < 2)
	{
		dynamic_sheet_attrs.ctlTraitCount = 2;
	}

	if (dynamic_sheet_attrs.ctlSkillCount < 0)
	{
		dynamic_sheet_attrs.ctlSkillCount = 0;
	}

	if (dynamic_sheet_attrs.ctlNoncoreCount < 0)
	{
		dynamic_sheet_attrs.ctlNoncoreCount = 0;
	}

	if (dynamic_sheet_attrs.ctlWeaponCount < 2)
	{
		dynamic_sheet_attrs.ctlWeaponCount = 2;
	}

	if (dynamic_sheet_attrs.ctlInventoryCount < 5)
	{
		dynamic_sheet_attrs.ctlInventoryCount = 5;
	}

	//Loading in editing mode, so wire up the event handlers
	$(containerId + " .ctlAddFeat").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlFeatCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addFeatRow('featTable', 'feat', count, containerId, true);
	});

	$(containerId + " .ctlAddAbility").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlAbilityCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addFeatRow('abilityTable', 'special_ability', count, containerId, true);
	});

	$(containerId + " .ctlAddTrait").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlTraitCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addFeatRow('traitTable', 'trait', count, containerId, true);
	});

	$(containerId + " .ctlAddSkill").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlSkillCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addSkillRow('skillTable', count, containerId, true);
	});

	$(containerId + " .ctlAddNoncore").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlNoncoreCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addNoncoreRow('noncoreTable', count, containerId, true);
	});

	$(containerId + " .ctlAddWeapon").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlWeaponCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addWeaponRow('weaponTable', count, containerId, true);
	});

	$(containerId + " .ctlAddInventory").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlInventoryCount");
		var count = Number(ctl.text())+1;
		ctl.text(count);
		j5e1080_addInventoryRow('inventorybox', count, containerId, true);
	});

	$(containerId + " .ctlAddSpellSection").bind("click.j5e1080", function () {
		var ctl = $(containerId + " .dsf_ctlSpellSectionCount");
		var count = Number(ctl.text());
		ctl.text(count + 1);
		j5e1080_addSpellSection('spellbox', count, containerId, true);
	});

	$(containerId).delegate(".ctlRemoveSpellSection", "click", function () {
		var ctl = $(containerId + " .dsf_ctlSpellSectionCount");
		var count = Number(ctl.text()) - 1;
		ctl.text(count);
		
		ctl = $(this).parents(".spellSectionContainer").next();

		$(this).parents(".spellSectionContainer").remove();
		
		j5e1080_renumberSpellSections(ctl);
	});
  }

  //Now, we initialize the dynamic rows to hold the incoming data
  for (var i=1; i<=dynamic_sheet_attrs.ctlFeatCount; i++)
  {
	j5e1080_addFeatRow('featTable', 'feat', i, containerId, options.isEditable);
  }

  for (var i=1; i<=dynamic_sheet_attrs.ctlAbilityCount; i++)
  {
	j5e1080_addFeatRow('abilityTable', 'special_ability', i, containerId, options.isEditable);
  }

  for (var i=1; i<=dynamic_sheet_attrs.ctlTraitCount; i++)
  {
	j5e1080_addFeatRow('traitTable', 'trait', i, containerId, options.isEditable);
  }

  for (var i=1; i<=dynamic_sheet_attrs.ctlSkillCount; i++)
  {
	j5e1080_addSkillRow('skillTable', i, containerId, options.isEditable);
  }

  for (var i=1; i<=dynamic_sheet_attrs.ctlNoncoreCount; i++)
  {
	j5e1080_addNoncoreRow('noncoreTable', i, containerId, options.isEditable);
  }

  for (var i=1; i<=dynamic_sheet_attrs.ctlWeaponCount; i++)
  {
	j5e1080_addWeaponRow('weaponTable', i, containerId, options.isEditable);
  }

  for (var i=1; i<=dynamic_sheet_attrs.ctlInventoryCount; i++)
  {
	j5e1080_addInventoryRow('inventorybox', i, containerId, options.isEditable);
  }

  for (var i=0; i<dynamic_sheet_attrs.ctlSpellSectionCount; i++)
  {
	j5e1080_addSpellSection('spellbox', i, containerId, options.isEditable, dynamic_sheet_attrs["spsSec" + i + "_Spontaneous"] == '1', dynamic_sheet_attrs["spsSec" + i + "_Spellbook"] == '1', dynamic_sheet_attrs["spsSec" + i + "_Domains"] == '1', dynamic_sheet_attrs["spsSec" + i + "_MinLevel"], dynamic_sheet_attrs["spsSec" + i + "_MaxLevel"]);
  }
}

function j5e1080_dataPostLoad(options) {
	//alert(JSON.stringify(dynamic_sheet_attrs));
	// Called just after the data is loaded.

	if (options.isEditable)
	{
		var containerId = "#" + options['containerId'];

		//since we're editing, make sure that all the data is recalculated and correct
		j5e1080_updateStat("str", containerId);
		j5e1080_updateStat("dex", containerId);
		j5e1080_updateStat("con", containerId);
		j5e1080_updateStat("int", containerId);
		j5e1080_updateStat("wis", containerId);
		j5e1080_updateStat("cha", containerId);

		j5e1080_updateInit(containerId);
		j5e1080_updateInventoryStuff(containerId);

		j5e1080_updateSkill(containerId, skill);
		j5e1080_updateNoncore(containerId, noncore);


		var fixHelper = function(e, ui) {
			ui.children().each(function() {
				$(this).width($(this).width());
			});
			return ui;
		};
		
		//Wire up sortable tables
		$(containerId + " .featTable").sortable({
			items: "tr:not(:first)",
			helper: fixHelper,
			update: j5e1080_renumberTable
		});

		$(containerId + " .abilityTable").sortable({
			items: "tr:not(:first)",
			helper: fixHelper,
			update: j5e1080_renumberTable
		});

		$(containerId + " .traitTable").sortable({
			items: "tr:not(:first)",
			helper: fixHelper,
			update: j5e1080_renumberTable
		});

		$(containerId + " .inventorybox").sortable({
			items: "div.item",
			helper: fixHelper,
			update: j5e1080_renumberItems
		});

		$(containerId + " .featTable tr, " + containerId + " .abilityTable tr, " + containerId + " .traitTable tr, " + containerId + " .inventorybox div.item").disableSelection();
	}
}

function j5e1080_dataChange(options) {
	// Called immediately after a data value is changed.
	// alert("dataChange. " + options['fieldName'] + " = " + options['fieldValue']);

	var field = options['fieldName'];
	var val = options['fieldValue'];
	var containerId = "#" + options['containerId'];

	//need to push the values to the other versions of the field
	//required due to how jEditable works

	switch (field)
	{
		case "str":
			j5e1080_updateStat("str", containerId);
			j5e1080_updateInventoryStuff(containerId)
		break;

		case "int":
			j5e1080_updateStat("int", containerId);
		break;

		case "wis":
			j5e1080_updateStat("wis", containerId);
		break;

		case "dex":
			j5e1080_updateStat("dex", containerId);
		break;

		case "con":
			j5e1080_updateStat("con", containerId);
		break;

		case "cha":
			j5e1080_updateStat("cha", containerId);
		break;
		
		case "misc_init_mod":
			j5e1080_updateInit(containerId);
		break;

		case "armor_bonus":
		case "shield_bonus":
		case "misc_mod":
		case "dextoac":
			j5e1080_updateAC(containerId);
		break;
		
		case "pp":
		case "gp":
		case "ep":
		case "sp":
		case "cp":
		case "light_load":
			j5e1080_updateInventoryStuff(containerId);
		break;
	}

	if ((field.substr(field.length - 6) == '_ranks'))
	{
		j5e1080_updateSkill(containerId, "dsf_" + field.substr(0, field.length - 6));
		j5e1080_updateNoncore(containerId, "dsf_" + field.substr(0, field.length - 6));
	}
	else if ((field.substr(field.length - 9) == '_misc_mod'))
	{
		j5e1080_updateSkill(containerId, "dsf_" + field.substr(0, field.length - 9));
		j5e1080_updateNoncore(containerId, "dsf_" + field.substr(0, field.length - 9));
	}
	else if ((field.substr(field.length - 3) == '_cs'))
	{
		j5e1080_updateSkill(containerId, "dsf_" + field.substr(0, field.length - 3));
		j5e1080_updateNoncore(containerId, "dsf_" + field.substr(0, field.length - 3));
	}
	else if ((field.substr(field.length - 8) == '_ability'))
	{
		j5e1080_updateSkill(containerId, "dsf_" + field.substr(0, field.length - 8));
		j5e1080_updateNoncore(containerId, "dsf_" + field.substr(0, field.length - 8));
	}
	else if ((field.length >= 14) && (field.substr(0, 6) == 'spsSec') && (field.substr(field.length - 6) == 'BaseDC'))
	{
		for (var l=0; l<=9; l++)
		{
			$(containerId + " .dsf_" + field.substr(0, 7) + "_DC" + l).text(Number(val) + l);
		}
	}
}

function j5e1080_dataPreSave(options) {
	// Called just before the data is saved to the server.
	// alert("dataPreSave");
	var containerId = "#" + options['containerId'];

	//Comb through the dynamic tables and remove empty values
	j5e1080_cleanTable("feat", "Feat", containerId);
	j5e1080_cleanTable("special_ability", "Ability", containerId);
	j5e1080_cleanTable("trait", "Trait", containerId);
	j5e1080_cleanSkillTable("skill", "Skill", containerId);
	j5e1080_cleanNoncoreTable("noncore", "Noncore", containerId);
	j5e1080_cleanTable("weapon", "Weapon", containerId);
	j5e1080_cleanInventoryTable("inventory", "Inventory", containerId);
}

// You can define your own variables...just make sure to namespace them!

function j5e1080_updateStat(stat, containerId)
{
	var value = Number($(containerId + " .dsf_" + stat).text());

	if (j5e1080_isNumeric(value))
	{
		$(containerId + " .dsf_" + stat + "_mod").text(Math.floor((parseInt(value) - 10) / 2));
	
		switch (stat)
		{
			case "dex":
				j5e1080_updateInit(containerId);
				j5e1080_updateAC(containerId);
			break;
		}

		j5e1080_updateSkills(containerId, stat);
		j5e1080_updateNoncores(containerId, stat);
	}
}

function j5e1080_updateInit(containerId)
{
	$(containerId + " .dsf_initative_total").text(Number($(containerId + " .dsf_dex_mod:first").text()) +
		Number($(containerId + " .dsf_misc_init_mod").text()));
}

function j5e1080_updateAC(containerId)
{
	$(containerId + " .dsf_ac").text(Number($(containerId + " .dsf_armor_bonus").text()) +
		Number($(containerId + " .dsf_shield_bonus").text()) +
		Number($(containerId + " .dsf_dextoac").text()) +
		Number($(containerId + " .dsf_misc_mod").text()));
}

function j5e1080_updateSkills(containerId, stat)
{
	var id;
	stat = stat[0].toUpperCase() + stat.substr(1).toLowerCase();
	$(containerId + " .skillTable td:contains(" + stat + ")").each(function (i, c) {
		id = j5e1080_findDsfClass($(c).next());
		
		if (id)
		{
			j5e1080_updateSkill(containerId, id.substr(0, id.length - 4));
		}
	});
}

function j5e1080_updateSkill(containerId, skill)
{
	var modtype = $(containerId + " ." + skill + "_mod").prev().text().toLowerCase();
	var classmod = Number($(containerId + " ." + skill + "_cs input").val()) ? Number($(containerId + " .dsf_proficiency").text()) : 0;
	var ranks = Number($(containerId + " ." + skill + "_ranks").text());
	var abilMod = Number($(containerId + " .dsf_" + modtype + "_mod:first").text());

	var ctl = $(containerId + " ." + skill + "_ability_mod");
	
	if (ctl.length)
	{
		//Custom field, so fill in the stat mod
		ctl.text(j5e1080_signedInt(abilMod));
	}

	$(containerId + " ." + skill + "_mod").text(j5e1080_signedInt(classmod + ranks +
		Number($(containerId + " ." + skill + "_misc_mod").text()) +
		abilMod));
}

function j5e1080_updateNoncores(containerId, stat)
{
	var id;
	stat = stat[0].toUpperCase() + stat.substr(1).toLowerCase();
	$(containerId + " .noncoreTable td:contains(" + stat + ")").each(function (i, c) {
		id = j5e1080_findDsfClass($(c).next());
		
		if (id)
		{
			j5e1080_updateNoncore(containerId, id.substr(0, id.length - 4));
		}
	});
}

function j5e1080_updateNoncore(containerId, noncore)
{
	var modtype = $(containerId + " ." + noncore + "_mod").prev().text().toLowerCase();
	var classmod = Number($(containerId + " ." + noncore + "_cs input").val()) ? Number($(containerId + " .dsf_proficiency:first").text()) : 0;
	var ranks = Number($(containerId + " ." + noncore + "_ranks").text());
	var abilMod = Number($(containerId + " .dsf_" + modtype + "_mod:first").text());

	var ctl = $(containerId + " ." + noncore + "_ability_mod");
	
	if (ctl.length)
	{
		//Custom field, so fill in the stat mod
		ctl.text(j5e1080_signedInt(abilMod));
	}
	
	$(containerId + " ." + noncore + "_mod").text(j5e1080_signedInt(classmod + ranks +
		Number($(containerId + " ." + noncore + "_misc_mod").text()) +
		abilMod));
}

function j5e1080_updateTotal(countTitle, fieldName, containerId)
{
	var count = Number($(containerId + " .dsf_ctl" + countTitle + "Count").text());
	var sum = 0;

	for (var i=0; i<count; i++)
	{
		var val = Number($(containerId + " .dsf_" + fieldName + i).text());
		
		if (!isNaN(val))
			sum += val;
	}
	
	$(containerId + " .dsf_" + fieldName + "Total").text(Math.round(100.0 * sum) / 100.0);
}

function j5e1080_updateInventoryStuff(containerId)
{
	var val = $(containerId + " .dsf_str:first").text();
	if (j5e1080_isNumeric(val))
	{
		val = Number(val);
		var heavy = val * 15;
		
		$(containerId + " .dsf_light_load").text(val * 5);
		$(containerId + " .dsf_medium_load").text(val * 10);
		$(containerId + " .dsf_heavy_load").text(heavy);
		$(containerId + " .dsf_lift_over_head").text(heavy * 2);
	}
	
	$(containerId + " .dsf_wealth_total").text(
		Math.round(100 * (Number($(containerId + " .dsf_pp").text()) * 10 +
		Number($(containerId + " .dsf_gp").text()) +
		Number($(containerId + " .dsf_ep").text()) / 2.0 +
		Number($(containerId + " .dsf_sp").text()) / 10.0 +
		Number($(containerId + " .dsf_cp").text()) / 100.0)) / 100.0
	);
}

function j5e1080_bindRow(newRow, containerId)
{
	//Force-bind the new elements.  Ah, sweet hax
	containerId = containerId.replace("#", "");
	newRow.find(".dsf").each(function (i, c) {
		var name = j5e1080_findDsfClass(c);
		if (name)
			aisleten.characters.bindField(name.replace("dsf_", ""), containerId, 'j5e1080');
	});
}

function j5e1080_addFeatRow(table, prefix, num, containerId, isEditable)
{
	var newRow = $('<tr class="j5e1080_' + prefix + 'Row' + num +'"><td class="dsf dsf_' + prefix + num + '" /><td class="dsf dsf_' + prefix + 'Description' + num + '">&nbsp;</td></tr>');
	
	$(containerId + " ." + table).append(newRow);

	if (isEditable)
	{
		newRow.disableSelection();
		j5e1080_bindRow(newRow, containerId);
	}
}

function j5e1080_addSkillRow(table, num, containerId, isEditable)
{
	var newRow = $('<tr class="j5e1080_extra_skillRow' + num +'"><td><span class="dsf dsf_skill' + num + '_cs checkbox"></span></td><td class="dsf dsf_skill' + num + '" /><td class="dsf dsf_skill' + num + '_ability">&nbsp;</td><td class="dsf dsf_skill' + num + '_mod readonly">&nbsp;</td><td class="dsf dsf_skill' + num + '_ability_mod readonly">&nbsp;</td><td class="dsf dsf_skill' + num + '_ranks">&nbsp;</td><td class="dsf dsf_skill' + num + '_misc_mod">&nbsp;</td></tr>');
	
	$(containerId + " ." + table).append(newRow);

	if (isEditable)
	{
		newRow.disableSelection();
		j5e1080_bindRow(newRow, containerId);
	}
}

function j5e1080_addNoncoreRow(table, num, containerId, isEditable)
{
	var newRow = $('<tr class="j5e1080_extra_noncoreRow' + num +'"><td><span class="dsf dsf_noncore' + num + '_cs checkbox"></span></td><td class="dsf dsf_noncore' + num + '" /><td class="dsf dsf_noncore' + num + '_ability">&nbsp;</td><td class="dsf dsf_noncore' + num + '_mod readonly">&nbsp;</td><td class="dsf dsf_noncore' + num + '_ability_mod readonly">&nbsp;</td><td class="dsf dsf_noncore' + num + '_ranks">&nbsp;</td><td class="dsf dsf_noncore' + num + '_misc_mod">&nbsp;</td></tr>');
	
	$(containerId + " ." + table).append(newRow);

	if (isEditable)
	{
		newRow.disableSelection();
		j5e1080_bindRow(newRow, containerId);
	}
}

function j5e1080_addWeaponRow(table, num, containerId, isEditable)
{
	var newRow = $('<tr class="j5e1080_weaponRow' + num +'"><td class="dsf dsf_weapon' + num + '" /><td class="dsf dsf_weapon' + num + '_attack_bonus">&nbsp;</td><td class="dsf dsf_weapon' + num + '_damage">&nbsp;</td><td class="dsf dsf_weapon' + num + '_range">&nbsp;</td><td class="dsf dsf_weapon' + num + '_type">&nbsp;</td><td class="dsf dsf_weapon' + num + '_notes">&nbsp;</td></tr>');
	
	$(containerId + " ." + table).append(newRow);

	if (isEditable)
	{
		newRow.disableSelection();
		j5e1080_bindRow(newRow, containerId);
	}
}

function j5e1080_addInventoryRow(table, num, containerId, isEditable)
{
	var newRow = $('<div class="item j5e1080_item' + num + '"><table><col width="155" /><col width="155" /><tr><td class="dsf dsf_item' + num + '" /><td class="dsf dsf_item' + num + 'x" /></tr></table></div>');
	
	$(containerId + " ." + table).append(newRow);

	if (isEditable)
	{
		newRow.disableSelection();
		j5e1080_bindRow(newRow, containerId);
	}
}

function j5e1080_addSpellSection(table, num, containerId, isEditable, isSpontaneous, usesSpellbook, hasDomains, minLevel, maxLevel)
{
	if (!maxLevel)
	{
		//new section, so pull the values from the add dialog
		isSpontaneous = $(containerId + " .newSpellsDialog input[name=spontaneous]")[0].checked;
		usesSpellbook = $(containerId + " .newSpellsDialog input[name=spellbook]")[0].checked;
		hasDomains = $(containerId + " .newSpellsDialog input[name=domains]")[0].checked;
		minLevel = Number($(containerId + " .newSpellsDialog input[name=minSpellLevel]").val());
		maxLevel = Number($(containerId + " .newSpellsDialog input[name=maxSpellLevel]").val());
	}
	
	//Make sure we have at least some rows to add
	if (!maxLevel || (maxLevel < 4))
		maxLevel = 4;

	if (!minLevel || (minLevel < 0))
		minLevel = 0;

	if (maxLevel > 9)
		maxLevel = 9;

	if (minLevel > maxLevel)
	{
		var tmp = minLevel;
		minLevel = maxLevel;
		maxLevel = tmp;
	}

	var html = '<div class="spellSection spellSectionContainer j5e1080_spellSection' + num + '"><div class="dsf dsf_spsSec' + num + '_Spontaneous" style="display:none;">' + (isSpontaneous ? '1' : '0') + '</div><div class="dsf dsf_spsSec' + num + '_Spellbook" style="display:none;">' + (usesSpellbook ? '1' : '0') + '</div><div class="dsf dsf_spsSec' + num + '_Domains" style="display:none;">' + (hasDomains ? '1' : '0') + '</div><div class="dsf dsf_spsSec' + num + '_MaxLevel" style="display:none;">' + maxLevel + '</div><div class="dsf dsf_spsSec' + num + '_MinLevel" style="display:none;">' + minLevel + '</div><div class="spellSection"><h3 class="title"><span class="dsf dsf_spsSec' + num + '_Name"></span><span class="ctlRemoveSpellSection removeButton">- Remove</span></h3>';

	var dcTable = '<div class="fancybox domain dcbox quarterwidth"><h4 class="title">Per-Day</h4><table><tr><td class="dsf dsf_spsSec' + num + '_BaseDC"></td><td class="dsf dsf_spsSec' + num + '_SpellFailure"></td></tr><tr><th>Spell DC</th><th>Spell Attack</th></tr></table><table class="dcTable"><col width="15" /><col /><col /><col /><tr><th>Level</th>'
	
	if (isSpontaneous)
		dcTable += '<th>Known</th>';
	
	dcTable += '<th>Per Day</th><th>Bonus</th></tr>';

	for (var l=minLevel; l<=maxLevel; l++)
	{
		dcTable += '<tr><td class="spellLevel">' + l + ':</td>'

		if (isSpontaneous)
			dcTable += '<td class="dsf dsf_spsSec' + num + '_KnownNumber' + l + '"></td>';

		dcTable += '<td class="dsf dsf_spsSec' + num + '_PerDayNumber' + l + '"></td>'

		if (l == 0)
			dcTable += '<td>&mdash;</td>';
		else
			dcTable += '<td class="dsf dsf_spsSec' + num + '_BonusNumber' + l + '"></td>';

		dcTable += '</tr>';
	}

	dcTable += "</table>";

	if (hasDomains)
	{
		for (var d=0; d<3; d++)
		{
			html += '<div class="fancybox domain quarterwidth"><h4 class="title"><span class="dsf dsf_spsSec' + num + '_Domain' + d + '_Name"></span></h4><table class="domainTable"><col width="13" /><col /><tr><td colspan="2" class="dsf dsf_spsSec' + num + '_Domain' + d + '_Power1"></td></tr><tr><th colspan="2">Domain Power</th></tr><tr><td colspan="2" class="dsf dsf_spsSec' + num + '_Domain' + d + '_Power2"></td></tr><tr><th colspan="2">Domain Power</th></tr>';

			for (var l=Math.max(1, minLevel); l<=maxLevel; l++)
			{
				html += '<tr><td class="spellLevel">' + l + ':</td><td class="dsf dsf_spsSec' + num + '_Domain' + d + '_Spells' + l + '"></td></tr>';
			}

			html += "</table></div>";
		}
		
		html += dcTable + "</div>";
	}
	else
		html += '<div class="threequarterwidth">';
	
	if (usesSpellbook)
	{
		html += '<h4 class="title">Spellbook</h4>';

		for (var l=minLevel; l<=maxLevel; l++)
		{
			html += '<div class="spellList"><div class="spellLevel" style="display:inline-block;">' + l + ':</div><div class="dsf dsf_spsSec' + num + '_Known' + l + '"></div></div>';
		}
	}

	if (isSpontaneous)
		html += '<h4 class="title">Spells Known</h4>';
	else
		html += '<h4 class="title">Spells Prepared</h4>';

	for (var l=minLevel; l<=maxLevel; l++)
	{
		html += '<div class="spellList"><div class="spellLevel" style="display:inline-block;">' + l + ':</div><div class="dsf dsf_spsSec' + num + '_Prepared' + l + '"></div></div>';
	}
	
	if (!hasDomains)
		html += "</div>" + dcTable;
	
	var newSection = $(html);
	$(containerId + " ." + table).append(newSection);

	if (isEditable)
	{
		j5e1080_bindRow(newSection, containerId);
	}
}

function j5e1080_cleanTable(prefix, title, containerId)
{
	var max = Number($(containerId + " .dsf_ctl" + title + "Count").text());
	var count = 0;
	for (var i=1; i<=max; i++)
	{
		var row = $(containerId + " tr.j5e1080_" + prefix + "Row" + i);
		var obj =  row.find("td:first");
		if ("" == $.trim(obj.text()))
		{
			//This row is empty, so find the relevant tr tags and remove them
			row.remove();
		}
		else
		{
			count++;
		}
	}
  
	//Nothing to renumber if we remove them all
	if (count > 0)
		j5e1080_renumberTable(null, { item: $(containerId + " ." + prefix + "Table td:first") });
  $(containerId + " .dsf_ctl" + title + "Count").text(count);
}

function j5e1080_cleanSkillTable(containerId)
{
	var max = Number($(containerId + " .dsf_ctlSkillCount").text());
	var count = 0;
	for (var i=1; i<=max; i++)
	{
		var row = $(containerId + " tr.j5e1080_SkillRow" + i);
		var obj =  row.find("td:nth(2)");
		if ("" == $.trim(obj.text()))
		{
			//This row is empty, so find the relevant tr tags and remove them
			row.remove();
		}
		else
		{
			count++;
		}
	}
  
	//Nothing to renumber if we remove them all
	if (count > 0)
		j5e1080_renumberTable(null, { item: $(containerId + " .SkillTable td:first") });
  $(containerId + " .dsf_ctl" + title + "Count").text(count);
}

function j5e1080_cleanNoncoreTable(containerId)
{
	var max = Number($(containerId + " .dsf_ctlNoncoreCount").text());
	var count = 0;
	for (var i=1; i<=max; i++)
	{
		var row = $(containerId + " tr.j5e1080_NoncoreRow" + i);
		var obj =  row.find("td:nth(2)");
		if ("" == $.trim(obj.text()))
		{
			//This row is empty, so find the relevant tr tags and remove them
			row.remove();
		}
		else
		{
			count++;
		}
	}
  
	//Nothing to renumber if we remove them all
	if (count > 0)
		j5e1080_renumberTable(null, { item: $(containerId + " .NoncoreTable td:first") });
  $(containerId + " .dsf_ctl" + title + "Count").text(count);
}

function j5e1080_cleanInventoryTable(containerId)
{
	var max = Number($(containerId + " .dsf_ctlInventoryCount").text());
	var count = 0;
	for (var i=1; i<=max; i++)
	{
		var box = $(containerId + " div.j5e1080_item" + i);
		var obj = box.find("td:first");
		if ("" == $.trim(obj.text()))
		{
			//This row is empty, so find the relevant tr tags and remove them
			box.remove();
		}
		else
		{
			count++;
		}
	}
	
	//Nothing to renumber if we remove them all
	if (count > 0)
		j5e1080_renumberItems(null, { item: $(containerId + " .inventorybox div.item:first") });
  
  $(containerId + " .dsf_ctlInventoryCount").text(count);
}

function j5e1080_findDsfClass(element)
{
  var classes = $(element).attr('class');
  
  if (!classes)
	return null;
  
  classes = classes.split(/\s/);
  var fieldName = null;
  $.each(classes, function(i, className) {
	if(className.substr(0,4) == "dsf_") {
	  fieldName = className;
	}
  });
  return fieldName;
}

function j5e1080_isNumeric(n)
{
  return ($.isNumeric && $.isNumeric(n)) || (!isNaN(parseFloat(n)) && isFinite(n));
}

function j5e1080_signedInt(n)
{
	return (n < 0) ? n : ("+" + n)
}

function j5e1080_renumberTable(e, ui) {
	//ui.item is the tr tag that got moved
	var parent = ui.item.parents("table");
	var prefix = parent.attr("prefix");
	var baserow = parent.find(".j5e1080_" + prefix + "Row1").children();
	baserow.each(function (i, c) {
		baserow[i] = $(c).prop("class").replace("1", "{0}");
	});
	
	//Now that we have the templates, reorder things
	parent.find("tr:not(:first)").each(function (i, c) {
		$(c).prop("class", "j5e1080_" + prefix + "Row" + (i+1));
		$(c).find("td").each(function (j, cc) {
			var str = baserow[j];
			$(cc).prop("class", str.replace(/\{0\}/g, (i+1)));
		});
	});
}

function j5e1080_renumberItems(e, ui) {
	//ui.item is the tr tag that got moved
	var parent = ui.item.parents(".inventorybox");
	var baserow = [ "dsf dsf_item{0}", "dsf dsf_item{0}_weight" ];
	
	//Now that we have the templates, reorder things
	parent.find(".item").each(function (i, c) {
		$(c).prop("class", "item j5e1080_item" + (i+1));
		$(c).find("tr:first td").each(function (j, cc) {
			var str = baserow[j];
			$(cc).prop("class", str.replace(/\{0\}/g, (i+1)));
		});
	});
}


function j5e1080_renumberSpellSections(ctl) {
	//ctl is the div tag after the item that got removed
	
	if (!ctl.length)
		return; //Removed the last item, so nothing to do
		
	var parent = ctl.parents(".spellbox");
	var count = Number(parent.find(".dsf_ctlSpellSectionCount").text());
	var start = Number(ctl.prop("class").substr(54));
	
	//Now that we have the templates, reorder things
	for (var i = start; i <= count; i++)
	{
		parent.find(".j5e1080_spellSection" + i).each(function (j, c) {
			$(c).prop("class", "spellSection spellSectionContainer j5e1080_spellSection" + (i-1));
			$(c).find(".dsf").each(function (j, cc) {
				var str = $(cc).prop("class");
				$(cc).prop("class", str.replace("dsf_spsSec" + i, "dsf_spsSec" + (i-1)));
			});
		});
	}
}

Back

D&D 5e Character Sheet v.2 for 1280x800 tablet screen

Create Your Campaign

Just One More Step

Just A Little More Info

Use a Social Account