{% extends "timepiece/time-sheet/base.html" %}
{% load url from future %}
{% load timepiece_tags %}

{% block title %}Dashboard{% endblock title %}

{% block bodyid %}dashboard{% endblock bodyid %}

{% block breadcrumb %}{% endblock breadcrumb %}

{% block content %}
    {% if perms.timepiece.can_clock_in %}
        <h2>{{ week_start|date:'F j' }} to {{ week_end|date:'F j' }}</h2>

        <div class="row-fluid">
            <div class="span12" id="active-entry">
                <div id="active-header">
                    <a class="btn btn-primary" href="{% url 'timepiece-clock-in' %}">
                        {% if active_entry %}Switch Entry{% else %}Clock In{% endif %}
                    </a>
                    {% if active_entry %}
                        <a class="btn btn-primary" href="{% url 'timepiece-clock-out' active_entry.pk %}">Clock Out</a>
                        <a class="btn btn-{% if active_entry.is_paused %}inverse{% else %}primary{% endif %}"
                                href="{% url 'timepiece-toggle-paused' active_entry.pk %}">
                            {% if active_entry.is_paused %}Resume{% else %}Pause{% endif %}
                        </a>
                        <a class="btn btn-primary" href="{% url 'timepiece-update' active_entry.pk %}">Edit</a>
                    {% endif %}
                </div>

                <p>
                    {% if active_entry %}
                        You have been clocked into
                        <a href="{% url 'view_project' active_entry.project.pk %}">{{ active_entry.project.name }}</a>
                        since {{ active_entry.start_time|date:"g:i A" }}
                        {% ifnotequal active_entry.start_time.date today %}
                            {% if active_entry.start_time.date < week_start or active_entry.start_time.date > week_end %}
                                on {{ active_entry.start_time|date:"F j" }}
                            {% else %}
                                on {{ active_entry.start_time|date:"l" }}
                            {% endif %}
                        {% endifnotequal %}
                        ({{ active_entry.get_active_seconds|humanize_seconds }} time clocked{% if active_entry.seconds_paused or active_entry.is_paused %} and {{ active_entry.seconds_paused|humanize_seconds }} paused{% endif %}).
                    {% else %}
                        You are not currently clocked into a project.
                    {% endif %}
                </p>
            </div>
        </div>

        <ul class="nav nav-tabs">
            <li class="active"><a href="#progress" data-toggle="tab">Progress</a></li>
            <li><a href="#entries" data-toggle="tab">All Entries</a></li>
            <li><a href="#online-users" data-toggle="tab">Online Users</a></li>
        </ul>

        <div class="tab-content">
            <div class="tab-pane active" id="progress">
                <div>
                    <div id="overall-label">Overall</div>
                    <div id="progress-all"
                        data-worked="{{ total_worked }}"
                        data-assigned="{{ total_assigned }}">
                    </div>
                </div>
                {% if project_progress %}
                    <table id="project-progress" class="table table-striped table-bordered">
                        <thead>
                            <th>Project</th>
                            <th>Hours Assigned</th>
                            <th>Hours Worked</th>
                            <th class="desktop">Progress</th>
                        </thead>
                        <tbody>
                            {% for project in project_progress %}
                                <tr>
                                    <td><a href="{% url 'timepiece-clock-in' %}?project={{ project.pk }}">{{ project.name }}</a></td>
                                    <td>{{ project.assigned|convert_hours_to_seconds|humanize_seconds:"%H:%M" }}</td>
                                    <td>{{ project.worked|convert_hours_to_seconds|humanize_seconds:"%H:%M" }}</td>
                                    <td class="desktop project_progress_bar"
                                        data-worked = "{{ project.worked }}"
                                        data-assigned = "{{ project.assigned }}">
                                    </td>
                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                {% else %}
                    <p>No entries or assignments exist for this week.</p>
                {% endif %}
            </div>
            <script src="{{ STATIC_URL }}timepiece/js/dashboard.js"></script>

            <div class="tab-pane" id="entries">
                <a class="btn add-entry" href="{% url 'timepiece-add' %}" id="add-entry">Add Entry</a>
                {% if week_entries %}
                    <table class="table table-striped table-bordered" style="margin-top:10px;">
                        <thead>
                            <tr>
                                <th>Date</th>
                                <th>Entry</th>
                                <th>From</th>
                                <th>To</th>
                                <th class="desktop">Pause Time</th>
                                <th class="desktop">Total Time</th>
                            </tr>
                        </thead>
                        <tbody>
                        {% for entry in week_entries %}
                            <tr>
                                <td>
                                    {% ifchanged entry.start_time|date %}
                                        {{ entry.start_time|date:"D" }}
                                    {% endifchanged %}
                                </td>
                                <td class="project">
                                    {% if entry.status == "unverified" %}
                                       <a href="{% url 'timepiece-update' entry.id %}?next={{ request.get_full_path|urlencode }}"><i class="icon-pencil"></i></a>
                                        <a href="{% url 'timepiece-delete' entry.id %}?next={{ request.get_full_path|urlencode }}"><i class="icon-remove"></i></a>
                                    {% else %}
                                        <span class="label label-success"><i class="icon-ok icon-white"></i></span>
                                    {% endif %}
                                    <span class="desktop">{{ entry.activity.name }} on </span>{{ entry.project.name }}
                                </td>
                                <td class="time break">{{ entry.start_time|date:"g:i A" }}</td>
                                <td class="time break">{{ entry.end_time|date:"g:i A" }}</td>
                                <td class="desktop time break">{{ entry.seconds_paused|humanize_seconds }}</td>
                                <td class="desktop time break">{{ entry.get_seconds|humanize_seconds|slice:":-3" }}</td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                {% else %}
                    <p>No entries exist for this week.</p>
                {% endif %}
            </div>

            <div class="tab-pane" id="online-users">
                {% if others_active_entries %}
                    <table class="table table-striped table-bordered">
                        <thead>
                            <th>Name</th>
                            <th>Project</th>
                            <th class="desktop">Since</th>
                        </thead>
                        <tbody>
                            {% for entry in others_active_entries %}
                                <tr>
                                    <td><i class="icon-user"></i> {{ entry.user__first_name }} {{ entry.user__last_name }}</td>
                                    <td><span class="desktop">{{ entry.activity__name }} on </span>{{ entry.project__name }}</td>
                                    <td class="desktop">
                                        {{ entry.start_time|date:"g:i A" }}
                                        {% ifnotequal entry.start_time.date today %}
                                            {% if entry.start_time.date < week_start or entry.start_time.date > week_end %}
                                                on {{ entry.start_time|date:"N j" }}
                                            {% else %}
                                                on {{ entry.start_time|date:"l" }}
                                            {% endif %}
                                        {% endifnotequal %}
                                    </td>
                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                {% else %}
                    <p>Currently there are no other users with an active entry.</p>
                {% endif %}
            </div>
        </div>
    {% endif %}
{% endblock content %}
