{% import "macros/widgets.html.twig" as widgets %}
{% import "macros/datatables.html.twig" as tables %}
{% extends 'export/layout.html.twig' %}

{% set columnTitles = {} %}
{% set columns = {
    'date': true,
    'username': false,
    'customer': true,
    'project': true,
    'activity': true,
    'description': false,
    'exported': false,
    'tags': false,
} %}

{% for id, field in timesheetMetaFields %}
    {% set columns = columns|merge({ ('t_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('t_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in customerMetaFields %}
    {% set columns = columns|merge({ ('c_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('c_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in projectMetaFields %}
    {% set columns = columns|merge({ ('p_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('p_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in activityMetaFields %}
    {% set columns = columns|merge({ ('a_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('a_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in userPreferences %}
    {% set columns = columns|merge({ ('u_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('u_' ~ field.name): (field.label)}) %}
{% endfor %}

{% set columns = columns|merge({
    'hourlyRate': false,
    'fixedRate': false,
    'duration': 'label.duration',
    'rate': 'label.rate',
}) %}

{% block javascripts %}
    <script type="text/javascript">
        document.getElementById('summary-by-activities').addEventListener('click', function(event) {
            document.getElementById('summary-project').style.display = event.target.checked ? 'none' : 'table';
            document.getElementById('summary-activity').style.display = event.target.checked ? 'table' : 'none';
        });
        document.getElementById('summary-show').addEventListener('click', function(event) {
            document.getElementById('export-summary').style.display = event.target.checked ? 'block' : 'none';
        });
        document.getElementById('summary-duration').addEventListener('click', function(event) {
            if (!document.getElementById('summary-rate').checked) {
                return;
            }
            document.getElementById('summary-rate').disabled = !event.target.checked;
            var cells = document.getElementsByClassName('summary-duration');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
        });
        document.getElementById('summary-rate').addEventListener('click', function(event) {
            if (!document.getElementById('summary-duration').checked) {
                return;
            }
            document.getElementById('summary-duration').disabled = !event.target.checked;
            var cells = document.getElementsByClassName('summary-rate');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
        });
        document.getElementById('summary-show').addEventListener('click', function(event) {
            document.getElementById('export-summary').style.display = event.target.checked ? 'block' : 'none';
        });
        document.getElementById('records-show').addEventListener('click', function(event) {
            document.getElementById('export-records').style.display = event.target.checked ? 'block' : 'none';
        });
        var columnCheckboxes = document.getElementsByClassName('column-visibility-changer');
        for (var checkbox of columnCheckboxes) {
            checkbox.addEventListener('click', function(event) {
                var cells = document.getElementsByClassName('column-'+event.target.name);
                for (var columnCell of cells) {
                    columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
                }
            });
        }
    </script>
{% endblock %}

{% block styles %}
    <style>
        .items tr.summary {
        }
        .items td.totals {
            font-weight: bold;
            text-align: right;
        }
        .items td.duration,
        .items th.duration,
        .items th.cost,
        .items td.cost {
            text-align: center;
        }
        .toolbar {
            border-bottom: 1px solid #ccc;
            background-color: #eee;
            padding: 5px 0 0 5px;
        }
    </style>
{% endblock %}

{% block export %}
    <div class="row no-print toolbar">
        <div class="col-xs-12">
            <form class="navbar-form">
                <div class="form-group">
                    {{ 'export.summary'|trans }}:
                </div>
                <div class="form-group">
                    <label class="control-label" for="summary-show">
                        <input type="checkbox" id="summary-show" name="summary-show" checked="checked">
                        {{ 'label.visible'|trans }}
                    </label>
                </div>
                <div class="form-group">
                    <label class="control-label" for="summary-by-activities">
                        <input type="checkbox" id="summary-by-activities" name="summary-by-activities">
                        {{ 'label.activity'|trans }}
                    </label>
                </div>
                <div class="form-group">
                    <label class="control-label" for="summary-duration">
                        <input type="checkbox" id="summary-duration" name="summary-duration" checked>
                        {{ 'label.duration'|trans }}
                    </label>
                </div>
                <div class="form-group">
                    <label class="control-label" for="summary-rate">
                        <input type="checkbox" id="summary-rate" name="summary-rate" checked>
                        {{ 'label.rate'|trans }}
                    </label>
                </div>
            </form>

            <form class="navbar-form">
                <div class="form-group">
                    {{ 'export.full_list'|trans }}:
                </div>
                <div class="form-group">
                    <label class="control-label" for="records-show">
                        <input type="checkbox" id="records-show" name="records-show" checked="checked">
                        {{ 'label.visible'|trans }}
                    </label>
                </div>
                {% for columnId, visibility in columns %}
                    <div class="form-group">
                        <label class="control-label" for="records-column-{{ columnId }}">
                            <input type="checkbox" class="column-visibility-changer" id="records-column-{{ columnId }}" name="{{ columnId }}" {% if visibility %}checked="checked"{% endif %}>
                            {{ columnTitles[columnId]|default('label.'~columnId)|trans }}
                        </label>
                    </div>
                {% endfor %}
            </form>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12">
            <h2>{{ 'export.document_title'|trans }}</h2>
            <p>
                {{ 'export.period'|trans }}:
                {{ query.begin|date_short }} - {{ query.end|date_short }}
            </p>
        </div>
    </div>

    <div class="row" id="export-summary">
        <div class="col-xs-12">
            <h3>{{ 'export.summary'|trans }}</h3>
            <table class="items table table-condensed table-bordered dataTable" id="summary-project">
                <thead>
                <tr>
                    <th>{{ 'label.customer'|trans }}</th>
                    <th>{{ 'label.project'|trans }}</th>
                    <th class="duration summary-duration">{{ 'label.duration'|trans }}</th>
                    <th class="cost summary-rate">{{ 'label.rate'|trans }}</th>
                </tr>
                </thead>
                <tbody>
                {% set customer = null %}
                {% set customerDuration = 0 %}
                {% set customerRate = 0 %}
                {% set customerCurrency = null %}
                {% for summary in summaries %}
                    {% if customer is same as(null) %}
                        {% set customer = summary.customer %}
                        {% set customerCurrency = summary.currency %}
                    {% endif %}
                    {% if customer is not same as(summary.customer) %}
                        <tr class="summary">
                            <td colspan="2"></td>
                            <td class="totals duration summary-duration">{{ customerDuration|duration }}</td>
                            <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                        </tr>
                        {% set customerCurrency = summary.currency %}
                        {% set customer = summary.customer %}
                        {% set customerDuration = 0 %}
                        {% set customerRate = 0 %}
                    {% endif %}
                    <tr>
                        <td>{{ summary.customer }}</td>
                        <td>{{ summary.project }}</td>
                        <td class="duration summary-duration">{{ summary.duration|duration }}</td>
                        <td class="cost summary-rate">{{ summary.rate|money(summary.currency) }}</td>
                    </tr>
                    {% set customerDuration = customerDuration + summary.duration %}
                    {% set customerRate = customerRate + summary.rate %}
                {% endfor %}
                {% if customer is not same as(null) %}
                    <tr class="summary">
                        <td colspan="2"></td>
                        <td class="totals duration summary-duration">{{ customerDuration|duration }}</td>
                        <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                    </tr>
                {% endif %}
                </tbody>
            </table>

            <table class="items table table-condensed table-bordered dataTable" id="summary-activity" style="display:none">
                <thead>
                <tr>
                    <th>{{ 'label.customer'|trans }}</th>
                    <th>{{ 'label.project'|trans }}</th>
                    <th>{{ 'label.activity'|trans }}</th>
                    <th class="duration summary-duration">{{ 'label.duration'|trans }}</th>
                    <th class="cost summary-rate">{{ 'label.rate'|trans }}</th>
                </tr>
                </thead>
                <tbody>
                {% set customer = null %}
                {% set customerDuration = 0 %}
                {% set customerRate = 0 %}
                {% set customerCurrency = null %}
                {% for summary in summaries %}
                {% if customer is same as(null) %}
                    {% set customer = summary.customer %}
                    {% set customerCurrency = summary.currency %}
                {% endif %}
                {% if customer is not same as(summary.customer) %}
                    <tr class="summary">
                        <td colspan="3"></td>
                        <td class="totals duration summary-duration">{{ customerDuration|duration }}</td>
                        <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                    </tr>
                    {% set customerCurrency = summary.currency %}
                    {% set customer = summary.customer %}
                    {% set customerDuration = 0 %}
                    {% set customerRate = 0 %}
                {% endif %}
                {% for activitySummary in summary.activities %}
                <tr>
                    <td>{{ summary.customer }}</td>
                    <td>{{ summary.project }}</td>
                    <td>{{ activitySummary.activity }}</td>
                    <td class="duration summary-duration">{{ activitySummary.duration|duration }}</td>
                    <td class="cost summary-rate">{{ activitySummary.rate|money(activitySummary.currency) }}</td>
                </tr>
                {% endfor %}
                {% set customerDuration = customerDuration + summary.duration %}
                {% set customerRate = customerRate + summary.rate %}
                {% endfor %}
                {% if customer is not same as(null) %}
                    <tr class="summary">
                        <td colspan="3"></td>
                        <td class="totals duration summary-duration">{{ customerDuration|duration }}</td>
                        <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                    </tr>
                {% endif %}
                </tbody>
            </table>
        </div>
    </div>

    <div class="row" id="export-records">
        <div class="col-xs-12">
            <h3>{{ 'export.full_list'|trans }}</h3>
            <table class="table table-condensed table-bordered dataTable">
                <thead>
                <tr>
                    {% for columnId, visibility in columns %}
                    <th class="column column-{{ columnId }}" {% if not visibility %}style="display: none"{% endif %}>
                        {{ columnTitles[columnId]|default('label.'~columnId)|trans }}
                    </th>
                    {% endfor %}
                </tr>
                </thead>
                <tbody>
                {% set timeWorked = 0 %}
                {% set rateTotal = 0 %}
                {% set currency = false %}
                {% for entry in entries %}
                    {% set timeWorked = timeWorked + entry.duration %}
                    {% set rateTotal = rateTotal + entry.rate %}
                    {% if currency is same as(false) %}
                        {% set currency = entry.project.customer.currency %}
                    {% endif %}
                    {% if currency is not same as(entry.project.customer.currency) %}
                        {% set currency = null %}
                    {% endif %}
                    <tr>
                        <td class="column-date text-nowrap" {% if not columns.date %}style="display: none"{% endif %}>
                            {{ entry.begin|date_time }}
                            {% if entry.end %}
                                <br>
                                {{ entry.end|date_time }}
                            {% endif %}
                        </td>
                        <td class="column-username" {% if not columns.username %}style="display: none"{% endif %}>
                            {{ widgets.username(entry.user) }}
                        </td>
                        <td class="column-customer" {% if not columns.customer %}style="display: none"{% endif %}>
                            {{ entry.project.customer.name }}
                        </td>
                        <td class="column-project" {% if not columns.project %}style="display: none"{% endif %}>{{ entry.project.name }}
                        </td>
                        <td class="column-activity" {% if not columns.activity %}style="display: none"{% endif %}>
                            {% if entry.activity is not null %}
                                {{ entry.activity.name }}
                            {% endif %}
                        </td>
                        <td class="column-description" {% if not columns.description %}style="display: none"{% endif %}>
                            {% if entry.description is not empty %}
                                {{ entry.description|escape|desc2html }}
                            {% endif %}
                        </td>
                        <td class="column-exported" {% if not columns.exported %}style="display: none"{% endif %}>
                            {% if entry.exported %}
                                {{ 'entryState.exported'|trans }}
                            {% else %}
                                {{ 'entryState.not_exported'|trans }}
                            {% endif %}
                        </td>
                        <td class="column-tags" {% if not columns.tags %}style="display: none"{% endif %}>
                            {% if entry.tags is not empty %}
                                {{ entry.tagsAsArray|join(', ') }}
                            {% endif %}
                        </td>
                        {% for id, field in timesheetMetaFields %}
                            <td class="column-{{ 't_' ~ field.name }} text-nowrap" {% if not columns['t_' ~ field.name] %}style="display: none"{% endif %}>
                                {{ tables.datatable_meta_column(entry, field) }}
                            </td>
                        {% endfor %}
                        {% for id, field in customerMetaFields %}
                            <td class="column-{{ 'c_' ~ field.name }} text-nowrap" {% if not columns['c_' ~ field.name] %}style="display: none"{% endif %}>
                                {{ tables.datatable_meta_column(entry.project.customer, field) }}
                            </td>
                        {% endfor %}
                        {% for id, field in projectMetaFields %}
                            <td class="column-{{ 'p_' ~ field.name }} text-nowrap" {% if not columns['p_' ~ field.name] %}style="display: none"{% endif %}>
                                {{ tables.datatable_meta_column(entry.project, field) }}
                            </td>
                        {% endfor %}
                        {% for id, field in activityMetaFields %}
                            <td class="column-{{ 'a_' ~ field.name }} text-nowrap" {% if not columns['a_' ~ field.name] %}style="display: none"{% endif %}>
                                {% if entry.activity is not null %}
                                    {{ tables.datatable_meta_column(entry.activity, field) }}
                                {% endif %}
                            </td>
                        {% endfor %}
                        {% for id, field in userPreferences %}
                            <td class="column-{{ 'u_' ~ field.name }} text-nowrap" {% if not columns['u_' ~ field.name] %}style="display: none"{% endif %}>
                                {% set metaField = entry.user.preference(field.name) %}
                                {% if not metaField is null and metaField.value is not null and metaField.value is not empty %}
                                    {{ widgets.form_type_value(field.type, metaField.value, entry.user) }}
                                {% endif %}
                            </td>
                        {% endfor %}
                        <td class="column-hourlyRate text-nowrap" {% if not columns.hourlyRate %}style="display: none"{% endif %}>
                            {{ entry.hourlyRate|money(entry.project.customer.currency) }}
                        </td>
                        <td class="column-fixedRate text-nowrap" {% if not columns.fixedRate %}style="display: none"{% endif %}>
                            {{ entry.fixedRate|money(entry.project.customer.currency) }}
                        </td>
                        <td class="column-duration text-nowrap" {% if not columns.duration %}style="display: none"{% endif %}>
                            {{ entry.duration|duration }}
                        </td>
                        <td class="column-rate text-nowrap" {% if not columns.rate %}style="display: none"{% endif %}>
                            {{ entry.rate|money(entry.project.customer.currency) }}
                        </td>
                    </tr>
                {% endfor %}
                {# leave in tbody instead of adding it to tfoot, as tfoot will be repeated on each page when printing #}
                <tr>
                    {% for id, visibility in columns %}
                        {% if id != 'duration' and id != 'rate' %}
                            <th class="column-{{ id }}" {% if not visibility %}style="display: none"{% endif %}></th>
                        {% endif %}
                    {% endfor %}
                    <th class="text-nowrap column-duration">
                        {{- timeWorked|duration -}}
                    </th>
                    <th class="text-nowrap column-rate">
                        {%- if currency is not null and currency is not same as(false) %}
                            {{ rateTotal|money(currency) }}
                        {% else %}
                            {{ rateTotal|money }}
                        {% endif -%}
                    </th>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

{% endblock %}