Bug 29212: Use Flatpickr on OPAC pages
authorOwen Leonard <oleonard@myacpl.org>
Wed, 13 Oct 2021 17:51:08 +0000 (17:51 +0000)
committerFridolin Somers <fridolin.somers@biblibre.com>
Tue, 1 Feb 2022 07:55:40 +0000 (21:55 -1000)
commit5f4e4708a20987ff520299d58add973774222be8
tree3daf8b1782508dcc5dcde6ae093326b562a55ea4
parent56ea40359a60fb0c5638c7605038736855361441
Bug 29212: Use Flatpickr on OPAC pages

This patch adds Flatpickr assets to the OPAC (JS and SCSS). A few pages
are updated to use Flatpickr instead of jQueryUI datepickers.

jQueryUI CSS files are updated because they contain some font family
definitions which are simple to remove but overly complicated to
override. Without this change some Font Awesome icons are broken when
they appear inside jQueryUI widgets like tabs.

We don't run the risk of having this change overwritten by a future
jQueryUI upgrade because there won't be any more.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

- Log into the OPAC and check that date pickers on the following pages
  work correctly, including month selection, year selection, forward
  and back arrows, and "Clear date" controls:
- Go to the "Your personal details" page.
- Check the "Date of birth" field.
- With SuspendHoldsOpac enabled, view the "Your summary" page for a
  patron with pending holds.
- Click "Suspend" to confirm that the "Suspend until" datepicker
  works correctly for more than one hold.
- From the catalog search results page, select multiple results and
  click the "Place hold" link.
- On the hold confirmation page, click "Show more options" to test
  the "Hold starts on date" (with OPACAllowHoldDateInFuture enabled)
  and the "Hold not needed after" fields.

Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
15 files changed:
koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
koha-tmpl/opac-tmpl/bootstrap/css/src/_flatpickr.scss [new file with mode: 0644]
koha-tmpl/opac-tmpl/bootstrap/css/src/_flatpickr_vars.scss [new file with mode: 0644]
koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
koha-tmpl/opac-tmpl/bootstrap/en/includes/calendar.inc
koha-tmpl/opac-tmpl/bootstrap/en/includes/holds-table.inc
koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-bottom.inc
koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-memberentry.tt
koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-reserve.tt
koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
koha-tmpl/opac-tmpl/bootstrap/lib/jquery/jquery-ui-1.12.1.css
koha-tmpl/opac-tmpl/bootstrap/lib/jquery/jquery-ui-1.12.1.min.css
koha-tmpl/opac-tmpl/bootstrap/lib/jquery/jquery-ui-rtl-1.12.1.css
koha-tmpl/opac-tmpl/bootstrap/lib/jquery/jquery-ui-rtl-1.12.1.min.css
koha-tmpl/opac-tmpl/lib/flatpickr/flatpickr.min.js [new file with mode: 0644]