Islamic Calender Support in Datepicker

[AhmedMustafa]

Angular-ui/bootstrap should have the support for the Islamic(Hijri) calendar which is the civil calendar in Saudi Arabia and it is used in all the Islamic countries worldwide. https://en.wikipedia.org/wiki/Islamic_calendar

[Foxandxss]

From ignorance, couldn't you create a custom template for it?

[AhmedMustafa]

What do you mean by creating a custom template?

[Foxandxss]

You can override our templates (what you see on screen) with your own template. That way you can translate it to your language.

That being said, if you need extra functionality, a template replacement wouldn't do it.

[AhmedMustafa]

It is not about translation(Islamic calendar can be displayed in English as well as Arabic), it is about the calculations & the conversion of dates between the Gregorian & the Islamic calendar. The Islamic calendar is a lunar calendar with 12 months in a year of 354/355 days. Which means if today is Fri, April(04) 22, 2016 in Gregorian, it is Fri, Ragab(07) 14, 1437 in Hijri.

[AhmedMustafa]

Most probably the templates will be used as is in both the Gregorian & the Islamic calendar. The changes more likely to be done in the datepareser & the datepicker. I already did some progress regarding this here & here. But I am not sure if I follow the right path or not. Any advice will be appreciated.

[Foxandxss]

I don't dislike what I see there and that is probably your best option.

Our Datepicker is currently a beast that consume all our time, adding support for a different type of calendar would be a real problem for us. Forking the project and implementing the features you need (what you did) is the best course of action.

[deeg]

Closing per @Foxandxss comment. Please feel free to continue the discussion if there is more to be had.

[AhmedMustafa]

@deeg Why this issue get closed?! @Foxandxss seems to have no problem with this.

The Islamic calendar is a mandatory globalization feature in the Islamic world. It is the main calendar used in Saudi Arabia and it is used in all the Islamic countries worldwide. https://github.com/unicode-cldr/cldr-core/blob/master/supplemental/calendarPreferenceData.json

Beside that, there is a real business need to include this feature in the Apps developed with the Angular-UI bootstrap. So I think it is no more optional to include this support, at least from the Islamic users' point of view.

[Foxandxss]

I agree, islamic calendar can be needed for a lot of people, but the best course of action is to create your own library with it (you can use our datepicker as a base if you want).

There are infinite things that we could add to ui-bootstrap, but as it is today, it requires an insane amount of hours and since we do it for free, we also need to work every day so our available time is minimum.

[AhmedMustafa]

I see & I really appreciate your efforts. But could I create the Islamic calendar and host it as a new widget of the ui-bootstrap?

[Foxandxss]

You can create it in your own github repository and tell that it is compatible with ui-bootstrap. If we host it here, we will need to maintain it and that is something we don't want to do, what we have now exhaust us more than needed right now ;(

[AhmedMustafa]

Being a member of the Globalization Team at IBM, I would say not to worry about maintaining the Islamic calendar as this will be part of our regular responsibilities.

[AhmedMustafa]

We just need to find out the most suitable way to design & integrate the Islamic calendar with ui-bootstrap.

[AhmedMustafa]

@Foxandxss As I said before, the globalization team at IBM willing to participate in creating & maintaining the Islamic calendar. There should be no extra development or maintaining overhead on your team.

[Foxandxss]

But why you don't create a new repository and put it there? You can grab all the code you want from here, that is not a problem.

There is no real value of having the calendar here. You can create your own repo, pull the code from here that you need and code the changes needed for the islamic calendar.

[AhmedMustafa]

The value of having the Islamic calendar here is: -It will be easy to convince the customers(who are already using ui-bootstrap) to upgrade the version of ui-bootstrap rather than integrating another third-party library within their projects. -Whenever you add any new feature/enhancement to the existing calendar, it should be reflected directly to the Islamic calendar.

[pkozlowski-opensource]

@AhmedMustafa so as much as we would love to have a built-in support for all the possible calendars in the date-picker the reality on the ground is that:

• the current implementation doesn't have enough flex points built in to support various calendars
• the current implementation is not trivial (and date-picker is one of the most complex directives) so introducing needed flex points would involve big code changes

Given the above the future request would involve significant amount of work and high risk of breaking changes / new bugs introduced. Tackling both new development and dealing with regressions requires time (don't want to jump with estimates here but it is in the order of magnitude of weeks). The bitter truth is that none of the maintainers has such time available for the foreseeable future...

Honestly I don't know what the best curse of action is here. If you truly care about changing the existing date-picker maybe you should step in and own this directive (code changes and maintenance)? Just be warned: that requires significant time investment....

[NorhanSamir]

How can I use Hijri dates in datepicker component ??

[AhmedMustafa]

@NorhanSamir I don't think it is supported here, but you can use this library https://ng-bootstrap.github.io/#/components/datepicker/examples

[kilanny]

@AhmedMustafa Thank you so much

[Ghyath-Serhal]

@ibraheemalkilanny The calendar supports Hijri, check the below link https://ng-bootstrap.github.io/#/components/datepicker/calendars#islamicumalqura