decide.nolog.cz/app/templates/components/create-options-datetime.hbs

<div class="box">
  {{#if errorMessage}}
    {{#bs-alert type="warning"}}
      {{t errorMessage}}
    {{/bs-alert}}
  {{/if}}

  {{#bs-form
    action='submit'
    formLayout='horizontal'
    model=this
    novalidate=true
  }}
    <div class="days">
      {{#each dates as |date index|}}
        {{!
          show summarized validation state for all times in a day
        }}
        <div class="{{unless (get daysValidationState date.day) 'label-has-no-validation' (concat 'label-has-' (get daysValidationState date.day))}}">
          {{!
            show label only if it differ from label before
            Nested-helpers are called first and object-at requires a positive integer
            but returns undefined if an element with the passed in index does not exist.
            Therefore we pass in array length if index is null. Cause index starting
            by zero there can't be any element with an index === array.length.
          }}
          {{#bs-form-element
            classNames='option'
            label=date.dayFormatted
            invisibleLabel=(eq date.dayFormatted (object-at dates (if index (sub index 1) dates.length) 'dayFormatted'))
            model=date
            property='time'
            as |value id validationState|
          }}
            <div class="input-group">
              {{bs-input
                autofocus=(unless index true false)
                id=id
                placeholder='00:00'
                type='time'
                value=value
              }}
              <div class="input-group-btn">
                {{! disable delete button if there is only one option }}
                <button {{action 'deleteOption' date}}
                  class="delete btn {{if (eq validationState 'success') 'btn-success'}} {{if (eq validationState 'error') 'btn-danger'}} {{unless validationState 'btn-default'}}">
                  <span class='glyphicon glyphicon-trash' aria-hidden='true'></span>
                  <span class='sr-only'>{{t 'create.options.button.delete.label'}}</span>
                </button>
                <button {{action 'addOption' date}}
                  class="add btn {{if (eq validationState 'success') 'btn-success'}} {{if (eq validationState 'error') 'btn-danger'}} {{unless validationState 'btn-default'}}">
                  <span class='glyphicon glyphicon-plus' aria-hidden='true'></span>
                  <span class='sr-only'>{{t 'create.options.button.add.label'}}</span>
                </button>
              </div>
            </div>
          {{/bs-form-element}}
        </div>
      {{/each}}
    </div>

    {{#if (gt groupedDates.length 1)}}
      {{#bs-form-element}}
        <button {{action "adoptTimesOfFirstDay"}} class="btn btn-default adopt-times-of-first-day">{{t "create.options-datetime.copy-first-line"}}</button>
      {{/bs-form-element}}
    {{/if}}

    <div class="row">
      <div class="col-xs-6 col-md-4 text-right">
        {{bs-button
          action='back'
          classNames='back'
          defaultText=(t 'action.back')
        }}
      </div>
      <div class="col-xs-6 col-md-8">
        {{bs-button
          buttonType='submit'
          defaultText=(t 'action.next')
          type='primary'
        }}
      </div>
    </div>
  {{/bs-form}}
</div>