ANovokmet / svelte-gantt

:calendar: Interactive JavaScript Gantt chart/resource booking component

Home Page:https://anovokmet.github.io/svelte-gantt/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

External draggable example not working

xeoshow opened this issue · comments

Hello,

When I am trying the External draggable example from below link, got below error. I am trying on chrome, windows 11, seems a bug? Thanks.

https://anovokmet.github.io/svelte-gantt/external

image

You can change as below and have a try.
@ANovokmet If this works , coud you please merge it into the release branch? Thanks.

src\modules\external\external.ts

constructor(node: HTMLElement, options: DragOptions) {
        this.options = Object.assign({}, defaults, options);
        this.draggable = new Draggable(node, {
            onDrag: this.onDrag.bind(this),
            dragAllowed: () => this.options.enabled,
            resizeAllowed: false,
            onDrop: this.onDrop.bind(this),
            container: document.body,
            // getX: (event: MouseEvent) => {
            //     return event.pageX;
            // },
            // getY: (event: MouseEvent) => event.pageY,
            **getX: () => 0, // use this instead**
            **getY: () => 0, // use this instead**
            getWidth: () => 0
        });
    }

src\core\drag\draggable.ts

 if (canDrag || canResize) {
            let x = 0;
            let y = 0;
            if (this.settings?.getX()) {
                x = this.settings.getX();
            } **else {
                x = event.pageX;  // use the onmousedown event 
            }**
            if (this.settings?.getY()) {
                y = this.settings.getY();
            } **else {
                y = event.pageY;  // use the onmousedown event 
            }**
            const width = this.settings.getWidth();

            this.initialX = offsetEvent.clientX;
            this.initialY = offsetEvent.clientY;

Fixed in v4.3.0, thanks @gubeils @xeoshow

@ANovokmet
Thank you very much, will this be published to https://www.npmjs.com/package/svelte-gantt ?
Thanks again.