Bug 33703 - Entering dates should be more flexible accepting different entry formats
Summary: Entering dates should be more flexible accepting different entry formats
Status: Needs documenting
Alias: None
Product: Koha
Classification: Unclassified
Component: Patrons (show other bugs)
Version: Main
Hardware: All All
: P3 enhancement (vote)
Assignee: Lucas Gass
QA Contact: Martin Renvoize
URL:
Keywords:
Depends on: 32693 34923 34939
Blocks: 36342 37371
  Show dependency treegraph
 
Reported: 2023-05-09 16:52 UTC by Kristi
Modified: 2024-07-25 11:15 UTC (History)
13 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Small patch
Documentation contact:
Documentation submission:
Text to go in the release notes:
This makes entering dates directly into the date field a bit more flexible by allowing to omit the delimiters ('/' or '-', or '.') for the set date format.
Version(s) released in:
24.05.00


Attachments
DateNoSlash_1 (30.85 KB, image/png)
2023-05-09 16:52 UTC, Kristi
Details
DateNoSlash_2 (29.30 KB, image/png)
2023-05-09 16:52 UTC, Kristi
Details
Bug 33703: Add cleave.js for direct input dateformatting (23.93 KB, patch)
2023-09-15 20:48 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: (follow-up) declare variables (1.15 KB, patch)
2023-09-15 21:30 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: (follow-up) declare variables (1.13 KB, patch)
2023-09-18 19:58 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add cleave.js (OPAC) (23.41 KB, patch)
2023-09-18 20:06 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add cleave.js for direct input dateformatting (23.98 KB, patch)
2023-09-29 15:32 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: (follow-up) declare variables (1.13 KB, patch)
2023-09-29 15:32 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add cleave.js (OPAC) (23.41 KB, patch)
2023-09-29 15:32 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: (follow-up) Add license information (1.24 KB, patch)
2023-10-13 17:24 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add cleave to dateaccessioned.pl (1.66 KB, patch)
2023-10-13 19:44 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add cleave to dateaccessioned.pl (1.71 KB, patch)
2023-10-16 18:56 UTC, ByWater Sandboxes
Details | Diff | Splinter Review
Bug 33703: Remove call to cleave.js in additem.tt (1.04 KB, patch)
2023-10-24 15:36 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Masikto core/kit for date masking (95.36 KB, patch)
2024-01-30 00:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add time support (2.53 KB, patch)
2024-01-31 00:51 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Don't use Maskito when picking a range (4.14 KB, patch)
2024-03-04 18:06 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to dateaccessioned.pl (1.04 KB, patch)
2024-03-04 18:19 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito support for OPAC (95.31 KB, patch)
2024-03-04 18:40 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to about.tt (1.44 KB, patch)
2024-03-04 18:47 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Masikto core/kit for date masking (96.29 KB, patch)
2024-03-04 20:17 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add time support (2.53 KB, patch)
2024-03-04 20:17 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Don't use Maskito when picking a range (4.14 KB, patch)
2024-03-04 20:17 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to dateaccessioned.pl (1.04 KB, patch)
2024-03-04 20:17 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito support for OPAC (95.31 KB, patch)
2024-03-04 20:17 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to about.tt (1.44 KB, patch)
2024-03-04 20:17 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Masikto core/kit for date masking (96.29 KB, patch)
2024-03-11 23:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add time support (2.59 KB, patch)
2024-03-11 23:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Don't use Maskito when picking a range (3.03 KB, patch)
2024-03-11 23:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to dateaccessioned.pl (1.04 KB, patch)
2024-03-11 23:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito support for OPAC (95.31 KB, patch)
2024-03-11 23:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to about.tt (1.44 KB, patch)
2024-03-11 23:45 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Masikto core/kit for date masking (96.36 KB, patch)
2024-03-18 13:00 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 33703: Add time support (2.66 KB, patch)
2024-03-18 13:00 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 33703: Don't use Maskito when picking a range (3.09 KB, patch)
2024-03-18 13:01 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 33703: Add Maskito to dateaccessioned.pl (1.11 KB, patch)
2024-03-18 13:01 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 33703: Add Maskito support for OPAC (95.38 KB, patch)
2024-03-18 13:01 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 33703: Add Maskito to about.tt (1.50 KB, patch)
2024-03-18 13:01 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 33703: Add Masikto core/kit for date masking (96.40 KB, patch)
2024-03-27 12:02 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 33703: Add time support (2.70 KB, patch)
2024-03-27 12:02 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 33703: Don't use Maskito when picking a range (3.14 KB, patch)
2024-03-27 12:02 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 33703: Add Maskito to dateaccessioned.pl (1.16 KB, patch)
2024-03-27 12:02 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 33703: Add Maskito support for OPAC (95.42 KB, patch)
2024-03-27 12:03 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 33703: Add Maskito to about.tt (1.55 KB, patch)
2024-03-27 12:03 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 33703: Add Masikto core/kit for date masking (96.40 KB, patch)
2024-04-22 14:23 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add time support (2.70 KB, patch)
2024-04-22 14:23 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Don't use Maskito when picking a range (3.14 KB, patch)
2024-04-22 14:24 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to dateaccessioned.pl (1.16 KB, patch)
2024-04-22 14:24 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito support for OPAC (95.42 KB, patch)
2024-04-22 14:24 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: Add Maskito to about.tt (1.64 KB, patch)
2024-04-22 14:24 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 33703: (follow-up) Fix typo in calendar.inc (990 bytes, patch)
2024-04-23 13:35 UTC, Lucas Gass
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Kristi 2023-05-09 16:52:05 UTC
Created attachment 150894 [details]
DateNoSlash_1

