Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add support for Canvas on ghost of dragging #63

Open
cbazza opened this issue Oct 19, 2019 · 0 comments
Open

Add support for Canvas on ghost of dragging #63

cbazza opened this issue Oct 19, 2019 · 0 comments

Comments

@cbazza
Copy link

cbazza commented Oct 19, 2019

Basically when dragging something that has canvas inside, the ghost clone has blank canvas; it would be great if you could copy the previous canvas into the cloned one so that the ghost works properly, hide this new functionality behind a flag.

https://github.com/kutlugsahin/smooth-dnd/blob/master/src/mediator.ts

line 88:   const ghost: HTMLElement = wrapperElement.cloneNode(true) as HTMLElement; 

The problem is that cloneNode doesn't copy content of canvas so cloned canvas is blank so need to do something like this following line 88.

if (copyFullCanvas) {
        let elements = ghost.querySelectorAll("canvas");
        if (elements.length) {
            let sourceCanvas = wrapperElement.querySelectorAll("canvas");
            elements.forEach((canvas, idx)=>{
                let destCtx = canvas.getContext('2d');
                destCtx.drawImage(sourceCanvas[idx], 0, 0);
            });
        }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant