<form autocomplete="off" class="prototype lancer-content-manager">
  <div class="flexcol">
    {{! Update core data }}
    {{#if coreUpdate}}
      <div class="card clipped flexcol">
        <div class="lancer-header lancer-primary major">Official LANCER Content</div>
        <div class="form fields flexrow" style="align-items: center">
          <span style="margin: 5px 10px">
            {{#if coreVersion}}
              Core Data is at v{{coreVersion}}
            {{else}}
              Core Data has not been built yet
            {{/if}}
          </span>
          {{#if (ne coreVersion coreUpdate)}}
            <button
              type="button"
              class="lcp-core-update"
              title="Update Core Data"
              tabindex="-1"
              style="margin: 5px 10px"
            >
              <i class="cci cci-content-manager i--m"></i>
              Update to v{{coreUpdate}}
            </button>
          {{else}}
            <button
              type="button"
              class="lcp-core-update"
              title="Rebuild Core Data"
              tabindex="-1"
              style="margin: 5px 10px"
            >
              <i class="cci cci-content-manager i--m"></i>
              Rebuild Core Data
            </button>
          {{/if}}
        </div>
        {{! Official LCPs }}
        <div class="massif-content-table">
          {{#each officialData as |pack|}}
            <input class="massif-content-checkbox" name="{{pack.id}}" checked type="checkbox" />
            <span class="massif-content-label" style="margin: 5px 10px">{{pack.name}}</span>
            <span class="massif-content-curr-version" style="margin: 5px 10px">{{pack.version}}</span>
            <span class="massif-content-icon" style="margin: 5px 10px"><i class="fas fa-arrow-right"></i></span>
            <span class="massif-content-avail-version" style="margin: 5px 10px">{{pack.version}}</span>
          {{/each}}
        </div>
      </div>
    {{/if}}

    {{! Import New LCP }}
    <div class="lcp-importer card clipped">
      <div class="lancer-header lancer-primary major" style="grid-area: 1/1/2/3;">Import/Update LCP</div>
      <input id="lcp-file" type="file" name="lcp-up" class="lcp-up" accept=".lcp" />
      {{! New LCP Manifest }}
      {{#if manifest}}
        <div class="card clipped flexcol" style="grid-column: 1/3;">
          <div class="lancer-header lancer-primary major">{{manifest.name}} v{{manifest.version}}</div>
          {{#if manifest.website}}
            <a href="{{manifest.website}}" class="medium" style="margin: 5px;">by {{manifest.author}}</a>
          {{else}}
            <div class="major" style="margin: 10px;">by {{manifest.author}}</div>
          {{/if}}
          <button type="button" class="lcp-import" title="Import LCP" tabindex="-1">
            <i class="cci cci-content-manager i--m"></i>
            <label>Import LCP</label>
          </button>
          <div class="flexrow" style="margin: 5px;">
            {{#if manifest.description}}
              <div class="minor desc-text">
                {{{manifest.description}}}
                <p>This LCP contains:
                  <ul>
                    {{#if manifest.skills}}
                      <li><span class="lcp-manifest-badge">{{manifest.skills}}</span> pilot skills</li>
                    {{/if}}
                    {{#if manifest.talents}}
                      <li><span class="lcp-manifest-badge">{{manifest.talents}}</span> talents</li>
                    {{/if}}
                    {{#if manifest.gear}}
                      <li><span class="lcp-manifest-badge">{{manifest.gear}}</span> pilot gear</li>
                    {{/if}}
                    {{#if manifest.frames}}
                      <li><span class="lcp-manifest-badge">{{manifest.frames}}</span> frames</li>
                    {{/if}}
                    {{#if manifest.systems}}
                      <li><span class="lcp-manifest-badge">{{manifest.systems}}</span> mech systems</li>
                    {{/if}}
                    {{#if manifest.weapons}}
                      <li><span class="lcp-manifest-badge">{{manifest.weapons}}</span> mech weapons</li>
                    {{/if}}
                    {{#if manifest.mods}}
                      <li><span class="lcp-manifest-badge">{{manifest.mods}}</span> weapon mods</li>
                    {{/if}}
                    {{#if manifest.tags}}
                      <li><span class="lcp-manifest-badge">{{manifest.tags}}</span> tags</li>
                    {{/if}}
                    {{#if manifest.statuses}}
                      <li><span class="lcp-manifest-badge">{{manifest.statuses}}</span> statuses/conditions</li>
                    {{/if}}
                    {{#if manifest.npc_classes}}
                      <li><span class="lcp-manifest-badge">{{manifest.npc_classes}}</span> NPC classes</li>
                    {{/if}}
                    {{#if manifest.npc_templates}}
                      <li><span class="lcp-manifest-badge">{{manifest.npc_templates}}</span> NPC templates</li>
                    {{/if}}
                    {{#if manifest.npc_features}}
                      <li><span class="lcp-manifest-badge">{{manifest.npc_features}}</span> NPC features</li>
                    {{/if}}
                  </ul>
                </p>
              </div>
            {{/if}}
            {{#if manifest.image_url}}
              <img
                src="{{manifest.image_url}}"
                title="{{manifest.name}}"
                style="max-width: 400px; max-height: 400px;"
              />
            {{/if}}
          </div>
        </div>
      {{/if}}
    </div>

    {{! List installed LCPs }}
    <div class="card clipped-top">
      <div class="lancer-header lancer-primary major">Imported LCPs</div>
      <div class="flexrow">
        <table class="lcp-index">
          <tr class="lcp-index-header">
            <th class="lcp-index">Name</th>
            <th class="lcp-index">Author</th>
            <th class="lcp-index">Version</th>
          </tr>
          {{#if lcps}}
            {{#each lcps.index as |lcp key|}}
              {{#if lcp.name}}
                <tr data-id="{{key}}">
                  <td class="lcp-index">{{lcp.name}}</td>
                  <td class="lcp-index">{{lcp.author}}</td>
                  <td class="lcp-index">{{lcp.version}}</td>
                </tr>
              {{/if}}
            {{/each}}
          {{/if}}
        </table>
      </div>
    </div>

    <div class="flexrow medium">
      <button type="button" class="lcp-clear-all" title="Clear Compendiums" tabindex="-1" style="margin: 5px 10px">
        <i class="cci cci-content-manager i--m"></i>
        Clear LANCER Compendium Data
      </button>
    </div>

  </div>
</form>