Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Wysiwyg with image copy/paste [closed]

First, I understand that an image cannot be "copied" from a local machine into a website. I understand that it must be uploaded. I am a web programmer, and am familiar with common web wysiwyg tools such as TinyMCE and FCKEditor. My question is if there exists a program or web module or something of the sort that works will perform an automatic upload of images for a wysiwyg. I have a client that is constantly complaining about not being able to copy/paste documents with images from MS Word into a wysiwyg to create content on their website.

I have looked into TX Text Control (http://labs.textcontrol.com/) and was looking into a possibly flash wysiwyg that could upload the file automatically behind the scenes. I don't know if this exists, and google did not much help me in my search, so I thought I would ask other coders.

I am open to any sort of server technology, or browser requirements. I am looking for some browser based tool instead of an application tool such as Dreamweaver or otherwise.

If no good solution to the problem exists, I am willing to accept that at this point.

Note: This was a request from a client, and to me it seemed rather unreasonable. I decided to gather community advice instead of just tell the client 'No' and the options here have been extremely helpful and informative in presenting possible solutions.

like image 947
jW. Avatar asked Jan 05 '10 20:01

jW.


2 Answers

You might find inspiration from ScreenshotMe.

Basically you need different parts:

  • something that takes the image out of the clipboard and uploads it to the web: this could be a java applet, flash or firefox extensions. Flash or Java would have the advantage of being cross browser
  • then you use the <canvas> tag to display the image once it has been uploaded (use explorercanvas to bring canvas to Internet Explorer)

As I pointed out in my comment, Google is discontinuing gears in favor of HTML5, have a look at 7 User Interaction - HTML 5.

EDIT:

HTML5 when implemented is supposed to interact with the system's clipboard. I imagine the following scenario would work:

  • paste the image data from clipboard to canvas
  • get the canvas pixel data back as an image using toDataURL(): see Canvas2Image
  • upload the image to server when submitting: see Saving canvas image with PHP

Until HTML5 copy/paste drag&drop is implemented, you'll have to rely on Flash or a (signed) Java applet to interact with the clipboard.

like image 180
Gregory Pakosz Avatar answered Sep 18 '22 19:09

Gregory Pakosz


You could look into drag & drop upload with Google Gears.

like image 40
Annie Avatar answered Sep 20 '22 19:09

Annie