{% extends "wafer/base_form.html" %}
{% load crispy_forms_tags %}
{% block title %}{{ WAFER_CONFERENCE_NAME }} - Change Food {{ object.user.userprofile.display_name }}{% endblock %}
{% block content %}
<h1>Food - {{ object.user.userprofile.display_name }}</h1>
{% crispy form %}
{% endblock %}
{% block extra_foot %}
{{ block.super }}
<script type="text/javascript">
'use strict';
$(function() {
  var original = 0;

  // Select all buttons on food selection table
  function updateSelectAllButton(toggle, checkboxes) {
    if (checkboxes.filter(':checked').length == 0) {
      toggle.addClass('fa-square')
        .removeClass('fa-minus-square fa-check-square');
    } else if (checkboxes.filter(':not(:checked)').length == 0) {
      toggle.addClass('fa-check-square')
        .removeClass('fa-square fa-minus-square');
    } else {
      toggle.addClass('fa-minus-square')
        .removeClass('fa-square fa-check-square');
    }
  }
  function calculateTotal() {
    var total = 0;
    var checkboxes = $('#meals input:checked');
    checkboxes.each(function() {
      if (this.value.startsWith('breakfast')) {
        total = total + {{ prices.breakfast }};
      } else if (this.value.startsWith('lunch')) {
        total = total + {{ prices.lunch }};
      } else if (this.value.startsWith('dinner')) {
        total = total + {{ prices.dinner }};
      }
    });
    var conference_dinner = $('input#id_conference_dinner:checked');
    conference_dinner.each(function() {
      total = total + {{ prices.conference_dinner }};
    });
    return total;
  }

  function setOriginal() {
    original = calculateTotal();
    if (original) {
      $('#delta').parent().show();
    }
  }

  function updateTotal() {
    var total = calculateTotal();
    $('#total').html(total.toFixed(2));
    $('#delta').html((total - original).toFixed(2));
  }

  $('#meals .select-day').each(function() {
    var toggle = $(this);
    var checkboxes = $(this).closest('tr').find('input');
    updateSelectAllButton(toggle, checkboxes);
    $(this).parent().on('click', function(e) {
      var select = checkboxes.filter(':checked').length == 0;
      checkboxes.each(function() {
        this.checked = select;
      });
      updateSelectAllButton(toggle, checkboxes);
      updateTotal();
    });
    checkboxes.each(function() {
      $(this).on('click', function() {
        updateSelectAllButton(toggle, checkboxes);
        updateTotal();
      });
    });
  });

  $('#meals .select-all').on('click', function(e) {
    var selectAll = $(this);
    var table = selectAll.closest('table');
    var checkboxes = table.find('input');
    var selectDays = table.find('.select-day');

    var select = checkboxes.filter(':checked').length == 0;

    checkboxes.each(function() {
      this.checked = select;
    });

    updateSelectAllButton(selectAll, checkboxes);
    selectDays.each(function() {
      updateSelectAllButton($(this), checkboxes);
    });
    updateTotal();
  });

  $('input#id_conference_dinner').on('click', function(e) {
    updateTotal();
  });

  setOriginal();
  updateTotal();
});
</script>
{% endblock %}
