Automatically switch between native date picker and custom date picker based on mobile or not mobile devices
In #19468 was implemented the browser native date picker (when it's available) which is great for mobile devices, but to be honest, not so great when we speak about desktops/laptops. Being a project management/issue tracking platform, I expect that most of the usages are made from desktops/laptops (or at least, this is the case at Zitec).
I would like to propose to change a little bit the current behaviour and to use the native date picker only for mobile devices and for non-mobile devices, to use the custom date picker.
I made some tests using FlatPickr:"https://github.com/flatpickr/flatpickr" library and it works very well.
Why FlatPickr and not jQuery UI Date Picker?
- first of all, because the switch between native and non native is made by this library and we don't need to code it
- second of all, it is written in JS vanilla without any dependency, it is very light weight and has tests
- and finally, it offers a bunch of other really great features that can be useful for other improvements or by the plugins (for ex: time picker, range selections, etc).
At the same time, jQuery UI is not actively maintained (last release in September 14, 2016) and I think it is a good idea to start replace it with other modern libraries.
I'm attaching a very basic patch for demo and test purposes and to take some feedback, especially from Plan.io guys who were behind those two great additions (mobile responsive and native pickers).
1. Non mobile devices:
2. Mobile devices:
#6 Updated by Marius BALTEANU over 2 years ago
Pavel Rosický wrote:
I like this change! Do you think that flatpickr's assets should be served via cdn? It's cleaner, but it also might cause problems on networks with restricted access.
Thanks! No, it’s only for testing, the final patch will contain the library assets.
#7 Updated by James Byrne about 2 years ago
I vote for this. We recently updated to 3.4.11 from 3.2.? and discovered that our corporate standard date format (yyyy-mm-dd) is not available in Redmine Date pickers. I have read the W3 consortium's implementation notes and cannot believe that something as idiocentric as date formatting was not provided for as a type attribute.
Alternatively, provide for a system-wide configuration option to either use date type or js text date fields.
#8 Updated by Luc Luc almost 2 years ago
Please take into consideration https://www.redmine.org/issues/23224#note-5 (maybe #23224 is related to this issue) and make the native ones optional if possible (even on mobile).
I'm on 4.0.4 and with each update since 3.2.x I have to revert c418fab8a76b7672c4f341fb7c3e203ae92b50c0 for the date-picker to be consistent and allow ISO8601 date format (YYYY-MM-DD).
- File redmine-flatpickr-datetimepicker.patch added
While I commented a year ago on this issue I didn't noticed Marius' patch until today (upgraded to 4.2 and checked again the date-picker related issues).
Wow... Thank you so so much Marius!
Due to #23224 I had to constantly revert the (unfortunate - in my opinion) native date-pickers patch on each Redmine upgrade.
This flatpickr proposal is awesome.
I took the liberty to adjust your patch Marius so it includes the flatpickr assets (js and stylesheet) into Redmine installation. Hopefully I didn't break some policy with this approach.
Thank you again.