Exporting HTML canvas from inside of Chrome extension - javascript

I'm writing a Chrome extension where a canvas is modified, and I want to have the option to save the canvas data as an image. Is there any way for me (using JavaScript) to save directly to the file system (ideal) or at least prompt the user with a download menu so they can save it themselves?

There seems to be no way to do this except for these ideas:
Online backend written in PHP or something
An iframe to show the online website which would have the canvas on it
Tell the user to right click and save the canvas image

Related

Open Seadragon: Download currently displayed image in Viewer

I'm using Open Seadragon and loaded multiple images into the viewer with
tileSources: ['http://url.com',
'http://url.com',
'http://url.com',],
The files that I linked in tileSources are all json but I want to download a jpg image.
How can create a function that downloads the currently viewed image?
Do you want the exact view that's in the viewer at this moment? If so, you can copy the contents of the HTML canvas at viewer.drawer.canvas.
You might also check out https://github.com/KTGLeiden/Openseadragon-screenshot.
If you want the full high-resolution version of the image (not just what's in the viewer at the moment), I'm not aware of anything that does that.

Display PDF like on web

I am trying to display PDF file on the web without download option and copy option.
Then I found this https://books.google.co.in/books?id=kwBvDwAAQBAJ&printsec=frontcover&source=gbs_ge_summary_r&cad=0#v=onepage&q&f=false
Can you tell me how can I achieve this on my website?
What mplungjan said in his comment is correct. Anything that is put on the web can be copied one way or another. It appears that the google site you linked to is just showing an image of each page (see https://books.google.co.in/books/content?id=kwBvDwAAQBAJ&pg=PP1&img=1&zoom=3&hl=en&sig=ACfU3U0s8V3HjcApLeNwIGStMQlzZFaotA) with transparent pixels over each image to make it so you can't right-click to save the image. But it's easy to see what they're doing by viewing the source in the inspector.
If you don't want your users to be able to download the entire file, you could break it up into multiple small files (or images, like google is doing in your link) that would make it a little harder for them to get the files. But you can't really stop them from downloading anything.

Disable toolbar in PDF Web View Element to disable Download and Print

My issue is that I have to deploy a local server (without internet), so I cannot use Google Doc Viewer in this case. All I want is to restrict the user from download or printing the document. I have tried hiding or removing the toolbar in JS but it is not working out.
You may be able to disable the toolbar somehow, but that isn't good enough to keep users from downloading or printing it anyway, and nothing you can do will be. If a person can see something, they can copy it, no matter what you try to do to stop them (and all trying will do is inconvenience legitimate users). Previous similar questions:
How to prevent downloading images and video files from my website?
disable downloading of image from a html page
https://graphicdesign.stackexchange.com/questions/39462/is-it-possible-to-prevent-download-of-images-when-designing-a-website
Although those talk about images, the exact same reasoning applies to PDFs.

Can I programmatically save part of a web page as an image?

If possible, I would like to do this with a simple button. The users are not terribly comfortable with computers, which is why I haven't just told them to print screen or use the snipping tool.
I know it can be done in Mozilla-based browsers with <canvas> and drawWindow(). But this application is running on Internet Explorer 7 and 8.
The page shows some graphs (generated by a ReportViewer control) based on the input of a couple of dropdowns. Does that mean a client-side script is the only option? Or could I do it in the ASP.NET back end somehow? Perhaps re-generating an image any time the dropdowns are changed?
(I've been a desktop dev for so long that I don't quite "get" what you can and can't do in web apps yet.)
From what I understand you've got some drop downs and you're generating a graph based on the input of those drop downs by the user?
So if I was doing this with PHP (just trying to give you ideas here, dunno whats possible and what's not in ASP) I would create an image magic or gdb library script that builds a jpeg based on the variables input in a querystring.
For instance this would output a jpeg image of a simple graph with 3 points on it:
http://mydomain.org/image.php?value1=10&value2=20&value3=30
Then for the front end of my script I would probably use jquery/ajax to call that script and show the image as the user is changing the values.
Then you have an image that you can potentially force download or instruct users to right click and choose "save as".
Anyway, this is just an idea, not a solution. I don't know about ASP.NET, but this is how I would do it in PHP.

How do I let a user paste an image on a webpage?

I want to give the user possibility to paste an image into a webform. I don't need to display the image, all I need is the image's location.
I know it's possible because the guys at CKEditor(and other editors) are doing it.
If you go here, http://ckeditor.com/demo and paste an image you copied and then right click on it and go to image properties you'll see they have the image's address.
How can this be done?
Thanks
It is not possible because giving a browser the possibility to access local files, which have not been added to be uploaded explicitly by the user, opens a variety of very dangerous security holes that would certainly be super-exploited by hackers.
A good solution would be to give the posibility to upload using Ajax and link the images in the document once they are available in the server.
Take a look at “Sending files using a FormData object” part of the Using XMLHttpRequest document at Mozilla Developer Network.

Categories