Group choices for scheduling a job by day

The options for scheduling a job by time should be grouped by day,
because a long list of 96 options is not very usable.

On the server side, this commit generates label for the next 4 days in
a friendly format (ie today/tomorrow/Sunday/Monday)

The Javascript component for choosing a time was built in a kind of
old-school jQuery way, where it manipulated the elements on the page.
The complexity of introducing groups of options was just too much for
this pattern, because it involves storing a lot of state in the DOM.

This commit completely rewrites the JS to:

- read the initial options and groups from the HTML and store them
  in the object
- use Hogan to completely re-render the UI from a series of Mustache
  templates, each of which represents a state of the UI and takes the
  inital options and groups
- filter the choices to show when the today/tomorrow/… buttons are
  clicked
This commit is contained in:
Chris Hill-Scott
2016-10-11 14:17:29 +01:00
parent 324e1f9ef4
commit a78d9d5048
5 changed files with 134 additions and 92 deletions

View File

@@ -38,7 +38,7 @@
</span>
{% endif %}
</legend>
<div class="radio-select" data-module="radio-select">
<div class="radio-select" data-module="radio-select" data-categories="{{ field.categories|join(',') }}">
<div class="radio-select-column">
{% for option in field %}
<label class="block-label" for="{{ option.id }}">