{% extends 'base.html' %}
{% set active_page = "pop" %}
{% set version2 = False %}
 
{% block container %}
  {% if current_user.is_authenticated %}
  <!--start POP list div-->
  <div ng-init="popList()">
    <form>
      <div class="form-group"> <!--start search bar-->
        <div class="input-group">
          <div class="input-group-addon"><i class="fa fa-search"></i></div>
          <input type="text" class="form-control" placeholder="Search within results..." ng-model="gen.searchValue">
        </div>
      </div> <!--end search bar-->
    </form>
    <hr>
    <p ng-show="gen.errorEvent == 'noData'">Error: No Data Found</p>
    <div class="row" ng-if="gen.tableLoading==true">
             <div class="col-md-2 col-md-offset-5" style="text-align:center">
        <i class="fa fa-refresh fa-spin"></i>
      </div>
    </div>
    <div class="panel panel-default" style="overflow:auto" ng-init="gen.sortValue='locationCode'">
      <table class="table table-bordered table-striped table-hover" ng-show="gen.tableLoading == false && gen.errorEvent != 'noData'">
        <thead>
          <tr>
            <th>
              <a href="#" ng-click="setSort('locationCode'); reverseSort()">SITE
                <span ng-show="gen.sortValue == 'locationCode' && !gen.sortReverse" class="fa fa-caret-down"></span>
                <span ng-show="gen.sortValue == 'locationCode' && gen.sortReverse" class="fa fa-caret-up"></span>
              </a>
            </th>
            <th>
              <a href="#" ng-click="setSort('hostingProvider'); reverseSort()">HOSTING PROVIDER
                <span ng-show="gen.sortValue == 'hostingProvider' && !gen.sortReverse" class="fa fa-caret-down"></span>
                <span ng-show="gen.sortValue == 'hostingProvider' && gen.sortReverse" class="fa fa-caret-up"></span>
              </a>
            </th>
            <th>
              <a href="#" ng-click="setSort('physicalAddress'); reverseSort()">PHYSICAL ADDRESS
                <span ng-show="gen.sortValue == 'physicalAddress' && !gen.sortReverse" class="fa fa-caret-down"></span>
                <span ng-show="gen.sortValue == 'physicalAddress' && gen.sortReverse" class="fa fa-caret-up"></span>
              </a>
            </th>
            <th>
              <a href="#" ng-click="setSort('locationStatus'); reverseSort()">STATUS
                <span ng-show="gen.sortValue == 'locationStatus' && !gen.sortReverse" class="fa fa-caret-down"></span>
                <span ng-show="gen.sortValue == 'locationStatus' && gen.sortReverse" class="fa fa-caret-up"></span>
              </a>
            </th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="row in popData | orderBy:gen.sortValue:gen.sortReverse | filter:gen.searchValue">
            <td ng-click="goToURL('{{ url_for('data.pop_details') }}?site='+row.locationCode)">{{row.locationCode|angular}}</td>
            <td ng-click="goToURL('{{ url_for('data.pop_details') }}?site='+row.locationCode)">{{row.hostingProvider|angular}}</td>
            <td ng-click="goToURL('{{ url_for('data.pop_details') }}?site='+row.locationCode)">{{row.physicalAddress|angular}}</td>
            <td ng-click="goToURL('{{ url_for('data.pop_details') }}?site='+row.locationCode)">{{row.locationStatus|angular}}</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
  <!--end pop list div-->
  {% else %}
  <div class="jumbotron">
  	<h3>Authorized Access Only</h3>
  	<h4><a href="{{ url_for('auth.login') }}">Click Here To Login</a></h4>
  </div>
  {% endif %}
{% endblock %}
{% block scripts %}
{% endblock %}