{{#liquid-if loading}}
  <div class="text-center">
    <p>
      <i class="icon icon-spinner icon-spin"></i> Loading...
    </p>
  </div>
{{else}}
  <section class="horizontal-form container-fluid">
    <h2>Edit Load Balancer</h2>
    {{top-errors errors=errors}}

    {{partial "container/edit-name"}}

    {{partial "form-divider"}}

    <div class="row">
      <div class="col-sm-12 col-md-2 form-label">
        <label>Scale</label>
      </div>
      {{#if isGlobal}}
        <div class="col-sm-10 col-md-8">
          <span class="text-muted">Always run one instance of this container on every host</span>
        </div>
      {{else}}
        <div class="col-sm-2 col-md-1">
          {{service.scale}}
        </div>
        <div class="col-sm-10 col-md-7">
          {{input-slider value=service.scale valueMax=11 scaleMax=12}}
        </div>
      {{/if}}
    </div>

    {{partial "form-divider"}}

    <div class="row">
      <div class="col-xs-6 col-md-2 form-label">
        <label>Listening Ports</label>
      </div>
      <div class="col-sm-12 col-md-8">
        {{partial "loadbalancer/edit-listeners"}}
      </div>
    </div>

    {{partial "form-divider"}}

    <div class="row">
      <div class="col-xs-6 col-md-2 form-label">
        <label>Targets</label>
      </div>
      <div class="col-xs-6 col-md-8">
        <button class="btn-circle-plus btn-circle-text" style="margin-right: 20px;" {{action "addTargetService"}}>Add Service</button>
      </div>
    </div>
    <div class="row">
      <div class="col-sm-12 col-md-8 col-md-offset-2">
        {{partial "loadbalancer/edit-targets"}}
      </div>
    </div>

    {{partial "form-divider"}}

    {{edit-ssl-termination
      balancerService=service
      listenersArray=listenersArray
      launchConfig=service.launchConfig
      certificates=allCertificates
    }}
  </section>

  {{partial "save-cancel"}}
{{/liquid-if}}
