<div class="row">
  <div class="col-xs-10 col-sm-7 col-md-6 col-lg-4">
    <h1>{{'Domain name'|translate}}</h1>
    <input type="text" class="form-control" id="domain_check_name" ng-model="$parent.form.domain" ng-keypress="($event.which === 13)?domainCheck():0" >
    <br>
    <div class="progress" ng-show="progress>=0 && progress<100">
      <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="{{progress}}" aria-valuemin="0" aria-valuemax="100" ng-style="progressStyle">
          {{progress}}%
      </div>
    </div>
    <br>
    <div class="advanced col-xs-6">
      <label class="checkbox"><input type="checkbox" ng-model="$parent.form.advanced"> {{'Advanced options'|translate}}</label>
      <div ng-show="$parent.form.advanced" class="advanced">
        <label class="checkbox"><input type="checkbox" ng-model="$parent.form.ipv4" ng-disabled="!$parent.form.ipv6"> IPv4</label>
        <label class="checkbox"><input type="checkbox" ng-model="$parent.form.ipv6" ng-disabled="!$parent.form.ipv4"> IPv6</label>
        <select ng-model="$parent.form.profile" class="form-control">
          <option value="default_profile">Default</option>
          <option value="test_profile_1">IANA profile</option>
          <option value="test_profile_2">Test profile 2</option>
        </select>
      </div>
    </div>
  </div>
  <div class="col-xs-2">
    <a title="{{'Run test'|translate}}" href="#" onClick="return false;" ng-click="domainCheck();" class="bigbutton"><span class="fa fa-play-circle-o run-btn-icon"></span></a>
  </div>
  <div class="col-xs-12 col-sm-12 col-md-4 col-lg-6">
    <div class="result" ng-show="result">
      <div>
      <h2> {{'Test #'|translate}} {{ test.id }}</h2>
      <i>{{'Executed at'|translate}} {{ test.creation_time | asDate | date:"yyyy-MM-ddTHH:mmZ" }}</i>
      <br>
      {{'Link'|translate}}
      <input type="text" class="form-control disabled" value="{{location}}">
      </div>
      <navigation nav-id="search_result" inverse="yes">
        <tab tab-title="{{'Basic'|translate}}" tab-id="basic">
          <br>
          <div ng-repeat="module in getModules(result)" class="module">
            <div class="text-{{modules[module]}}">
            <a href="#" class="expand"><span class="fa fa-plus-square-o"></span></a> &nbsp; <span class="fa fa-{{modules[module]}}"></span>
            {{module|translate}}</div>
            <div>
              <div ng-repeat="item in getItems(result,module)" class="alert alert-{{item.level}} more" style="display:none">
                {{item.message|translate}}
              </div>
            </div>
          </div>
        </tab>
        <tab tab-title="{{'Advanced'|translate}}" tab-id="advanced">
          <div id="adv_result">
          <div ng-repeat="module in getModules(result)">
            <b>{{module|translate}}</b>
              <div ng-repeat="item in getItems(result,module)" class="alert alert-{{item.level}}">
                {{item.message|translate}}
              </div>
          </div>
          </div>
        </tab>
        <tab tab-title="{{'Export'|translate}}" tab-id="export">
          <br>
          <a download="report.txt" class="btn btn-primary" ng-click="exportFile($event)">{{'Download'|translate}}</a>
          <a target="_self" class="btn btn-primary" ng-click="exportHTML($event)">{{'Download HTML'|translate}}</a>
        </tab>
        <tab tab-title="{{'History'|translate}}" tab-id="history">
        <br>
          <div class="" ng-repeat="item in history">
            <span class="history-{{item.overall_result}}">&#x25C9;</span>&nbsp;<a target="_self" href="/test/{{item.id}}">{{item.creation_time | asDate | date:"yyyy-MM-ddTHH:mmZ"}}</a>
          </div>
        </tab>
      </navigation>
    </div>
  </div>
</div>
