Our powerful JS Calendar component


Post by ashik »

I can see what happens here. The calendar takes care of the preserving the data which is obviously a better approach. I tried your method. I'm just getting started and exploring the package so I'm unable to think of several options to try. Please find the error attached.

Animal wrote: Wed Jan 04, 2023 12:54 pm

Probably best not to throw the event editor out. It does a lot.

Try configuring the Calendar with this:

    onBeforeEventEdit() {
        const { editor } = this.features.eventEdit;

        editor.on({
            beforeShow : () => {
                editor._centered = false;
            },
            once       : true
        });
        editor.floating = false;
        editor._centered = true;
        editor.render(this.element.parentNode); // or this.contentElement
    },

dockeditor.gif

Obviously the calendar.element.parentNode needs the correct CSS. Probably

display : flex;
flex-direction : row;
align-items : stretch
}
Attachments
Screenshot 2023-01-04 at 4.36.46 PM.png
Screenshot 2023-01-04 at 4.36.46 PM.png (169.86 KiB) Viewed 377 times

Post by tasnim »

Hi,
You could use this in Angular

const { editor } = event.eventEdit;

This will not give you error


Post by Animal »

Maybe try this

const { editor } = (this.features.eventEdit as EventEdit)

Assuming that you have imported the EventEdit feature

Note that I am not a typescript specialist, so YMMV


Post by ashik »

Cool. This one worked but there's a glitch. The editor portion is greyed out when clicked and dragged. Check the video

tasnim wrote: Wed Jan 04, 2023 1:29 pm

Hi,
You could use this in Angular

const { editor } = event.eventEdit;

This will not give you error

Attachments
Screen Recording 2023-01-04 at 5.30.08 PM.mov
(3.33 MiB) Downloaded 26 times

Post by tasnim »

I don't see any glitches.
Maybe it's in your code. Could you please upload your app here so we can check what's causing that glitch?

You could check my video below

Attachments
chrome_gXryrAM1TJ.mp4
(1.6 MiB) Downloaded 24 times

Post by ashik »

Did you click and drag inside the editor?
Uploading the project is quite difficult as it is being integrated inside our application.


Post by tasnim »

I tried to click and drag and reproduced the glitch.
You just need to set the draggable property false
inside of onBeforeEventEdit fn

editor.draggable = false;

This should solve your issue


Post by ashik »

editor.draggable = false

did the trick. Why is the draggable property not defaulted to false as nobody want this to happen. At this point in time I strongly feel there should be a separate documentation for each of the framework otherwise it's going to be a difficult task achieve.


Post by tasnim »

Thanks for your suggestions.
I've created some FRs for these
https://github.com/bryntum/support/issues/5875
https://github.com/bryntum/support/issues/5874


Post by Animal »

In the upcoming version you will be able to just do

    features : {
        eventEdit : {
            // We want our editor to be static, *not* floating
            // This converts it to a docked, slide-in overlay
            editorConfig : {
                appendTo : document.body
            }
        }
    }

Which makes it look like this:

dockededitor.gif
dockededitor.gif (465.78 KiB) Viewed 201 times

Post Reply