<form class="form-horizontal" id="display-options-accordion">
  <div class="form-group">
    <label class="col-sm-2 control-label">{{t 'Opacity'}}</label>
    <div class="col-sm-12">
      <input class="form-control opacity-slider">
    </div>
  </div>
  {{#each options}}
    <div class="form-group layer-display-options-wrapper panel">
      <label class="col-sm-2 control-label">
        <input type="radio" id="visualization-selector_{{this.counter}}" name="visualization-selector" class="visualization-selector" {{#if this.isChosen}} checked{{/if}}>
        <a data-toggle="collapse" data-parent="#display-options-accordion" class="visualization-selector-collapse" href="#collapse-display-options-{{this.counter}}">{{t this.name}}</a>
        </input>
      </label>
      <div id="collapse-display-options-{{this.counter}}" class="panel-collapse collapse {{#if this.isChosen}}in{{/if}}">
      {{#each this.parameters}}
        <label class="col-sm-2 control-label">
          {{t this.name}}
        </label>
        {{#if this.values}}
          {{#if this.values.[0].value}}
            <div class="{{#if this.selectThree}}col-sm-4{{else}}col-sm-12{{/if}} option-row">
              <select class="form-control layer-option layer-option-selection" data-counter="{{counterMultiple}}" name="{{this.target}}">
                {{#each this.values}}
                  <option value="{{this.value}}" {{#if this.isCurrentB1}} selected="selected"{{/if}}>{{this.label}}</option>
                {{/each}}
              </select>
            </div>
            {{#if this.selectThree}}
              <div class="col-sm-4 option-row">
                <select class="form-control layer-option layer-option-selection" data-counter="{{counterMultiple}}" name="{{this.target}}">
                  {{#each this.values}}
                    <option value="{{this.value}}" {{#if this.isCurrentB2}} selected="selected"{{/if}}>{{this.label}}</option>
                  {{/each}}
                </select>
              </div>
              <div class="col-sm-4 option-row">
                <select class="form-control layer-option layer-option-selection" data-counter="{{counterMultiple}}" name="{{this.target}}">
                  {{#each this.values}}
                    <option value="{{this.value}}" {{#if this.isCurrentB3}} selected="selected"{{/if}}>{{this.label}}</option>
                  {{/each}}
                </select>
              </div>
            {{/if}}
          {{/if}}
        {{/if}}
        {{#each this.rangeInputsConfig}}
          <div class="option-row
          {{#if this.selectThree}}col-sm-4{{else}}col-sm-12{{/if}}"
          >
            <input class="layer-option layer-option-slider"
              name="{{this.target}}"
              value="{{this.value}}"
              data-provide="slider"
              data-range="{{this.range}}"
              data-slider-min="{{this.min}}"
              data-slider-max="{{this.max}}"
              data-slider-step="{{this.step}}"
              data-slider-value="{{this.sliderValue}}"
              data-tooltip-position="top"
              data-slider-tooltip=""
              data-counter="{{../counterMultiple}}"
              data-lookupkeypreferences="{{this.lookupKeyPreferences}}"
            />
          </div>
        {{/each}}
      {{/each}}
      </div>
    </div>
  {{/each}}
</form>
