Grapesjs: Dragging from toolbar can be off (dragMode)

[emilsedgh]

Here is a working demo of the issue

Steps to reproduce:

1. Select a component
2. Try dragging it from the toolbar

You can see that immediately the component jumps to the left.
Although it works fine if you try dragging the component by itself (and not using toolbar)

This only happens if Grapesjs is loaded from a with margin and doesn't start from x:0

The reason it happens is this:

In both cases of dragging from toolbar or component itself, the tlb-move command is called.
tlb-move accepts an event argument and the positioning of the element is calculated using event.clientX.

When you drag the component, sine the component is inside the iframe, it's clientX is relevant to the document and all goes fine.

But the toolbar button doesn't live on the canvas/iframe. Therefore, an event originating from ToolbarButtonView is relevant to the page, not to the canvas.

Here is a visual description:

The ideal solution would be to calculate clientX and clientY of ToolbarIconView relative to the canvas before passing them to tlb-move command.

If you would accept such patch, I can get started on one.

[pouyamiralayi]

@emilsedgh there is an open discussion about this here

[emilsedgh]

Oh, I tried to find it before reporting but I couldn't. Thanks. I'll close this one then.

[alemenciones]

this's fixed in the last release right?

I need a solution when i drag outside of iframe in mobile devices