Savage Realms

DST Source Code

HTML Template <div class="wrapper csx" style="width:748px;"> <div class="uicontainer"> <div class="formatBar"> <button type="button" class="boldButton" title="Bold (Ctrl+B)"></button> <button type="button" class="italicButton" title="Italic (Ctrl+I)"></button> <button type="button" class="underlineButton" title="Underline (Ctrl+U)"></button> <button type="button" class="indentButton" title="Indent (Ctrl+Tab)"></button> </div> <div class="tipBox"> <div class="corner topLeft"></div> <div class="corner topRight"></div> <div class="corner bottomLeft"></div> <div class="corner bottomRight"></div> <div class="contentBox"> <div class="tipArea edit"></div> </div> </div> </div> <!-- Main Character Sheet Page Background Div --> <div class="content"> <!-- General Character Information --> <div class="top" style=""> <span class="linefield dsf dsf_name readonly" style="width:232px;text-align:left;"></span ><span class="boxfield box51 dsf dsf_xp" style="top:2px;"></span ><span class="linefield dsf dsf_rank" style="width:120px;"></span ><span class="linefield dsf dsf_profession" style="width:120px;"></span ><span class="linefield dsf dsf_culture" style="width:120px;"></span ><span class="boxfield box51 dsf dsf_bennies" style="top:2px;"></span> <div class="labelrow" style="white-space:nowrap;"> <span class="lable" style="width:232px;text-align:left;">Character Name</span ><span class="lable w51" style="margin-left:2px;">XP</span ><span class="lable" style="width:120px;">Rank</span ><span class="lable" style="width:120px;">Profession</span ><span class="lable" style="width:120px;">Culture</span ><span class="lable w51" style="margin-left:1px;">Bennies</span> </div> <span class="linefield dsf dsf_race" style="width:142px;text-align:left;"></span ><span class="linefield dsf dsf_size" style="width:38px;"></span ><span class="linefield dsf dsf_age" style="width:38px;"></span ><span class="linefield dsf dsf_gender" style="width:38px;"></span ><span class="linefield dsf dsf_height" style="width:38px;"></span ><span class="linefield dsf dsf_weight" style="width:38px;"></span ><span class="linefield dsf dsf_concept" style="width:355px;text-align:left;"></span> <div class="labelrow" style="white-space:nowrap;"> <span class="lable" style="width:142px;text-align:left;">Race</span ><span class="lable" style="width:38px;">Size</span ><span class="lable" style="width:38px;">Age</span ><span class="lable" style="width:38px;">Gender</span ><span class="lable" style="width:38px;">Height</span ><span class="lable" style="width:38px;">Weight</span ><span class="lable" style="width:355px;text-align:left;">Concept</span> </div> </div> <!-- Crunch Page --> <div class="main page page_crunch" style="min-height:400px;margin-bottom:-4px;"> <div class="column"> <!-- Wounds Block --> <div class="section"> <div class="header">WOUNDS</div> <div class="labelrow"> <span class="lable w51">Current</span> <span class="lable w51 right">Penalty</span> </div> <div class="valbar"> <span class="boxfield box51 dsf dsf_current_wounds"></span> <span class="valtitle" style="margin-left:40px;">Wounds</span> <span class="boxfield box51 right dsf dsf_wound_penalty"></span> </div> <div class="valbar"> <span class="boxfield box51 dsf dsf_current_fatigue"></span> <span class="valtitle" style="margin-left:40px;">Fatigue</span> <span class="boxfield box51 right dsf dsf_fatigue_penalty"></span> </div> <div class="lable listhead">Permanent Injuries <span class="interface trash"></span> <span class="interface add addto_injuries" title="Add Injury"></span> </div> <ul class="group list list_injuries"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_injury fullcolumn singlerow" defaultString="Injury">Injury</span> <span class="tip dslf dslf_tip"></span> </li> <span class="oldfields hidden">[{"injury":"injury", "tip": "injury_tip"}]</span> <span class="dsf dsf_injuries readonly hidden"></span> </ul> </div> <!-- Attributes Block --> <div class="section" style="min-height:130px;left:0px;"> <div class="header">ATTRIBUTES</div> <div class="labelrow"> <span class="lable w28">Dice</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_agility"></span> <span class="valtitle">Agility</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_smarts"></span> <span class="valtitle">Smarts</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_strength"></span> <span class="valtitle">Strength</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_spirit"></span> <span class="valtitle">Spirit</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_vigor"></span> <span class="valtitle">Vigor</span> </div> </div> <!-- Derived Characteristics Block --> <div class="section" style="min-height:110px;left:0px;"> <div class="header">DERIVED CHARACTERISTICS</div> <div class="labelrow"> <span class="lable w28">Value</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_charisma"></span> <span class="valtitle">Charisma</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_parry"></span> <span class="valtitle">Parry</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_toughness"></span> <span class="valtitle">Toughness</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_pace"></span> <span class="valtitle">Pace</span> </div> <div class="lable listhead">Setting Rules <span class="interface trash"></span> <span class="interface add addto_setting_rules" title="Add Setting Rule"></span> </div> <ul class="group list list_setting_rules" style="margin-top:-5px;"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit boxfield box28 dslf dslf_setting_rule"></span> <span class="edit dslf dslf_rule_value singlerow valtitle" style="position:relative; top:-5px;" defaultString="Setting Rule">Setting Rule</span> </li> <span class="oldfields hidden"> [{ "setting_rule": "setting_rule", "rule_value": "setting_rule_value" }] </span> <span class="dsf dsf_setting_rules readonly hidden"></span> </ul> </div> <!-- Skills Block --> <div class="section"> <div class="header">SKILLS</div> <div class="labelrow"> <span class="lable w28">Dice</span> <span class="lable w51 right" style="margin-right:-5px;">Attribute</span> <span class="interface trash"></span> <span class="interface add addto_skills" title="Add Skill"></span> </div> <ul class="group list list_skills" style="margin-top:-2px;"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit boxfield box28 dslf dslf_skill_value"></span> <span class="edit dslf dslf_skill singlerow" defaultString="Skill Name">Skill Name</span> <span class="edit boxfield box51 right dslf dslf_skill_attribute"></span> </li> <span class="oldfields hidden"> [{ "skill":"skill_name", "skill_value":"skill_value", "skill_attribute":"skill_attribute" }] </span> <span class="dsf dsf_skills readonly hidden"></span> </ul> </div> <!-- Notes Block --> <div class="section" style="min-height:44px;"> <div class="header">NOTES</div> <div class="lable listhead">Note <span class="interface trash"></span> <span class="interface add addto_notes" title="Add Note"></span> </div> <ul class="group list list_notes"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_note fullcolumn singlerow" defaultString="Note">Note</span> <span class="tip dslf dslf_tip"></span> </li> <span class="oldfields hidden">[{"note":"note","tip":"note_tip"}]</span> <span class="dsf dsf_notes readonly hidden"></span> </ul> </div> </div><div class="column gutter"> <!-- Armor Block --> <div class="section" style="min-height:110px;left:0px;"> <div class="header">ARMOR</div> <div class="labelrow"> <span class="lable w28">Value</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_armor_head"></span> <span class="valtitle">Head: </span> <span class="edit dsf dsf_armor_head_name" style="position:relative;top:-3px;"></span> <span class="tip dsf dsf_armor_head_tip"></span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_armor_torso"></span> <span class="valtitle">Torso: </span> <span class="edit dsf dsf_armor_torso_name" style="position:relative;top:-3px;"></span> <span class="tip dsf dsf_armor_torso_tip"></span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_armor_arms"></span> <span class="valtitle">Arms: </span> <span class="edit dsf dsf_armor_arms_name" style="position:relative;top:-3px;"></span> <span class="tip dsf dsf_armor_arms_tip"></span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_armor_legs"></span> <span class="valtitle">Legs: </span> <span class="edit dsf dsf_armor_legs_name" style="position:relative;top:-3px;"></span> <span class="tip dsf dsf_armor_legs_tip"></span> </div> </div> <!-- Arcane Background Block --> <div class="section" style="min-height:70px;"> <div class="header">POWERS</div> <div class="labelrow"> <span class="lable">Arcane Background</span> </div> <div class="valbar" style="text-align:center;"> <span class="edit dsf dsf_arcane_background fullcolumn singlerow" style="text-align:center;" defaultString="None">None</span> </div> <div class="labelrow"> <span class="lable w28">Current</span> <span class="lable w24 right">Max</span> </div> <div class="valbar"> <span class="boxfield box28 dsf dsf_power_points"></span> <span class="valtitle" style="margin-left:50px;">Power Points</span> <span class="boxfield right dsf dsf_max_power_points"></span> </div> <div class="lable listhead">Power <span class="interface trash"></span> <span class="interface add addto_powers" title="Add Power"></span> </div> <ul class="group list list_powers"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_type fullcolumn singlerow" defaultString="Power">Power</span> <div class="labelrow" style="margin-top:5px;"> <div class="lable w28 attackbox">Cost</div> <div class="lable w51 attackbox">Range</div> <div class="lable w51 attackbox">Damage</div> <div class="lable w51 attackbox">Duration</div> </div> <div class="valbar"> <span class="edit boxfield box28 dslf dslf_power_cost"></span> <span class="edit boxfield box51 dslf dslf_power_range"></span> <span class="edit boxfield box51 dslf dslf_power_damage"></span> <span class="edit boxfield box51 dslf dslf_power_duration"></span> <span class="tip dslf dslf_power_tip"></span> </div> </li> <span class="oldfields hidden"> [{ "type":"power_type", "power_cost": "power_cost", "power_range": "power_range", "power_damage": "power_damage", "power_duration": "power_duration", "power_tip":"power_tip" }] </span> <span class="dsf dsf_powers readonly hidden"></span> </ul> </div> <!-- Racial Features Block --> <div class="section" style="min-height:42px;left:0px;min-height:40px\9"> <div class="header">RACIAL FEATURES</div> <div class="lable listhead">Feature <span class="interface trash"></span> <span class="interface add addto_racial_features" title="Add Feature"></span> </div> <ul class="group list list_racial_features"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_feature fullcolumn singlerow" defaultString="Feature">Feature</span> <span class="tip dslf dslf_tip"></span> </li> <span class="oldfields hidden">[{"feature":"racial_feature","tip":"racial_feature_tip"}]</span> <span class="dsf dsf_racial_features readonly hidden"></span> </ul> </div> <!-- Edges Block --> <div class="section" style="min-height:120px;left:0px;min-height:100px\9"> <div class="header">EDGES</div> <div class="lable listhead">Edge <span class="interface trash"></span> <span class="interface add addto_edges" title="Add Edge"></span> </div> <ul class="group list list_edges"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_edge fullcolumn singlerow" defaultString="Edge">Edge</span> <span class="tip dslf dslf_tip"></span> </li> <span class="oldfields hidden">[{"edge":"edge","tip":"edge_tip"}]</span> <span class="dsf dsf_edges readonly hidden"></span> </ul> </div> <!-- Hindrances Block --> <div class="section" style="min-height:68px;left:0px;min-height:53px\9"> <div class="header">HINDRANCES</div> <div class="lable listhead">Hindrance <span class="interface trash"></span> <span class="interface add addto_hindrances" title="Add Hindrance"></span> </div> <ul class="group list list_hindrances"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_hindrance fullcolumn singlerow" defaultString="Hindrance">Hindrance</span> <span class="tip dslf dslf_tip"></span> </li> <span class="oldfields hidden">[{"hindrance":"hindrance", "tip": "hindrance_tip"}]</span> <span class="dsf dsf_hindrances readonly hidden"></span> </ul> </div> </div><div class="column gutter"> <!-- Attacks Block --> <div class="section" style="min-height:97px;left:0px;min-height:74px\9"> <div class="header">ATTACKS</div> <div class="lable listhead">Attack <span class="interface trash"></span> <span class="interface add addto_attacks" title="Add Attack"></span> </div> <ul class="group list list_attacks"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_attack fullcolumn singlerow" defaultString="Attack">Attack</span> <div class="labelrow" style="margin-top:2px;"> <div class="lable w51 attackbox">Damage</div> <div class="lable w51 attackbox">Skill</div> <div class="lable w51 attackbox">Range</div> <div class="lable w28 right">WT</div> <div class="lable w24 right">AP</div> </div> <div class="valbar"> <span class="edit boxfield box51 dslf dslf_damage"></span> <span class="edit boxfield box51 dslf dslf_skill"></span> <span class="edit boxfield box51 dslf dslf_range"></span> <span class="edit boxfield box28 right dslf dslf_weight"></span> <span class="edit boxfield right dslf dslf_armor_piercing"></span> </div> <div class="valbar"> <span class="edit dslf dslf_notes" style="position:relative;top:3px;" defaultString="Attack Notes">Attack Notes</span> <span class="tip dslf dslf_tip"></span> </div> </li> <span class="oldfields hidden"> [{ "attack": "attack", "damage": "attack_damage", "skill": "attack_skill", "range": "attack_range", "weight": "attack_weight", "armor_piercing": "attack_armor_piercing", "tip": "attack_tip", "notes": "attack_notes" }] </span> <span class="dsf dsf_attacks readonly hidden"></span> </ul> </div> <!-- Equipment Block --> <div class="section" style="min-height:142px;left:0px;min-height:122px\9"> <div class="header">EQUIPMENT</div> <div class="labelrow"> <span class="lable w51">Current</span> <span class="lable w51 right">Limit</span> </div> <div class="valbar"> <span class="boxfield box51 dsf dsf_current_weight"></span> <span class="valtitle" style="margin-left:20px;">Weight Carried</span> <span class="boxfield box51 right dsf dsf_weight_limit"></span> </div> <div class="valbar"> <span class="boxfield box51 dsf dsf_gold"></span> <span class="valtitle" style="margin-left:25px;">Gold Pieces</span> </div> <div class="lable listhead">Item <span class="interface trash"></span> <span class="interface add addto_items" title="Add Item"></span> </div> <ul class="group list list_items"> <li class="proto item"> <div class="handle"><div></div></div> <span class="edit dslf dslf_mod fullcolumn singlerow" defaultString="Item">Item</span> <span class="link_address dslf dslf_link"></span> <span class="tip dslf dslf_tip"></span> </li> <span class="oldfields hidden">[{"mod":"item","link":"item_link","tip":"mod_tip"}]</span> <span class="dsf dsf_items readonly hidden"></span> </ul> </div> </div> </div> <!-- Fluff Page --> <div class="main page page_fluff" style="min-height:400px;margin-bottom:-4px;"> <div style="margin:0px 4px 4px 4px;position:relative;z-index:3;"> <span style="display:inline-block;float:right;width:234px;margin-left:6px;position:relative;"> <span class="dsf dsf_avatar_image readonly" style="width:234px"></span> <img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_frame_top.png" style="position:absolute;left:0px;top:0px;width:234px;" /> <img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_frame_bottom.png" style="position:absolute;left:0px;bottom:0px;width:234px;" /> </span> <span class="dsf dsf_bio readonly" style="font-size:9pt;"></span> </div> </div> </div> <!-- Page Tabs --> <div style="text-align:right;position:relative;"> <div style="position:absolute;left:10px;top:10px;text-align:left;font-size:9pt;"> Character By <span class="dsf dsf_player readonly"></span><br/> Sheet By <span class="dsf dsf_dst_author readonly"></span> </div> <span class="tabs"> <a class="tab crunch tab_crunch" style="right:148px;top:0px;"> </a> <a class="tab fluff tab_fluff" style="right:18px;top:0px;"> </a> </span> </div> </div>

