ui/lib/nodes/addon/components/node-driver/driver-amazonec2/template.hbs

{{#accordion-list showExpandAll=false as | al expandFn |}}
  <div class="over-hr"><span>{{driverOptionsTitle}}</span></div>

  {{#accordion-list-item
    title=(t 'nodeDriver.amazonec2.access.title')
    detail=(t 'nodeDriver.amazonec2.access.detail')
    expandAll=expandAll
    expand=(action expandFn)
    expandOnInit=true
  }}
    <div class="row">
      <div class="col span-4">
        <label class="acc-label">{{t 'nodeDriver.amazonec2.region.label'}}</label>
        {{#if (eq step 1)}}
          <select class="form-control" onchange={{action (mut config.region) value="target.value"}}>
            {{#each regionChoices as |choice|}}
              <option value={{choice}} selected={{eq config.region choice}}>{{choice}}</option>
            {{/each}}
          </select>
        {{else}}
          <div>{{config.region}}</div>
        {{/if}}
      </div>

      <div class="col span-4">
        <label class="acc-label">{{t 'nodeDriver.amazonec2.accessKey.label'}}</label>
        {{#if (eq step 1)}}
          {{input type="text" name="username" classNames="form-control" placeholder=(t 'nodeDriver.amazonec2.accessKey.placeholder') value=config.accessKey}}
        {{else}}
          <div>{{config.accessKey}}</div>
        {{/if}}
      </div>

      <div class="col span-4">
        <label class="acc-label">{{t 'nodeDriver.amazonec2.secretKey.label'}}</label>
        {{#if (eq step 1)}}
          {{input type="password" name="password" classNames="form-control" placeholder=(t 'nodeDriver.amazonec2.secretKey.placeholder') value=config.secretKey}}
        {{else}}
          <div class="text-muted text-italic">{{t 'nodeDriver.amazonec2.secretKey.provided'}}</div>
        {{/if}}
      </div>
    </div>

    {{#if (eq step 1)}}
      <div class="row">
        <div class="span-8 offset-4">
          <p class="text-info text-small m-0">{{t 'nodeDriver.amazonec2.access.help'}}</p>
        </div>
      </div>
    {{/if}}
  {{/accordion-list-item}}

  {{#if (eq step 1)}}
    {{top-errors errors=errors}}
    {{save-cancel
      save="awsLogin"
      cancel="cancel"
      createLabel="nodeDriver.amazonec2.access.next"
      savingLabel="nodeDriver.amazonec2.access.loading"
    }}
  {{/if}}

  <div class="{{unless (gte step 2) 'hide'}}">
    {{#accordion-list-item
      title=(t 'nodeDriver.amazonec2.zone.title')
      detail=(t 'nodeDriver.amazonec2.zone.detail')
      expandAll=expandAll
      expand=(action expandFn)
      expandOnInit=true
    }}
      {{#if (eq step 2)}}
        <div class="row">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.availabilityZone'}}</label>
          <select class="form-control" onchange={{action (mut selectedZone) value="target.value"}}>
            {{#each zoneChoices as |choice|}}
              <option value={{choice}} selected={{eq selectedZone choice}}>{{choice}}</option>
            {{/each}}
          </select>
        </div>

        <div class="row">
          <label class="acc-label pt-20">{{t 'nodeDriver.amazonec2.subnet'}}</label>
          {{#if subnetChoices.length}}
            {{#each subnetChoices as |choice|}}
              {{#if choice.isVpc}}
                <hr class="mt-20 mb-20" />
                <div class="radio">
                  <label class="acc-label pb-0">{{radio-button selection=selectedSubnet value=choice.value}} {{choice.label}}
                    {{#each choice.tags as |tag|}}
                      <span class="tag-xs bg-info mr-5">
                        <i class="icon icon-tag"></i>
                        {{tag}}
                      </span>
                    {{/each}}
                  </label>
                </div>
              {{else}}
                <div class="radio">
                <label class="ml-20">
                  {{radio-button selection=selectedSubnet value=choice.value}} <i class="icon icon-level-down text-muted" style="transform: scaleX(-1) rotate(90deg);"></i> {{choice.label}}
                  {{#each choice.tags as |tag|}}
                    <span class="tag-xs bg-info mr-5">
                      <i class="icon icon-tag"></i>
                      {{tag}}
                    </span>
                  {{/each}}
                </label>
                </div>
              {{/if}}
            {{/each}}
          {{else}}
            There are no subnets to choose from.
          {{/if}}
        </div>
      {{else}}
        <div class="row">
          <div class="span-6">
            <label class="acc-label">{{t 'nodeDriver.amazonec2.availabilityZone'}}</label>
            {{config.region}}{{config.zone}}
          </div>
          <div class="span-6">
            <label class="acc-label pt-20">{{t 'nodeDriver.amazonec2.subnet'}}</label>
            {{#if config.subnetId}}
              {{config.subnetId}}
            {{else}}
              {{config.vpcId}}
            {{/if}}
          </div>
        </div>
      {{/if}}
    {{/accordion-list-item}}

    {{#if (eq step 2)}}
      {{top-errors errors=errors}}
      {{save-cancel
        save="selectSubnet"
        cancel="cancel"
        createLabel="nodeDriver.amazonec2.zone.next"
        savingLabel="nodeDriver.amazonec2.zone.loading"
      }}
    {{/if}}
  </div>

  <div class="{{unless (gte step 3) 'hide'}}">
    {{#accordion-list-item
      title=(t 'nodeDriver.amazonec2.securityGroup.title')
      detail=(t 'nodeDriver.amazonec2.securityGroup.detail')
      expandAll=expandAll
      expand=(action expandFn)
      expandOnInit=true
    }}
      <div class="row">
        {{#if (eq step 3)}}
          <div class="radio pt-10">
            <label>
              {{radio-button selection=whichSecurityGroup value="default"}}
                {{t 'nodeDriver.amazonec2.securityGroup.defaultCreate' groupName=defaultSecurityGroupName htmlSafe=true}}
            </label>
          </div>

          {{#if (and settings.isRancher (not isCustomSecurityGroup))}}
            <p class="text-info ml-20"><a href="{{settings.docsBase}}/installation/references/" target="_blank">{{t 'nodeDriver.amazonec2.portHelp.link'}}</a> {{t 'nodeDriver.amazonec2.portHelp.text'}}</p>
          {{/if}}

          <div class="radio pt-10">
            <label>
              {{radio-button selection=whichSecurityGroup value="custom"}}
              {{t 'nodeDriver.amazonec2.securityGroup.choose'}}
            </label>
          </div>

          {{#if isCustomSecurityGroup}}
            <select class="form-control existing-security-groups" multiple="true" onchange={{action 'multiSecurityGroupSelect' ''}}>
              {{#each allSecurityGroups as |choice|}}
                <option value={{choice.name}} selected={{array-includes selectedSecurityGroup choice.name}}>{{choice.name}} ({{choice.id}})</option>
              {{/each}}
            </select>
          {{/if}}
        {{else}}
          <div>
            {{#if (is-array config.securityGroup)}}
              <div class="comma-seperated-list">
                {{#each config.securityGroup as |group|}}
                  <span>{{group}}</span>
                {{/each}}
              </div>
            {{else}}
              {{defaultSecurityGroupName}}
            {{/if}}
          </div>
        {{/if}}
      </div>
    {{/accordion-list-item}}

    {{#if (eq step 3)}}
      {{top-errors errors=errors}}
      {{save-cancel
        save="selectSecurityGroup"
        cancel="cancel"
        createLabel="nodeDriver.amazonec2.securityGroup.next"
        savingLabel="nodeDriver.amazonec2.securityGroup.loading"
      }}
    {{/if}}
  </div>

  <div class="{{unless (gte step 4) 'hide'}}">
    {{#accordion-list-item
      title=(t 'nodeDriver.amazonec2.instance.title')
      detail=(t 'nodeDriver.amazonec2.instance.detail')
      expandAll=expandAll
      expand=(action expandFn)
      expandOnInit=true
    }}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.instanceType.label'}}</label>
          {{new-select
            classNames="form-control"
            value=config.instanceType
            content=instanceTypes
            optionValuePath="name"
            optionLabelPath="name"
            optionGroupPath="group"
          }}
        </div>

        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.rootSize.label'}}</label>
          <div class="input-group">
            {{input type="text" classNames="form-control" placeholder="" value=config.rootSize}}
            <span class="input-group-addon bg-default">{{t 'nodeDriver.amazonec2.rootSize.unit'}}</span>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.ami.label'}}</label>
          {{input type="text" classNames="form-control" placeholder=(t 'nodeDriver.amazonec2.ami.placeholder') value=config.ami}}
          {{#if settings.isRancher}}
            <p class="help-block">
              <a href="https://github.com/rancher/os/blob/master/README.md/#user-content-amazon" target="_blank">{{t 'nodeDriver.amazonec2.ami.rancherList'}}</a>
            </p>
          {{/if}}
        </div>

        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.sshUser.label'}}</label>
          {{input type="text" classNames="form-control" placeholder=(t 'nodeDriver.amazonec2.sshUser.placeholder') value=config.sshUser}}
        </div>
      </div>

      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.iam.label'}}</label>
          {{input type="text" classNames="form-control" value=config.iamInstanceProfile placeholder=(t 'nodeDriver.amazonec2.iam.placeholder')}}
        </div>

        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.privateIp.label'}}</label>
          <div class="checkbox">
            <label class="acc-label">{{input type="checkbox" checked=config.privateAddressOnly}} {{t 'nodeDriver.amazonec2.onlyPrivate.label'}}</label>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t 'nodeDriver.amazonec2.requestSpotInstance.label'}}</label>
          <div class="checkbox">
            <label class="acc-label">{{input type="checkbox" checked=config.requestSpotInstance}} {{t 'nodeDriver.amazonec2.requestSpotInstance.enable'}}</label>
          </div>
        </div>

        {{#if config.requestSpotInstance}}
          <div class="col span-6">
            <label class="acc-label">{{t 'nodeDriver.amazonec2.spotPrice.label'}}</label>
            <div class="input-group">
              {{input type="text" classNames="form-control" placeholder="" value=config.spotPrice}}
              <span class="input-group-addon bg-default">{{t 'nodeDriver.amazonec2.spotPrice.unit'}}</span>
            </div>
          </div>
        {{/if}}
      </div>

      <div class="row">
        <div class="col span-12">
          {{form-key-value
              addActionLabel="nodeDriver.amazonec2.tags.addActionLabel"
              initialMap=tags
              changed=(action (mut tags))
          }}
        </div>
      </div>
    {{/accordion-list-item}}

    <div class="over-hr"><span>{{templateOptionsTitle}}</span></div>

    {{form-name-description
      model=model
      nameRequired=true
    }}

    {{form-user-labels
      initialLabels=labelResource.labels
      setLabels=(action 'setLabels')
      expandAll=expandAll
      expand=(action expandFn)
    }}

    {{form-engine-opts
      machine=model
      showEngineUrl=showEngineUrl
    }}

    {{top-errors errors=errors}}
    {{save-cancel save="save" cancel="cancel" editing=editing}}
  </div>
{{/accordion-list}}