Displaying events

[Makashov]

Usage

Basic Example

render(
  <InfiniteCalendar
    events={[
      new Date(2018, 0, 26),
      new Date(2018, 0, 24),
    ]}
    width={Math.min(window.innerWidth, 600)}

  />
, document.querySelector('#demo'));

Result

[Makashov]

Also you can change color of events with eventsColor param in theming.

module.exports = {
  accentColor: '#448AFF',
  eventsColor: 'rgb(68, 138, 255)',
  floatingNav: {
    background: 'rgba(56, 87, 138, 0.94)',
    chevron: '#FFA726',
    color: '#FFF',
  },
  headerColor: '#448AFF',
  selectionColor: '#559FFF',
  textColor: {
    active: '#FFF',
    default: '#333',
  },
  todayColor: '#FFA726',
  weekdayColor: '#559FFF',
};

[Makashov]

resolves #6

[gopeter]

Would be great if this could be merged :-)

[MathiasKandelborg]

This works great! I have emailed the maintainer but haven't gotten any answers yet. If anyone would like to help me ask if @clauderic still wants to maintain this package I'd be glad.

If he still doesn't answer after a while, would anyone be interested in helping maintain a similar calendar based on/forked from this codebase? My thoughts being that this project is way too good to just die.

There are already quite a few PRs that would help get the project up to date and even. I have used this PR in production with a simple function to match the selected days against an array of dates and only display the ones that selection match.

[giggioz]

@Makashov ehy, thanks for the fork!
Can i ask you in which way this resolves #6 ?
Could you provide us a little snippet in which it is shown the event name in the day of the event?
Thanks!

[Makashov]

@giggioz Hi there!
Sorry but it can't show event names :(
It can take array of dates from events attribute and display them like in the picture.
I think best way to display event name is using onSelect event.

[Makashov]

Hi @MathiasKandelborg!
Sorry but i am not going to maintain this project, i just wanted to make it a little bit better.

[daiky00]

when would your pull request get merge? whats happening with this @Makashov

[Makashov]

Hi @daiky00, I don't know when it will be merged. I am not even sure will it be merged or not. Looks like @clauderic is too busy for a long time. I did this changes for my own project and created merge request, because I thought it will be usefull for others.

[MathiasKandelborg]

I also got caught in work. I'll have the time to make a release with this PR soon. Would that interest anyone?

[gopeter]

I'm using @Makashov's solution in production (internal app) for a few months and it works like a charm :-) (https://github.com/gopeter/react-infinite-calendar)

I've also added few more things:

• Added currentDate param to onScrollEnd: gopeter@8d6aaaa
• Updated dependencies: gopeter@352a7dd

[daiky00]

@gopeter how up to date is your branch? and are you planning to publish this to npm?

[daiky00]

I think somebody with more time should take this project on @clauderic . can you assign someone to help you?!

[gopeter]

@daiky00 no need to publish it to npm, you can use @Makashov's or my branch in your package.json. It wasn't updated since April, but it works very well with the newest React version (16.6).

[MathiasKandelborg]

@gopeter While I agree, some people might find it unnecessarily difficult and would want the process of adding react-infinite-calendar to be the same as every other- npm install

I've also been using a local version instead, but it is an extra step, which we could get rid of by having this merged or getting a new release on npm.

[gopeter]

For sure, but without @clauderic‘s feedback we can‘t do much on this :-(

[rew62]

@daiky00 no need to publish it to npm, you can use @Makashov's or my branch in your package.json. It wasn't updated since April, but it works very well with the newest React version (16.6).

Hi @gopeter I am very new to react/npm/git. Would you be so kind as to provide more clarity. I have @clauderic npm loaded, and I want to get to your version. Would I use a npm command like npm install git://github.com/gopeter/react-infinite-calendar, or should I download your version manually and do an npm install inside the directory. I'm just not sure what you meant by 'use my branch in your package.json' Thanks.

[ayozebarrera]

so?

[clauderic]

Hey @makasho, thanks for taking the time to submit this PR. I'm sorry I couldn't get to it sooner.

Unfortunately, the approach you've chosen would add complexity to the base functionality that the Calendar supports. There is a better way to enhance the base calendar component, and that is through enhancers. For instance, see the implementation for withMultipleDates (https://github.com/clauderic/react-infinite-calendar/blob/master/src/Calendar/withMultipleDates.js), which should be very similar to what you've tried to implement.

I'm going to close this PR, but I'd be happy to accept a PR that followed the enhancer approach.