Page 1 of 2

Vertical Mode not available in Trial version

Posted: Sat Aug 24, 2019 12:57 am
by joanxtb
Hi. We've downloaded your trial version as we're interested in the Vertical Mode feature of your scheduler. Our product is built on React.js, so we've used your integration guide to create a very simple example. Out of the box on the 'horizontal' version. it renders just fine with the following code:
<BryntumScheduler
                ref={'scheduler'}
                autoHeight={true}
                startDate={new Date(2019, 1, 7, 8)}
                endDate={new Date(2019, 1, 7, 18)}
                eventStyle="colored"
                tickSize={80}
                barMargin={2}
            />

However if we add the attribute mode="vertical", things get nasty. (I'll paste a glimpse of the error code below since is pretty big).

We dig a little into your BryntumScheduler component looking for the Mode attribute, but seems like its not there, at least in the version:
/**
 * @author Saki
 * @date 2019-06-06 19:54:44
 * @Last Modified by: Saki
 * @Last Modified time: 2019-06-13 17:28:18
 */

-----
There are 2 errors: one nasty one like:
TypeError: Cannot read property 'cells' of undefined
VerticalTimeAxis.refresh
/Users/freddytorres/Development/Sportslogic/Admin/scheduler/build/scheduler.module.js:179
  176 | _0x403b2f=releaseEventActions[action],_0x176325=renderEventActions[action];if(_0x403b2f&&oldConfig){const _0x209313=oldConfig[_0x29e5('0x2e0')]['tplData'],_0x5172c1={'tplData':_0x209313,'assignmentRecord':_0x209313[_0x29e5('0x143f')],'eventRecord':_0x209313[_0x29e5('0x117d')],'resourceRecord':_0x209313[_0x29e5('0x11fe')],'element':element};scheduler[_0x29e5('0x194')]('releaseEvent',_0x5172c1);}if(_0x176325){const _0x2f305a=config['elementData'][_0x29e5('0x14d9')],_0x54e3e3={'tplData':_0x2f305a,'assignmentRecord':_0x2f305a[_0x29e5('0x143f')],'eventRecord':_0x2f305a['eventRecord'],'resourceRecord':_0x2f305a[_0x29e5('0x11fe')],'element':element};element[_0x29e5('0x2e0')][_0x29e5('0x16f')]=element;_0x54e3e3[_0x29e5('0x14ec')]=action===_0x29e5('0x14ed');scheduler['trigger ....
. it continues for looong.

The other error is:
TypeError: Cannot read property 'destroy' of undefined
BryntumScheduler.componentWillUnmount
src/components/scheduler/BryntumScheduler.js:153
  150 | 
  151 | // React component removed, destroy engine
  152 | componentWillUnmount() {
> 153 |     this.schedulerEngine.destroy && this.schedulerEngine.destroy();
  154 | }
  155 | 
  156 | // Component about to be updated, from changing a prop using state. React to it depending on what 
changed and


----

Again, this just happens if we add mode="vertical" to the snippet

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 3:58 pm
by joanxtb
Did you guys had any chance to check what's going on ?

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 4:58 pm
by Maxim Gorkovsky
Hello.
Reproduced, thank you for report. Ticket opened here: https://app.assembla.com/spaces/bryntum/tickets/9120-vertical-scheduler-throws-exception-when-autoheight-is-true/details
To get rid of this issue, please remove autoHeight config from the <BryntumScheduler> element, after that scheduler should build normally.

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 5:19 pm
by joanxtb
Still not working for us. We've removed the autoHeight property from the tag <BryntumScheduler /> as well as from the BryntumScheduler react wrapper in the properties array, (and basically everywhere else we found 'autoHeight'). Still getting the error.

----
TypeError: Cannot read property 'cells' of undefined
VerticalTimeAxis.refresh
/Users/freddytorres/Development/Sportslogic/Admin/scheduler/build/scheduler.module.js:179
  176 | _0x403b2f=releaseEventActions[action],_0x176325=renderEventActions[action];if(_0x403b2f&&oldConfig){const _0x209313=oldConfig[_0x29e5('0x2e0')]['tplData'],_0x5172c1={'tplData':_0x209313,'assignmentRecord':_0x209313[_0x29e5('0x143f')],'eventRecord':_0x209313[_0x29e5('0x

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 5:21 pm
by joanxtb
There are another 6 references to 'autoHeight' at the build/scheduler.module.js file, but that file seems pre-compiled or somethings. It makes so much references to memory addresses-like strings. It would not be wise from us to touch that file.

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 5:28 pm
by joanxtb
Maybe this version of the error helps a little more:
Uncaught TypeError: Cannot read property 'cells' of undefined
    at VerticalTimeAxis.refresh (scheduler.module.js:179)
    at VerticalTimeAxis.render (scheduler.module.js:179)
    at VerticalTimeAxisColumn.renderer (scheduler.module.js:179)
    at Row.renderCell (scheduler.module.js:108)
    at Row.render (scheduler.module.js:107)
    at RowManager.renderFromRow (scheduler.module.js:109)
    at RowManager.renderFromRow (scheduler.module.js:180)
    at RowManager.reinitialize (scheduler.module.js:108)
    at Scheduler.renderRows (scheduler.module.js:157)
    at Scheduler.renderRows (scheduler.module.js:180)
    at Scheduler.onPaint (scheduler.module.js:157)
    at Scheduler.callback (scheduler.module.js:9)
    at Scheduler.trigger (scheduler.module.js:9)
    at Scheduler.triggerPaint (scheduler.module.js:11)
    at Scheduler.render (scheduler.module.js:11)
    at Scheduler.render (scheduler.module.js:157)
    at Scheduler.render (scheduler.module.js:175)
    at ScheduleTooltip.functionChainRunner (scheduler.module.js:23)
    at Scheduler._0x343a42.<computed> [as render] (scheduler.module.js:23)
    at Scheduler.finalizeInit (scheduler.module.js:11)
    at Scheduler.finalizeInit (scheduler.module.js:147)
    at Scheduler.construct (scheduler.module.js:11)
    at Scheduler.construct (scheduler.module.js:175)
    at Scheduler.construct (scheduler.module.js:175)
    at Scheduler.construct (scheduler.module.js:175)
    at Scheduler.construct (scheduler.module.js:175)
    at Scheduler.construct (scheduler.module.js:179)
    at new Base (scheduler.module.js:9)
    at new Localizable (scheduler.module.js:9)
    at new Events (scheduler.module.js:9)
    at new Delayable (scheduler.module.js:9)
    at new Widget (scheduler.module.js:11)
    at new Pluggable (scheduler.module.js:23)
    at new State (scheduler.module.js:23)
    at new GridElementEvents (scheduler.module.js:131)
    at new GridFeatures (scheduler.module.js:131)
    at new GridNavigation (scheduler.module.js:131)
    at new GridResponsive (scheduler.module.js:131)
    at new GridSelection (scheduler.module.js:131)
    at new GridState (scheduler.module.js:131)
    at new GridSubGrids (scheduler.module.js:147)
    at new Grid (scheduler.module.js:147)
    at new TimelineDateMapper (scheduler.module.js:175)
    at new TimelineDomEvents (scheduler.module.js:175)
    at new TimelineEventRendering (scheduler.module.js:175)
    at new TimelineScroll (scheduler.module.js:175)
    at new TimelineViewPresets (scheduler.module.js:175)
    at new TimelineZoomable (scheduler.module.js:175)
    at new TimelineBase (scheduler.module.js:175)
    at new SchedulerDom (scheduler.module.js:175)

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 5:46 pm
by Maxim Gorkovsky
I'm trying with react/javascript/filtering demo from the trial distribution, I pasted slightly modified code snippet from the first post and it worked for me:
<BryntumScheduler
    ref={scheduler}
    mode="vertical"
    autoHeight={false}
    startDate={new Date(2019, 1, 7, 8)}
    endDate={new Date(2019, 1, 7, 18)}
    eventStyle="colored"
    tickSize={80}
    barMargin={2}
    />
Are you using typescript or different config? It would help a lot if you could provide a runnable test case.

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 7:22 pm
by joanxtb
We use Javascript. Where can I send you a runnable test case ( I got one ). Tho is easy to replicate:

1. Create a brand new react app with npx create-react-app test-scheduler
2. Copy and paste the Scheduler/build folder that comes at the Trial distribution in the root folder of the app
3. npm install --save Scheduler/build
4. Copy the BryntumScheduler React wrapper file (BryunthumScheduler.js - also comes in the Trial dist) in the root folder app.
5. Change the App.js file to:
-----

import React from 'react';
import './App.css';
import BryntumScheduler from './BryntumScheduler';
import 'bryntum-scheduler/scheduler.stockholm.css';

function App() {
  const resources = [
    { name: 'The field 1', id: 1 },
    { name: 'The field 2', id: 2 },
  ]
  const columns = {
    columnWidth: 140,
    //headerRenderer : ({ resourceRecord }) => `${resourceRecord.id} - ${resourceRecord.name}`
  }
  return (
    <div className="App">
      <BryntumScheduler
        //ref={scheduler}
        mode="vertical"
        autoHeight={false}
        startDate={new Date(2019, 1, 7, 8)}
        endDate={new Date(2019, 1, 7, 18)}
        eventStyle="colored"
        tickSize={80}
        barMargin={2}
      />
    </div>
  );
}

export default App;

----
6. Run npm start

---

It causes the same issue on our end.

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 9:17 pm
by Maxim Gorkovsky
Where can I send you a runnable test case ( I got one )
You can attach zip to a forum post.

Re: Vertical Mode not available in Trial version

Posted: Mon Aug 26, 2019 9:23 pm
by joanxtb
There it is. Unzip -> npm install -> npm start