React-calendar-timeline: Can hours be omitted from a day in the timeline?

Created on 21 Feb 2017  路  5Comments  路  Source: namespace-ee/react-calendar-timeline

More of a question really. I would like to know if it were possible to omit certain hours from within a day in the timeline.

For example I would like to build out a calendar view that contain events. This timeline will only show for each day starting from an hour that the first event is at and ending when the last event that day is over.

For example:

Day 1:
  2 events:
     Event A: starts from 10AM, ends at 2PM
     Event B: starts from 3PM ends at 6PM

Day 2:
  2 events:
     Event A: starts from 12PM, ends at 4PM
     Event B: starts from 4PM ends at 5PM

The timeline would only show hours from 10AM to 6PM for day 1, and the timeline would show only hours 12PM to 5PM for day 2. I'm going through the docs but I can't seem to find any combination of props for which I could achieve the above scenario.

Am I missing something?

Thanks!

feature-request help wanted

Most helpful comment

Hey! Right now, this is not possible and it would require some bigger changes to the timeline to work. But it's not theoretically impossible :).

The timeline treats time as a continuously flowing number of milliseconds (from the UNIX Epoch). The internals of the timeline rely on this number being continuous and make the assumption that the same difference in time is always the same difference in pixels (width).

To make it jagged - skipping a few hours here and there - would break this assumption and greatly complicate the code of the timeline.

However, what could work instead is to replace the unix time with a different continuous number, where the meaning to each millisecond is attributed externally from the calendar. So for example t=0 is today at 1pm, t=3599 is today at 2pm-1sec, but t=3600 is today at 6pm. (2pm to 4pm skipped).

We seem to only use the moment functions moment(time), .startOf('day'), .valueOf(), .add(1, 'hour') and .day() (to get the weekday).

You would need to reimplement those functions, find a way to hot-swap them with the regular moment library and possibly rewrite the time-related functions in utils.js (iterateTimes, getMinUnit, getNextUnit).

Should be fun 馃榾

If anyone wants to work on it, please go ahead! I can provide guidance... but since we don't need it for anything we're building ourselves, we're not going to invest time in this.

All 5 comments

While this request is for flexible time-frames per day, I'd like to know if some kind of fixed time-frame is possible. Kind of like working-hours, where you specify when the day starts/ends (08:00-18:00) and hours outside of that window are not shown.

Hey! Right now, this is not possible and it would require some bigger changes to the timeline to work. But it's not theoretically impossible :).

The timeline treats time as a continuously flowing number of milliseconds (from the UNIX Epoch). The internals of the timeline rely on this number being continuous and make the assumption that the same difference in time is always the same difference in pixels (width).

To make it jagged - skipping a few hours here and there - would break this assumption and greatly complicate the code of the timeline.

However, what could work instead is to replace the unix time with a different continuous number, where the meaning to each millisecond is attributed externally from the calendar. So for example t=0 is today at 1pm, t=3599 is today at 2pm-1sec, but t=3600 is today at 6pm. (2pm to 4pm skipped).

We seem to only use the moment functions moment(time), .startOf('day'), .valueOf(), .add(1, 'hour') and .day() (to get the weekday).

You would need to reimplement those functions, find a way to hot-swap them with the regular moment library and possibly rewrite the time-related functions in utils.js (iterateTimes, getMinUnit, getNextUnit).

Should be fun 馃榾

If anyone wants to work on it, please go ahead! I can provide guidance... but since we don't need it for anything we're building ourselves, we're not going to invest time in this.

Closing due to inactivity and narrowness of feature request

Hey there ! @mariusandra would you still provide guidance if i decided to work on this feature ? :)

Hi @maxsd , I'm unfortunately not involved with this library anymore and don't have time to help. Good luck!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

stahlmanDesign picture stahlmanDesign  路  4Comments

mdrulis-neurosys picture mdrulis-neurosys  路  7Comments

danielcruser picture danielcruser  路  3Comments

sabina4 picture sabina4  路  4Comments

x1mrdonut1x picture x1mrdonut1x  路  5Comments