<section class="header">
  <h3>
    {{action-menu model=model classNames="pull-right"}}
    <div class="state {{model.stateColor}}">
      <i class="{{model.stateIcon}}"></i> {{model.displayState}}
    </div>
    <span class="right-divider">{{#link-to "hosts"}}Hosts:{{/link-to}} {{model.displayName}}</span>
    {{#link-to "containers.new" (query-params hostId=model.id) classNames="btn btn-sm btn-primary right-divider-btn"}}Add Container{{/link-to}}
  </h3>
  {{partial "description"}}
</section>

<section>
  {{#info-multi-stats model=model linkName="hostStats" single=true}}
    <ul class="list-lines">
      {{#if model.showTransitioningMessage}}
        <li>
          <label>Message</label>
          <span class="force-wrap {{model.stateColor}}">
            {{model.transitioningMessage}}
          </span>
        </li>
      {{/if}}

      <li>
        <label>IP Address</label>
        {{model.displayIp}} {{zero-clipboard text=model.displayIp}}
      </li>

      {{#if model.machine}}
        <li>
          <label>Provider</label>
          {{model.machine.driver}}
        </li>
      {{/if}}

      {{#if model.cpuBlurb}}
        <li>
          <label>CPU</label>
          {{model.cpuBlurb}}{{#if model.cpuTooltip}} <i class="icon icon-info" tooltip="{{model.cpuTooltip}}"></i>{{/if}}
        </li>
      {{/if}}

      {{#if model.memoryBlurb}}
        <li>
          <label>Memory</label>
          {{model.memoryBlurb}}
        </li>
      {{/if}}

      {{#if model.diskBlurb}}
        <li>
          <label>Storage</label>
          {{#if model.diskDetail}}
            {{#each model.diskDetail as |disk|}}
              <span style="display: inline-block; padding-right: 10px;">{{disk.value}} <i class="icon icon-info" tooltip="{{disk.label}}"></i></span>
            {{/each}}
          {{else}}
            {{model.diskBlurb}} (total)
          {{/if}}
        </li>
      {{/if}}

      {{#if model.osDetail}}
        <li>
          <label>OS</label>
          {{model.osDetail}}
        </li>
      {{/if}}

      {{#if model.info.osInfo.kernelVersion}}
        <li>
          <label>Kernel</label>
          {{model.info.osInfo.kernelVersion}}
        </li>
      {{/if}}

      {{#if model.dockerBlurb}}
        <li>
          <label>Docker</label>
          {{model.dockerBlurb}}
        </li>
      {{/if}}

      <li>
        <label>Labels</label>
        {{#if userLabelArray.length}}
          {{#each userLabelArray as |label|}}
            <span class="label label-default clip" style="display: inline-block; max-width: 100%;">{{label.key}}{{#if label.value}}={{label.value}}{{/if}}</span>
          {{/each}}
        {{else}}
          <span class="text-muted">None</span>
        {{/if}}
      </li>
    </ul>
  {{/info-multi-stats}}
</section>

<section>
  <ul class="nav nav-tabs nav-tabs-well">
    {{#link-to "host.containers" tagName="li" href=false}}<a><i class="icon icon-box"></i> Containers</a>{{/link-to}}
    {{#link-to "host.storage" tagName="li" href=false}}<a><i class="icon icon-hdd"></i> Storage</a>{{/link-to}}
  </ul>
  <div class="well nav-well">
    {{outlet}}
  </div>
</section>
