306 lines
		
	
	
		
			19 KiB
		
	
	
	
		
			Handlebars
		
	
	
	
	
	
			
		
		
	
	
			306 lines
		
	
	
		
			19 KiB
		
	
	
	
		
			Handlebars
		
	
	
	
	
	
| <form>
 | |
|     <div class="hench-sheet-container hench-padding-wide hench-gap-wide hench-white">
 | |
|         <!-- ID row -->
 | |
|         <div class="hench-row hench-gap-wide">
 | |
|             <!-- Core - Name, Look, Playbook -->
 | |
|             <div class="hench-box hench-m-grey hench-flex-resizeable hench-padding-wide hench-gap-narrow">
 | |
|                 <!-- Name -->
 | |
|                 <div class="hench-field hench-row hench-gap-narrow">
 | |
|                     <label class="hench-flex-fixed" for="hench-name">Name: </label>
 | |
|                     <input type="text" name="hench-name" class="hench-text-input hench-flex-resizeable" value="{{actor.name}}" data-field-path="name" />
 | |
|                 </div>
 | |
|                 <!-- Look -->
 | |
|                 <div class="hench-field hench-row hench-gap-narrow">
 | |
|                     <label class="hench-flex-fixed" for="hench-look">Look: </label>
 | |
|                     <input type="text" name="hench-look" class="hench-text-input hench-flex-resizeable" value="{{actor.system.look}}" data-field-path="system.look" />
 | |
|                 </div>
 | |
|                 <!-- Playbook -->
 | |
|                 <div class="hench-field hench-row hench-gap-narrow">
 | |
|                     <label class="hench-flex-fixed" for="hench-playbook">Playbook: </label>
 | |
|                     <select name="hench-playbook" class="hench-hench-sheet-playbook-dropdown hench-flex-resizeable">
 | |