Description: When using the Koha Date of Birth field to add a new patron, entering a date without punctuation (/ or -) causes the date to change to an incorrect date.


Steps to reproduce:
1. From Koha Patron module > add new patron > patron identity section, Date of birth field, enter a birthdate for 24 May 1964 as 05241964 (DateNoSlash_1.png) manually.

2. Tab or hit enter, and the birth date that is recorded changes to 06/10/1964 or June 10 1964 (DateNoSlash_2.png). Similar behavior happens whenever the date is entered without punctuation. 

Expected Results: If data is entered in this field without slashes or hyphens, the slashes would be input without changing the intended date. 

Suggesting here a correction to correctly assign birthdates as entered with or without punctuation.
Comment 1 Kristi 2023-05-09 16:52:39 UTC
Created attachment 150895 [details]
DateNoSlash_2
Comment 2 Katrin Fischer 2023-05-09 20:28:09 UTC
Which Dateformat are you using?

I am not sure how easy it would be to implement this as the MM DD and YY parts can be in a different position depending on the DateFormat. Do you know if this worked with the old date picker widget?
Comment 3 Kristi 2023-05-09 20:33:34 UTC
(In reply to Katrin Fischer from comment #2)
> Which Dateformat are you using?
> 
> I am not sure how easy it would be to implement this as the MM DD and YY
> parts can be in a different position depending on the DateFormat. Do you
> know if this worked with the old date picker widget?

Our dateformat is set to mm/dd/yyyy
Comment 4 Owen Leonard 2023-05-10 12:52:14 UTC
This is definitely not a bug in the sense of something not working the way it's designed to. Koha doesn't have code that automatically formats entry into dates, that's why the date picker widget is used.

However, it is certainly becoming increasingly common for date fields to accept and automatically format text entry, and adding that should be something we look into.
Comment 5 Nick Clemens (kidclamp) 2023-05-10 17:12:46 UTC
So what appears to be happening is that the date is being parsed as if the expected separators are there.

i.e:

05241964

is being read as:

05/41/64

The 41st day of May becomes the 10th of June
Comment 6 Lucas Gass 2023-09-15 20:41:57 UTC
cleave.js looks like a stable and popular library that handles this very well. It is licensed as "Apache License Version 2.0".
Comment 7 Lucas Gass 2023-09-15 20:48:53 UTC
Created attachment 155719 [details] [review]
Bug 33703: Add cleave.js for direct input dateformatting

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period
Comment 8 Lucas Gass 2023-09-15 21:30:02 UTC
Created attachment 155720 [details] [review]
Bug 33703: (follow-up) declare variables
Comment 9 Owen Leonard 2023-09-18 11:07:06 UTC
Looks very cool!
Comment 10 Lucas Gass 2023-09-18 19:58:51 UTC
Created attachment 155861 [details] [review]
Bug 33703: (follow-up) declare variables
Comment 11 Lucas Gass 2023-09-18 20:06:31 UTC
Created attachment 155862 [details] [review]
Bug 33703: Add cleave.js (OPAC)
Comment 12 David Nind 2023-09-24 20:55:42 UTC
I had a go at testing, but haven't signed off.

Some things I noted - don't think any are show stoppers:

0. Took a little getting used to - but seems OK overall. For example, if you are used to typing the separators such as 25/ and having it come up automatically.

1. Entering dates: 

- if you start, but don't finish (for example, you get interrupted), the date clears after about 14-15 seconds (for some date fields only). For example: Patron date of birth, type 2023 (where date format = YYYY-MM-DD).

- if you partially complete a date, for example 20.02.2 then click away (for example another tab or application window) it autocompletes the date using what is in the date picker - in the example it would add it as 2023. Another example: 20. and then click on another window, makes it 20.01.2023. If date picker doesn't have Yesterday or Today options, and you click away on another tab/window, it is cleared.

- acquisitions - adding an item from an existing record: item details - date acquired - autocompletes, when you click away, doesn't time out; accounting details - estimated date of delivery - same behavour.

- cataloguing - dateaccessioned.pl plugin (added to a tag for a framework): defaults to today's date (as expected), you can change.

- log viewer: as per acquisitions.

2. Dates with time: for example, checkouts and specifying the due date - from the date picker if you select any date (including Yesterday, Today, and Tomorrow) it puts the time as 23:59; entering it manually, it automatically makes it 00, and you can't enter the seconds (I vaguely remember testing for a bug where the time was important and caused "issues", but I can't remember what).

