<div class="content">
  <project-page>
    <div>
      <div class="page-header page-header-bleed-right">
        <h1>Deployments</h1>
      </div>
      <alerts alerts="alerts"></alerts>
      <table class="table table-bordered table-hover table-mobile">
        <thead>
          <tr>
            <th>Name</th>
            <th>Last Deployment</th>
            <th>Status</th>
            <th>Created</th>
            <th>Trigger</th>
          </tr>
        </thead>
        <!-- message doesnt show right when there are both dcs and rcs and they are all filtered -->
        <tbody ng-if="showEmptyMessage()">
          <!-- If there are no deployment configs, and if the only 'deployments' are just replication controllers -->
          <tr><td colspan="5" data-title="Name"><em>{{emptyMessage}}</em></td></tr>
        </tbody>
        <tbody ng-repeat="(deploymentConfigName, deploymentConfigDeployments) in deploymentsByDeploymentConfig" ng-if="deploymentConfigs[deploymentConfigName] || !unfilteredDeploymentConfigs[deploymentConfigName]">
          <!-- Deployment config with no deployments-->
          <tr ng-if="(deploymentConfigDeployments | hashSize) == 0 && deploymentConfigName != ''">
            <td data-title="Name">
              <a ng-if="deploymentConfigs[deploymentConfigName]" href="{{deploymentConfigName | navigateResourceURL : 'DeploymentConfig' : projectName}}">{{deploymentConfigName}}</a>
              <span ng-if="deploymentConfigs[deploymentConfigName].status.details.message" class="pficon pficon-warning-triangle-o" style="cursor: help;" data-toggle="popover" data-placement="right" data-trigger="hover" dynamic-content="{{deploymentConfigs[deploymentConfigName].status.details.message}}"></span>
            </td>
            <td data-title="Last"><em>No deployments</em></td>
            <td class="hidden-xs">&nbsp;</td>
            <td class="hidden-xs">&nbsp;</td>
            <td class="hidden-xs">&nbsp;</td>
          </tr>
          <!-- Deployment config with deployments, or deployments from a deployment config which has since been deleted -->
          <tr ng-repeat="deployment in deploymentConfigDeployments | orderObjectsByDate : true | limitTo : 1" ng-if="deploymentConfigName != ''">
            <td data-title="Name">
              <span ng-if="deploymentConfigs[deploymentConfigName]">
                <a href="{{deploymentConfigName | navigateResourceURL : 'DeploymentConfig' : deployment.metadata.namespace}}">{{deploymentConfigName}}</a>
                <span ng-if="deploymentConfigs[deploymentConfigName].status.details.message" class="pficon pficon-warning-triangle-o" style="cursor: help;" data-toggle="popover" data-placement="right" data-trigger="hover" dynamic-content="{{deploymentConfigs[deploymentConfigName].status.details.message}}"></span>
              </span>
              <span ng-if="deploymentConfigs && !deploymentConfigs[deploymentConfigName] && deploymentConfigName != ''">
                {{deploymentConfigName}}
                <span class="pficon pficon-warning-triangle-o" data-toggle="tooltip" data-placement="right" title="This deployment config no longer exists" style="cursor: help;"></span>
              </span>
            </td>
            <td data-title="Last">
              <!-- Deployment number and link -->
              <span ng-if="deployment | annotation : 'deploymentVersion'">
                <a ng-href="{{deployment | navigateResourceURL}}">#{{deployment | annotation : 'deploymentVersion'}}</a>
              </span>
              <span ng-if="!(deployment | annotation : 'deploymentVersion')">
                <a ng-href="{{deployment | navigateResourceURL}}">{{deployment.metadata.name}}</a>
              </span>
            </td>
            <td data-title="Status">
              <div row class="status">
                <status-icon status="deployment | deploymentStatus" disable-animation></status-icon>
                <span flex>
                  {{deployment | deploymentStatus}}<span ng-if="(deployment | deploymentStatus) == 'Deployed' || (deployment | deploymentStatus) == 'Running'">,
                  <span ng-if="deployment.spec.replicas !== deployment.status.replicas">{{deployment.status.replicas}}/</span>{{deployment.spec.replicas}} replica<span ng-if="deployment.spec.replicas != 1">s</span></span>
                </span>
              </div>
              <!-- TODO would be nice to have the deploymentStatusReason in a popup, when there is one -->
            </td>
            <td data-title="Created">
              <relative-timestamp timestamp="deployment.metadata.creationTimestamp"></relative-timestamp>
              <span>- {{deployment.metadata.creationTimestamp | date : 'short'}}</span>
            </td>
            <td data-title="Trigger">
              <span ng-if="!deployment.causes.length">Unknown</span>
              <span ng-if="deployment.causes.length">
                <span ng-repeat="cause in deployment.causes">
                  <span ng-switch="cause.type">
                    <span ng-switch-when="ImageChange">
                      <span ng-if="cause.imageTrigger.from">
                        <abbr title="{{cause.imageTrigger.from | imageObjectRef : null : true}}">Image</abbr> change
                      </span>
                    </span>
                    <span ng-switch-when="ConfigChange">Config change</span>
                    <span ng-switch-default>{{cause.type}}</span>
                  </span>
                </span>
              </span>
            </td>
          </tr>
        </tbody>
      </table>
      <div ng-if="(unfilteredReplicationControllers | hashSize) > 0">
        <h3>Other replication controllers</h3>
        <table class="table table-bordered">
          <thead>
            <tr>
              <th>Name</th>
              <th>Status</th>
              <th>Created</th>
            </tr>
          </thead>
          <tbody>
            <!-- We only show this if there are replication controllers but the active filter is hiding them, otherwise the RC table doesnt show
                 at all -->
            <tr ng-if="(deploymentsByDeploymentConfig[''] | hashSize) === 0"><td><em>No replication controllers to show</em></td></tr>
            <tr ng-repeat="deployment in deploymentsByDeploymentConfig[''] | orderObjectsByDate : true">
              <td>
                <a ng-href="{{deployment | navigateResourceURL}}">{{deployment.metadata.name}}</a>
              </td>
              <td>
                <span class="fa fa-check text-success" aria-hidden="true"></span>
                <span>Deployed, <span ng-if="deployment.status.replicas !== deployment.spec.replicas">{{deployment.status.replicas}}/</span>{{deployment.spec.replicas}} replica<span ng-if="deployment.spec.replicas != 1">s</span></span>
              </td>
              <td>
                <relative-timestamp timestamp="deployment.metadata.creationTimestamp"></relative-timestamp>
                <span>- {{deployment.metadata.creationTimestamp | date : 'short'}}</span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </project-page>
</div>
