{% extends 'home.jinja' %}


{% block breadcrumb %}
{{ super() }}
<li class="divider">/</li>
<li><a href="{{ url_for('project.work.home') }}">Projects Home</a></li>
{% endblock %}


{% block left %}
<!--  <ul class="nav nav-list">
    <li>
      <form class="form-search" action="">
        <div class="input-append">
          <input type="text" class="input-medium search-query" placeholder="keyword" name="q">
          <button type="submit" class="btn"><i class="icon-search"></i> Search</button>
        </div>
      </form>
    </li>
  </ul>
-->

  <ul class="nav nav-tabs nav-stacked">
    {% for project in projects %}
    <li>
      <a href="{{ url_for('project.work.render_project', project_id=project.id) }}"><i class="icon-tasks"></i> {{ project.name }}</a>
    </li>
    {% endfor %}

    {% if request.nereid_user.is_project_admin() %}
    {# admin only area #}
    <hr/>
    <li class="nav-header">
      {{ _('Administration') }}
    </li>
    <li>
      <a href="{{ url_for('project.work.render_global_timesheet') }}">
        <i class="icon-time"></i> {{ _("Timesheets") }}
      </a>
    </li>
    <li>
      <div class="modal fade" id="new-project">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">×</button>
          <h3>{{ _('Create a New Project') }}</h3>
        </div>
        <div class="modal-body">
          <form class="form-vertical well" id="new-project-form" method="POST" action="{{ url_for('project.work.create_project') }}">
            <label for="name">Project Name:</label>
            <input class="span6" type="text" placeholder="ABC Project" name="name" required="required" id="name"/>
            <div class="form-actions">
              <button type="submit" class="btn btn-info span5" id="create_new_project" data-loading-text="Creating New Project">
                <i class="icon-plus icon-white"></i> {{ _('Save') }}
              </button>
            </div>
          </form>
        </div>
      </div>
      
      <a data-toggle="modal" href="#new-project">
        <i class="icon-plus"></i> {{ _("New Project") }}
      </a>
    </li>
    {% endif %}
    <hr/>
    <li>
      <a href="{{ url_for('project.work.my_tasks', state="opened") }}"><i class="icon-list"></i> {{ _('My tasks') }}</a>
    </li>
    {% if request.nereid_user.has_permissions(['project.manager'])  or request.nereid_user.has_permissions(['project.admin'])%}
    <li>
      <a href="{{ url_for('project.work.render_tasks_by_employee') }}"><i class="icon-list"></i> {{ _('Tasks by employee') }}</a>
    </li>
    {% endif %}
    <hr/>
    <li>
      <a href="#"><i class="icon-question-sign"></i> {{ _("Help") }}</a>
    </li>
  </ul>
{% endblock %}

{% block main %}
<div class="hidden-phone">
<h2>Projects Home</h2>
<div class="row-fluid" id="timeline">
</div>
<div class="row-fluid">
  <div class="span5"></div>
  <a class="btn btn-mini" id="more_timeline">{{ _('Show More') }}</a>
</div>
</div>
{% endblock %}

{% block scripts %}
{{ super() }}
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){

  // Activate datepicker
  var d = new Date();
  $.each($("input.datepicker"), function(index, value) {
    if (!$(this).attr('value')) {
      $("div.datepicker").attr('data-date', d.getMonth()+1 + '/' + d.getDate() + '/' + d.getFullYear());
      $("input.datepicker").attr('value', d.getMonth()+1 + '/' + d.getDate() + '/' + d.getFullYear());
    }
  });
  $(".datepicker").datepicker();

  $('.clear-date').click(function() {
    $(this).parent().find('input.datepicker').val('');
  });

  // Client side validation for the form
  $("form#new-project-form").validate();
});
  function checkperiodform() {
    var start_date = document.periodform.start_date.value
    var end_date = document.periodform.end_date.value
    if (start_date=='' || end_date=='') {
      alert("Both dates are required.")
      return false;
    }
    return true;
  };
</script>
{% endblock %}
