{% extends "ecm/assets/assets.html" %}
{% load i18n %}
{% block headtitle %}{% trans 'Asset Changes on' %} {{ date }}{% endblock %}



{% block title %}
<div>
  <h1 class="pagetitle">{% trans 'Asset Changes on' %}
    <small>
      <select id="date_selector" class="date_selector">{% for d in dates %}
        <option value="{{ d.value }}" {% if d.value == date_str %}selected="selected"{% endif %}>{{ d.show|ecm_datetime }}</option>
      {% endfor %}</select>
    </small>
  </h1>
</div>
{% endblock %}

{% block javascripts %}
<script type="text/javascript">
BASE_URL = '/assets/changes/{{ date_str }}/';
DATE = '{{ date_str }}';
PARAMS = {
    stations: true,
    space: true,
    since_weeks: {{since_weeks}},
    to_weeks: {{to_weeks}},
    divisions: '{%for h in hangars%}{{h.hangarID}}{%if not forloop.last%},{%endif%}{%endfor%}',
};
</script>
{% endblock %}


{% block assets_javascripts %}
<script type="text/javascript">
function updateDateSelector() {
    $.getJSON('/assets/changes/dates/', PARAMS)
     .success(function (data) {
         var options = '';
         var selected = '';
         for (var i=0; i < data.length; i++) {
             selected = data[i].value == DATE ? 'selected' : '';
             options += '<option value="' + data[i].value + '" ' + selected + '>' + data[i].show + '</option>';
         }
         $('#date_selector').html(options);         
     });
}
$(document).ready(function () {
    $('#date_selector').change(function () {
        DATE = $('#date_selector option:selected').val();
        BASE_URL = '/assets/changes/' + DATE + '/';
        $('#assets_tree').jstree('close_all');
        $('#assets_tree').jstree('refresh');
    });

    $('#apply_filter').click(function() {
        PARAMS.stations = $('button#show_stations').hasClass('active');
        PARAMS.space = $('button#show_space').hasClass('active');
        
        var divisionsBtns = $('#division_buttons button.active');
        var divisions = '';
        for (var i=0 ; i < divisionsBtns.length ; i++) {
            divisions += ',' + divisionsBtns[i].id;
        }
        if (divisions.length != 0) {
            divisions = divisions.substring(1);
        }
        PARAMS.divisions = divisions;
        updateDateSelector();
        $('#assets_tree').jstree('close_all');
        $('#assets_tree').jstree('refresh');
    });

    $('#reset_filter').click(function() {
        $('#space_buttons button').addClass('active');
        $('#division_buttons button').addClass('active');
        PARAMS.stations = true;
        PARAMS.space = true;
        PARAMS.stations = true;
        var divisionsBtns = $('#division_buttons button');
        var divisions = '';
        for (var i=0 ; i < divisionsBtns.length ; i++) {
            divisions += ',' + divisionsBtns[i].id;
        }
        if (divisions.length != 0) {
            divisions = divisions.substring(1);
        }
        PARAMS.divisions = divisions;
        updateDateSelector();
        $('#assets_tree').jstree('close_all');
        $('#assets_tree').jstree('refresh');
    });
});
</script>
{% endblock %}