{{! vim: set ft=html.handlebars ts=2 sw=2 et : }}

<form class="{{cssClass}} flexcol" autocomplete="off">
  <header class="sheet-header flexrow">
    <img class="profile" src="{{actor.img}}" title="{{actor.name}}" alt="{{actor.name}}"
                                                                    data-edit="img">
    <section class="header-details flexrow">
      <h1 class="charnam">
        <input name="name" type="text" value="{{actor.name}}"
                                       placeholder="{{localize 'DND5E.Name'}}">
      </h1>
      <ul class="summary flexrow">
        <li>
          <span>{{lookup wjmais.actorSizes system.traits.size}}</span>
        </li>
        <li>
          <span>{{lookup wjmais.shipClass system.traits.size}}</span>
        </li>
        <li>
          <input class="wjmais-model" type="text" name="actor.flags.wjmais.model"
                                                  value="{{actor.flags.wjmais.model}}"
                                                  placeholder="{{localize 'WJMAIS.Model'}}">
        </li>
        <li>
          <input type="text" name="system.source.custom"
                             value="{{system.source.custom}}"
                             placeholder="{{localize 'DND5E.SOURCE.FIELDS.source.label'}}">
        </li>
      </ul>
      <ul class="attributes flexrow">
        <li class="attribute health">
          <h4 class="attribute-name box-title">{{localize 'WJMAIS.HullPoints'}}</h4>
          <div class="attribute-value multiple">
            <input name="system.attributes.hp.value" type="text" placeholder="&mdash;"
                                                               value="{{system.attributes.hp.value}}" data-dtype="Number">
            <span class="sep"> &sol; </span>
            <input name="system.attributes.hp.max" type="text" placeholder="&mdash;"
                                                             value="{{system.attributes.hp.max}}" data-dtype="Number">
          </div>
        </li>
        <li class="attribute health">
          <h4 class="attribute-name box-title">{{localize 'WJMAIS.BulwarkPoints'}}</h4>
          <div class="attribute-value multiple">
            <input class="temphp" name="system.attributes.hp.temp" type="text" placeholder="&mdash;"
                                                                             value="{{system.attributes.hp.temp}}" data-dtype="Number">
            <span class="sep"> &sol; </span>
            <input class="temphp" name="system.attributes.hp.tempmax" type="text" placeholder="&mdash;"
                                                                                value="{{system.attributes.hp.tempmax}}" data-dtype="Number">
          </div>
        </li>
        <li class="attribute armor">
          <h4 class="attribute-name box-title">
            {{ localize "DND5E.ArmorClass" }}
            <a class="armor-config-button" data-action="armor" title="{{localize 'DND5E.ArmorConfig'}}"><i class="fas fa-cog"></i></a>
          </h4>
          <div class="attribute-value" data-attribution="attributes.ac">
            <span>{{system.attributes.ac.value}}</span>
          </div>
        </li>
        <li class="attribute speed">
          <h4 class="attribute-name box-title">
            {{ localize "WJMAIS.Speed" }}
            <a class="speed-config-button" data-action="speed" title="{{localize 'WJMAIS.SpeedConfig'}}"><i class="fas fa-cog"></i></a>
          </h4>
          <div class="attribute-value">
            <span>{{flags.wjmais.speed.tactical}} ({{flags.wjmais.speed.mnv}}&deg;)</span>
          </div>
        </li>
      </ul>
    </section>
  </header>

  <nav class="sheet-navigation tabs" data-group="primary">
    <a class="item active" data-tab="attributes">{{localize 'DND5E.Attributes'}}</a>
    <a class="item" data-tab="features">{{localize 'DND5E.Features'}}</a>
    <a class="item" data-tab="cargo">{{localize 'DND5E.VehicleCargoCrew'}}</a>
    <a class="item" data-tab="effects">{{ localize "DND5E.Effects" }}</a>
    <a class="item" data-tab="biography">{{localize 'DND5E.Description'}}</a>
  </nav>

  <section class="sheet-body">
    <div class="tab attributes flexrow" data-group="primary" data-tab="attributes">
      {{#if isNPC}}
        <ul class="ability-scores flexrow">
        {{#each abilities as |ability id|}}
          <li class="ability" data-ability="{{id}}">
            <h4 class="ability-name box-title rollable">{{ability.label}}</h4>
            <input type="text" name="system.abilities.{{id}}.value" value="{{ability.value}}" class="ability-score"  placeholder="0" data-dtype="Number">
            <div class="ability-modifiers flexrow">
              <span class="ability-mod" data-tooltip="DND5E.Modifier">
                {{numberFormat ability.mod decimals=0 sign=true}}
              </span>
            </div>
          </li>
        {{/each}}
        </ul>
      {{/if}}
      {{#unless isNPC}}
        <section class="center-pane flexcol">
          <h4 class="attribute-name box-title">{{localize 'WJMAIS.BridgeCrewRoles'}}</span>
          {{> "wjmais.bridge-crew-roles" sections=roles}}
        </section>
      {{/unless}}
      <section class="center-pane flexcol">
        {{#if isGM}}
          <div class="counters">
            <div class="counter flexrow npc-toggle">
              <h4>Mode</h4>
              <div class="counter-value">
                <label class="checkbox">
                  {{localize 'WJMAIS.NPCShip'}}
                  <input class="npc-toggle" type="checkbox" name="flags.wjmais.npc" data-dtype="Boolean" {{checked flags.wjmais.npc}}>
                </label>
              </div>
            </div>
          </div>
        {{/if}}
        <div class="counters">
          <div class="counter flexrow crew-min-max">
            <h4>{{localize 'WJMAIS.CrewMinMax'}}</h4>
            <div class="counter-value">
              <input class="wjmais-crew-min" type="number"
                                             placeholder="&mdash;" name="flags.wjmais.crew.min"
                                                                   data-dtype="Number" value="{{flags.wjmais.crew.min}}">
              <span class="sep"> &sol; </span>
              <input class="wjmais-crew-max" type="number"
                                             placeholder="&mdash;" name="flags.wjmais.crew.max"
                                                                   data-dtype="Number" value="{{flags.wjmais.crew.max}}">
            </div>
          </div>
          <div class="counter flexrow air">
            <h4>{{localize 'WJMAIS.DaysOfAir'}}</h4>
            <div class="counter-value">
              <input class="wjmais-air" type="number"
                                                      placeholder="&mdash;" name="flags.wjmais.air"
                                                                            data-dtype="Number" value="{{flags.wjmais.air}}">
            </div>
          </div>
          <div class="counter flexrow cargo-cap">
            <h4>{{localize 'WJMAIS.CargoHold'}}</h4>
            <div class="counter-value">
              <input class="wjmais-cargo-hold" type="number"
                                               placeholder="&mdash;" name="flags.wjmais.cargo"
                                                                     data-dtype="Number" value="{{flags.wjmais.cargo}}">
            </div>
          </div>
          <div class="counter flexrow hardpoints">
            <h4>{{localize 'WJMAIS.Hardpoints'}}</h4>
            <div class="counter-value">
              <input class="wjmais-hardpoints-sm" type="number"
                                                  placeholder="0" name="flags.wjmais.hardpoints.sm"
                                                                  data-dtype="Number" value="{{flags.wjmais.hardpoints.sm}}">
              <span>Small</span>
              <span class="sep"> &sol; </span>
              <input class="wjmais-hardpoints-med" type="number"
                                                   placeholder="0" name="flags.wjmais.hardpoints.med"
                                                                   data-dtype="Number" value="{{flags.wjmais.hardpoints.med}}">
              <span>Medium</span>
              <span class="sep"> &sol; </span>
              <input class="wjmais-hardpoints-lg" type="number"
                                                  placeholder="0" name="flags.wjmais.hardpoints.lg"
                                                                  data-dtype="Number" value="{{flags.wjmais.hardpoints.lg}}">
              <span>Large</span>
            </div>
          </div>
        </div>
        <div class="traits">
          <div class="form-group">
            <label>{{localize "DND5E.Size"}}</label>
            <select class="actor-size" name="system.traits.size">
              {{selectOptions wjmais.actorSizes selected=system.traits.size localize=true}}
            </select>
          </div>
          <div class="form-group {{traits.traits.lt.cssClass}}">
            <label>{{localize "WJMAIS.LandingTypes"}}</label>
            <a class="trait-selector" data-trait="lt"
            data-tooltip="{{localize 'DND5E.TraitConfig' trait=(localize 'WJMAIS.LandingTypes')}}" tabindex="0">
              <i class="fas fa-edit"></i>
            </a>
            <ul class="traits-list">
              {{#each traits.traits.lt.selected as |v k|}}
                <li class="tag {{k}}">{{v}}</li>
              {{/each}}
            </ul>
          </div>
        </div>
      </section>
    </div>

    <div class="tab features flexcol" data-group="primary" data-tab="features">
      {{> "wjmais.actor-features" sections=features}}
    </div>

    <div class="tab cargo flexcol" data-group="primary" data-tab="cargo">
      {{> "dnd5e.inventory" sections=cargo}}
    </div>

    <div class="tab effects flexcol" data-group="primary" data-tab="effects">
      {{> "dnd5e.active-effects"}}
    </div>

    <div class="tab biography flexcol" data-group="primary" data-tab="biography">
      {{editor biographyHTML target='system.details.biography.value' button=true editable=editable engine="prosemirror" collaborate=false}}
    </div>
  </section>
</form>