Paste into a WebCanvas

I have a client that wants to be able to have a user COPY a portion of a report or webscreen and paste it into a web app.

I see that a WebCanvas has an AcceptDrop method. So …

When a user COPIES a section of the screen, they really don’t have a picture file on their computer … yet. If they had the picture file, then they could drag-n-drop. I know they can past text into a WebTextArea, but I assume that’s because they have the text in the computer. That is, in the computer that they are browsing with.

I suspect a picture held in the copy/paste buffer may be different. But you all can correct my wrongness on this assumption.

So … assume that a user has a browser and they want to copy a section of a PDF into a Xojo Webapp, what do we think we can do to accomplish that.

What I need to understand is … if a user can select an area in a desktop app (PDF viewer or Browser) and PASTE that picture into other applications, can they paste that into a Xojo control (WebCanvas, WebImageWell, what ever). Assume that they have grabbed a picture area (no text).

Thanks Eric

P.S. Snarky remarks are OK.

No. The accept drop method is for drag and drop within the app. Not for outside sources… and WebCanvas is just a place to draw.

Thanks for a definitive answer.

At first glance, it should be possible to adapt this to Xojo Web :

I believe it should be possible to send the blob image back to the Xojo app as Base64 though WebSDK’s Xojo.triggerServerEvent(). Then processing it is another story. I never did that.

You should get look at under Clipboard API and see what they gave to say about browser support. It’s not as cross-browser as you’d like it to be.

If the adaptation Michel suggest is possible it could be a nice feature and solution for many WebApps !!!

Right, but go read the link I sent. The Clipboard API does not work consistently or even completely across browsers which could leave you with a solution that works only part of the time.

@Greg O’Lone … I saw your advice and I also saw the link you sent… And there I notice that most of the browsers works fine with the API. If so, and if someone have enough knowledge to adapt to Xojo what Michel suggest, I beleive that it would be very usefull for the hole community. Only Opera Mini and UC Browser for Android it seams that are not compatible with the API.

You’ve got to read the whole thing, not just the graph. the comments section below the chart that affect Pasting:

1 Only supports Text and URL data types and uses a non-standard method of interacting with the clipboard.
2 Only fires copy event on a valid selection and only cut and paste in focused editable fields.
4 Only supports paste event (on focused editable field).
6 Supports cut & copy events without a focused editable field, but not paste (presumably for security reasons)
7 Supports cut & copy events without a focused editable field, but does not fire paste with document.execCommand(‘paste’)[/quote]

1 = IE, Edge
2 = Edge, Safari, Android
6 = Firefox
7 = Chrome

Canvases are not considered a “focused editable field” when they have focus, all of the supported browsers will disallow for one reason or another.

Having read the link that Michel provided, I’d bet that this worked in 2012, but no longer does (that was 6 years ago). Browsers have gotten much more careful about privacy since then and the prospect of processing the user’s clipboard on paste without giving them a chance to review it first is a huge concern. That’s exactly what you’d have to do to display it on screen, even if just minimally because you’d have to take it in and display it on screen. You could just as easily send the image to a server somewhere on the internet (which is what you’d have to do in a Xojo canvas).

Greg, if you go to the page I linked to and click on the top picture, then paste a picture, it does paste. Here is the URL.

I did it with a picture I have on my desktop, showed it with preview, copied, and pasted under Chrome 66. It works in Safari as well, but not in FireFox.

On Windows, it works only in Chrome and Edge. Not in IE, or Firefox.

Read this thread with interest as I really want to be able to paste an image. Naturally the JS code for doing that is freely available.

What would it take to do this in Xojo ? Base64 the image data into a form field and POST it to the server I guess ?

Read something similar here:

Would appreciate pointers. Not looking to become a control developer but may pay to get it done.


EDIT: In enterprise world now, browser support for this is fine.
EDIT2: Tried to fix the link 6 times. Enough is enough :slight_smile:

Did a little digging around and found this javascript:

Any pointers with what would be required to get this working in Web Edition would be appreciated :slight_smile:


Look into WebSDK, in the Extras folder, next to the Xojo executable.