{{top-errors errors=errors}}

<section class="horizontal-form">
  <div class="container-fluid">
    {{#if showNameScale}}
      <div class="box mt-20">
        <h4>{{t 'nodeDriver.rackspace.instanceSection'}}</h4>
        <div class="row mb-20">
          <div class="row">
            <div class="col span-11-of-23 mt-0 mb-0">
              {{form-name-description
                  name=prefix
                  nameRequired=true
                  namePlaceholder="hostsPage.new.name.placeholder"
                  nameHelpText=nameCountLabel
                  descriptionShown=true
              }}
            </div>
            <div class="col span-11-of-23 mt-0 mb-0 offset-1-of-23">
              {{form-count
                  min=0
                  initialScale=1
                  setScale=(action (mut count))
              }}
            </div>
          </div>
        </div>
      </div>
    {{/if}}

    <div class="over-hr mt-20 mb-20">
      <span>{{t 'nodeDriver.rackspace.accountSection'}}</span>
    </div>

    <div class="row inline-form">
      <div class="col span-2 col-inline">
        <label>{{t 'nodeDriver.rackspace.username.label'}}{{field-required}}</label>
      </div>
      <div class="col span-10">
        {{input type="text" value=config.username classNames="form-control" placeholder=(t 'nodeDriver.rackspace.username.placeholder')}}
      </div>
    </div>

    <div class="row inline-form">
      <div class="col span-2 col-inline">
        <label>{{t 'nodeDriver.rackspace.apiKey.label'}}{{field-required}}</label>
      </div>
      <div class="col span-10">
        {{input type="password" value=config.apiKey classNames="form-control" placeholder=(t 'nodeDriver.rackspace.apiKey.placeholder')}}
        <p class="text-info">{{t 'nodeDriver.rackspace.accountHelp'}}</p>
      </div>
    </div>

    <div class="over-hr mt-20 mb-20">
      <span>{{t 'nodeDriver.rackspace.regionSection'}}</span>
    </div>

    <div class="row inline-form">
      <div class="col span-2 col-inline">
        <label>{{t 'nodeDriver.rackspace.region.label'}}</label>
      </div>
      <div class="col span-10">
        <select class="form-control" onchange={{action (mut config.region) value="target.value"}}>
          {{#each regionChoices as |choice|}}
            <option value={{choice.value}} selected={{eq config.region choice.value}}>{{choice.label}}</option>
          {{/each}}
        </select>
      </div>
    </div>

    <div class="over-hr mt-20 mb-20">
      <span>{{t 'nodeDriver.rackspace.instanceOptionsSection'}}</span>
    </div>

    <div class="row inline-form">
      <div class="col span-2 col-inline">
        <label>{{t 'nodeDriver.rackspace.flavor.label'}}</label>
      </div>
      <div class="col span-10">
        <select class="form-control" onchange={{action (mut config.flavorId) value="target.value"}}>
          {{#each flavorChoices as |choice|}}
            <option value={{choice.value}} selected={{eq config.flavorId choice.value}}>{{choice.label}}</option>
          {{/each}}
        </select>
      </div>
    </div>

    <div class="over-hr mt-40 mb-30">
      <span>{{settings.appName}}</span>
    </div>

    <div class="row">
      <div class="col span-12">
        {{form-user-labels initialLabels=labelResource.labels setLabels=(action 'setLabels') expandAll=null}}
      </div>
    </div>

    {{#advanced-section}}
      {{form-engine-opts machine=model showEngineUrl=showEngineUrl}}
    {{/advanced-section}}
  </div>

  {{save-cancel save="save" cancel="cancel" editing=editing}}
</section>