3. Koha About > Licenses page: I think we normally add the license information for libraries used in Koha.

4. OPAC - there doesn't seem to be too many places where there is a date field, but this may just depend on modules enabled: 

- Placing a hold: doesn't seem to work, for example: for a record select Place a hold, then show more options - can't manually enter the date (note that there are no Yesterday Today Tomorrow options - only today's date and future dates).

- Your account > Personal details > Date of birth: doesn't time out, if you click away it autocompletes if it can.
Comment 13 Lucas Gass 2023-09-26 19:28:24 UTC
David,

I appreciate your very through testing! 

> 0. Took a little getting used to - but seems OK overall. For example, if you
> are used to typing the separators such as 25/ and having it come up
> automatically.
This is the intent of the patch. And I think this is OK because if you manually type the separator/delimiter nothing happens, since it is automatically added. 


> 1. Entering dates: 
> 
> - if you start, but don't finish (for example, you get interrupted), the
> date clears after about 14-15 seconds (for some date fields only). For
> example: Patron date of birth, type 2023 (where date format = YYYY-MM-DD).
> 
> - if you partially complete a date, for example 20.02.2 then click away (for
> example another tab or application window) it autocompletes the date using
> what is in the date picker - in the example it would add it as 2023. Another
> example: 20. and then click on another window, makes it 20.01.2023. If date
> picker doesn't have Yesterday or Today options, and you click away on
> another tab/window, it is cleared.
Correct me if I am wrong but it appears like this happens with or without my patch, right? 

> 2. Dates with time: for example, checkouts and specifying the due date -
> from the date picker if you select any date (including Yesterday, Today, and
> Tomorrow) it puts the time as 23:59; entering it manually, it automatically
> makes it 00, and you can't enter the seconds (I vaguely remember testing for
> a bug where the time was important and caused "issues", but I can't remember
> what).
Maybe Bug 29477? Again, this allow happens without this patchset. But if you think I should deal with it here I am happy to do so!  

> 3. Koha About > Licenses page: I think we normally add the license
> information for libraries used in Koha.
Good call, this should be added and I will do so.
 
> 4. OPAC - there doesn't seem to be too many places where there is a date
> field, but this may just depend on modules enabled: 
> 
> - Placing a hold: doesn't seem to work, for example: for a record select
> Place a hold, then show more options - can't manually enter the date (note
> that there are no Yesterday Today Tomorrow options - only today's date and
> future dates).
I have filed and patched Bug 34923.
Comment 14 David Nind 2023-09-26 22:10:43 UTC
(In reply to Lucas Gass from comment #13)

> 1. Entering dates: 
> 
> - if you start, but don't finish (for example, you get interrupted), the
> date clears after about 14-15 seconds (for some date fields only). For
> example: Patron date of birth, type 2023 (where date format = YYYY-MM-DD).
> 
> - if you partially complete a date, for example 20.02.2 then click away (for
> example another tab or application window) it autocompletes the date using
> what is in the date picker - in the example it would add it as 2023. Another
> example: 20. and then click on another window, makes it 20.01.2023. If date
> picker doesn't have Yesterday or Today options, and you click away on
> another tab/window, it is cleared.

You are right, this happens without the patch. So no change in behavour.

> > 2. Dates with time: for example, checkouts and specifying the due date -
> > from the date picker if you select any date (including Yesterday, Today, and
> > Tomorrow) it puts the time as 23:59; entering it manually, it automatically
> > makes it 00, and you can't enter the seconds (I vaguely remember testing for
> > a bug where the time was important and caused "issues", but I can't remember
> > what).

