Premium support for our pure JavaScript UI components


Post by mightym »

Hey guys,
I dug around but haven't found anything how/if I could do the following with Scheduler Pro:

Is it possible that an Event between 2 Events always automatically fills up the horizontal space between them?


Post by marcio »

Hey mightym,

Thanks for reaching out.

By your description, perhaps you find useful this config https://bryntum.com/products/schedulerpro/docs/api/Scheduler/view/mixin/TimelineEventRendering#config-fillTicks

And you can check in a live demo here https://bryntum.com/products/schedulerpro/examples-scheduler/fillticks/

Best regards,
Márcio


Post by mightym »

Hey marcio,
I've seen the fillticks example already. But as I'm not trying to expand the events to the ticks I thought this wont help me. But your saying thats basically the same mechanism to solve my challenge?


Post by marcio »

Hey,

If I understood correctly, yes.

I'm sharing two screenshots of that demo, one that has fillTicks enabled and one that doesn't. You're looking for something like.

When it's disabled, the event is displayed on the defined start/end date. With the feature enabled, it fills until the end of the tick.

It's that the last behavior that you're looking for, or am I not understanding correctly what you want to achieve? If I misunderstood, could you provide more context/screenshots of what's the desired behavior?

Attachments
fillTicks_enabled.png
fillTicks_enabled.png (282.35 KiB) Viewed 297 times
fillTicks_disabled.png
fillTicks_disabled.png (197.75 KiB) Viewed 297 times

Best regards,
Márcio


Post by mightym »

Ah ok, no thats not what I'm looking for. I'm trying to achieve that an event between 2 events is basically always filling up the whole space between 2 event. No matter the tick size.
But actually let me explain you the overall thing I'm trying to build. I'll attach a screenshot.

There are these 3 blue lines with the numbering 1, 2, 3
These lines should snap on a single date/time.
And between those lines there are these white bars which are basic events.
These events can be dragged between the blue lines, but should always fill up the whole space between a pair of lines.
Like if an event is between line 1 and line 2 and is dragged between line 2 and 3 it should expand so that it fills up the timespan between line 2 and 3.

My idea was I could build those blue lines via single date "pseudo" events. and attach the blue line and the marker to the dom.
And based on those events I could define the space the white events should fill up...
but I'm anyway not sure if that would work :)

Attachments
Bildschirmfoto 2024-02-09 um 20.04.45.png
Bildschirmfoto 2024-02-09 um 20.04.45.png (89.78 KiB) Viewed 286 times

Post by alex.l »

Hi,

No, that is not supported. Could you please describe a use case why do you need this, we will discuss internally and if it might be useful for others, we will open a feature request.

Thanks!

All the best,
Alex


Post by mightym »

Well alex.l I'm not 100% sure if this is a "feature". I was just curious if there are already solutions/usecases for this.
Because code wise this could be achieved by this logic/constraints:

  • you have 3 Events
  • 2 events of the type start and end
  • 1 event of the type timespan
  • a timespan event can only be be dragged between events of type start and end
  • a timespan event always has to fill up the whole span between the start and end event
  • if you move a start/end event all the timespan events between them have to resize

I'm just not sure if its possible via all the callbacks/events of scheduler pro to control all these constraints

The usecase for this is quite common in our industry (logistics). You have multiple stops (loading and unloading points which have a specific date) and you have multiple deliveries between those stops.


Post by alex.l »

Thanks for the info, I will discuss this with our team.

In theory, it is achievable with some logic in https://bryntum.com/products/schedulerpro/docs/api/Scheduler/feature/EventDrag#event-beforeEventDropFinalize where you can validate drop and adjust event duration to time slot according to your logic.
To validate dragging area, try https://bryntum.com/products/schedulerpro/docs/api/Scheduler/view/Scheduler#config-getDateConstraints
and read https://bryntum.com/products/schedulerpro/docs/api/Scheduler/feature/EventDrag#validating-drag-drop
For lines you can use https://bryntum.com/products/schedulerpro/docs/api/Scheduler/feature/TimeRanges

All the best,
Alex


Post Reply