<form class="{{cssClass}}" autocomplete="off">

    {{!-- Sheet Header --}}
    <header class="sheet-header">
      <div class="header-fields">
        <div class="flexrow">
          <img class="profile-img" src="{{img}}" data-edit="img" title="{{name}}" />
          <h1 class="charname"><input name="name" type="text" value="{{name}}" placeholder="Name"/></h1>
        </div>
      </div>
    </header>

    {{!-- Sheet Tab Navigation --}}
    <nav class="sheet-tabs tabs" data-group="primary">
        <a class="item" data-tab="attribute">Main</a>
        <a class="item" data-tab="defence">Defence/Weapons</a>
        <a class="item" data-tab="equipment">Equipment</a>
        <a class="item" data-tab="notes">Notes</a>
    </nav>

    {{!-- Sheet Body --}}
    <section class="sheet-body">

        {{!-- Carac Tab --}}
        <div class="tab items" data-group="primary" data-tab="attribute">
          <span><a class="lock-unlock-sheet"><img class="small-button-container" 
            src="systems/fvtt-fragged-kingdom/images/icons/{{#if editScore}}unlocked.svg{{else}}locked.svg{{/if}}" alt="Unlocked/Locked"
            >{{#if editScore}}Unlocked{{else}}Locked{{/if}}</a>
          </span>
          <div class="grid grid-2col">
            <div class="">

              <span class="generic-label"><h3>Type</h3>
              <select class="competence-base flexrow" type="text" name="data.npctype" value="{{data.npctype}}" data-dtype="String" {{#unless @root.editScore}}disabled{{/unless}}>
                {{#select data.npctype}}
                <option value="henchman">Henchman</option>
                <option value="drone">Troop</option>
                {{/select}}
              </select> </span>

              <button class="npc-skill-roll">Generic Skill roll</button>

              <div>
              <span class="generic-label"><h3>Traits List</h3></span>
              <ul>
                {{#each traits as |trait key|}}
                <li class="item flexrow list-item" data-item-id="{{trait.id}}">
                  <img class="sheet-competence-img" src="{{trait.img}}"/>
                  <span class="competence-label">{{trait.name}}</span>
                  <span class="competence-label">{{trait.data.data.type}}</span>
                  <div class="item-controls">
                    <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
                    <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
                  </div>
                </li>                  
                {{/each}}
              </ul> 
            </div>

            </div>

            <div class="">
              <span class="generic-label"><h3>Stats & Numbers</h3></span>
              <ul>
                {{#each data.spec as |spec key|}}
                <li class="item flexrow list-item stack-left" data-attr-key="{{key}}">
                  <span class="stat-label padd-right npc-stat-label" name="{{key}}">{{spec.label}}</span>
                  <input type="text" class="input-numeric-short padd-right" name="data.spec.{{key}}.value" value="{{spec.value}}" data-dtype="Number" {{#unless @root.editScore}}disabled{{/unless}}/>
                </li>
                {{/each}}
              </ul>    
            </div>

          </div>
        </div>
        

      {{!-- Defence Tab --}}
      <div class="tab defence" data-group="primary" data-tab="defence">
        <div class="flexcol">

          <div class="">     
            {{#each data.fight as |fight key|}}   
            <ul>
              <li class="item flexrow list-item stack-left">
                <span class="stat-label padd-right"><strong>{{fight.label}}</strong></span>                
                <input type="text" class="input-numeric-short padd-right" name="data.fight.{{key}}.value" value="{{fight.value}}" data-dtype="Number"/>
              </li>
              {{#each fight.derivated as |derivated keydev|}}   
              <li class="item flexrow list-item">
                <span class="stat-label flexrow ">{{derivated.label}}</span>
                <input type="text" class="input-numeric-short padd-right"  name="data.fight.{{key}}.derivated.{{keydev}}.value" value="{{derivated.value}}" data-dtype="Number"/>
              </li>
              {{/each}}
            </ul>    
            {{/each}}
          </div>

          <span class="generic-label"><h3>Weapons</h3></span>
          <ul class="stat-list alternate-list">
            {{#each weapons as |weapon key|}}
            <li class="item stat flexrow list-item" data-arme-id="{{weapon.id}}" data-item-id="{{weapon.id}}">
              <img class="sheet-competence-img" src="{{weapon.img}}"/>
              <span class="stat-label">{{weapon.name}}</span>
              <div class="item-controls">
                <a class="item-control item-equip" title="Worn">{{#if weapon.data.data.equipped}}<i class="fas fa-circle"></i>{{else}}<i class="fas fa-genderless"></i>{{/if}}</a>
                <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
                <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
              </div>
            </li>
            <li class="item stat flexrow list-item stats-table" data-armure-id="{{weapon.id}}" data-item-id="{{weapon.id}}">
              {{#each weapon.data.data.weaponstats as |weaponstat statkey|}}
              <ul>
                <li class="item stat flexrow list-item" data-item-id="{{weapon.id}}" data-stat-id={{statkey}}><span class="stat-label weapon-label"><a name="{{weapon.name}}">Attack with {{weaponstat.name}}</a></span>
                </li>
                <li>{{> "systems/fvtt-fragged-kingdom/templates/weapon-stats-section.html" stats=weaponstat.data.statstotal isfinal=false header=true}}
                </li>
              </ul>
              {{/each}}
            </li>
            {{/each}}                
          </ul>          

        </div>
      </div>

      {{!-- Traits Tab --}}
      <div class="tab traits" data-group="primary" data-tab="traits">


    </div>

      {{!-- Features Tab --}}
      <div class="tab equipment" data-group="primary" data-tab="equipment">
        <div class="flexcol">

          <div><h4>Equipment</h4></div>
          <ul class="item-list alternate-list">
            <li class="item flexrow list-item">
              <span class="equipement-label">Name</span>
              <span class="equipement-label">Type</span>
              <div class="item-controls">
                <span class="equipement-label">&nbsp;</span>
                <span class="equipement-label">&nbsp;</span>
                <span class="equipement-label">&nbsp;</span>
              </div>
            </li>
            {{#each equipments as |equip key|}}
            <li class="item flexrow list-item" data-item-id="{{equip.id}}">
              <img class="sheet-competence-img" src="{{equip.img}}"/>
              <span class="equipement-label">{{equip.name}}</span>
              <span class="equipement-label">{{equip.type}}</span>
              <div class="item-controls">
                <a class="item-control item-equip" title="Worn">{{#if equip.data.data.equipped}}<i class="fas fa-circle"></i>{{else}}<i class="fas fa-genderless"></i>{{/if}}</a>
                <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
                <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
              </div>
            </li>                  
          {{/each}}
          </ul>

        </div>
      </div>

      {{!-- Notes Tab --}}
      <div class="tab notes" data-group="primary" data-tab="notes">        
        <article class="flexcol">
          <h3>Description : </h3>
          <div class="form-group editor">
            {{editor content=data.description target="data.description" button=true owner=owner editable=editable}}
          </div>
          <hr>
          <h3>Notes : </h3>
          <div class="form-group editor">
            {{editor content=data.notes target="data.notes" button=true owner=owner editable=editable}}
          </div>
          <hr>
          {{>"systems/fvtt-fragged-kingdom/templates/editor-notes-gm.html"}}
        </article>
      </div>

    </section>
</form>