{% extends "base.html" %}
{% load i18n lazysignup_tags %}
{% block content %}

	<ul class="list-group">

<li class="list-group-item new-task-item task-item">

<div class="col-xs-3 form-group">
<form action="/refresh_done/" method="post">
{% csrf_token %}
<input type="submit" class="btn" value="Refresh" name="refreshbtn">
</form>
</div>

<div class="col-xs-10 form-group">
<h6 style="text-align:right;float:right;">
{{ variable }} </h6>
</div>
</li>

              {% if not user|is_lazy_user %}
		<li class="list-group-item new-task-item task-item">
		  	<form action="/add/" method="post">
		  		{% csrf_token %}
				<div class="col-xs-1 form-group">
				</div>
				<div class="col-xs-10 form-group">
					<input class="form-control" name="name" placeholder="Enter a new job name...">
				</div>
				<div class="col-xs-1 form-group">
					<button type="submit" class="btn btn-link">
		  				<span class="fa fa-check save-button"></span>						
					</button>					
				</div>
			</form>
		</li>
                {% endif %}
                <li class="list-group-item task-item">
                <div class="col-xs-1">
                     done
                </div>
                <div class="col-xs-10">
                  job name
                </div>
                <div class="col-xs-10">
                  date created
                </div>
                <div class="col-xs-1">
                  delete
                </div>
                </li>                 
		{% for task in tasks %}
			<li class="list-group-item task-item">
			  	<div class="col-xs-1">
		  			{% if task.done %}
			  			<span class="fa fa-check-square-o"></span>
					{% else %}
					  {% if task.running > 0  %}
			  			<span class="fa fa-spinner
			  			fa-spin"></span>
			  			{{ task.running }}%
			                  {% else %}
			                        <span class="fa fa-square-o"></span>
			                  {% endif %}
					{% endif %}

			  	</div>
				<div class="col-xs-10">
                                  <a href="/details/{{task.id}}/">
				  {{ task.name }}</div>
				  </a>
				<div class="col-xs-10">{{ task.created_date  }}</div>
			  	<div class="col-xs-1 actions-column">
			  		<a href="/delete/{{task.id}}/"><span class="fa fa-times"></span></a>
			  	</div>
			</li>		
		{% endfor %}		
	</ul>

{% if not alldone %}
<script src="/static/jquery.min.js"></script>

<script>
function worker() {
  $.ajax({
    data:{csrfmiddlewaretoken: '{{ csrf_token }}'},
    url: "/refresh_done/", 
    type:"post",
    success: function(data) {
      window.location.href = "/refresh_done/";
    },
    complete: function() {
      // Schedule the next request when the current one's complete
      setTimeout(worker, 30000);
    }
  });
};
$(document).ready(function() {
  // run the first time; all subsequent calls will take care of themselves
  setTimeout(worker, 30000);
});
</script>
{% endif %} 

{% endblock %}