Our pure JavaScript Scheduler component


Post by Samith »

Is there a way to swap partnered schedulers with a component state?


Post by mats »

Sorry, not quite following - please describe a bit better what you want to do.


Post by Samith »

ex: simply, how to swap two partnered schedulers (move top scheduler to bottom and bottom scheduler to top) from a button click

https://www.bryntum.com/examples/scheduler/partners/


Post by mats »

Sure, that's easily done with basic DOM manipulation. Please read on MDN: https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild


Post by Samith »

No, it is not working that way, you have configured 'partner' key in the scheduler config, but when we try to swap it from react, we are getting following error

2020-07-01 18_19_32-Resource Management Scheduler.png
2020-07-01 18_19_32-Resource Management Scheduler.png (13.71 KiB) Viewed 1250 times

Post by mats »

How do you swap positions? Seems to work fine for me, try at https://www.bryntum.com/examples/scheduler/partners/

to run in console:

scheduler.element.parentElement.appendChild(scheduler.element);

Post by Samith »

can you test it with your react/ drag-between-schedulers demo, your answer is not react specific, it is just a simple DOM manipulation

try to swap scheduler positions (bottom scheduler to top view and and top scheduler to bottom view)

https://www.bryntum.com/examples/scheduler/react/javascript/drag-between-schedulers/build/index.html

ex:

<div id="content">
      <BryntumScheduler
        {...scheduler2Config}
        schedulerClass={BottomScheduler}
      />
      <BryntumWidget type="splitter" />
      <BryntumScheduler {...scheduler1Config} ref={scheduler1Ref} />
    </div>
err.png
err.png (103.32 KiB) Viewed 1130 times

Do you have a fix for this?

Last edited by Samith on Fri Aug 28, 2020 4:49 am, edited 1 time in total.

Post by saki »

The proof of concept:

  1. navigate to https://www.bryntum.com/examples/scheduler/react/javascript/drag-between-schedulers/build/index.html
  2. in the console, execute:
    c = document.getElementById('container');c.appendChild(document.querySelector('.b-splitter'));c.appendChild(document.getElementById('top-scheduler'));

This does not do anything with the components it only moves splitter to the end of container and then moves top scheduler after the splitter. It's all.

In the real life you may want to adjust sizes of schedulers before or after swap, you may want to write a universal routine that would be able to swap schedulers back, etc.


Post by Samith »

Thanks. this was useful, but i'm confused why the component way is not working even though we pass correct partners,
does it always require the top gird to be partnered with bottom, is opposite not working?


Post by saki »

The position of partners is irrelevant, in fact the scheduler code does not know if its partner is above or below. That is also the reason that simple swap of DOM elements does not break anything and the partnered schedulers continue to work.

I don't know the details of your "component way" of swap but I'd guess that it does more than just mere swap of DOM, perhaps destroy an re-create or anything else in addition to the DOM swap.


Post Reply