remotelock / react-week-scheduler

A time grid component for React with scheduling capabilities.
https://remotelock.github.io/react-week-scheduler
MIT License
139 stars 58 forks source link

Schedule types, based on colours and labels #2

Closed pimvanderheijden closed 5 years ago

pimvanderheijden commented 5 years ago

Hello

This looks like a great module / fork. I'm considering to use it. Before I can make that choice, however, I'd like to know if there's a way to create schedule types or whatever you want to call it.

For example, one blue schedule labelled "fishing" and one green schedule labelled "soccer".

Thanks in advance

forabi commented 5 years ago

Hey! Thanks for the interest.

This module is very new, released less than a month ago. It was designed with one lock access schedule in mind for use on connect.remotelock.com. However, there might come a use case in the near feature where we need to display (not edit) two schedules (lock action, auto lock) on the same timegrid.

I wanted to focus on an MVP first but any contributions are welcome!

pimvanderheijden commented 5 years ago

Great. Thanks for letting me know!

On Fri, 22 Mar 2019 at 10:42, Muhammad Fawwaz Orabi < notifications@github.com> wrote:

Hey! Thanks for interest.

This module is very new, released less than one 1 month ago. It was designed with one lock access schedule in mind for use on connect.remotelock.com. However, there might come a use case in the near feature where we need to display (not edit) two schedules (lock action, auto lock) on the same timegrid.

I wanted to focus on an MVP first but any contributions are welcome!

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/remotelock/react-week-scheduler/issues/2#issuecomment-475554727, or mute the thread https://github.com/notifications/unsubscribe-auth/AVepSvGQYEv1lu0lQ7dp5-3DhtIU2iBvks5vZKV5gaJpZM4cDLE8 .

forabi commented 5 years ago

@MidnightP Update: it's now possible to customize how each cell in the time grid is rendered by passing custom components as eventRootComponent and eventContentComponent. See the default implementation for an example: https://github.com/remotelock/react-week-scheduler/blob/master/src/components/DefaultEventRootComponent.tsx

With this, you can "fake" multiple schedules by passing a single, flattened schedule object and checking the range index of each date range in the custom component and render e.g. a different background color.

pimvanderheijden commented 5 years ago

Wow that sounds really cool! I switched over to a Vue library called vue-cal, since we're migrating in that direction anyway. We'll load in the Vue component in our React app.