html javascript Put an image over another image and post to facebook

Question

In my web application , the user opens a photo from his pc with javascript ( I use a preview script without uploading to my server ). Then I have a draggable image that the user drags over his photo and positions it where he wants. What I want is to create a final image that has 3 layers, one is the user's image, the other is the draggable image I have and the third is a logo. Then the user should be able to post that image to Facebook.

And now the question. I don't want to upload the user's image and positions etc to my server and create the image server-side save it and post. I want the final image to be created in browser level (javascript I guess ) and then post to facebook directly.

Can someone give some directions? Is there any library that can help?

Answer 1

For the first part of the question, the answer is this library http://html2canvas.hertzen.com/ It takes the html and converts it to canvas with great accuracy. I just still need to find how to post it on Facebook.