I'm attempting to get an array of pixels of the screen (web page) but i know of no way of doing that without using canvas (either straight-up or converting HTML dom elements into canvas, first). I need to capture every pixel on the screen and i don't know what operating system is going to be used so i can't request the display from the O/S, either. Is there a third-party tool, possibly, or a way to do this from the window object in the DOM?
I have only one idea. Maybe you should try to move this functionality to the server. You can use WkHtmlToPDF(http://wkhtmltopdf.org/) for saving websites as PDF, pdf file you can convert to an image and read pixels array.
As web developers with no control of the client machine, there's two approaches to getting a screenshot of a webpage:
Open the webpage in a headless browser on the server and make the screenshot there. phantomjs is a popular one.
(I'm including this for completeness, though you said you don't want to take that route): Use the canvas element on the client. html2canvas is an interesting project that re-renders an entire HTML document into a canvas element so a screenshot can be made.
If your use case allows it, you could of course instruct your users to take a screenshot and paste it in an upload form that can handle images from the clipboard. On Windows, that's a matter of hitting "Print Screen" and CTRL+V.
Here is an api to generate images from online web pages: http://www.page2images.com/Create-Website-Screenshot-with-Javascript-API
Related
I am onto a photo project. Dynamically added a watermark in the large picture preview. But someone with general idea can manipulate the link and get the original picture. Disabling Right button seems to be useless. In this case what can be the appropriate solution?
Disable any access to original pictures. Make server script that receives picture's ID (or name) and sets watermark before picture will be shown. And make your application such way that this script only can access images by users. If manipulation with link allows users to have unauthorized access, then it looks like you have problems with architecture of project.
So I'm following this tutorial and in the part, "Getting graphics there", the guy/girl says to, and I quote, "We’ll start with what I consider the best one, an swf. Make a new directory in the root of your project folder called assets and save this nice picture of a leek in there."
In the linked webpage there was no copy or save as... option when right-clicking, so I googled how to copy swf from websites and it said to view source code, and to do so by hitting CTRL + U on chrome. I did and nothing. So I tried going on the top right corner > Tools > Developer Tools and it gave me the page HTML, but in the code, where the HTML was getting the image from was the webpage link itself, so... help? ^^".
Maybe I'm suposed to save the link/location to that image and FlashDevelop will get it from there?
(I can't print screen it because I'll get the white background by doing so when I believe the file is the leek only, with no background.)
The problem can also be solved in another way since getting this particular leek is not important, I do have an image I made in photoshop and I could use it aswell, although it's PNG and not SWF as he says in the tutorial... :P
Are there any online png to swf converters? How can it be done properly?
I just need help getting an swf image
An SWF file is a compiled Adobe Flash "movie." It's not really an image. Flash movies can be interactive, dynamic, static, etc., much like a Java applet. For this reason, there is no way to "convert" a PNG file to an SWF file. If you had Adobe Flash, you could create an SWF yourself, but chances are you do not.
In the case of your leek, it appears to be just a simple static image embedded in the SWF. The reason you didn't see "copy" or "save as" when right-clicking was that Adobe Flash player has its own context menu. Ctrl-U didn't work either because Flash player traps keystrokes. If you want to save it, you can use your browser's file menu. That would be the easiest way. The reason your search results suggested viewing the source was that usually when people want to save SWF files, they are taking them out of existing web pages. By contrast, you are looking directly at the SWF file - you don't have to try to find the url in a web page's source because you're already at that url.
To make it even easier to work with user content, we enable image post-processing. This way, regardless of what type of file a user uploads from the Cloud or their local device, you can be sure it's in exactly the right size. To convert an image, take the filepicker url and append /convert, along with query parameters specifying what you want to change. See the Docs»
filepicker.io shows an example of a cropping tool on their front page. Could that be built into the picker itself?
We've discussed building it into the upload experience a la iOS, but think that the functionality is best done as a step after the upload. The demo on our front page is done using JCrop, and at some point we'll open-source the demo as a jquery plugin or similar.
I'm in the process of developing an iOS app that retrieves images from a URL (http://m.9gag.com). It so happens that the HTML for the URL is in constant change and whenever I have a working code, the site's style changes.
Is there any way I could pull those images from the HTML without having to worry about webpage changes? There is no public API at the moment so that's sadly not an option.
I look forward to hearing some options.
Also, if the page is set so that when the user scrolls to the bottom, it loads more content, how can I get more html to load based on how far down in the HTML parsing I've got? I'm not using a webview, I just need to update the HTML I initially retrieved.
It seems that the simplest way in your case - use regular expression (for example http://[A-Za-z0-9_/\.]*\.jpg) to extract URLs and keep track of already pulled images.
I'm wondering if it's possible to edit out certain parts of the html code. It's really longa and as I parse it (with element parser), the deeper the parser goes into the code the slower it runs. Any ideas? I'm using a 3G as well.
edit:
For example on this site I'd want the posts and the usernames. Let's say there are like 50 replies on this thread and assume it will take a long time for the 3G phone to parse thousands of lines.
I'd want to remove the right links, the ads, the links at the top and bottom of the page too. Then I'd get the revised html and push it into the parser.
If you downloading a webpage using UIWebView, then you can use normal javascript to (by using the method stringByEvaluatingJavascriptFromString) to hide or remove any elements you want to remove from the view of the user.