> Maybe Bug 29477? Again, this allow happens without this patchset. But if you
> think I should deal with it here I am happy to do so!  

That looks like the bug.

Before this patch, you can enter the time manually and the default time when you select from date picker has the time as 23:59.

After this patch, you can't manually enter the time and the time defaults to 00:00 using the date picker.

As this is the current behavour, it will probably need to be addressed at some stage.

I've only tested on the checkout form.

> > 3. Koha About > Licenses page: I think we normally add the license
> > information for libraries used in Koha.
> Good call, this should be added and I will do so.

Thanks!

> > 4. OPAC - there doesn't seem to be too many places where there is a date
> > field, but this may just depend on modules enabled: 
> > 
> > - Placing a hold: doesn't seem to work, for example: for a record select
> > Place a hold, then show more options - can't manually enter the date (note
> > that there are no Yesterday Today Tomorrow options - only today's date and
> > future dates).
> I have filed and patched Bug 34923.

Thanks!
Comment 15 David Nind 2023-09-26 22:21:39 UTC
(In reply to David Nind from comment #14)
> (In reply to Lucas Gass from comment #13)
...
> 
> After this patch, you can't manually enter the time and the time defaults to
> 00:00 using the date picker.
> 
> As this is the current behavour, it will probably need to be addressed at
> some stage.

I double-checked, and I was wrong here. The time when you use the date picker defaults to 23:59. However, the rest still applies - you can't manually enter the time and it defaults to 00:00.
Comment 16 Lucas Gass 2023-09-27 21:28:36 UTC
(In reply to David Nind from comment #15)
> (In reply to David Nind from comment #14)
> > (In reply to Lucas Gass from comment #13)
> ...
> > 
> > After this patch, you can't manually enter the time and the time defaults to
> > 00:00 using the date picker.
> > 
> > As this is the current behavour, it will probably need to be addressed at
> > some stage.
> 
> I double-checked, and I was wrong here. The time when you use the date
> picker defaults to 23:59. However, the rest still applies - you can't
> manually enter the time and it defaults to 00:00.

Since this happens with or without these patches I have filed and patched Bug 34939. I will make this one dependent on Bug 34939.
Comment 17 David Nind 2023-09-28 21:23:12 UTC
The patch no longer applies 8-(..

155719 - Bug 33703: Add cleave.js for direct input dateformatting
155861 - Bug 33703: (follow-up) declare variables
155862 - Bug 33703: Add cleave.js (OPAC)

Apply? [(y)es, (n)o, (i)nteractive] y
Applying: Bug 33703: Add cleave.js for direct input dateformatting
Using index info to reconstruct a base tree...
M	koha-tmpl/intranet-tmpl/prog/en/includes/calendar.inc
Falling back to patching base and 3-way merge...
Auto-merging koha-tmpl/intranet-tmpl/prog/en/includes/calendar.inc
CONFLICT (content): Merge conflict in koha-tmpl/intranet-tmpl/prog/en/includes/calendar.inc
error: Failed to merge in the changes.
Patch failed at 0001 Bug 33703: Add cleave.js for direct input dateformatting
Comment 18 Lucas Gass 2023-09-29 15:32:02 UTC
Created attachment 156411 [details] [review]
Bug 33703: Add cleave.js for direct input dateformatting

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period
Comment 19 Lucas Gass 2023-09-29 15:32:04 UTC
Created attachment 156412 [details] [review]
Bug 33703: (follow-up) declare variables
Comment 20 Lucas Gass 2023-09-29 15:32:07 UTC
Created attachment 156413 [details] [review]
Bug 33703: Add cleave.js (OPAC)
Comment 21 Lucas Gass 2023-09-29 15:32:45 UTC
Rebased on top of Bug 34939.
Comment 22 David Nind 2023-10-01 19:07:01 UTC
Hi Lucas.

I tried a few other areas, and this seemed to work OK: acquisitions, statistics reports, calendar tool, log viewer, patron categories, circulate and fine rules, budgets.

One area that didn't work was on the add or edit item forms (these use the dateaccessioned.pl plugin). Should it work here?

Also, there is no license information on the About > Licenses page.

David
Comment 23 Lucas Gass 2023-10-13 17:24:36 UTC
Created attachment 157132 [details] [review]
Bug 33703: (follow-up) Add license information
Comment 24 Lucas Gass 2023-10-13 17:25:55 UTC
> One area that didn't work was on the add or edit item forms (these use the
> dateaccessioned.pl plugin). Should it work here?

It looks like the flatpickr on that page does not allow for the direct input of dates. Should it? If so I am happy to fix that in a seperate bug report.

> Also, there is no license information on the About > Licenses page.
I have added this.
Comment 25 Katrin Fischer 2023-10-13 17:50:15 UTC
Forcing users to use the calendar widget is an accessiblity issue (hard on screen readers for example). We should allow direct entry always.
Comment 26 Lucas Gass 2023-10-13 19:44:43 UTC
Created attachment 157135 [details] [review]
Bug 33703: Add cleave to dateaccessioned.pl
Comment 27 Lucas Gass 2023-10-13 19:46:23 UTC
(In reply to Katrin Fischer from comment #25)
> Forcing users to use the calendar widget is an accessiblity issue (hard on
> screen readers for example). We should allow direct entry always.

I was mistaken, you can directly input dates with the dateaccessioned plugin. Therefore I have added the ability for formatting on this bug. 

This is ready for testing.
Comment 28 ByWater Sandboxes 2023-10-16 18:56:50 UTC
Created attachment 157206 [details] [review]
Bug 33703: Add cleave to dateaccessioned.pl

Signed-off-by: Kristi Krueger <kkrueger@cuyahogalibrary.org>
Comment 29 Kristi 2023-10-16 18:57:20 UTC
Reviewed these scenarios for all 4 dateformats:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period 
    -Date fields in add to order from existing record (acquisitions)
Comment 30 Lucas Gass 2023-10-24 15:36:37 UTC
Created attachment 157746 [details] [review]
Bug 33703: Remove call to cleave.js in additem.tt

This removes the extra call to the cleave library in additem.tt. Since calender.inc is called here this is not needed.
Comment 31 Martin Renvoize 2023-10-24 16:26:35 UTC
I really like this.. but I'm a little worried about cleave.js. It appears to be abandoned by the author since May 2020 (with a few people asking since if there's a prevalent fork or anyone happy to take on the maintenance).

There's an open merge request for datetime support too, which I think would be important for this.

I think perhaps we should investigate other masking libraries, unfortunately?
Comment 32 Lucas Gass 2023-10-24 16:52:28 UTC
(In reply to Martin Renvoize from comment #31)
> I really like this.. but I'm a little worried about cleave.js. It appears to
> be abandoned by the author since May 2020 (with a few people asking since if
> there's a prevalent fork or anyone happy to take on the maintenance).
> 
> There's an open merge request for datetime support too, which I think would
> be important for this.
> 
> I think perhaps we should investigate other masking libraries, unfortunately?

I'd be happy to rework this with a different library, however I'd like some general consensus/agreement on that library before proceeding.
Comment 33 Lucas Gass 2023-10-24 22:47:52 UTC
If we cannot use cleave.js maybe the next best thing is simply using HTML5's date input:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
Comment 34 David Cook 2023-10-24 22:50:13 UTC
(In reply to Lucas Gass from comment #33)
> If we cannot use cleave.js maybe the next best thing is simply using HTML5's
> date input:
> 
> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

I suggested that as well on a different bug but it was rejected for some reason I can't remember...
Comment 35 Martin Renvoize 2023-10-25 08:20:52 UTC
Hmm, I don't know why we opted for flatpickr over the native date type.. though I do use options within flatpickr extensively in he bookings work and I don't think the native picker would support all the options we use?

As did some research and it would appear the most well maintained, tried and tested libraries are:

* InputMask (https://robinherbots.github.io/Inputmask/#/documentation) which seems to be maintained by one maintainer, and started out in the jQuery days.. you can see it's still got some jQuery style to it today.. but it is very wide spread and has pretty consistent maintanence.
* iMask.js (https://imask.js.org/guide.html) which is a bit more modern, but doesn't appear to do datetime out of the box :(.  Seems well maintained by a group of contributors.
* Maskito (https://maskito.dev/kit/date-time) which is the newest kid to the block, has datetime handling out of the box and seems to be well maintained and very open in their development being part of Taiga UI kit.

I think the simplest to switch to feels like Maskito to me.. though iMask also looks fairly trivial.  Both also have Vue support baked in so would appear to be a bit future proofed given our current direction of travel.
Comment 36 Katrin Fischer 2023-10-25 21:00:10 UTC
I believe it could have been 118N issues that turned us away from HTML5.
Comment 37 Lucas Gass 2023-10-25 21:47:57 UTC
(In reply to Katrin Fischer from comment #36)
> I believe it could have been 118N issues that turned us away from HTML5.

I also see that the HTML5 stuff does not support datetime in the way we need it to.

I do like Maskito.
Comment 38 Lucas Gass 2023-11-28 15:16:44 UTC
Cleave.js has been revived/reborn as cleave-zen:

https://github.com/nosir/cleave-zen
https://github.com/nosir/cleave.js/issues/723

In my opinion this is the best, and smartest, masking library available.
Comment 39 Lucas Gass 2024-01-30 00:45:14 UTC
Created attachment 161619 [details] [review]
Bug 33703: Add Masikto core/kit for date masking
Comment 40 Lucas Gass 2024-01-31 00:51:34 UTC
Created attachment 161663 [details] [review]
Bug 33703: Add time support
Comment 41 Lucas Gass 2024-03-04 18:06:11 UTC
Created attachment 162722 [details] [review]
Bug 33703: Don't use Maskito when picking a range
Comment 42 Lucas Gass 2024-03-04 18:19:58 UTC
Created attachment 162723 [details] [review]
Bug 33703: Add Maskito to dateaccessioned.pl
Comment 43 Lucas Gass 2024-03-04 18:40:06 UTC
Created attachment 162724 [details] [review]
Bug 33703: Add Maskito support for OPAC
Comment 44 Lucas Gass 2024-03-04 18:47:04 UTC
Created attachment 162725 [details] [review]
Bug 33703: Add Maskito to about.tt
Comment 45 Lucas Gass 2024-03-04 20:17:22 UTC
Created attachment 162726 [details] [review]
Bug 33703: Add Masikto core/kit for date masking

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').
7. Add/edit an item with the dateaccessioned.pl plugin loaded, making the dates are well formed.
8. Make an item bookable by going to the item tab of a record and setting at least 1 item to "Bookable:".
9. Now "Place booking", which should trigger a modal.
10. In the "Period" date picker, which is a range, the dates should NOT be formatted.
11. Log in to the OPAC and try some date pickers ( self reg/borrower mod/ect )

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period
Comment 46 Lucas Gass 2024-03-04 20:17:24 UTC
Created attachment 162727 [details] [review]
Bug 33703: Add time support
Comment 47 Lucas Gass 2024-03-04 20:17:27 UTC
Created attachment 162728 [details] [review]
Bug 33703: Don't use Maskito when picking a range
Comment 48 Lucas Gass 2024-03-04 20:17:30 UTC
Created attachment 162729 [details] [review]
Bug 33703: Add Maskito to dateaccessioned.pl
Comment 49 Lucas Gass 2024-03-04 20:17:32 UTC
Created attachment 162730 [details] [review]
Bug 33703: Add Maskito support for OPAC
Comment 50 Lucas Gass 2024-03-04 20:17:35 UTC
Created attachment 162731 [details] [review]
Bug 33703: Add Maskito to about.tt
Comment 51 Kristi 2024-03-06 22:07:52 UTC
I tested all four dateformat settings with the following:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period
as well as 
Hold expires on date
Suspend hold date
Renewal due date

These all formatted the dates as expected.

I looked at all 4 dateformats in the OPAC for patron birthdate, hold not needed after, and suspend hold dates, and those all formatted as expected.

I also tested the bookings modal. While entering a date does not format automatically, clicking away does create an unexpected, formatted start date. 
For example, with the mm/dd/yyyy format, instead of picking a date on the calendar in the modal, if I type in 07012024 for an July 01 start, the calendar start date formats to 07/12/2024 and the picker on the calendar moves to Friday, July 12. 

Since booking seems to be beyond the scope of this bug, signing off here.
Comment 52 Kristi 2024-03-06 22:12:59 UTC
Also reviewed the Date acquired field when adding new bib items in all 4 dateformats, which formatted as expected.
Comment 53 Kristi 2024-03-07 14:07:21 UTC
Also reviewed Patron record date of birth and Patron record expiry date when duplicating a patron and formatting was as expected in all 4 date formats.
Comment 54 Lucas Gass 2024-03-11 23:45:27 UTC
Created attachment 163078 [details] [review]
Bug 33703: Add Masikto core/kit for date masking

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').
7. Add/edit an item with the dateaccessioned.pl plugin loaded, making the dates are well formed.
8. Make an item bookable by going to the item tab of a record and setting at least 1 item to "Bookable:".
9. Now "Place booking", which should trigger a modal.
10. In the "Period" date picker, which is a range, the dates should NOT be formatted.
11. Log in to the OPAC and try some date pickers ( self reg/borrower mod/ect )

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period
Comment 55 Lucas Gass 2024-03-11 23:45:29 UTC
Created attachment 163079 [details] [review]
Bug 33703: Add time support
Comment 56 Lucas Gass 2024-03-11 23:45:32 UTC
Created attachment 163080 [details] [review]
Bug 33703: Don't use Maskito when picking a range
Comment 57 Lucas Gass 2024-03-11 23:45:34 UTC
Created attachment 163081 [details] [review]
Bug 33703: Add Maskito to dateaccessioned.pl
Comment 58 Lucas Gass 2024-03-11 23:45:37 UTC
Created attachment 163082 [details] [review]
Bug 33703: Add Maskito support for OPAC
Comment 59 Lucas Gass 2024-03-11 23:45:40 UTC
Created attachment 163083 [details] [review]
Bug 33703: Add Maskito to about.tt
Comment 60 Lucas Gass 2024-03-11 23:46:28 UTC
Rebased for current master
Comment 61 Martin Renvoize 2024-03-18 13:00:54 UTC
Created attachment 163319 [details] [review]
Bug 33703: Add Masikto core/kit for date masking

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').
7. Add/edit an item with the dateaccessioned.pl plugin loaded, making the dates are well formed.
8. Make an item bookable by going to the item tab of a record and setting at least 1 item to "Bookable:".
9. Now "Place booking", which should trigger a modal.
10. In the "Period" date picker, which is a range, the dates should NOT be formatted.
11. Log in to the OPAC and try some date pickers ( self reg/borrower mod/ect )

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 62 Martin Renvoize 2024-03-18 13:00:58 UTC
Created attachment 163320 [details] [review]
Bug 33703: Add time support

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 63 Martin Renvoize 2024-03-18 13:01:01 UTC
Created attachment 163321 [details] [review]
Bug 33703: Don't use Maskito when picking a range

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 64 Martin Renvoize 2024-03-18 13:01:04 UTC
Created attachment 163322 [details] [review]
Bug 33703: Add Maskito to dateaccessioned.pl

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 65 Martin Renvoize 2024-03-18 13:01:08 UTC
Created attachment 163323 [details] [review]
Bug 33703: Add Maskito support for OPAC

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 66 Martin Renvoize 2024-03-18 13:01:11 UTC
Created attachment 163324 [details] [review]
Bug 33703: Add Maskito to about.tt

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Comment 67 Martin Renvoize 2024-03-18 13:02:59 UTC
This all looks great to me and works in my testing... it would be food to get a final QA as the implementation library changed during all the work but I think that can be fairly quick.. I'd also happily take a signoff from Owen to be a QA tick as someone familiar with the UI/Ux challenges this helps resolve.
Comment 68 Owen Leonard 2024-03-27 12:02:50 UTC
Created attachment 163978 [details] [review]
Bug 33703: Add Masikto core/kit for date masking

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').
7. Add/edit an item with the dateaccessioned.pl plugin loaded, making the dates are well formed.
8. Make an item bookable by going to the item tab of a record and setting at least 1 item to "Bookable:".
9. Now "Place booking", which should trigger a modal.
10. In the "Period" date picker, which is a range, the dates should NOT be formatted.
11. Log in to the OPAC and try some date pickers ( self reg/borrower mod/ect )

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 69 Owen Leonard 2024-03-27 12:02:53 UTC
Created attachment 163979 [details] [review]
Bug 33703: Add time support

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 70 Owen Leonard 2024-03-27 12:02:56 UTC
Created attachment 163980 [details] [review]
Bug 33703: Don't use Maskito when picking a range

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 71 Owen Leonard 2024-03-27 12:02:58 UTC
Created attachment 163981 [details] [review]
Bug 33703: Add Maskito to dateaccessioned.pl

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 72 Owen Leonard 2024-03-27 12:03:01 UTC
Created attachment 163982 [details] [review]
Bug 33703: Add Maskito support for OPAC

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 73 Owen Leonard 2024-03-27 12:03:04 UTC
Created attachment 163983 [details] [review]
Bug 33703: Add Maskito to about.tt

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 74 Katrin Fischer 2024-04-22 10:01:08 UTC
I believe we have a conflict with the just to be pushed bug 32693 here on the about page - could you please resolve?
Comment 75 Lucas Gass 2024-04-22 14:23:53 UTC
Created attachment 165307 [details] [review]
Bug 33703: Add Masikto core/kit for date masking

To test:
1. Apply patch
2. Restart all, clear browser cache
3. In the staff interface start testing some flatpickr instances with direct inputs.
4. Try entering your dates without delimiters, '/' or '-', or '.'.
5. Make sure the dates are well formed.
6. Test with each of dateformat's Koha supports. ( system preference 'dateformat').
7. Add/edit an item with the dateaccessioned.pl plugin loaded, making the dates are well formed.
8. Make an item bookable by going to the item tab of a record and setting at least 1 item to "Bookable:".
9. Now "Place booking", which should trigger a modal.
10. In the "Period" date picker, which is a range, the dates should NOT be formatted.
11. Log in to the OPAC and try some date pickers ( self reg/borrower mod/ect )

Some places to test:
    -Patron record date of birth
    -Patron record registration date
    -Patron record expiry date
    -Checkouts, manually set a due date
    -Patron category, enrollment period

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 76 Lucas Gass 2024-04-22 14:23:57 UTC
Created attachment 165308 [details] [review]
Bug 33703: Add time support

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 77 Lucas Gass 2024-04-22 14:24:00 UTC
Created attachment 165309 [details] [review]
Bug 33703: Don't use Maskito when picking a range

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 78 Lucas Gass 2024-04-22 14:24:03 UTC
Created attachment 165310 [details] [review]
Bug 33703: Add Maskito to dateaccessioned.pl

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 79 Lucas Gass 2024-04-22 14:24:06 UTC
Created attachment 165311 [details] [review]
Bug 33703: Add Maskito support for OPAC

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 80 Lucas Gass 2024-04-22 14:24:09 UTC
Created attachment 165312 [details] [review]
Bug 33703: Add Maskito to about.tt

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 81 Lucas Gass 2024-04-22 14:24:37 UTC
rebased for current main and back to PQA
Comment 82 Jonathan Druart 2024-04-23 07:49:13 UTC
Last patch does not apply.

I also spotted a typo in calendar.inc:
+    var delimter = "";
Comment 83 Lucas Gass 2024-04-23 13:35:27 UTC
Created attachment 165399 [details] [review]
Bug 33703: (follow-up) Fix typo in calendar.inc

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Comment 84 Lucas Gass 2024-04-23 13:36:41 UTC
(In reply to Jonathan Druart from comment #82)
> Last patch does not apply.
> 
> I also spotted a typo in calendar.inc:
> +    var delimter = "";

I fixed the typo, thanks. This is applying cleanly for me.
Comment 85 Katrin Fischer 2024-04-26 15:06:42 UTC
Pushed for 24.05!

Well done everyone, thank you!
Comment 86 Fridolin Somers 2024-05-24 07:52:35 UTC
Not backported to 23.11.x
Comment 87 Lucas Gass 2024-07-16 14:06:14 UTC
This patchset needs to be removed from main and 24.05, see Bug 37371.
Comment 88 Martin Renvoize 2024-07-17 10:43:51 UTC
I would say we should attempt to fix the issue highlighted rather than remove it ;)
Comment 89 Lucas Gass 2024-07-17 13:13:43 UTC
(In reply to Martin Renvoize from comment #88)
> I would say we should attempt to fix the issue highlighted rather than
> remove it ;)

I agree, I will look into a fix.