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

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

    {{!-- Sheet Tab Navigation --}}
    <nav class="sheet-tabs tabs" data-group="primary">
        <a class="item" data-tab="stats">{{localize 'SHEET.TabStats'}}</a>
        <a class="item" data-tab="skills">{{localize 'SHEET.TabSkills'}}</a>
        <a class="item" data-tab="fight">{{localize 'SHEET.TabFight'}}</a>
        <a class="item" data-tab="gears">{{localize 'SHEET.TabGears'}}</a>
        <a class="item" data-tab="description">{{localize 'SHEET.TabDescription'}}</a>
    </nav>

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

        {{!-- Carac Tab --}}
        <div class="tab items" data-group="primary" data-tab="stats">
          <div class="grid grid-2col">
            <div class="flex-group-left flexcol">
              <span><a class="lock-unlock-sheet"><img class="small-button-container" 
                src="systems/foundryvtt-shadows-over-sol/img/icons/{{#if data.editStatSkill}}unlocked.svg{{else}}locked.svg{{/if}}" alt="lock/unlock"
                >{{#if data.editStatSkill}}Lock{{else}}Unlock{{/if}}</a></span>
              <ul class="stat-list alternate-list">
                {{#each data.stats as |stat key|}}
                    {{#if stat.isLevelUp}}
                    <li class="stat flexrow xp-level-up" data-attribute="{{key}}">
                      <span class="stat-label flexrow tooltip tooltip-nobottom" name="data.stats.{{key}}.label">
                        <span class="tooltiptext ttt-xp">
                          {{localize 'STAT.levelUp'}}
                      </span>
                      {{else}}
                      <li class="stat flexrow list-item" data-attribute="{{key}}">
                      {{/if}}
                      <span class="stat-label flexrow tooltip tooltip-nobottom" name="data.stat.{{key}}.label"><a name={{key}}>{{localize stat.label}}</a></span>
                      <select class="stat-value flexrow" type="text" name="data.stats.{{key}}.value" value="{{stat.value}}" data-dtype="Number" {{#unless @root.data.editStatSkill}}disabled{{/unless}}>
                        {{#select stat.value}}
                        {{>"systems/foundryvtt-shadows-over-sol/templates/stat-option-list.html"}}
                        {{/select}}
                      </select>     
                      <input class="stat-xp flexrow" type="text" name="data.stats.{{key}}.xp" value="{{stat.xp}}" data-dtype="Number" {{#unless @root.data.editStatSkill}}disabled{{/unless}} />
                      <span class="flexrow"><img class="cardsuit-img" src="systems/foundryvtt-shadows-over-sol/img/cards/{{stat.cardsuit}}.webp" /></span>
                      </li>
                {{/each}}
              </ul>          
            </div>
            <div class="flex-group-left flexcol">
              <ul class="stat-list alternate-list">
                {{#each data.scores as |score key|}}
                  <li class="stat flexrow list-item" data-attribute="{{key}}">
                    <span class="generic-label flexrow tooltip tooltip-nobottom" name="data.scores.{{key}}.label">{{localize score.label}}</span>                    
                    <input class="stat-value flexrow" type="text" name="data.scores.{{key}}.value" value="{{score.value}}" data-dtype="Number" {{#unless @root.data.editStatSkill}}disabled{{/unless}} />
                    {{#if (eq key 'defense')}}
                    <input class="stat-value flexrow" type="text" name="data.scores.{{key}}.critical" value="{{score.critical}}" data-dtype="Number" {{#unless @root.data.editStatSkill}}disabled{{/unless}} />
                    {{/if}}
                    {{#if (eq key 'edge')}}
                    <input class="stat-value flexrow" type="text" name="data.scores.{{key}}.bonus" value="{{score.bonus}}" data-dtype="Number" {{#unless @root.data.editStatSkill}}disabled{{/unless}} />
                    {{/if}}
                  </li>
                {{/each}}
              </ul>          
            </div>
          </div>
          
          <div>
            <span class="edge-name">Edge cards</span><a class="edge-draw">Draw edge cards</a>
              {{#each data.edgecard as |card key|}}
              <img class="card-img" src="{{card.path}}" data-edit="img" title="{{card.cardName}}" />
              {{/each}}
            </span>              
          </div>

        </div>
        
        {{!-- Skills Tab --}}
        <div class="tab skills" data-group="primary" data-tab="skills">
          <div class="flexrow">
            <span><a class="lock-unlock-sheet"><img class="small-button-container" 
              src="systems/foundryvtt-shadows-over-sol/img/icons/{{#if data.editStatSkill}}unlocked.svg{{else}}locked.svg{{/if}}" alt="lock/unlock"
              >{{#if data.editStatSkill}}Lock{{else}}Unlock{{/if}}</a></span>
          </div>
          
          <span class="generic-label">Skills</span>
          <div class="grid grid-2col">

          <div class="flex-group-left flexcol skill-column">
            <ul class="item-list alterne-list">
              {{#each data.skill1 as |skill key|}}
                {{#if skill.data.isLevelUp}}
                <li class="item flexrow xp-level-up" data-item-id="{{skill._id}}">
                {{else}}
                <li class="item flexrow list-item" data-item-id="{{skill._id}}">
                {{/if}}
                  <img class="sheet-skill-img" src="{{skill.img}}"/>
                  {{#if skill.data.isLevelUp}}
                  <span class="skill-label tooltip tooltip-nobottom">
                    <span class="tooltiptext ttt-xp">
                    </span>
                  <a name={{key}}>{{skill.name}}</a></span>
                  {{else}}                          
                  <span class="skill-label"><a>{{skill.name}}</a></span>
                  {{/if}}
                  <input class="skill-value" type="text" compname="{{skill.name}}" value="{{numberFormat skill.data.value decimals=0}}" data-dtype="number" {{#unless @root.data.editStatSkill}}disabled{{/unless}}/>
                  <input class="skill-xp" type="text" compname="{{skill.name}}" value="{{skill.data.xp}}" data-dtype="number" {{#unless @root.data.editStatSkill}}disabled{{/unless}}/>
                  <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 class="flex-group-left flexcol skill-column">
            <ul class="item-list alterne-list">
              {{#each data.skill2 as |skill key|}}
                {{#if skill.data.isLevelUp}}
                <li class="item flexrow xp-level-up" data-item-id="{{skill._id}}">
                {{else}}
                <li class="item flexrow list-item" data-item-id="{{skill._id}}">
                {{/if}}
                  <img class="sheet-skill-img" src="{{skill.img}}"/>
                  {{#if skill.data.isLevelUp}}
                  <span class="skill-label tooltip tooltip-nobottom">
                    <span class="tooltiptext ttt-xp">
                    </span>
                  <a name={{key}}>{{skill.name}}</a></span>
                  {{else}}                          
                  <span class="skill-label"><a>{{skill.name}}</a></span>
                  {{/if}}
                  <input class="skill-value" type="text" compname="{{skill.name}}" value="{{numberFormat skill.data.value decimals=0}}" data-dtype="number" {{#unless @root.data.editStatSkill}}disabled{{/unless}}/>
                  <input class="skill-xp" type="text" compname="{{skill.name}}" value="{{skill.data.xp}}" data-dtype="number" {{#unless @root.data.editStatSkill}}disabled{{/unless}}/>
                  <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>

        {{!-- Fight Tab --}}
        <div class="tab fight" data-group="primary" data-tab="fight">
          <ul class="item-list alternate-list">
          </ul>
        </div>

        {{!-- Gears Tab --}}
        <div class="tab gears" data-group="primary" data-tab="gears">
          <div class="flex-group-left flexcol competence-column">
          </div>
        </div>


      {{!-- Biography Tab --}}
      <div class="tab biography" data-group="primary" data-tab="description">        
        <article class="flexrow">          
          <ul class="item-list alternate-list">
            <li class="item flexrow list-item">
              <label class="description-label generic-label">Geneline : </label>
              <label class="description-label generic-label item-link"><a data-item-id="{{data.geneline._id}}">{{data.geneline.name}}</a></label>
            </li>
            <li class="item flexrow list-item">
              <label class="description-label generic-label">Subculture : </label>
              <label class="description-label generic-label item-link"><a data-item-id="{{data.subculture._id}}">{{data.subculture.name}}</a></label>
            </li>
            <li class="item flexrow list-item">
              <label class="description-label stat-label">Genre : </label>
              <input class="description-value flexrow" type="text" name="data.sex" value="{{data.sex}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label class="description-label stat-label">Weight : </label>
              <input class="description-value flexrow" type="text" name="data.weight" value="{{data.weight}}" data-dtype="String"/>              
            </li>
            <li class="item flexrow list-item">
              <label class="description-label stat-label">Size : </label>
              <input class="description-value flexrow" type="text" name="data.taille" value="{{data.taille}}" data-dtype="String"/>
            </li>
          </ul>
          <ul class="item-list alterne-list">
            <li class="item flexrow list-item">
              <label class="description-label stat-label">Hair : </label>
              <input class="description-value flexrow" type="text" name="data.hair" value="{{data.hair}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label class="description-label stat-label">Eyes : </label>
              <input class="description-value flexrow" type="text" name="data.eyes" value="{{data.eyes}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label class="description-label stat-label">Age : </label>
              <input class="description-value flexrow" type="text" name="data.age" value="{{data.age}}" data-dtype="String"/>
            </li>
          </ul>
        </article>

        <article class="flexcol">
          <h3>Biography : </h3>
          <div class="form-group medium-editor">
            {{editor content=data.biography target="data.biography" button=true owner=owner editable=editable}}
          </div>
          <h3>Notes : </h3>
          <div class="form-group medium-editor">
            {{editor content=data.notes target="data.notes" button=true owner=owner editable=editable}}
          </div>
          {{>"systems/foundryvtt-shadows-over-sol/templates/editor-notes-gm.html"}}
        </article>
      </div>

    </section>
</form>