app-datepicker
app-datepicker copied to clipboard
motss
Any suggestions for enhancement?
Features to be implemented:
- [x] To add locales to fix #8 -- fixed with 0d851dd, 7b18c9c
- [x] Rename to
app-datepickerand bump version. - [x] [FEATURE] To show week numbers. (Proposed by https://github.com/motss/app-datepicker/issues/64)
- [x] To add swiping features on mobile.
- [x] Suggestions on certain naming. I suck at naming things.
- [ ] Improve accessibility of this element due to https://www.youtube.com/watch?v=2qjgxH384Nc
- [ ] [FEATURE] To allow customization on many (MANY!!!) dates such ash public holidays!~ :tada: (Proposed by https://github.com/motss/app-datepicker/issues/10#issuecomment-288082405)
Not under consideration
- [ ] Better demo with
iron-demo-helpers, see https://github.com/PolymerElements/iron-demo-helpers/pull/32. - [ ] [FEATURE] To allow selectable date range.
Feel free to leave comments down here for any suggestions to enhance this element.
@motss demo seems to be broken in Safari 9. PTAL.
I also recommend refactor using importHref to load polyfills. Current behavior can be broken on vulcanized app.
@web-padawan Please file an issue with description of the problem. What kind of error message you receive that makes the demo seems broken in Safari 9?
@derooy Do you mind opening an issue for that as feature request? It's a good-to-have feature. Hope you can be one of the contributors working on implementing this feature or providing feedbacks on the feature.
@motss How about the ability to specify a list of invalid/valid dates?
I'd be game to submit a PR for this if you're open to the change.
@nick-woodward A list of invalid/ valid dates? Not get it still.
On Thu, 8 Sep 2016 at 12:08 Nick Woodward [email protected] wrote:
@motss https://github.com/motss How about the ability to specify a list of invalid/valid dates?
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/motss/app-datepicker/issues/10#issuecomment-245488334, or mute the thread https://github.com/notifications/unsubscribe-auth/AKHcjxfV0i3F890p0xeAwX07OQVWjYkIks5qn4oygaJpZM4IGJ16 .
Essentially the same concept that you have with "disableDays", but at a date-level, rather then day of the week.
I kind of get it but the user should input valid date and not to rely on a datepicker to tell that the input date is not valid.
On Thu, 8 Sep 2016 at 13:06 Nick Woodward [email protected] wrote:
Essentially the same concept that you have with "disableDays", but at a date-level, rather then day of the week.
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/motss/app-datepicker/issues/10#issuecomment-245494749, or mute the thread https://github.com/notifications/unsubscribe-auth/AKHcj0743TpWFzYMGK8gsWgiU-4EM97Rks5qn5fJgaJpZM4IGJ16 .
Purposely allowing a user the ability to do something incorrectly when you can prevent it doesn't really make sense to me.
I'm going to walk through a bit of our app to give you an idea of what our use-case is
We have the user specify a date-range at a higher level that then determines the days a conference can take place. As you're well aware app-datepicker supports min and max dates
However a user isn't allowed to create multiple conference days for a given date. Since your component doesn't support an "invalidDates" or "disableDates" concept it leads to scenarios below where the user could select days that don't make sense
In contrast this is a component I wrote when the app was using Angular 1.x + Angular Material:
@nick-woodward Now I just figured it out what you're trying to convey. It's definitely a fantastic idea. I totes agree with this suggestion. Please open an issue as a feature request before proceeding to any PR (if you want to). Once again, thank you very much for suggesting this proposal.
PS: What a nice piece of work you have there! Is it publicly accessible?
Not at the moment, it was a quick datepicker I hacked together when I was using Angular Material. It isn't nearly as fleshed out as yours since it doesn't animate and there isn't an area to select a year. (i.e. click the year and it brings up the list of possible years)
I do however have other components I've open sourced!
I think the autoUpdateDate attribute should be true by default, it's the typical use scenario. It took at least me a while to understand why the data binding didn't work. The user can actually use [[ ]] syntax for one-way data binding if they want to, or {{ }} for two-way data binding, which makes this attribute unnecessary.
@panuhorsmalahti By default, app-datepicker needs buttons to confirm on selected date change. Let say app-datepicker was put into a dialog, the selected date should be updated only when the user click on the confirm button within the dialog. If autoUpdateDate was enabled by default, this would always update and fire when the selected date changes. Of course, you can say that let's turn it off when there are buttons or something like that. So this is basically the use case of why autoUpdateDate was proposed and set to false by default. Hope it answered your doubt!~
Ah, that makes sense, I was only thinking about the dialog use case.
In our project, we have different type of dates. Some are available (and you can select them), some are blocked (and you can't thanks to the disabled-dates array) but some are both but we can't customize them. So, it could be nice to be able to customize the colors of some dates. That can be useful to inform our user about some events (if coupled with a legend) or in our case, to inform certain dates are not currently blocked but close to.
For those who are interested in the range functionality, I have released a component that handles this case, pending app-datepicker !
See demo here : https://www.webcomponents.org/element/roxus/range-datepicker
https://github.com/motss/app-datepicker/tree/lit-element-v1 is the latest branch with lit-html 1.0 RC and addressing many of the issues listed here.
would it be possible to implement a:
- [ ] simple month picker - similar to year picker - allowing quick jump to months ahead of current instead of clicking clicking clicking...?
- [ ] months as chip seletors,
- [ ] years as chips in a grid for more years on the same page as in the below spec.
- [ ] option to multi-select to + from dates (a checkbox in the bottom part of the dialog could be used to indicate that "range" is being set. When checked the first selected date becomes the start and hovering to the second date should highlight the range. When clicking on the second date - the dialogue completes and returns the 2 selected dates in an object or arr.
- [ ] transition carousel when moving from one months to the next
actually anything from here: https://material.io/components/pickers/#desktop-pickers
MD has a relatively new specs for the pickers and it is quite comprehensive for authors to implement it now. The goal is to implement according to the specs in terms of UI/ UX.
I already have plan to work on v5 once v4 goes stable.
The new specs looks promising for a datepicker author like myself and I'm going to work on datepickers for desktop and not prioritize any datepicker for mobile (might skip it and fallback to native datepickers on iOS or Android). Also, range datepickers also in the specs so it's definitely win-win for people who want that too.
