TTiaitaandTyson
fd5872d6e0
* Added Glitter Hearts sheet v1 * Added sheet.json and preview.png * [Glitter Hearts] added instructions to sheet.json Co-authored-by: Tyson <myapatheticimagination@gmail.com>
278 lines
10 KiB
HTML
278 lines
10 KiB
HTML
<link rel="stylesheet" href="glitterhearts.css">
|
|
|
|
<div class="main">
|
|
<div class="header">
|
|
<div class="block logo"></div>
|
|
<div class="block underlabelled">
|
|
<input type="text" name="attr_char_name">
|
|
<input type="text" maxlength="10" name="attr_char_pronouns">
|
|
<label>Character Name</label>
|
|
<label>Pronouns</label>
|
|
</div>
|
|
<div class="block underlabelled">
|
|
<input type="text" name="attr_hero_name">
|
|
<input type="text" maxlength="10" name="attr_hero_pronouns">
|
|
<label>Hero Name</label>
|
|
<label>Pronouns</label>
|
|
</div>
|
|
<div class="block underlabelled">
|
|
<input type="text" name="attr_player_name">
|
|
<input type="text" maxlength="10" name="attr_player_pronouns">
|
|
<label>Player Name</label>
|
|
<label>Pronouns</label>
|
|
</div>
|
|
<div class="block hp-display">
|
|
<input type="number" name="attr_pc_hp"> / <input type="number" name="attr_pc_max_hp">
|
|
</div>
|
|
</div>
|
|
<div class="statline">
|
|
<div class="stat">
|
|
<label>Physical</label>
|
|
<button type="roll"
|
|
value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_physical}]]}}{{roll_stat=Physical}}"
|
|
name="roll_Physical"></button>
|
|
<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_physical">
|
|
</div>
|
|
<div class="stat">
|
|
<label>Emotional</label>
|
|
<button type="roll"
|
|
value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_emotional}]]}}{{roll_stat=Emotional}}"
|
|
name="roll_Emotional"></button>
|
|
<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_emotional">
|
|
</div>
|
|
<div class="stat">
|
|
<label>Mental</label>
|
|
<button type="roll"
|
|
value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_Mental}]]}}{{roll_stat=Mental}}"
|
|
name="roll_Mental"></button>
|
|
<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_mental">
|
|
</div>
|
|
<div class="stat">
|
|
<label>Mystical</label>
|
|
<button type="roll"
|
|
value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_Mystical}]]}}{{roll_stat=Mystical}}"
|
|
name="roll_Mystical"></button>
|
|
<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_mystical">
|
|
</div>
|
|
<div class="stat">
|
|
<label>Persona</label>
|
|
<button type="roll"
|
|
value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_persona}]]}}{{roll_stat=Persona}}"
|
|
name="roll_Persona"></button>
|
|
<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_persona">
|
|
</div>
|
|
</div>
|
|
<div class="navbar">
|
|
<button class="nav" type="action" name="act_pg1">Character</button>
|
|
<button class="nav" type="action" name="act_pg2">Heroic Achievements</button>
|
|
<button class="nav" type="action" name="act_pg3">Notes</button>
|
|
</div>
|
|
<div class="page">
|
|
<input type="hidden" class="tabstoggle" name="attr_sheetTab" value="pg1">
|
|
<div class="pg1">
|
|
<div class=layout>
|
|
<div class="pg1-upper">
|
|
<div class="pg1-box">
|
|
<div class="class-selection">
|
|
<div class="section-header">Everyday Identity</div>
|
|
<select name="attr_pc_everyday_class">
|
|
<option value="" selected="selected"></option>
|
|
<option value="Athlete">The Athlete</option>
|
|
<option value="Bodybuilder">The Bodybuilder</option>
|
|
<option value="Boxer">The Boxer</option>
|
|
<option value="Coach">The Coach</option>
|
|
<option value="Intellectual">The Intellectual</option>
|
|
<option value="Unrivalled">The Unrivalled</option>
|
|
<option value="Skeptic">The Skeptic</option>
|
|
<option value="Savant">The Savant</option>
|
|
<option value="Popular">The Popular One</option>
|
|
<option value="Clown">The Clown</option>
|
|
<option value="Counselor">The Counselor</option>
|
|
<option value="Team">The Team Player</option>
|
|
<option value="Succeed">The Most Likely To Succeed</option>
|
|
<option value="Aloof">The Aloof</option>
|
|
<option value="Loner">The Loner</option>
|
|
<option value="Overconfident">The Overconfident</option>
|
|
<option value="Goth">The Goth</option>
|
|
<option value="Dreamer">The Dreamer</option>
|
|
<option value="Believer">The True Believer</option>
|
|
<option value="Gifted">The Gifted</option>
|
|
</select>
|
|
</div>
|
|
<div class="move-list">
|
|
<div class="move-header">
|
|
<div class="section-header">Moves</div>
|
|
<div class="section-header">Pg.</div>
|
|
</div>
|
|
<div>
|
|
<fieldset class="repeating_moveseveryday">
|
|
<div class="move">
|
|
<input type="text" class="move-name" name="attr_everyday_move_name">
|
|
<input type="number" maxlength="3" min="0" class="move-pg" name="attr_everyday_move_pg">
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pg1-box">
|
|
<div class="class-selection">
|
|
<div class="section-header">Magical Archetype</div>
|
|
<select name="attr_pc_magical_class">
|
|
<option value="" selected="selected"></option>
|
|
<option value="Idol">The Idol</option>
|
|
<option value="Witch">The Witch</option>
|
|
<option value="Warrior">The Warrior</option>
|
|
<option value="Defender">The Defender</option>
|
|
<option value="Tactitcian">The Tactitcian</option>
|
|
</select>
|
|
</div>
|
|
<div class="move-list">
|
|
<div class="move-header">
|
|
<div class="section-header">Moves</div>
|
|
<div class="section-header">Pg.</div>
|
|
</div>
|
|
<div>
|
|
<fieldset class="repeating_movesmagical">
|
|
<div class="move">
|
|
<input type="text" class="move-name" name="attr_magical_move_name">
|
|
<input type="number" maxlength="3" min="0" class="move-pg" name="attr_magical_move_pg">
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pg1-box">
|
|
<div class="class-selection">
|
|
<div class="section-header">Mystical Connection</div>
|
|
<select name="attr_pc_mystical_class">
|
|
<option value="" selected="selected"></option>
|
|
<option value="Fire">Elemental: Fire</option>
|
|
<option value="Water">Elemental: Water</option>
|
|
<option value="Air">Elemental: Air</option>
|
|
<option value="Lightning">Elemental: Lightning</option>
|
|
<option value="Metal">Elemental: Metal</option>
|
|
<option value="Light">Elemental: Light</option>
|
|
<option value="Dark">Elemental: Dark</option>
|
|
<option value="Life">Elemental: Life</option>
|
|
<option value="Death">Elemental: Death</option>
|
|
<option value="Joy">Emotional: Joy</option>
|
|
<option value="Sadness">Emotional: Sadness</option>
|
|
<option value="Love">Emotional: Love</option>
|
|
<option value="Fear">Emotional: Fear</option>
|
|
<option value="Anger">Emotional: Anger</option>
|
|
<option value="Hope">Emotional: Hope</option>
|
|
<option value="Desire">Emotional: Desire</option>
|
|
<option value="Disgust">Emotional: Disgust</option>
|
|
<option value="Trust">Emotional: Trust</option>
|
|
</select>
|
|
</div>
|
|
<div class="move-list">
|
|
<div class="move-header">
|
|
<div class="section-header">Moves</div>
|
|
<div class="section-header">Pg.</div>
|
|
</div>
|
|
<fieldset class="repeating_movesmystical">
|
|
<div class="move">
|
|
<input type="text" class="move-name" name="attr_mystical_move_name">
|
|
<input type="number" maxlength="3" min="0" class="move-pg" name="attr_mystical_move_pg">
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pg1-lower">
|
|
<div class="condition-counters">
|
|
<div class="pg1-conditions-list pg1-box">
|
|
<div class="section-header">Conditions</div>
|
|
<fieldset class="repeating_conditions">
|
|
<div class="condition">
|
|
<input type="text" name="attr_condition">
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
<div class="pg1-counter-list">
|
|
<div class="stat">
|
|
<label>Power Pool</label>
|
|
<input type="number" name="attr_power_points">
|
|
</div>
|
|
<div class="stat">
|
|
<label>Experience</label>
|
|
<input type="number" name="attr_experience">
|
|
</div>
|
|
<div class="stat">
|
|
<label>Heroic Achievements</label>
|
|
<input type="number" name="attr_achievements">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pg1-relationship-list">
|
|
<div class="relationship-block">
|
|
<div class="section-header">Relationships</div>
|
|
<div class="section-header">Status</div>
|
|
</div>
|
|
<div>
|
|
<fieldset class="repeating_relationship">
|
|
<div class="relationship-block">
|
|
<input type="text" name="attr_relationshipname">
|
|
<select name="attr_relationshipstatus">
|
|
<option value=""></option>
|
|
<option value="1">Cooperative</option>
|
|
<option value="2">Competitive</option>
|
|
<option value="3">Broken</option>
|
|
</select>
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pg2">
|
|
<div class="pg-layout">
|
|
<div class="section-header">Heroic Achievements</div>
|
|
<div>
|
|
<fieldset class="repeating_achievements">
|
|
<div class="pg2-achievement">
|
|
<input type="checkbox" name="attr_achievement_check" value="1">
|
|
<input type="text" name="attr_achievement_text">
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pg3">
|
|
<div class="pg-layout">
|
|
<div class="section-header">Notes</div>
|
|
<textarea name="attr_notes"></textarea>>
|
|
</div>
|
|
</div>
|
|
<div class="footer">
|
|
<div>Version 1.0</div>
|
|
<div>Glitter Hearts designed by Greg Leatherman.</div>
|
|
<div>gleather.itch.io/glitter-hearts</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<rolltemplate class="sheet-rolltemplate-glitterhearts">
|
|
<div class="wrapper">
|
|
<div class="template">
|
|
<div class="template-title">{{pc_name}} rolls {{roll_stat}}!</div>
|
|
{{#rollLess() check 7}}<div class="template-6minus"><span>{{check}}</span> 6- Miss!</div>{{/rollLess() check 7}}
|
|
{{#rollBetween() check 7 9}}<div class="template-7-9"><span>{{check}}</span> 7-9 Partial Success!</div>{{/rollBetween() check 7 9}}
|
|
{{#rollBetween() check 10 11}}<div class="template-11-12"><span>{{check}}</span> 10+ Full Success!</div>{{/rollBetween() check 10 11}}
|
|
{{#rollGreater() check 11}}<div class="template-12plus"><span>{{check}}</span> 12+ Great Success!</div>{{/rollGreater() check 11}}
|
|
</div>
|
|
</div>
|
|
</rolltemplate>
|
|
|
|
<script type="text/worker">
|
|
const buttonlist = ["pg1","pg2","pg3"];
|
|
buttonlist.forEach(button => {
|
|
on(`clicked:${button}`, function() {
|
|
setAttrs({
|
|
sheetTab: button
|
|
});
|
|
});
|
|
});
|
|
</script> |