3

I've been dealing with taking screenshots for Firefox and Safari browsers but I can't figure out how to do it! With Google Chrome API I can do it this way (it's pretty simple): 

chrome.tabs.captureVisibleTab(null, null, function (image)).....etc

BUT I can't find a SIMPLE way to do it on Firefox and Safari!! The only answer I got here was using the 'html2canvas' (http://html2canvas.hertzen.com/examples.html) BUT IT IS NOT a 100% solution in order to take EXACT screenshots of a specific webpage!! It doesn't work for me in this case!!! Can someone help me with this issue in order to find a simple solution for Firefox and Safari?

tshepang
  • 12,111
  • 21
  • 91
  • 136
user2364265
  • 79
  • 2
  • 6

2 Answers2

1

I have personally used html2canvas and I found it quite efficient for taking partial or full page screenshots. But it does require you some knowledge of JavaScript and client side scripting.

If you are looking for a more easier approach , there are numerous extensions on Google Chrome webstore. A popular one is Awesome Screenshot which even allows you to take screenshot of entire webpage (till the scroll bar ends).

tshepang
  • 12,111
  • 21
  • 91
  • 136
Faizan
  • 1,847
  • 8
  • 40
  • 63
  • Is Awesome Screenshot source code available? (In order to take a look at it) – user2364265 May 13 '13 at 16:54
  • It merely depends on if it is open source , which I don't think it will be. However it is available for free. or you may contact its developer for further assistance. – Faizan May 13 '13 at 16:56
  • Ohh that's a shame!! I need a small piece of code in order to take screenshots on Firefox and Safari browsers (I need to build a small-quick example for a cross-browser extension named Kango extensions), so that's why I'm looking for some source code (easier approach). I got already implemented a screenshot capture using chrome's API, but I still need something similar for Firefox and Safari!! :-( – user2364265 May 13 '13 at 17:02
  • There are open source addons available for firefox. You might need to do some digging to find the one you want. https://addons.mozilla.org/en-us/firefox/collections/kozaki/im%C3%B9/ – Faizan May 13 '13 at 17:10
  • Thanks dude!! I will take a look at those addons!! – user2364265 May 13 '13 at 17:12
1

You can use Mozilla's chrome tools to draw some or all of the window to an image canvas:

var c2d = myCanvas.getContext('2d');
c2d.drawWindow(window, x, y, w, h, 'rgb(255,255,255)');

See drawWindow(), XUL.

I don't remember exactly, but that's the gist. The magic is the .drawWindow() method, which cannot be executed on the content side, it must be in an area with chrome privileges (like an add-on/extension).

Edit: Here's a good example.

Community
  • 1
  • 1
Nick
  • 4,901
  • 40
  • 61