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

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.

Related

Is there a way to leave notes on/annotate a PDF file in React?

Ok, so I have a web-application that I'm making in ReactJS. Currently, users are able to upload pdfs using the 'React-File-picker' package and then view them by clicking a button.
If they want to leave notes on the pdf file they're viewing, they have to do it in a textbox at the bottom of the file viewer which seems intrusive and annoying (see screenshot 1). I've received a lot of requests to allow the user to click on the document itself and leave a note there sort of like how Adobe Arobat does (see screenshot 2).
Any recommendations on how I should approach this because I'm pretty lost currently.
Thanks
The textbox that's currently there ^^^
This is how I want to be able to do it ^^^

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.

Google Chrome PDF Viewer API

I do have a pdf embeded in to the page. It does work and it has it's own buttons, like print, download, rotate, zoom-in, zoom-out.
Is it possible to control these buttons from javascript? I want to show the pdf, but the buttons for download and print I want to control by myslef, with different design and placements outside of the embeded element.
TO sum up, I want to hide all buttons which is shown to the user from the default pdf viewer, except the page number, and I want to separately create donwload and print button with my own design but with the same functionality.
I've done a little bit of research and I found this: https://bugs.chromium.org/p/chromium/issues/detail?id=135146
which is yet has unknown status. Does it mean the API for Chrome pdf viewer doesnt exist? I couldnt fine any.
Another solution is to integrate PDF.js in my own web app, which is heavy (almost 2.6mb zipped) and time consuming.
Any idea is welcome.

Is it possible to serve up a different file than the intended one to be downloaded via JavaScript?

At work they want to do this to prevent people from downloading images easily from our site. They won't go the disable right click option, so they want to do what Flickr is doing:
http://www.flickr.com/photos/scg/12332332454/sizes/l/
If you right click and try to download that image it downloads the entire html page instead. Can this be done via JS or is it something handled by the server?
I know all this goes against usability and doesn't actually prevent people from ripping off images but it's what the ticket I'm assigned asks for.

Categories