foundryvtt-beam-saber/templates/crew-sheet.html

<form class="{{cssClass}} actor-sheet" autocomplete="off">

  <section class="flex-horizontal">

    <div id="name-alias" class="grow-two flex-column">
      <div id="name">
        <label for="crew-name">Name</label>
        <input type="text" id="crew-name" name="name" value="{{actor.name}}">
      </div>
  
      <div class="flex-vertical">
        <div class="item-class-label">Crew Reputation</div>
        {{#each actor.items as |item id|}}
        {{#eq item.type "crew_reputation"}}
          <div class="item flex-horizontal" data-item-id="{{item._id}}">
            <div class="item-body item-sheet-open flex-horizontal">
              <img src="{{item.img}}" title="{{item.name}}" width="24" height="24"/>
              <div class="item-name">{{item.name}}</div>
            </div>
            <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
          </div>
        {{/eq}}
        {{/each}}
      </div>
    </div>
  
    <img class="profile-img" src="{{actor.img}}" data-edit="img" title="{{actor.name}}" height="100" width="100"/>

    <div class="grow-two flex-vertical">
      <div id="lair">
        <label for="crew-lair">Lair</label>
        <input type="text" id="crew-lair" name="data.lair" value="{{data.lair}}">
      </div>


      <div class="flex-horizontal">

        <div id="crew-hold" class="flex-horizontal">
          <div class="black-label">Hold</div>
          {{#multiboxes data.hold}}
          <div class="flex-horizontal">
            <div class="gray-label">Weak</div>
            <input id="crew-hold-weak" type="radio" name="data.hold" value="weak">
            <label for="crew-hold-weak"></label>
          </div>
          <div class="flex-horizontal">
            <div class="gray-label">Strong</div>
            <input id="crew-hold-strong" type="radio" name="data.hold" value="strong">
            <label for="crew-hold-strong"></label>
          </div>
          {{/multiboxes}}
        </div>

        <div id="crew-tier">
          {{#multiboxes data.tier}}
          <input id="crew-tier-0" type="radio" name="data.tier" value="0">
          <label for="crew-tier-0" class="black-label">Tier</label>
          <input id="crew-tier-1" type="radio" name="data.tier" value="1">
          <label for="crew-tier-1"></label>
          <input id="crew-tier-2" type="radio" name="data.tier" value="2">
          <label for="crew-tier-2"></label>
          <input id="crew-tier-3" type="radio" name="data.tier" value="3">
          <label for="crew-tier-3"></label>
          <input id="crew-tier-4" type="radio" name="data.tier" value="4">
          <label for="crew-tier-4"></label>
          {{/multiboxes}}
        </div>
      </div>

    </div>
  </section>


  <section class="flex-horizontal">
    <div id="crew-reputation">
      {{#multiboxes data.reputation}}
      {{#repturf data.turfs_amount}}
      <input type="radio" id="crew-reputation-0" name="data.reputation" value="0" dtype="Radio">
      <label class="black-label" for="crew-reputation-0">Rep</label>
      <input type="radio" id="crew-reputation-1" name="data.reputation" value="1" dtype="Radio">
      <label for="crew-reputation-1"></label>
      <input type="radio" id="crew-reputation-2" name="data.reputation" value="2" dtype="Radio">
      <label for="crew-reputation-2"></label>
      <input type="radio" id="crew-reputation-3" name="data.reputation" value="3" dtype="Radio">
      <label for="crew-reputation-3"></label>
      <input type="radio" id="crew-reputation-4" name="data.reputation" value="4" dtype="Radio">
      <label for="crew-reputation-4"></label>
      <input type="radio" id="crew-reputation-5" name="data.reputation" value="5" dtype="Radio">
      <label for="crew-reputation-5"></label>
      <input type="radio" id="crew-reputation-6" name="data.reputation" value="6" dtype="Radio">
      <label for="crew-reputation-6"></label>
      <input type="radio" id="crew-reputation-7" name="data.reputation" value="7" dtype="Radio">
      <label for="crew-reputation-7"></label>
      <input type="radio" id="crew-reputation-8" name="data.reputation" value="8" dtype="Radio">
      <label for="crew-reputation-8"></label>
      <input type="radio" id="crew-reputation-9" name="data.reputation" value="9" dtype="Radio" >
      <label for="crew-reputation-9"></label>
      <input type="radio" id="crew-reputation-10" name="data.reputation" value="10" dtype="Radio" >
      <label for="crew-reputation-10"></label>
      <input type="radio" id="crew-reputation-11" name="data.reputation" value="11" dtype="Radio" >
      <label for="crew-reputation-11"></label>
      <input type="radio" id="crew-reputation-12" name="data.reputation" value="12" dtype="Radio" >
      <label for="crew-reputation-12"></label>
      {{/repturf}}
      {{/multiboxes}}
      <div class="gray-label">Turf</div>
    </div>

    {{!-- Coins --}}
    <div id="crew-coins">

      <div id="crew-coins-hands">
        <div class="stripe">
          <label for="crew-coins-hands-0">Coins</label>
        </div>
        <div class="crew-coins coins-hands">
          {{#multiboxes data.coins.value}}
          <input type="radio" id="crew-coins-hands-0" name="data.coins.value" value="0" checked="checked">
          <input type="radio" id="crew-coins-hands-1" name="data.coins.value" value="1">
          <label for="crew-coins-hands-1"></label>
          <input type="radio" id="crew-coins-hands-2" name="data.coins.value" value="2">
          <label for="crew-coins-hands-2"></label>
          <input type="radio" id="crew-coins-hands-3" name="data.coins.value" value="3">
          <label for="crew-coins-hands-3"></label>
          <input type="radio" id="crew-coins-hands-4" name="data.coins.value" value="4">
          <label for="crew-coins-hands-4"></label>
          {{/multiboxes}}
        </div>
      </div>

      {{#if data.vault.max}}
      <div id="crew-coins-vault">
        
        <div class="stripe">
          <label for="crew-coins-vault-0">Vault</label>
        </div>
        <div class="crew-coins coins-vault">
          {{#multiboxes data.vault.value}}
          <input type="radio" id="crew-coins-vault-0" name="data.vault.value" value="0" checked="checked">
          {{#crew_vault_coins data.vault.max}}{{/crew_vault_coins}}
          {{/multiboxes}}
        </div>

      </div>
      {{/if}}
    
    </div>

    {{!-- Heat/Wanted --}}
    <div id="heat-wanted" class="flex-horizontal big-teeth-section">
  
      <div id="crew-heat" class="big-teeth">
        {{#multiboxes data.heat}}
        <input type="radio" id="crew-heat-0" name="data.heat" value="0" dtype="Radio">
        <label class="black-label" for="crew-heat-0">Heat</label>
        <input type="radio" id="crew-heat-1" name="data.heat" value="1" dtype="Radio">
        <label for="crew-heat-1"></label>
        <input type="radio" id="crew-heat-2" name="data.heat" value="2" dtype="Radio">
        <label for="crew-heat-2"></label>
        <input type="radio" id="crew-heat-3" name="data.heat" value="3" dtype="Radio">
        <label for="crew-heat-3"></label>
        <input type="radio" id="crew-heat-4" name="data.heat" value="4" dtype="Radio">
        <label for="crew-heat-4"></label>
        <input type="radio" id="crew-heat-5" name="data.heat" value="5" dtype="Radio">
        <label for="crew-heat-5"></label>
        <input type="radio" id="crew-heat-6" name="data.heat" value="6" dtype="Radio">
        <label for="crew-heat-6"></label>
        <input type="radio" id="crew-heat-7" name="data.heat" value="7" dtype="Radio">
        <label for="crew-heat-7"></label>
        <input type="radio" id="crew-heat-8" name="data.heat" value="8" dtype="Radio">
        <label for="crew-heat-8"></label>
        <input type="radio" id="crew-heat-9" name="data.heat" value="9" dtype="Radio">
        <label for="crew-heat-9"></label>
        {{/multiboxes}}
  
      </div>
      <div id="crew-wanted-container" class="small-teeth-container">
        {{#multiboxes data.wanted}}
        <div id="crew-wanted" class="small-teeth-wrap">
          <label class="black-label" for="crew-wanted-counter-0">Wanted</label>
          <div class="small-teeth">
            <input type="radio" id="crew-wanted-counter-0" name="data.wanted" value="0">
            <input type="radio" id="crew-wanted-counter-1" name="data.wanted" value="1">
            <label for="crew-wanted-counter-1"></label>
            <input type="radio" id="crew-wanted-counter-2" name="data.wanted" value="2">
            <label for="crew-wanted-counter-2"></label>
            <input type="radio" id="crew-wanted-counter-3" name="data.wanted" value="3">
            <label for="crew-wanted-counter-3"></label>
            <input type="radio" id="crew-wanted-counter-4" name="data.wanted" value="4">
            <label for="crew-wanted-counter-4"></label>
          </div>
        </div>
        {{/multiboxes}}
      </div>
  
    </div>
  </section>

  <section class="flex-horizontal">

    <div class="flex-vertical">

      <div id="crew-class" class="class-name">
        {{#each actor.items as |item id|}}
        {{#eq item.type "crew_type"}}
        <div class="big-name">{{item.name}}</div>
        <div class="big-description">{{item.data.description}}</div>
        {{/eq}}
        {{/each}}
      </div>
      <nav class="tabs flex-horizontal">
        <a class="item" data-tab="turfs">Turfs</a>
        <a class="item" data-tab="upgrades">Upgrades</a>
        <a class="item" data-tab="abilities">Abilities</a>
        <a class="item" data-tab="cohorts">Cohorts</a>
        <a class="item" data-tab="notes">Notes</a>
        <a class="item" data-tab="all-items">All Items</a>
      </nav>
    </div>


    {{!-- Crew XP --}}
    <div class="flex-fertical">
      <div class="big-teeth-section">
        <div class="big-teeth">
          <label class="black-label" for="crew-experience-0">Crew XP</label>
          {{#multiboxes data.experience}}
          <input type="radio" id="crew-experience-0" name="data.experience" value="0" dtype="Radio">
          {{#crew_experience}}{{/crew_experience}}
          {{/multiboxes}}
        </div>
      </div>
      <div class="experience-clues-container">
        <div class="experience-clues-description">At the end of each session, for each item below, mark 1 xp (or instead mark 2xp if that item occurred multiple times).</div>
        <div class="experience-clues">
          {{#each actor.items as |item id|}}
          {{#eq item.type "crew_type"}}
          {{html text=item.data.experience_clues}}
          {{/eq}}
          {{/each}}
        </div>
      </div>
    </div>

  </section>

  {{!-- Tabs --}}
  <section class="tab-content">

    {{!-- Turfs --}}
    <div class="tab" data-tab="turfs">
      <div class="label-stripe">
        <p><label>Turfs</label></p>
      </div>
      {{#each actor.items as |item id|}}
      {{#eq item.type "crew_type"}}
      <div class="item" data-item-id="{{item._id}}">
      {{> "systems/blades-in-the-dark/templates/parts/turf-list.html" turfs_data=item.data.turfs can_edit=false}}
      </div>
      {{/eq}}
      {{/each}}
    </div>


    {{!-- Crew Upgrades --}}
    <div id="crew-upgrades" class="tab grow-two flex-vertical" data-tab="upgrades">
      <div class="label-stripe">
        <p><label>Crew Upgrades</label></p>
      </div>
      {{#each actor.items as |item id|}}
      {{#eq item.type "crew_upgrade"}}
        <div class="item flex-horizontal" data-item-id="{{item._id}}">
          <div class="item-body item-sheet-open flex-horizontal">
            <b><div class="item-name">{{item.name}}</div></b>
            <div class="item-description">{{item.data.description}}</div>
          </div>
          <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
        </div>
      {{/eq}}
      {{/each}}
    </div>

    {{!-- Crew Abilities --}}
    <div id="crew-abilities" class="tab grow-two flex-vertical" data-tab="abilities">
      <div class="label-stripe">
        <p><label>Special Abilities</label></p>
      </div>
      {{#each actor.items as |item id|}}
      {{#eq item.type "crew_ability"}}
        <div class="item flex-horizontal" data-item-id="{{item._id}}">
          <div class="item-body item-sheet-open flex-horizontal">
            <b><div class="item-name">{{item.name}}</div></b>
            <div class="item-description">{{item.data.description}}</div>
          </div>
          <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
        </div>
      {{/eq}}
      {{/each}}
    </div>

    {{!-- Cohorts --}}
    <div id="crew-cohorts" class="tab grow-two flex-vertical" data-tab="cohorts">
      <div class="label-stripe flex-horizontal">
        <p>Cohorts</p>
        <p><a class="add-item" data-item-type="cohort"><i class="fas fa-plus-square"></i></a></p>
      </div>
      <div class="cohorts flex-horizontal">
        {{#each actor.items as |item id|}}
          {{#eq item.type "cohort"}}
          
            {{> "systems/blades-in-the-dark/templates/parts/cohort-block.html" item=item}}
    
          {{/eq}}
        {{/each}}
      </div>
    </div>

    {{!-- Notes --}}
    <div id="notes" class="tab grow-two flex-vertical" data-tab="notes">
      <div class="label-stripe">
        <p>Notes</p>
      </div>
      <textarea rows="15" name="data.description">{{{data.description}}}</textarea>
    </div>

    {{!-- Full Item List --}}
    <div class="tab grow-two flex-vertical" data-tab="all-items">
      <div class="label-stripe">
        <p><label>All Items</label></p>
      </div>
      {{#each actor.items as |item id|}}
      <div class="item flex-horizontal" data-item-id="{{item._id}}">
        <div class="item-body item-sheet-open flex-horizontal">
          <img src="{{item.img}}" title="{{item.name}}" width="24" height="24"/>
          <div class="item-name">{{item.name}}</div>
        </div>
        <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
      </div>
      {{/each}}
    </div>

  </section>


</form>