From 4cb308bf66ff5bbc65480058d6b63af05330c761 Mon Sep 17 00:00:00 2001 From: Matt Westcott Date: Thu, 9 May 2019 15:46:43 +0100 Subject: [PATCH] Move date / time widget initialiser JS into the widget's form media This allows them to work on pages that do not include _editor_js.html (or page-editor.js). However, wagtailadmin/shared/datetimepicker_translations.html will still be required in order to localise the date picker UI. Move datepicker translations to admin_base.html --- CHANGELOG.txt | 1 + docs/releases/2.6.rst | 1 + .../wagtailadmin/js/date-time-chooser.js | 75 +++++++++++++++++++ .../static_src/wagtailadmin/js/page-editor.js | 69 ----------------- .../templates/wagtailadmin/admin_base.html | 35 ++++++++- .../wagtailadmin/pages/_editor_js.html | 2 - .../shared/datetimepicker_translations.html | 39 ---------- wagtail/admin/widgets.py | 9 +++ .../wagtailforms/index_submissions.html | 8 +- 9 files changed, 127 insertions(+), 112 deletions(-) create mode 100644 wagtail/admin/static_src/wagtailadmin/js/date-time-chooser.js delete mode 100644 wagtail/admin/templates/wagtailadmin/shared/datetimepicker_translations.html diff --git a/CHANGELOG.txt b/CHANGELOG.txt index d4db74b69..3476b125c 100644 --- a/CHANGELOG.txt +++ b/CHANGELOG.txt @@ -13,6 +13,7 @@ Changelog * Added ButtonHelper examples in the modelAdmin primer page within documentation (Kalob Taulien) * Multiple clarifications, grammar and typo fixes throughout documentation (Dan Swain) * Use correct URL in API example in documentation (Michael Bunsen) + * Move datetime widget initialiser JS into the widget's form media instead of page editor media (Matt Westcott) * Fix: ModelAdmin no longer fails when filtering over a foreign key relation (Jason Dilworth, Matt Westcott) * Fix: The Wagtail version number is now visible within the Settings menu (Kevin Howbrook) * Fix: Scaling images now rounds values to an integer so that images render without errors (Adrian Brunyate) diff --git a/docs/releases/2.6.rst b/docs/releases/2.6.rst index e1a2afd1c..0594b73af 100644 --- a/docs/releases/2.6.rst +++ b/docs/releases/2.6.rst @@ -22,6 +22,7 @@ Other features * Added ButtonHelper examples in the modelAdmin primer page within documentation (Kalob Taulien) * Multiple clarifications, grammar and typo fixes throughout documentation (Dan Swain) * Use correct URL in API example in documentation (Michael Bunsen) + * Move datetime widget initialiser JS into the widget's form media instead of page editor media (Matt Westcott) Bug fixes ~~~~~~~~~ diff --git a/wagtail/admin/static_src/wagtailadmin/js/date-time-chooser.js b/wagtail/admin/static_src/wagtailadmin/js/date-time-chooser.js new file mode 100644 index 000000000..d5b1ffca2 --- /dev/null +++ b/wagtail/admin/static_src/wagtailadmin/js/date-time-chooser.js @@ -0,0 +1,75 @@ +$.fn.datetimepicker.defaults.i18n.wagtail_custom_locale = { + months: wagtailConfig.STRINGS.MONTHS, + dayOfWeek: wagtailConfig.STRINGS.WEEKDAYS, + dayOfWeekShort: wagtailConfig.STRINGS.WEEKDAYS_SHORT, +}; +$.datetimepicker.setLocale('wagtail_custom_locale'); + +// Compare two date objects. Ignore minutes and seconds. +function dateEqual(x, y) { + return x.getDate() === y.getDate() && + x.getMonth() === y.getMonth() && + x.getYear() === y.getYear() +} + +/* +Remove the xdsoft_current css class from markup unless the selected date is currently in view. +Keep the normal behaviour if the home button is clicked. + */ +function hideCurrent(current, input) { + var selected = new Date(input[0].value); + if (!dateEqual(selected, current)) { + $(this).find('.xdsoft_datepicker .xdsoft_current:not(.xdsoft_today)').removeClass('xdsoft_current'); + } +} + +function initDateChooser(id, opts) { + if (window.dateTimePickerTranslations) { + $('#' + id).datetimepicker($.extend({ + closeOnDateSelect: true, + timepicker: false, + scrollInput: false, + format: 'Y-m-d', + onGenerate: hideCurrent + }, opts || {})); + } else { + $('#' + id).datetimepicker($.extend({ + timepicker: false, + scrollInput: false, + format: 'Y-m-d', + onGenerate: hideCurrent + }, opts || {})); + } +} + +function initTimeChooser(id) { + if (window.dateTimePickerTranslations) { + $('#' + id).datetimepicker({ + closeOnDateSelect: true, + datepicker: false, + scrollInput: false, + format: 'H:i', + }); + } else { + $('#' + id).datetimepicker({ + datepicker: false, + format: 'H:i' + }); + } +} + +function initDateTimeChooser(id, opts) { + if (window.dateTimePickerTranslations) { + $('#' + id).datetimepicker($.extend({ + closeOnDateSelect: true, + format: 'Y-m-d H:i', + scrollInput: false, + onGenerate: hideCurrent + }, opts || {})); + } else { + $('#' + id).datetimepicker($.extend({ + format: 'Y-m-d H:i', + onGenerate: hideCurrent + }, opts || {})); + } +} diff --git a/wagtail/admin/static_src/wagtailadmin/js/page-editor.js b/wagtail/admin/static_src/wagtailadmin/js/page-editor.js index 7eb6ca74b..647cec26d 100644 --- a/wagtail/admin/static_src/wagtailadmin/js/page-editor.js +++ b/wagtail/admin/static_src/wagtailadmin/js/page-editor.js @@ -7,75 +7,6 @@ function registerHalloPlugin(name, opts) { compatibility, without throwing an error on later versions. */ } -// Compare two date objects. Ignore minutes and seconds. -function dateEqual(x, y) { - return x.getDate() === y.getDate() && - x.getMonth() === y.getMonth() && - x.getYear() === y.getYear() -} - -/* -Remove the xdsoft_current css class from markup unless the selected date is currently in view. -Keep the normal behaviour if the home button is clicked. - */ -function hideCurrent(current, input) { - var selected = new Date(input[0].value); - if (!dateEqual(selected, current)) { - $(this).find('.xdsoft_datepicker .xdsoft_current:not(.xdsoft_today)').removeClass('xdsoft_current'); - } -} - -function initDateChooser(id, opts) { - if (window.dateTimePickerTranslations) { - $('#' + id).datetimepicker($.extend({ - closeOnDateSelect: true, - timepicker: false, - scrollInput: false, - format: 'Y-m-d', - onGenerate: hideCurrent - }, opts || {})); - } else { - $('#' + id).datetimepicker($.extend({ - timepicker: false, - scrollInput: false, - format: 'Y-m-d', - onGenerate: hideCurrent - }, opts || {})); - } -} - -function initTimeChooser(id) { - if (window.dateTimePickerTranslations) { - $('#' + id).datetimepicker({ - closeOnDateSelect: true, - datepicker: false, - scrollInput: false, - format: 'H:i', - }); - } else { - $('#' + id).datetimepicker({ - datepicker: false, - format: 'H:i' - }); - } -} - -function initDateTimeChooser(id, opts) { - if (window.dateTimePickerTranslations) { - $('#' + id).datetimepicker($.extend({ - closeOnDateSelect: true, - format: 'Y-m-d H:i', - scrollInput: false, - onGenerate: hideCurrent - }, opts || {})); - } else { - $('#' + id).datetimepicker($.extend({ - format: 'Y-m-d H:i', - onGenerate: hideCurrent - }, opts || {})); - } -} - function InlinePanel(opts) { var self = {}; diff --git a/wagtail/admin/templates/wagtailadmin/admin_base.html b/wagtail/admin/templates/wagtailadmin/admin_base.html index d73e1c63d..d9b62f0aa 100644 --- a/wagtail/admin/templates/wagtailadmin/admin_base.html +++ b/wagtail/admin/templates/wagtailadmin/admin_base.html @@ -50,7 +50,40 @@ SHOW_ERROR: "{% trans 'Show error' %}", EDITOR_CRASH: "{% trans 'The editor just crashed. Content has been reset to the last saved version.' %}", BROKEN_LINK: "{% trans 'Broken link' %}", - MISSING_DOCUMENT: "{% trans 'Missing document' %}" + MISSING_DOCUMENT: "{% trans 'Missing document' %}", + + MONTHS: [ + "{% trans 'January' %}", + "{% trans 'February' %}", + "{% trans 'March' %}", + "{% trans 'April' %}", + "{% trans 'May' %}", + "{% trans 'June' %}", + "{% trans 'July' %}", + "{% trans 'August' %}", + "{% trans 'September' %}", + "{% trans 'October' %}", + "{% trans 'November' %}", + "{% trans 'December' %}" + ], + WEEKDAYS: [ + "{% trans 'Sunday' %}", + "{% trans 'Monday' %}", + "{% trans 'Tuesday' %}", + "{% trans 'Wednesday' %}", + "{% trans 'Thursday' %}", + "{% trans 'Friday' %}", + "{% trans 'Saturday' %}" + ], + WEEKDAYS_SHORT: [ + "{% trans 'Sun' %}", + "{% trans 'Mon' %}", + "{% trans 'Tue' %}", + "{% trans 'Wed' %}", + "{% trans 'Thu' %}", + "{% trans 'Fri' %}", + "{% trans 'Sat' %}" + ] }; wagtailConfig.ADMIN_URLS = { diff --git a/wagtail/admin/templates/wagtailadmin/pages/_editor_js.html b/wagtail/admin/templates/wagtailadmin/pages/_editor_js.html index f902805cf..ad143456c 100644 --- a/wagtail/admin/templates/wagtailadmin/pages/_editor_js.html +++ b/wagtail/admin/templates/wagtailadmin/pages/_editor_js.html @@ -25,5 +25,3 @@ {% hook_output 'insert_editor_js' %} - -{% include "wagtailadmin/shared/datetimepicker_translations.html" %} diff --git a/wagtail/admin/templates/wagtailadmin/shared/datetimepicker_translations.html b/wagtail/admin/templates/wagtailadmin/shared/datetimepicker_translations.html deleted file mode 100644 index 00d51a3b0..000000000 --- a/wagtail/admin/templates/wagtailadmin/shared/datetimepicker_translations.html +++ /dev/null @@ -1,39 +0,0 @@ -{% load i18n %} - - diff --git a/wagtail/admin/widgets.py b/wagtail/admin/widgets.py index 794cae430..efbe096ff 100644 --- a/wagtail/admin/widgets.py +++ b/wagtail/admin/widgets.py @@ -58,6 +58,9 @@ class AdminDateInput(widgets.DateInput): return context + class Media: + js = ['wagtailadmin/js/date-time-chooser.js'] + class AdminTimeInput(widgets.TimeInput): template_name = 'wagtailadmin/widgets/time_input.html' @@ -68,6 +71,9 @@ class AdminTimeInput(widgets.TimeInput): default_attrs.update(attrs) super().__init__(attrs=default_attrs, format=format) + class Media: + js = ['wagtailadmin/js/date-time-chooser.js'] + class AdminDateTimeInput(widgets.DateTimeInput): template_name = 'wagtailadmin/widgets/datetime_input.html' @@ -93,6 +99,9 @@ class AdminDateTimeInput(widgets.DateTimeInput): return context + class Media: + js = ['wagtailadmin/js/date-time-chooser.js'] + class AdminTagWidget(TagWidget): template_name = 'wagtailadmin/widgets/tag_widget.html' diff --git a/wagtail/contrib/forms/templates/wagtailforms/index_submissions.html b/wagtail/contrib/forms/templates/wagtailforms/index_submissions.html index b90ad8fa5..9235abb77 100644 --- a/wagtail/contrib/forms/templates/wagtailforms/index_submissions.html +++ b/wagtail/contrib/forms/templates/wagtailforms/index_submissions.html @@ -3,9 +3,15 @@ {% block titletag %}{% blocktrans with form_title=form_page.title|capfirst %}Submissions of {{ form_title }}{% endblocktrans %}{% endblock %} {% block extra_js %} {{ block.super }} - {% include "wagtailadmin/shared/datetimepicker_translations.html" %}