server test.hbs

<div class="container main">
  <div class="row content">
    <div class="col-md-12">
      <div class="palette report">
        <div class="row">
          <div class="col-md-9">
            <h1>Review Conformance and Select Tests</h1>
          </div>
          <div class="col-md-3">
            {{#if savingTestRun}}
              <button type="submit" disabled class="btn" ><span class="fa fa-lg fa-fw fa-spinner fa-pulse"></span> Preparing...</button>
            {{else}}
              {{#unless conformanceLoaded}}
                <button type="submit" class="btn" disabled={{executeTestsBtnDisabled}} {{action "executeTests"}}><i class="fa fa-lg fa-fw fa-spinner fa-pulse"></i> Loading...</button>
              {{else}}
                <button type="submit" class="btn" disabled={{executeTestsBtnDisabled}} {{action "executeTests"}}>RUN</button>
              {{/unless}}
            {{/if}}
          </div>
        </div>

        <p class="helper_text">
          Each FHIR Interface will first generate a conformance statement. Based on the conformance, a given set of recommended tests will be shown to the user.
        </p>

        <div class="col-md-7 col-md-offset-4 server-test-details">
          {{server-details server=server}}
        </div>

        {{#if runningTestCount}}
          <div class="row">
            <div class="progress">
              <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow={{executionProgress}} aria-valuemin="0" aria-valuemax="100" style={{progressStyle}}>
                <span class="sr-only">{{executionProgress}}% Complete</span>
              </div>
            </div>
          </div>
        {{/if}}

        <div class="row">
          <ul class="nav nav-tabs tabbed-data-container">
            <li class="tabbed-data active"><a data-toggle="tab" href="#test-data">Tests</a></li>
            <li class="tabbed-data"><a data-toggle="tab"href="#conformance-data">{{#unless conformanceLoaded}}<i class="fa fa-lg fa-fw fa-spinner fa-pulse"></i> {{/unless}}Conformance</a></li>
            {{!-- <li class="tabbed-data"><a data-toggle="tab"href="#heatmap-data">Heat Map</a></li> --}}
            <li class="tabbed-data"><a data-toggle="tab" href="#security-data">Security</a></li>
          </ul>
        </div>

        <div class="row">
          <div class="tab-content">

            <!-- TEST PANEL START -->
            <div class="tab-pane active" id="test-data">
              <div class="col-md-12 tab-content-holder">
                <div class="row server selectBox">
                  <div class="col-sm-2">
                    <button type="button" class="btn secondary" {{action "selectDeselectAll"}}><i class="fa fa-check"></i>&nbsp;{{selectAllBtnText}}</button>
                    <button type="button" class="btn secondary" {{action "expandCollapseAll"}}><i class="fa fa-expand"></i>&nbsp;{{expandCollapseBtnText}}</button>
                  </div>
                </div>
                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                  {{#each proxiedTests as |test|}}
                    {{test-panel proxiedTest=test}}
                  {{/each}}
                </div>
              </div>
            </div>

            <!-- CONFORMANCE PANEL START -->
            <div class="tab-pane" id="conformance-data">
              {{conformance-view conformance=server.conformance}}
            </div>

            <div class="tab-pane" id="security-data">
              <div class="col-md-12 tab-content-holder">
                <div class="well">
                  <div class="form-group">
                    <label for="bearer_token">Bearer Token</label>
                    <input type="text" id="bearer_token" name="bearer_token" class="form-control" />
                  </div>
                </div>

                <div class="well">
                  <label>Basic Auth:</label>
                  <div class="form-group">
                    <label for="username">Username</label>
                    <input type="text" id="username" name="username" class="form-control" />
                  </div>

                  <div class="form-group">
                    <label for="password">Password</label>
                    <input type="text" id="password" name="password" class="form-control" />
                  </div>
                </div>

                <div class="well">
                  <label>OAuth2 Auth</label>
                  <form id="oauth2_form" action="" method="GET">
                    <div class="form-group">
                      <label for="client_id">Client ID</label>
                      {{input type="text" name="client_id" class="form-control" value=server.client_id}}
                    </div>

                    <div class="form-group">
                      <label for="client_secret">Client Secret</label>
                      {{input type="text" name="client_secret" class="form-control" value=server.client_secret}}
                    </div>

                    <button type="submit" class="btn btn-primary" {{action "authorizeApp"}} >Authorize App</button>
                  </form>
                </div>

              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>