#*
 * Copyright 2012 LinkedIn Corp.
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
*#

<!DOCTYPE html> 
<html lang="en">
	<head>

#parse("azkaban/webapp/servlet/velocity/style.vm")
#parse("azkaban/webapp/servlet/velocity/javascript.vm")
	
		<script type="text/javascript" src="${context}/js/azkaban.executions.view.js"></script>
		<script type="text/javascript">
			var contextURL = "${context}";
			var currentTime = ${currentTime};
			var timezone = "${timezone}";
			var errorMessage = null;
			var successMessage = null;
		</script>
	</head>
	<body>

#set ($current_page="executing")
#parse ("azkaban/webapp/servlet/velocity/nav.vm")

## Page header.

		<div class="az-page-header">
			<div class="container-full">
        <h1><a href="${context}/executor">Executing Flows</a></h1>
			</div>
		</div>

		<div class="container-full">
      
#parse ("azkaban/webapp/servlet/velocity/alerts.vm")

## Page Content

      <ul class="nav nav-tabs" id="header-tabs">
        <li id="currently-running-view-link"><a href="#currently-running">Currently Running</a></li>
        <li id="recently-finished-view-link"><a href="#recently-finished">Recently Finished</a></li>
      </ul>

			<div class="row" id="currently-running-view">
				<div class="col-lg-12">
          <table id="executingJobs" class="table table-striped table-bordered table-hover table-condensed executions-table">
            <thead>
              <tr>
                <th class="execid">Execution Id</th>
                <th>Flow</th>
                <th>Project</th>
                <th class="user">User</th>
                <th class="user">Proxy</th>
                <th class="date">Start Time</th>
                <th class="date">End Time</th>
                <th class="elapse">Elapsed</th>
                <th class="status">Status</th>
                <th class="action">Action</th>
              </tr>
            </thead>
            <tbody>
#if ($runningFlows)
	#foreach ($flow in $runningFlows)
              <tr>
                <td class="tb-name">
                  <a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
                </td>
                <td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
                <td>
                  <a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
                </td>
                <td>${flow.submitUser}</td>
                <td>${flow.proxyUsers}</td>
                <td>$utils.formatDate(${flow.startTime})</td>
                <td>$utils.formatDate(${flow.endTime})</td>
                <td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
                <td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
                <td></td>
              </tr>
	#end
#else
              <tr>
                <td colspan="10">No Executing Flows</td>
              </tr>
#end
            </tbody>
          </table>
				</div><!-- /col-lg-12 -->
			</div><!-- /row -->

			<div class="row" id="recently-finished-view">
				<div class="col-lg-12">
          <table id="recentlyFinished" class="table table-striped table-bordered table-hover table-condensed executions-table">
            <thead>
              <tr>
                <th class="execid">Execution Id</th>
                <th>Flow</th>
                <th>Project</th>
                <th class="user">User</th>
                <th class="user">Proxy</th>
                <th class="date">Start Time</th>
                <th class="date">End Time</th>
                <th class="elapse">Elapsed</th>
                <th class="status">Status</th>
                <th class="action">Action</th>
              </tr>
            </thead>
            <tbody>
#if ($recentlyFinished.isEmpty())
	#foreach ($flow in $recentlyFinished)
              <tr>
                <td class="tb-name execId">
                  <a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
                </td>
                <td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
                <td>
                  <a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
                </td>
                <td>${flow.submitUser}</td>
                <td>${flow.proxyUsers}</td>
                <td>$utils.formatDate(${flow.startTime})</td>
                <td>$utils.formatDate(${flow.endTime})</td>
                <td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
                <td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
                <td></td>
              </tr>
	#end
#else
              <tr>
                <td colspan="10">No Recently Finished</td>
              </tr>
#end	
            </tbody>
          </table>
				</div><!-- /col-lg-12 -->
			</div><!-- /row -->
		
		</div><!-- /container-full -->
	</body>
</html>
