<div class="row form-group">
  <div class="col-sm-12 col-md-2 form-label">
    <label class="form-control-static">Volumes</label>
  </div>

  <div class="col-sm-12 col-md-8">
    <div class="form-control-static">
      <button class="btn-circle-plus" {{action "addVolume" target="view"}}></button>
    </div>
    {{#if volumesArray.length}}
      <table class="table fixed no-lines no-top-padding tight">
        {{#each volumesArray as |vol|}}
          <tr>
            <td>
              {{input type="text" class="form-control volume-path input-sm" value=vol.value placeholder="e.g. [/path/on/host]:/path/in/container[:ro]"}}
            </td>
            <td width="30" class="text-right">
              <button {{action "removeVolume" vol}} class="btn-circle-x" type="button" tabindex="-1"></button>
            </td>
          </tr>
        {{/each}}
      </table>
    {{/if}}
  </div>
</div>

{{#unless model.service}}
  <div class="row form-group">
    <div class="col-sm-12 col-md-2 form-label">
      <label class="form-control-static">Volumes From</label>
    </div>

    <div class="col-sm-12 col-md-8">
        <div class="form-control-static">
          {{#if instance.requestedHostId}}
            {{#if hostContainerChoices.length}}
              <button class="btn btn-circle-plus" {{action "addVolumeFrom" target="view"}}></button>
            {{else}}
              <span class="text-muted">This host has no containers to use the volumes from.</span>
            {{/if}}
          {{else}}
              <span class="text-muted">Only available when adding a container to a particular host.</span>
          {{/if}}
        </div>
      {{#if volumesFromArray.length}}
        <table class="table fixed no-lines no-top-padding tight">
          {{#each volumesFromArray as |vol|}}
            <tr>
              <td>
                {{display-name-select
                  classNames="form-control input-sm volumefrom-container"
                  prompt="Select a container..."
                  value=vol.value
                  content=hostContainerChoices
                  optionValuePath="content.id"
                  optionLabelPath="content.name"
                  optionGroupPath="group"
                }}
              </td>
              <td width="30" class="text-right">
                <button {{action "removeVolumeFrom" vol}} class="btn-circle-x" type="button" tabindex="-1"></button>
              </td>
            </tr>
          {{/each}}
        </table>
      {{/if}}
    </div>
  </div>
{{/unless}}

<div class="row form-group">
  <div class="col-sm-12 col-md-2 form-label">
    <label for="volumeDriver" class="form-control-static">Volume Driver</label>
  </div>

  <div class="col-sm-12 col-md-8">
    {{input type="text" class="form-control" value=instance.volumeDriver placeholder="Experimental: Requires Docker 1.7"}}
  </div>
</div>
