twinssbc / Ionic-Calendar

A calendar directive for Ionic framework
http://twinssbc.github.io/Ionic-Calendar/demo
MIT License
159 stars 73 forks source link

Issue with starting-Day-Week="1" #49

Closed lmigula closed 8 years ago

lmigula commented 8 years ago

Hi, I found an Issue where I couldn't find a solution myself. If I set the starting-Day-Week Parameter to 1 and have a Sunday as selected Date the week view jumps to the wrong week. So for example If you select the 19th June 2016 in the month view you get a week view from the 20th to the 26th of June. Plunker with the parameter set I had a look at the dateRange in the Controller and that all looks fine, so I hope you have a hint what I am missing.

Thanks Lars

twinssbc commented 8 years ago

@lmigula This is a bug and I have fixed it in version 0.2.7. Thanks for reporting it!

lmigula commented 8 years ago

Thank you for fixing it ;)

eric7704 commented 7 years ago

startingDayWeek: [1,3,5], its what I did, but other post said it has to be like this : starting-day-week="1", I was wondering where do you put the code, thanks.

twinssbc commented 7 years ago

@eric7704 starting-day-week="1" means the week view starts from Monday. What effect do you want to achieve with [1,3,5]?

eric7704 commented 7 years ago

Hi, thanks for the quick reply, For example in "fullcalendar" when you do "dow:[1,3,5]", means the recurring events will display one monday, wednesday, and Friday, how do i achieve this with ionic calendar, please help!

twinssbc commented 7 years ago

@eric7704 staring-day-week is not for specific event. To display recurring event, you need to handle it by yourself. You could simply create three events.

eric7704 commented 7 years ago

Thanks, I got it figured out! Now facing different problem, how do I set different background colors to events?

eric7704 commented 7 years ago

How do I change start hour column from 12 Am to 8 AM?

twinssbc commented 7 years ago

@eric7704 To set different background color, you could use a customized property in the event, then use a customized template to apply different css class based on the property.

To limit the hour column range, there's no native support for that. You could apply below styles to hide part of the table.

.weekview-header {
    background-color: white;
}

.weekview-allday-table {
    height: 50px;
    position: relative;
    border-bottom: 1px solid #ddd;
    background-color: white;
}

.weekview-normal-event-container {
    overflow: hidden;
    margin-top: -100px;
    height: 500px;
    z-index: -1000;
}
eric7704 commented 7 years ago

Thanks, right now I have another request, how can I combine weekview and month view toghether...

On Fri, Aug 11, 2017 at 5:57 PM, twinssbc notifications@github.com wrote:

@eric7704 https://github.com/eric7704 To set different background color, you could use a customized property in the event, then use a customized template to apply different css class based on the property.

To limit the hour column range, there's no native support for that. You could apply below styles to hide part of the table.

.weekview-header { background-color: white; }

.weekview-allday-table { height: 50px; position: relative; border-bottom: 1px solid #ddd; background-color: white; }

.weekview-normal-event-container { overflow: hidden; margin-top: -100px; height: 500px; z-index: -1000; }

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/twinssbc/Ionic-Calendar/issues/49#issuecomment-321947015, or mute the thread https://github.com/notifications/unsubscribe-auth/AcSvMb_MMNT3ztxQQGtgSHyY8MEeFd8Eks5sXPh0gaJpZM4IxHab .

twinssbc commented 7 years ago

@eric7704 This calendar doesn't support this kind of customization.

eric7704 commented 7 years ago

Hi, thanks for the replies, now facing a new problem, the timezone automatically pushes events one hour earlier, for example, my courses, start at 12:30, when I scroll to November weekview, courses' start time became 11:30, please help!

twinssbc commented 7 years ago

@eric7704 You need to handle the DST by yourself. Because the calendar is not aware of the local timezone.

eric7704 commented 7 years ago

Thanks, I figured out, but what I cant figure out is, how to change hour column format from 10 am to "10" and "am" next line..... same as weekViewHeader format

eric7704 commented 7 years ago

Hi, I got the hour column working, now moved on to another optimization problem, how come on every calendar weekview swipe, it always loads, like the events always display after. how to make events stay without loading everytime, thanks.

twinssbc commented 7 years ago

@eric7704 If you will load all events from the beginning, you could set queryMode to 'local', just like demo. If you still want to load events when swiping, just not that frequent, you could cache your loading result. Each time you swipe, if will trigger rangeChanged method. But you don't have to fetch events from back end each time.

eric7704 commented 7 years ago

Not working.... how is each slides being generated?

On Sat, Sep 2, 2017 at 5:34 PM, twinssbc notifications@github.com wrote:

@eric7704 https://github.com/eric7704 If you will load all events from the beginning, you could set queryMode to 'local', just like demo. If you still want to load events when swiping, just not that frequent, you could cache your loading result. Each time you swipe, if will trigger rangeChanged method. But you don't have to fetch events from back end each time.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/twinssbc/Ionic-Calendar/issues/49#issuecomment-326776957, or mute the thread https://github.com/notifications/unsubscribe-auth/AcSvMYP3eg_KxTpklr0SyXJtCAVpEKg7ks5sefQIgaJpZM4IxHab .

eric7704 commented 7 years ago

How to highlight today's column too?

On Wed, Sep 6, 2017 at 3:08 PM, Eric Chen ericchen@knowidea.ca wrote:

Not working.... how is each slides being generated?

On Sat, Sep 2, 2017 at 5:34 PM, twinssbc notifications@github.com wrote:

@eric7704 https://github.com/eric7704 If you will load all events from the beginning, you could set queryMode to 'local', just like demo. If you still want to load events when swiping, just not that frequent, you could cache your loading result. Each time you swipe, if will trigger rangeChanged method. But you don't have to fetch events from back end each time.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/twinssbc/Ionic-Calendar/issues/49#issuecomment-326776957, or mute the thread https://github.com/notifications/unsubscribe-auth/AcSvMYP3eg_KxTpklr0SyXJtCAVpEKg7ks5sefQIgaJpZM4IxHab .

twinssbc commented 7 years ago

@eric7704 What do you mean not working? Is there any error message printed in the console?

There are 3 slides in a loop, each time swipe to a new month/week/day view, it will fill the days to the previous and next slide.

Highlighting a column in the table is a bit complicated, because it's not natural to a table DOM element. If you really want to, you could use view customization to provide your own view.

Please create a separate issue, as your questions are not relevant to this issue.

danemaker commented 6 years ago

My dear twinssbc, I have been trying to change the beginning of the day of the week in the calendar for some days and it is impossible for me to change it. I do not know where the ruling may be, and I can not find a way for the days of the week to start on Monday. As you comment on the questions of different people, you can make the change of the one that I speak with this command effective -> starting-day-week = "1". I am inserting this command in the html, more specifically ->

          With this change would be enough ??? I am developing an app with ionic 3, please help me! Thank you!
danemaker commented 6 years ago

I'm sorry I did not stop to review the code in detail, your code is very very good. I could already see what the problem was.

.html -> [startingDayMonth] = "calendar.startingDayMonth"

.ts -> startingDayMonth: '1'

I have searched several calendars and the best one with difference is yours, congratulations.

Greetings and thanks!