|                         {{#each playbookKeys}}
 | |
|                             <option value="{{this.key}}" {{#if this.selected}}selected{{/if}}>{{this.key}}</option>
 | |
|                         {{/each}}
 | |
|                     </select>
 | |
|                 </div>
 | |
|             </div>
 | |
|             <!-- Inclinations -->
 | |
|             <div class="hench-box hench-l-grey hench-flex-resizeable hench-padding-wide hench-gap-narrow">
 | |
|                 <div class="hench-centered hench-title">
 | |
|                     Inclinations
 | |
|                 </div>
 | |
|                 <ul>
 | |
|                     {{#each actor.system.fixedInclinations}}
 | |
|                         <li>
 | |
|                             {{this}}
 | |
|                         </li>
 | |
|                     {{/each}}
 | |
|                     <li>
 | |
|                         <input type="text" class="hench-text-input" data-field-path="system.customInclination" value="{{actor.system.customInclination}}" />
 | |
|                     </li>
 | |
|                 </ul>
 | |
|             </div>
 | |
|             <!-- Icon -->
 | |
|             <div class="hench-box hench-l-grey hench-flex-fixed">
 | |
|                 <img src="{{actor.img}}" data-edit="img" class="hench-icon" />
 | |
|             </div>
 | |
|         </div>
 | |
|         <!-- Details row -->
 | |
|         <div class="hench-row hench-gap-wide">
 | |
|             <!-- Details --> 
 | |
|             <div class="hench-box hench-l-grey hench-flex-resizeable hench-padding-wide hench-gap-narrow">
 | |
|                 <div class="hench-row">
 | |
|                     <div class="hench-centered hench-title hench-flex-resizeable">
 | |
|                         Details
 | |
|                     </div>
 | |
|                 </div>
 | |
|                 {{#each actor.system.details}}
 | |
|                     <div class="hench-row">
 | |
|                         <label for="hench-detail-{{@index}}">{{this.question}}</label>
 | |
|                     </div>
 | |
|                     <div class="hench-row">
 | |
|                         <input name="hench-detail-{{@index}}" type="text" class="hench-text-input" data-field-path="system.details[{{@index}}].answer" value="{{this.answer}}" />
 | |
|                     </div>
 | |
|                 {{/each}}
 | |
|             </div>
 | |
|             <!-- Mission Planning -->
 | |
|             <div class="hench-box hench-m-grey hench-flex-resizeable hench-padding-wide hench-gap-narrow">
 | |
|                 <div class="hench-centered hench-title">
 | |
|                     Mission Planning
 | |
|                 </div>
 | |
|                 <ul>
 | |
|                     {{#each actor.system.missionPlanning}}
 | |
|                         <li>{{this}}</li>
 | |
|                     {{/each}}
 | |
|                 </ul>
 | |
|             </div>
 | |
|         </div>
 | |
|         <!-- Stress -->
 | |
|         <div class="hench-row hench-gap-wide">
 | |
|             <div class="hench-box hench-m-grey hench-flex-resizeable hench-padding-narrow hench-gap-narrow">
 | |
|                 <div class="hench-centered hench-title">
 | |
|                     <label for="hench-stress">
 | |
|                         Stress
 | |
|                     </label>
 | |
|                 </div>
 | |
|                 <div class="hench-row hench-row-even hench-gap-narrow">
 | |
|                     {{#int2checkbox maxStress actor.system.stress}}
 | |
|                         <input name="hench-stress" type="checkbox" class="hench-checkbox hench-checkbox-int-field" data-field-path="system.stress" data-value="{{index}}" {{#if marked}}checked {{/if}} />
 | |
|                     {{/int2checkbox}}
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|         <!-- Big Box -->
 | |
|         <div class="hench-row hench-gap-wide">
 | |
|             <!-- Column 1: gear, exp -->
 | |
|             <div class="hench-box hench-box-stretch hench-flex-fixed hench-gap-wide">
 | |
|                 <!-- Gear -->
 | |
|                 <div class="hench-row hench-flex-resizeable">
 | |
|                     <div class="hench-box hench-m-grey hench-flex-resizeable hench-padding-narrow hench-gap-narrow">
 | |
|                         <div class="hench-row">
 | |
|                             <div class="hench-centered hench-title hench-flex-resizeable">
 | |
|                                 Gear
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         <div class="hench-row hench-row-even hench-gap-narrow">
 | |
|                             <div>
 | |
|                                 <input type="button" class="hench-button hench-increment-button-field" data-field-path="system.gearLimit" data-value="{{decrement actor.system.gearLimit}}" {{#unless (canDecrease actor.system.gearLimit minGear)}}disabled{{/unless}} value="-" />
 | |
|                             </div>
 | |
|                             <div>
 | |
|                                 Limit: {{actor.system.gearLimit}}
 | |
|                             </div>
 | |
|                             <div>
 | |
|                                 <input type="button" class="hench-button hench-increment-button-field" data-field-path="system.gearLimit" data-value="{{increment actor.system.gearLimit}}" {{#unless (canIncrease actor.system.gearLimit maxGear)}}disabled{{/unless}} value="+" />
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         {{#each actor.system.fixedGear}}
 | |
|                             <div class="hench-row hench-l-grey hench-flex-resizeable hench-gap-narrow hench-padding-narrow">
 | |
|                                 <div class="hench-box hench-flex-fixed">
 | |
|                                     <input type="checkbox" name="hench-gear-{{@index}}" class="hench-checkbox hench-checkbox-toggle-field" data-field-path="system.fixedGear[{{@index}}].marked" {{#if this.marked}}checked{{/if}} />
 | |
|                                 </div>
 | |
|                                 <div class="hench-box hench-flex-resizeable">
 | |
|                                     <div>
 | |
|                                         {{this.description}}
 | |
|                                     </div>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         {{/each}}
 | |
|                         <div class="hench-row hench-l-grey hench-flex-resizeable hench-gap-narrow hench-padding-narrow">
 | |
|                             <div class="hench-box hench-flex-fixed">
 | |
|                                 <input type="checkbox" name="hench-gear-9" class="hench-checkbox hench-checkbox-toggle-field" data-field-path="system.customGear.marked" {{#if actor.system.customGear.marked}}checked{{/if}} />
 | |
|                             </div>
 | |
|                             <div class="hench-box hench-flex-resizeable">
 | |
|                                 <div>
 | |
|                                     <input type="text" class="hench-text-input" data-field-path="system.customGear.description" value="{{actor.system.customGear.description}}" />
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|                 <!-- exp -->
 | |
|                 <div class="hench-row hench-flex-resizeable">
 | |
|                     <div class="hench-box hench-d-grey hench-padding-narrow hench-gap-narrow hench-flex-resizeable">
 | |
|                         <div class="hench-row">
 | |
|                             <div class="hench-centered hench-title hench-flex-resizeable">
 | |
|                                 Experience
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         <div class="hench-row hench-row-even hench-gap-narrow hench-padding-narrow">
 | |
|                             {{#int2checkbox maxExp actor.system.experience}}
 | |
|                                 <div>
 | |
|                                     <input type="checkbox" class="hench-checkbox-int-field" data-field-path="system.experience" data-value="{{index}}" {{#if marked}} checked {{/if}} />
 | |
|                                 </div>
 | |
|                             {{/int2checkbox}}
 | |
|                         </div>
 | |
|                         {{#each actor.system.experienceTriggers}}
 | |
|                             <div class="hench-row hench-m-grey hench-padding-narrow hench-gap-narrow">
 | |
|                                 <div class="hench-box hench-flex-fixed">
 | |
|                                     <input type="checkbox" class="hench-checkbox hench-checkbox-toggle-field" data-field-path="system.experienceTriggers[{{@index}}].marked" {{#if this.marked}}checked{{/if}} />
 | |
|                                 </div>
 | |
|                                 <div class="hench-box hench-flex-resizeable">
 | |
|                                     {{this.description}}
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         {{/each}}
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </div>
 | |
|             <!-- Column 2: harm, moves -->
 | |
|             <div class="hench-box hench-box-stretch hench-flex-resizeable hench-gap-wide">
 | |
|                 <!-- Harm -->
 | |
|                 <div class="hench-row hench-gap-wide">
 | |
|                     <div class="hench-box hench-d-grey hench-padding-narrow hench-flex-resizeable">
 | |
|                         <div class="hench-row">
 | |
|                             <div class="hench-flex-resizeable hench-centered hench-title">
 | |
|                                 Harm
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         <!-- tier 3 -->
 | |
|                         <div class="hench-row hench-m-grey hench-harm-row hench-flex-resizeable">
 | |
|                             <div class="hench-flex-fixed hench-m-grey hench-harm-fixed-width">
 | |
|                                 3:
 | |
|                             </div>
 | |
|                             {{#each actor.system.harm.levelThree}}
 | |
|                                 <div class="{{#if this.marked}}hench-white{{else}}hench-l-grey{{/if}} hench-flex-resizeable hench-padding-narrow hench-harm-input-cell">
 | |
|                                     <input type="text" class="hench-harm-field" data-field-path="system.harm.levelThree[{{@index}}].description" data-dependent-path="system.harm.levelThree[{{@index}}].marked" value="{{this.description}}" />
 | |
|                                 </div>
 | |
|                             {{/each}}
 | |
|                             <div class="hench-flex-fixed hench-m-grey hench-harm-fixed-width">
 | |
|                                 Need help.
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         <!-- tier 2 -->
 | |
|                         <div class="hench-row hench-m-grey hench-harm-row hench-flex-resizeable">
 | |
|                             <div class="hench-flex-fixed hench-m-grey hench-harm-fixed-width">
 | |
|                                 2:
 | |
|                             </div>
 | |
|                             {{#each actor.system.harm.levelTwo}}
 | |
|                                 <div class="{{#if this.marked}}hench-white{{else}}hench-l-grey{{/if}} hench-flex-resizeable hench-padding-narrow hench-harm-input-cell">
 | |
|                                     <input type="text" class="hench-harm-field" data-field-path="system.harm.levelTwo[{{@index}}].description" data-dependent-path="system.harm.levelTwo[{{@index}}].marked" value="{{this.description}}" />
 | |
|                                 </div>
 | |
|                             {{/each}}
 | |
|                             <div class="hench-flex-fixed hench-m-grey hench-harm-fixed-width">
 | |
|                                 -1 Card
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         <!-- tier 1-->
 | |
|                         <div class="hench-row hench-m-grey hench-harm-row hench-flex-resizeable">
 | |
|                             <div class="hench-flex-fixed hench-m-grey hench-harm-fixed-width">
 | |
|                                 1:
 | |
|                             </div>
 | |
|                             {{#each actor.system.harm.levelOne}}
 | |
|                                 <div class="{{#if this.marked}}hench-white{{else}}hench-l-grey{{/if}} hench-flex-resizeable hench-padding-narrow hench-harm-input-cell">
 | |
|                                     <input type="text" class="hench-harm-field" data-field-path="system.harm.levelOne[{{@index}}].description" data-dependent-path="system.harm.levelOne[{{@index}}].marked" value="{{this.description}}" />
 | |
|                                 </div>
 | |
|                             {{/each}}
 | |
|                             <div class="hench-flex-fixed hench-m-grey hench-harm-fixed-width">
 | |
|                                 
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|                 <!-- Moves -->
 | |
|                 <div class="hench-row hench-gap-wide">
 | |
|                     <div class="hench-box hench-m-grey hench-flex-resizeable hench-padding-narrow hench-gap-narrow">
 | |
|                         <div class="hench-row">
 | |
|                             <div class="hench-centered hench-title hench-flex-resizeable">
 | |
|                                 Abilities
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         {{#each actor.system.moves}}
 | |
|                             <div class="hench-row hench-l-grey hench-flex-resizeable hench-gap-narrow">
 | |
|                                 <div class="hench-box hench-flex-fixed">
 | |
|                                     <input type="checkbox" name="hench-move-checkbox-{{@index}}" class="hench-checkbox-toggle-field" data-field-path="system.moves[{{@index}}].marked" {{#if this.marked}}checked{{/if}} {{#if this.locked}}disabled{{/if}} /> 
 | |
|                                 </div>
 | |
|                                 <div class="hench-box hench-flex-resizeable hench-gap-narrow hench-padding-narrow">
 | |
|                                     <div>
 | |
|                                         <label for="hench-move-checkbox-{{@index}}"><em><strong>{{this.name}}</strong></em></label>
 | |
|                                     </div>
 | |
|                                     <div>
 | |
|                                         {{{this.description}}}
 | |
|                                     </div>
 | |
|                                     {{#if this.hasWriteIn}}
 | |
|                                         <div>
 | |
|                                             <input type="text" name="hench-move-writein-{{@index}}" class="hench-text-field" data-field-path="system.moves[{{@index}}].writein" value="{{this.writein}}" />
 | |
|                                         </div>
 | |
|                                     {{/if}}
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         {{/each}}
 | |
|                         <div class="hench-row hench-l-grey hench-flex-resizeable hench-gap-narrow">
 | |
|                             <div class="hench-box hench-flex-fixed">
 | |
|                                 <input type="checkbox" name="hench-move-checkbox-custom" class="hench-checkbox-toggle-field" data-field-path="system.customMove.marked" {{#if actor.system.customMove.marked}}checked{{/if}} /> 
 | |
|                             </div>
 | |
|                             <div class="hench-box hench-flex-resizeable hench-gap-narrow hench-padding-narrow">
 | |
|                                 <div>
 | |
|                                     <input type="text" name="hench-move-name-custom" class="hench-text-input hench-emphasized hench-strong" data-field-path="system.customMove.name" value="{{actor.system.customMove.name}}" />
 | |
|                                 </div>
 | |
|                                 <div>
 | |
|                                     <textarea name="hench-move-description-custom" class="hench-text-input" data-field-path="system.customMove.description" rows="4">{{actor.system.customMove.description}}</textarea>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|         <!-- Advancements -->
 | |
|         <div class="hench-row hench-gap-wide">
 | |
|             <!-- base advancements -->
 | |
|             <div class="hench-box hench-m-grey hench-flex-resizeable hench-padding-narrow hench-gap-narrow">
 | |
|                 <div class="hench-flex-fixed hench-title hench-centered">
 | |
|                     Advancements
 | |
|                 </div>
 | |
|                 {{#each actor.system.baseAdvancements}}
 | |
|                     <div class="hench-row hench-flex-resizeable hench-l-grey hench-padding-narrow hench-gap-narrow">
 | |
|                         <div class="hench-box hench-flex-fixed">
 | |
|                             <input type="checkbox" class="hench-checkbox-toggle-field" data-field-path="system.baseAdvancements[{{@index}}].marked" {{#if this.marked}} checked {{/if}} />
 | |
|                         </div>
 | |
|                         <div class="hench-box hench-flex-resizeable">
 | |
|                             {{this.description}}
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 {{/each}}
 | |
|             </div>
 | |
|             <!-- advanced advancements -->
 | |
|             <div class="hench-box hench-d-grey hench-flex-resizeable hench-gap-narrow hench-padding-narrow">
 | |
|                 <div class="hench-flex-fixed hench-title hench-centered">
 | |
|                     Advancements
 | |
|                 </div>
 | |
|                 <div class="hench-flex-fixed hench-centered">
 | |
|                     <em>(Take only after 3 or more advancements)</em>
 | |
|                 </div>
 | |
|                 {{#each actor.system.exAdvancements}}
 | |
|                     <div class="hench-row hench-flex-resizeable hench-l-grey hench-padding-narrow hench-gap-narrow">
 | |
|                         <div class="hench-box hench-flex-fixed">
 | |
|                             <input type="checkbox" class="hench-checkbox-toggle-field" data-field-path="system.exAdvancements[{{@index}}].marked" {{#if this.marked}} checked {{/if}} />
 | |
|                         </div>
 | |
|                         <div class="hench-box hench-flex-resizeable">
 | |
|                             {{this.description}}
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 {{/each}}
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
| </form> |