{{!
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
}}
<div id="step1">
  <form role="form" class="form-horizontal">
    <!-- Available Applications -->
    {{#if controller.isAppTypesError}}
      <div class="row">
        <div class="col-xs-12 alert alert-warning app-types-alert">
          {{t wizard.step1.noAppTypesError}}
        </div>
      </div>
    {{/if}}
    <strong>{{t wizard.step1.header}}</strong>
    <div class="form-group row">
      <div class="col-xs-3">
        <label class="control-label">{{t wizard.step1.appTypes}}</label>
      </div>
      <div class="col-xs-7">
        {{#if controller.isAppTypesError}}
          {{view
            Em.Select
            contentBinding="view.noAppsAvailableSelect"
            class="form-control type-select"
            disabled=true
          }}
        {{else}}
          {{view
            Em.Select
            contentBinding="controller.availableTypes"
            optionLabelPath="content.displayName"
            class="form-control type-select"
            valueBinding="controller.selectedType"
            disabledBinding="controller.isAppTypesError"
          }}
        {{/if}}
      </div>
    </div>
    <div class="form-group row">
      <div class="col-xs-3">
        <label class=" control-label">{{t wizard.step1.description}}</label>
      </div>
      <div class="col-xs-7">
        <span class="pseudo-label control-label">
          {{#if controller.isAppTypesError}}
            {{t slider.apps.no.description.available}}
          {{else}}
            {{controller.typeDescription}}
          {{/if}}
        </span>
      </div>
    </div>
    <div class="form-group row">
      <div class="col-xs-3">
        <div {{bind-attr class=":control-group controller.isNameError:error"}}>
          <label class="control-label">{{t common.name}}</label>
        </div>
      </div>
      <div class="col-xs-7">
        {{input id="app-name-input" class="form-control" valueBinding="controller.newApp.name" disabledBinding="controller.isAppTypesError" placeholderTranslation="form.placeholder.step1.name"}}
      </div>
    </div>
    {{#if controller.isNameError}}
      <div class="row">
        <div class="col-xs-12 alert alert-danger">
          {{controller.nameErrorMessage}}
        </div>
      </div>
    {{/if}}
    <!-- Available Applications end -->
    <!-- Scheduler Options -->
    <hr />
    <div class="row">
      <strong>{{t wizard.step1.schedulerOptions.label}}</strong>
    </div>
    <div class="row">
      <div class="col-xs-3">
        <label class="control-label">{{t wizard.step1.schedulerOptions.queueName}}</label>
      </div>
      <div class="col-xs-7">
        {{input class="form-control queueName" valueBinding="controller.newApp.queueName" placeholderTranslation="form.placeholder.optional"}}
      </div>
    </div>
    <!-- Scheduler Options end -->
    <!-- YARN Labels -->
    <hr />
    <div class="row">
      <strong>{{t wizard.step1.yarnLabels.label}}</strong>
    </div>
    <div class="row">
      <div class="col-xs-3">
        <label class="control-label">
          {{view view.radioButton name="yarnLabel" selectionBinding="controller.newApp.selectedYarnLabel" value=0 class="radio-inline"}}
          {{t wizard.step1.yarnLabels.options.anyHost}}
        </label>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-3">
        <label class="control-label">
          {{view view.radioButton name="yarnLabel" selectionBinding="controller.newApp.selectedYarnLabel" value=1 class="radio-inline"}}
          {{t wizard.step1.yarnLabels.options.nonLabeledHost}}
        </label>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-3">
        <label class="control-label">
          {{view view.radioButton name="yarnLabel" selectionBinding="controller.newApp.selectedYarnLabel" value=2 class="radio-inline special-label-radio"}}
          {{t wizard.step1.yarnLabels.options.specifyLabel}}
        </label>
      </div>
      <div class="col-xs-7">
        {{input type="text" class="form-control special-label" disabledBinding="view.specLabelEnabled" valueBinding="controller.newApp.specialLabel"}}
      </div>
    </div>
    <!-- YARN Labels end -->
    <!-- Log Aggregation -->
    <hr />
    <div class="row">
      <strong>{{t wizard.step1.logAggregation.label}}</strong>
    </div>
    <div class="row">
      <div class="col-xs-3">
        <label class="control-label">{{t wizard.step1.logAggregation.filePatterns.include}}</label>
      </div>
      <div class="col-xs-7">
        {{input class="form-control includeFilePatterns" valueBinding="controller.newApp.includeFilePatterns" placeholderTranslation="form.placeholder.include.file.patterns"}}
      </div>
    </div>
    <div class="row">
      <div class="col-xs-3">
        <label class="control-label">{{t wizard.step1.logAggregation.filePatterns.exclude}}</label>
      </div>
      <div class="col-xs-7">
        {{input class="form-control excludeFilePatterns" valueBinding="controller.newApp.excludeFilePatterns" placeholderTranslation="form.placeholder.exclude.file.patterns"}}
      </div>
    </div>
    <div class="row">
      <div class="col-xs-3" {{bind-attr class=":col-xs-3 controller.isFrequencyError:error"}}>
        <label class="control-label">{{t common.frequency}}</label>
      </div>
      <div class="col-xs-7">
        <div class="input-group">
          {{input class="form-control frequency" valueBinding="controller.newApp.frequency" placeholderTranslation="form.placeholder.frequency"}}
          <div class="input-group-addon">{{t common.seconds}}</div>
        </div>
      </div>
    </div>
    {{#if controller.isFrequencyError}}
      <div class="row">
        <div class="col-xs-12 alert alert-danger">
          {{controller.frequencyErrorMessage}}
        </div>
      </div>
    {{/if}}
    <!-- Log Aggregation end -->
    <div class="btn-area">
      <button
        class="btn btn-success pull-right next-btn"
        {{bind-attr disabled="controller.isSubmitDisabled"}}
        {{action submit target="controller"}}>{{t common.next}} &rarr;
      </button>
    </div>
  </form>
</div>
