Skip to content

Commit

Permalink
Pickadate format based on py format (#242)
Browse files Browse the repository at this point in the history 
* Pickadate format now based on js format.
Closes #237

* Pickadate format conversion: remove additional unsupported formats.

* Pickadate format conversion: fix submit format.

* Pickadate format: rename variable.

* Pickadate format: remove additional hardcoded value.

* Pickadate format: fix unsupported removal order.

* Pickadate format: fix typo.

* Pickadate format: fix typo.

* Pickadate format: remove duplicated formats.

* Pickadate format: improved logic.

Also renamed variables.

* Update NEMO/apps/kiosk/templates/kiosk/tool_reservation.html

* Update NEMO/templates/mobile/new_reservation.html

* fixed wrong format for date

---------

Co-authored-by: Mathieu Rampant <mathieu.rampant@gmail.com>
  • Loading branch information
@r-xyz @rptmat57
r-xyz and rptmat57 authored Jun 19, 2024
1 parent 340f661 commit 4d57493
Show file tree
Hide file tree
Showing 5 changed files with 73 additions and 14 deletions.
12 changes: 6 additions & 6 deletions NEMO/apps/kiosk/templates/kiosk/tool_reservation.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,12 +56,12 @@ <h4>When would you like to reserve the {{ tool }}?</h4>
{% for item in tool_reservation_times %}
unavailable_times.push([{{ item.start|date:"U" }},{{ item.end|date:"U" }}]);
{% endfor %}
let date_picker = $('#date').pickadate({format: "dddd, mmmm d", formatSubmit: "yyyy-mm-dd", firstDay: 1, hiddenName: true, onSet: refresh_times});
let start_time_picker = $('#start').pickatime({interval: 15, formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
let end_time_picker = $('#end').pickatime({interval: 15, formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
let date_picker = $('#date').pickadate({format: "{{ pickadate_date_format }}", formatSubmit: "yyyy-mm-dd", firstDay: 1, hiddenName: true, onSet: refresh_times});
let start_time_picker = $('#start').pickatime({interval: 15, format: "{{ pickadate_time_format }}", formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
let end_time_picker = $('#end').pickatime({interval: 15, format: "{{ pickadate_time_format }}", formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
// set initial date
if ('{{ date|default_if_none:'' }}') {
date_picker.pickadate('picker').set('select', '{{ date }}', {format: 'yyyy-mm-dd'})
date_picker.pickadate('picker').set('select', '{{ date }}', {format: '{{ pickadate_date_format }}'})
}
function refresh_times() {
start_time_picker.pickatime('picker').render();
Expand All @@ -77,11 +77,11 @@ <h4>When would you like to reserve the {{ tool }}?</h4>
let start = times[0];
let end = times[1];
if (date_time_selected >= start && date_time_selected < end) {
return '<sp !an>h:i A</sp !an> <sm !all> !alre!ad!y re!serve!d</sm !all>';
return '<sp !an>{{ pickadate_time_format }}</sp !an> <sm !all> !alre!ad!y re!serve!d</sm !all>';
}
}
}
return "h:i A";
return '{{ pickadate_time_format }}';
}
revert(120)
</script>
10 changes: 9 additions & 1 deletion NEMO/context_processors.py
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,11 @@
from NEMO.models import Area, Notification, PhysicalAccessLevel, Tool, User
from NEMO.utilities import date_input_js_format, datetime_input_js_format, time_input_js_format
from NEMO.utilities import (
date_input_js_format,
datetime_input_js_format,
time_input_js_format,
pickadate_date_format,
pickadate_time_format,
)
from NEMO.views.customization import CustomizationBase
from NEMO.views.notifications import get_notification_counts

Expand Down Expand Up @@ -84,6 +90,8 @@ def base_context(request):
"time_input_js_format": time_input_js_format,
"date_input_js_format": date_input_js_format,
"datetime_input_js_format": datetime_input_js_format,
"pickadate_date_format": pickadate_date_format,
"pickadate_time_format": pickadate_time_format,
"no_header": request.session.get("no_header", False),
"safety_menu_item": customization_values.get("safety_main_menu") == "enabled",
"calendar_page_title": customization_values.get("calendar_page_title"),
Expand Down
12 changes: 6 additions & 6 deletions NEMO/templates/mobile/new_reservation.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,13 +69,13 @@ <h4>When would you like to reserve the {{ item }}?</h4>
{% for times in item_reservation_times %}
unavailable_times.push([{{ times.start|date:"U" }},{{ times.end|date:"U" }}]);
{% endfor %}
let date_picker = $('#date').pickadate({format: "dddd, mmmm d", formatSubmit: "yyyy-mm-dd", firstDay: 1, hiddenName: true, onSet: refresh_times});
let start_time_picker = $('#start').pickatime({interval: 15, formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
let end_time_picker = $('#end').pickatime({interval: 15, formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
let date_picker = $('#date').pickadate({format: "{{ pickadate_date_format }}", formatSubmit: "yyyy-mm-dd", firstDay: 1, hiddenName: true, onSet: refresh_times});
let start_time_picker = $('#start').pickatime({interval: 15, format: "{{ pickadate_time_format }}", formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
let end_time_picker = $('#end').pickatime({interval: 15, format: "{{ pickadate_time_format }}", formatSubmit: "H:i", hiddenName: true, formatLabel: format_label});
// set initial date
if ('{{ date|default_if_none:'' }}')
{
date_picker.pickadate('picker').set('select', '{{ date }}', {format: 'yyyy-mm-dd'})
date_picker.pickadate('picker').set('select', '{{ date }}', {format: '{{ pickadate_date_format }}'})
}
function refresh_times()
{
Expand All @@ -93,11 +93,11 @@ <h4>When would you like to reserve the {{ item }}?</h4>
let start = times[0];
let end = times[1];
if (date_time_selected >= start && date_time_selected < end) {
return '<sp !an>h:i A</sp !an> <sm !all> !alre!ad!y re!serve!d</sm !all>';
return '<sp !an>{{ pickadate_time_format }}</sp !an> <sm !all> !alre!ad!y re!serve!d</sm !all>';
}
}
}
return "h:i A";
return "{{ pickadate_time_format }}";
}

</script>
Expand Down
44 changes: 43 additions & 1 deletion NEMO/utilities.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,24 @@
"%%": "%",
}

py_to_pick_date_formats = {
"%A": "dddd",
"%a": "ddd",
"%B": "mmmm",
"%b": "mmm",
"%d": "dd",
"%H": "HH",
"%I": "hh",
"%M": "i",
"%m": "mm",
"%p": "A",
"%X": "HH:i",
"%x": "mm/dd/yyyy",
"%Y": "yyyy",
"%y": "yy",
"%%": "%",
}


# Convert a python format string to javascript format string
def convert_py_format_to_js(string_format: str) -> str:
Expand All @@ -72,13 +90,37 @@ def convert_py_format_to_js(string_format: str) -> str:
return string_format


def convert_py_format_to_pickadate(string_format: str) -> str:
string_format = (
string_format.replace("%w", "")
.replace("%s", "")
.replace("%f", "")
.replace("%:z", "")
.replace("%z", "")
.replace("%Z", "")
.replace("%j", "")
.replace(":%S", "")
.replace("%S", "")
.replace("%U", "")
.replace("%W", "")
.replace("%c", "")
.replace("%G", "")
.replace("%u", "")
.replace("%V", "")
)
for py, pick in py_to_pick_date_formats.items():
string_format = pick.join(string_format.split(py))
return string_format


time_input_format = get_format("TIME_INPUT_FORMATS")[0]
date_input_format = get_format("DATE_INPUT_FORMATS")[0]
datetime_input_format = get_format("DATETIME_INPUT_FORMATS")[0]
time_input_js_format = convert_py_format_to_js(time_input_format)
date_input_js_format = convert_py_format_to_js(date_input_format)
datetime_input_js_format = convert_py_format_to_js(datetime_input_format)

pickadate_date_format = getattr(settings, "PICKADATE_DATE_FORMAT", convert_py_format_to_pickadate(date_input_format))
pickadate_time_format = getattr(settings, "PICKADATE_TIME_FORMAT", convert_py_format_to_pickadate(time_input_format))

supported_embedded_video_extensions = [".mp4", ".ogv", ".webm", ".3gp"]
supported_embedded_pdf_extensions = [".pdf"]
Expand Down
9 changes: 9 additions & 0 deletions resources/settings.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,15 @@
DATE_INPUT_FORMATS = ["%m/%d/%Y", *global_settings.DATE_INPUT_FORMATS]
TIME_INPUT_FORMATS = ["%I:%M:%S %p", *global_settings.TIME_INPUT_FORMATS]

# -------------------- Pick date and time formats --------------------
# Those formats are optional in most cases and only used on kiosk or mobile views, when picking up date/time separately.
# If not defined, a conversion from DATE_INPUT_FORMATS and TIME_INPUT_FORMATS will be attempted.
# See allowed date formats at https://amsul.ca/pickadate.js/date/#formatting-rules
# See allowed time formats at https://amsul.ca/pickadate.js/time/#formatting-rules
# PICKADATE_DATE_FORMAT = "mm/dd/yyyy"
# PICKADATE_TIME_FORMAT = "HH:i A"


# -------------------- Internationalization and localization --------------------
# A boolean that specifies whether Django’s translation system should be enabled.
# This provides an easy way to turn it off, for performance.
Expand Down

0 comments on commit 4d57493

Please sign in to comment.