{% extends "base.html" %}
{% set currentPage = "allLabor" %}

{% block body %}

<h1> Labor Summary </h1>

<!--Menu-->
<ul class="nav nav-tabs">
  {% for menuItem in cfg["committee"] %}
    <li role="presentation"><a href="{{menuItem['link']}}">{{menuItem['title']}}</a></li>
  {% endfor %}
  {# if fac is empty we don't want to show the button. we perform two other tests like this #}
  {% if fac is not none %}
  <li style="float: right;"><a href="/{{username}}/download/{{downloadFileName}}"><span class="glyphicon glyphicon-download-alt"></span> Download Labor</a></li>
  {% endif %}
</ul>
<p></p>

<div class = "row">
  <table class = "table table-striped table-hover table-sm">
    <tr>
      <th>Faculty/Proj. Title</th>
      <th># Students</th>
      <th>Project Duration</th>
      <th style = "text-align: right; padding-right: 40px;">Total ($)</th>
    </tr>
    {% if fac is not none %}
      {% for person in fac %}
        <tr id="row{{loop.index0}}">
          <td>
            {{person.username.firstname}} {{person.username.lastname}} <span class = "small">({{person.programID.name}})</span>
            <br />
            <span class = "small">{{person.pID.title|truncate(50, True)}}</span>
          </td>
          
          <td name = "numStudents" style = "text-align: center; ">
            {{person.pID.numberStudents}}
          </td>
          
          <td name = "duration" style = "text-align: center;">
            {{person.pID.duration}}
          </td>
          <th id = "rowTotal{{loop.index0}}" name = "rowTotal" style = "text-align: right; padding-right: 40px;">
            
          </th>
        </tr>
      
      {% endfor %}
    {% endif %}
    
  </table>
  <p style = "text-align: right;"><strong>
    Labor Total = <span id = "grandTotal"></strong></span>
  </p>
</div>

<script>
{% if fac is not none %}
var numRows = {{fac|count}};
{% endif %}
var laborRate = {{params.laborRate}};

</script>

{% endblock %}