<div dashboard-header></div>
<div class="dashboard">
  <div ng-controller="ServiceCtrl" layout="column" class="body-wrapper service">

    <div class="detail">

      <div class="back">
        <md-button class="md-default-theme" ng-click="doTheBack()">‹ BACK</md-button>
      </div>

      <div class="heading">
        <span class="label">Service: </span>
        <span>{{service.metadata.name}}</span>
      </div>


      <table class="align-top">
        <tbody>
          <tr>
            <td class="name">Created</td>
            <td class="value">
              {{service.metadata.creationTimestamp | date:'medium'}}
            </td>
          </tr>

          <tr>
            <td class="name">Ports</td>
            <td class="value">
              <div ng-repeat="port in service.spec.ports">
                <span ng-show="port.name">
                  {{port.name}}:
                </span>
                {{port.port}}/{{port.protocol}}

                <div ng-show="port.nodePort && port.nodePort != 0">
                  Node Port: {{port.nodePort}}/{{port.protocol}}
                </div>

             </div>
            </td>
          </tr>


          <tr>
            <td class="name">IP</td>
            <td class="value">
              {{service.spec.clusterIP}}
            </td>
          </tr>

          <tr ng-show="service.status.loadBalancer.ingress">
            <td class="name">LoadBalancer Ingress</td>
            <td class="value">
              <span ng-repeat="lb in service.status.loadBalancer.ingress">
                {{lb.ip || lb.hostname}}{{$last ? '' : ', '}}
              </span>
            </td>
          </tr>

          <tr>
            <td class="name">Session Affinity</td>
            <td class="value">
              {{service.spec.sessionAffinity}}
            </td>
          </tr>

          <tr>
            <td class="name">Labels</td>
            <td class="value">
              <div ng-repeat="(label, value) in service.metadata.labels">
                {{label}}: {{value}}
              </div>
            </td>
          </tr>

          <tr ng-show="service.spec.selector">
            <td class="name">Selector</td>
            <td class="value">
              <span ng-repeat="(label, value) in service.spec.selector">
                {{label}}={{value}}{{$last ? '' : ', '}}
              </span>
            </td>
          </tr>

          <tr>
            <td class="name">Related Pods</td>
            <td class="value">
              <div ng-show="service.spec.selector && Object.keys(service.spec.selector).length > 1">
                <a ng-href="#/dashboard/groups/type/selector/{{getSelectorUrlFragment(service.spec.selector)}},type=pod">{{getSelectorUrlFragment(service.spec.selector)}}</a>
              </div>

              <div ng-repeat="(label, value) in service.spec.selector">
                <a ng-href="#/dashboard/groups/type/selector/{{label}}={{value}},type=pod">{{label}}={{value}}</a>
              </div>
            </td>
          </tr>

          <tr>
            <td class="name">Related Replication Controllers</td>
            <td class="value">
              <div ng-show="service.spec.selector && Object.keys(service.spec.selector).length > 1">
                <a ng-href="#/dashboard/groups/type/selector/{{getSelectorUrlFragment(service.spec.selector)}},type=replicationController">{{getSelectorUrlFragment(service.spec.selector)}}</a>
              </div>

              <div ng-repeat="(label, value) in service.spec.selector">
                <a ng-href="#/dashboard/groups/type/selector/{{label}}={{value}},type=replicationController">{{label}}={{value}}</a>
              </div>
            </td>
          </tr>

        </tbody>
      </table>



    </div>

  </div>
</div>
<div dashboard-footer></div>