CSS /* Component Includes */ @import url(https://chainsawxiv.github.io/DST/common/css/csx_dd4e_common.css); /* Parchment Sheet Customization */ div.ds_savagerealms .content{ background-image: url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_back_deco.png'), url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_back_bottom.png'), url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_back.jpg'); background-position: bottom left, bottom center, top center; background-repeat: no-repeat, no-repeat, repeat-y; color:#776655; padding-bottom:0px; } div.ds_savagerealms .boxfield{ background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_box.png'); } div.ds_savagerealms .box28{ background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_box_28.png'); } div.ds_savagerealms .box51{ background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_box_51.png'); } div.ds_savagerealms .linefield{ border-color:#BBAA99; } div.ds_savagerealms h1,h2,h3,h4{ color:#776655; } div.ds_savagerealms .top{ background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_back_top.png'); } div.ds_savagerealms .header{ background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_head.png'); color:#776655; } div.ds_savagerealms .valbar{ background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_valbar.png'); color:#776655; } div.ds_savagerealms .skillbar:nth-of-type(odd){ background-color:rgba(96,24,12,0.05); } div.ds_savagerealms .lable{ color:#998877; } div.ds_savagerealms a{ text-decoration:none; color:#776655; } /* Optional Link Styles */ div.ds_savagerealms .link_address{ display:none; } div.ds_savagerealms .link_active{ color:#7766AA; } div.ds_savagerealms .link_active:hover{ color:#AA88DD; } div.ds_savagerealms .list li.item{ border-bottom:1px solid rgba(96,24,12,0.1); border-radius:0px; } div.ds_savagerealms .dsf.fullcolumn, div.ds_savagerealms .edit.fullcolumn{ width:237px; padding-bottom:4px; } div.ds_savagerealms.editable .dsf.fullcolumn, div.ds_savagerealms.editable .edit.fullcolumn{ width:211px; } div.ds_savagerealms .tab.tab_manage, div.ds_savagerealms .tab.tab_crunch, div.ds_savagerealms .tab.tab_fluff{ width:125px; height:60px; position:absolute; } div.ds_savagerealms .tabs{ display: inline-block; position: relative; width: 275px; height: 71px; background-image: url(https://chainsawxiv.github.io/DST/sheets/chainsawxiv_dd4e/images/dd4e_tabs.png); background-position:right; }

JavaScript // Global Options csx_opts = { 'setupCallback': function(item){savagerealms_setup(item);}, 'uiContainer': function(){return document;}, 'defaultFieldValue':'', 'imagePath':'https://chainsawxiv.github.io/DST/common/images/', 'preloadFiles':[ 'add.png', 'add_hover.png', 'balance.png', 'balance_hover.png', 'bold_active.png', 'bold_hover.png', 'bullet.png', 'fb_back_bottom.png', 'fb_back_main.png', 'fb_back_top.png', 'grab.png', 'grab_hover.png', 'indent.png', 'indent_active.png', 'indent_hover.png', 'italic.png', 'italic_active.png', 'italic_hover.png', 'tip.png', 'tip_hover.png', 'trash.png', 'trash_active.png', 'trash_hover.png', 'underline.png', 'underline_active.png', 'underline_hover.png' ], }; // Pre-Load Configuration function savagerealms_dataPreLoad(opts){ aisleten.characters.jeditablePlaceholder = csx_opts.defaultFieldValue; } // Master Startup function savagerealms_dataPostLoad(data){ csx_opts.defaultContext = document.getElementById(data.containerId); csx_opts.uiContainer = csx_opts.defaultContext.querySelector('.uicontainer'); csx_opts.isEditable = data.isEditable; // Force user off of management page when not editing if (!csx_opts.isEditable && localStorage[ 'lastPage' ] == 'manage' ) localStorage[ 'lastPage' ] = 'crunch'; // Include the shared script file var includes = document.createElement('script'); includes.type = 'text/javascript'; includes.src = 'https://chainsawxiv.github.io/DST/common/js/csx_dd4e_common.js'; includes.onload = function(){ // Fix container properties csx_firstParentWithClass(csx_opts.defaultContext,'dynamic_sheet_container').style.overflow = 'visible'; // Set up the editing interface csx_opts.setupCallback(); }; document.body.appendChild(includes); // Preload rollover images // Deferred to prevent blocking window.setTimeout(function(){ if (document.images){ for (var i = 0; i < csx_opts.preloadFiles.length; i++){ var img = new Image(); img.src = csx_opts.imagePath + csx_opts.preloadFiles[i]; } } },500); } // Setup After Script Load function savagerealms_setup(context){ // Provide default context if (context == undefined) context = csx_opts.defaultContext; // Do setup for interfaces csx_edit(context); csx_tip(context); csx_list(context); csx_tab(context); } // Shutdown Before Save function savagerealms_dataPreSave(){ // Default the context if not set var context = csx_opts.defaultContext; // Bake everything down to its field values var edits = context.querySelectorAll('.dsf:not(.readonly),.edit'); for (var i = 0; i < edits.length; i++) edits[i].unrender(); var lists = context.querySelectorAll('.list'); for (var i = 0; i < lists.length; i++) lists[i].unrender(); }

Submit Notes Updated for some formatting fixes that were missed - thanks ChainsawXIV for spotting them! More bugfixing - namely in the Arms armor tip.

Back