-
Notifications
You must be signed in to change notification settings - Fork 4.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
3 changed files
with
3 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -1 +1 @@ | |||
<!DOCTYPE html> <html lang=en> <head> <meta charset=utf-8> <title>Screenshot console - html2canvas - Screenshots with JavaScript</title> <meta name=viewport content="width=device-width, initial-scale=1.0"> <meta name=description content="Screenshot creation with JavaScript"> <meta name=author content="Niklas von Hertzen"> <base href=""/> <link href="style.css" rel=stylesheet> <style type="text/css">body{padding-top:60px;padding-bottom:40px}</style> <!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> </head> <body> <div class="navbar navbar-fixed-top"> <div class=navbar-inner> <div class=container> <a class="btn btn-navbar" data-toggle=collapse data-target=".nav-collapse"> <span class=icon-bar></span> <span class=icon-bar></span> <span class=icon-bar></span> </a> <a class=brand href="index.html">html2canvas</a> <div class=nav-collapse> <ul class=nav> <li class="@LINK1@"><a href="index.html">Home</a></li> <li class="@LINK2@"><a href="about.html">About</a></li> <li class="@LINK3@"><a href="documentation.html">Documentation</a></li> <li class="@LINK4@"><a href="examples.html">Examples</a></li> <li><a href="https://github.com/niklasvh/html2canvas/downloads">Download</a></li> </ul> <p class="navbar-text pull-right" style="padding-top:5px;margin-bottom:-5px;"> <a href="http://twitter.com/share" class=twitter-share-button data-url="http://html2canvas.hertzen.com/" data-text="html2canvas - screenshots with #JavaScript" data-count=horizontal data-via=niklasvh>Tweet</a> <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> <g:plusone size=medium annotation=inline href="http://html2canvas.hertzen.com" width=250></g:plusone> </p> </div> </div> </div> </div> <a href="http://github.com/niklasvh/html2canvas"><img style="position: fixed; top: 0; right: 0; border: 0;z-index:9999;" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a> <div class=container> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script>window.jQuery||document.write('<script src="js/jquery-1.7.1.min.js"><\/script>');</script> <script type="text/javascript" src="js/html2canvas.js?rev032"></script> <script type="text/javascript">var date=new Date();var message,timeoutTimer,timer;var proxyUrl="http://html2canvas.appspot.com";function addRow(a,c,d){var b=$("<tr />").appendTo($(a));b.append($("<td />").css("font-weight","bold").text(c)).append($("<td />").text(d))}function throwMessage(b,a){window.clearTimeout(timeoutTimer);timeoutTimer=window.setTimeout(function(){message.fadeOut(function(){message.remove()})},a||2000);$(message).remove();message=$("<div />").html(b).css({margin:0,padding:10,background:"#000",opacity:0.7,position:"fixed",top:10,right:10,fontFamily:"Tahoma",color:"#fff",fontSize:12,borderRadius:12,width:"auto",height:"auto",textAlign:"center",textDecoration:"none"}).hide().fadeIn().appendTo("body")}$(function(){$("#recommended a").click(function(c){c.preventDefault();$("#url").val(this.href);$("button").click()});var a,b;$('input[type="button"]').click(function(){$(a.contentWindow).unbind("load");$(a).contents().find("body").html2canvas({canvasHeight:b.body.scrollHeight,canvasWidth:b.body.scrollWidth,logging:true})});$("#getscreenshot").click(function(d){d.preventDefault();$(this).prop("disabled",true);var c=$("#url").val();$("#content").append($("<img />").attr("src","loading.gif").css("margin-top",40));var f=document.createElement("a");f.href=c;$.ajax({data:{xhr2:false,url:f.href},url:proxyUrl,dataType:"jsonp",success:function(e){a=document.createElement("iframe");$(a).css({visibility:"hidden"}).width($(window).width()).height($(window).height());$("#content").append(a);b=a.contentWindow.document;b.open();$(a.contentWindow).load(function(){var g=$(a).contents().find("body"),h={onrendered:function(j){$("#content").empty().append(j);$("#getscreenshot").prop("disabled",false);$("base").attr("href","")},allowTaint:true,taintTest:false,flashcanvas:"src/flashcanvas.min.js"},i=html2canvas(g,h)});$("base").attr("href",f.protocol+"//"+f.hostname+"/");e=e.replace("<head>","<head><base href='"+f.protocol+"//"+f.hostname+"/' />");if($("#disablejs").prop("checked")){e=e.replace(/\<script/gi,"<!--<script");e=e.replace(/\<\/script\>/gi,"<\/script>-->")}b.write(e);b.close()}})})});</script> <h1>JavaScript screenshot creator</h1> <form class="well form-search"> <label for=url>Website URL:</label> <input type=url id=url value="http://www.yahoo.com" class="input-medium search-query"/><button class=btn id=getscreenshot>Get screenshot!</button> </form> <label for=disablejs>Disable JavaScript (recommended, doesn't work well with the proxy)</label> <input type=checkbox id=disablejs checked/><br/> <small>Tested with Google Chrome 12, Firefox 4 and Opera 11.5</small> <h3>Recommended (tested) pages:</h3> <ul id=recommended> <li><a href="http://www.yahoo.com">yahoo.com</a></li> <li><a href="http://www.google.com">google.com</a></li> <li><a href="https://github.com/niklasvh/html2canvas">github.com</a></li> <li><a href="http://www.smashingmagazine.com">smashingmagazine.com</a></li> <li><a href="http://www.mashable.com">mashable.com</a></li> <li><a href="http://www.facebook.com/google">facebook.com/google</a></li> <li><a href="http://www.youtube.com/">youtube.com</a></li> <li><a href="http://www.cnn.com/">cnn.com</a></li> <li><a href="http://www.engadget.com/">engadget.com (lot of elements, very slow)</a></li> <li><a href="http://eu.battle.net/en/">battle.net</a></li> </ul> <h4> About</h4> <p> The whole screenshot is created with JavaScript. The only server interaction that is happening on this page is the proxy for loading the external pages/images into JSONP/CORS enabled page and onwards onto the JavaScript renderer script. There are a lot of problems of loading external pages, even with a proxy, and as such many pages will not render at all. If you wish to try the script properly, I recommend you get a copy of the source from <a href="https://github.com/niklasvh/html2canvas">here</a> instead. </p> <div id=content></div> <hr> <footer> <p> Created by <a href="http://hertzen.com">Niklas von Hertzen</a> <a href="https://twitter.com/Niklasvh" class=twitter-follow-button data-show-count=false>Follow @Niklasvh</a> <script>!function(e,a,f){var c,b=e.getElementsByTagName(a)[0];if(!e.getElementById(f)){c=e.createElement(a);c.id=f;c.src="//platform.twitter.com/widgets.js";b.parentNode.insertBefore(c,b)}}(document,"script","twitter-wjs");</script> </p> </footer> </div> <script src="script.min.js"></script> <script>var _gaq=_gaq||[];_gaq.push(["_setAccount","UA-188600-10"]);_gaq.push(["_trackPageview"]);(function(){var b=document.createElement("script");b.type="text/javascript";b.async=true;b.src=("https:"==document.location.protocol?"https://ssl":"http://www")+".google-analytics.com/ga.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(b,a)})();(function(){var a=document.createElement("script");a.type="text/javascript";a.async=true;a.src="https://apis.google.com/js/plusone.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)})();</script> </body> </html> | <!DOCTYPE html> <html lang=en> <head> <meta charset=utf-8> <title>Screenshot console - html2canvas - Screenshots with JavaScript</title> <meta name=viewport content="width=device-width, initial-scale=1.0"> <meta name=description content="Screenshot creation with JavaScript"> <meta name=author content="Niklas von Hertzen"> <base href=""/> <link href="style.css" rel=stylesheet> <style type="text/css">body{padding-top:60px;padding-bottom:40px}</style> <!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> </head> <body> <div class="navbar navbar-fixed-top"> <div class=navbar-inner> <div class=container> <a class="btn btn-navbar" data-toggle=collapse data-target=".nav-collapse"> <span class=icon-bar></span> <span class=icon-bar></span> <span class=icon-bar></span> </a> <a class=brand href="index.html">html2canvas</a> <div class=nav-collapse> <ul class=nav> <li class="@LINK1@"><a href="index.html">Home</a></li> <li class="@LINK2@"><a href="about.html">About</a></li> <li class="@LINK3@"><a href="documentation.html">Documentation</a></li> <li class="@LINK4@"><a href="examples.html">Examples</a></li> <li><a href="https://github.com/niklasvh/html2canvas/downloads">Download</a></li> </ul> <p class="navbar-text pull-right" style="padding-top:5px;margin-bottom:-5px;"> <a href="http://twitter.com/share" class=twitter-share-button data-url="http://html2canvas.hertzen.com/" data-text="html2canvas - screenshots with #JavaScript" data-count=horizontal data-via=niklasvh>Tweet</a> <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> <g:plusone size=medium annotation=inline href="http://html2canvas.hertzen.com" width=250></g:plusone> </p> </div> </div> </div> </div> <a href="http://github.com/niklasvh/html2canvas"><img style="position: fixed; top: 0; right: 0; border: 0;z-index:9999;" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a> <div class=container> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script>window.jQuery||document.write('<script src="js/jquery-1.7.1.min.js"><\/script>');</script> <script type="text/javascript" src="js/html2canvas.js?rev032"></script> <script type="text/javascript">var date=new Date();var message,timeoutTimer,timer;var proxyUrl="http://html2canvas.appspot.com";function addRow(a,c,d){var b=$("<tr />").appendTo($(a));b.append($("<td />").css("font-weight","bold").text(c)).append($("<td />").text(d))}function throwMessage(b,a){window.clearTimeout(timeoutTimer);timeoutTimer=window.setTimeout(function(){message.fadeOut(function(){message.remove()})},a||2000);$(message).remove();message=$("<div />").html(b).css({margin:0,padding:10,background:"#000",opacity:0.7,position:"fixed",top:10,right:10,fontFamily:"Tahoma",color:"#fff",fontSize:12,borderRadius:12,width:"auto",height:"auto",textAlign:"center",textDecoration:"none"}).hide().fadeIn().appendTo("body")}$(function(){$("#recommended a").click(function(c){c.preventDefault();$("#url").val(this.href);$("button").click()});var a,b;$('input[type="button"]').click(function(){$(a.contentWindow).unbind("load");$(a).contents().find("body").html2canvas({canvasHeight:b.body.scrollHeight,canvasWidth:b.body.scrollWidth,logging:true})});$("#getscreenshot").click(function(d){d.preventDefault();$(this).prop("disabled",true);var c=$("#url").val();$("#content").append($("<img />").attr("src","loading.gif").css("margin-top",40));var f=document.createElement("a");f.href=c;$.ajax({data:{xhr2:false,url:f.href},url:proxyUrl,dataType:"jsonp",success:function(e){a=document.createElement("iframe");$(a).css({visibility:"hidden"}).width($(window).width()).height($(window).height());$("#content").append(a);b=a.contentWindow.document;b.open();$(a.contentWindow).load(function(){var g=$(a).contents().find("body"),h={onrendered:function(j){$("#content").empty().append(j);$("#getscreenshot").prop("disabled",false);$("base").attr("href","")},allowTaint:true,taintTest:false,flashcanvas:"src/flashcanvas.min.js"},i=html2canvas(g,h)});$("base").attr("href",f.protocol+"//"+f.hostname+"/"+f.pathname+"/");e=e.replace("<head>","<head><base href='"+f.protocol+"//"+f.hostname+"/"+f.pathname+"/' />");if($("#disablejs").prop("checked")){e=e.replace(/\<script/gi,"<!--<script");e=e.replace(/\<\/script\>/gi,"<\/script>-->")}b.write(e);b.close()}})})});</script> <h1>JavaScript screenshot creator</h1> <form class="well form-search"> <label for=url>Website URL:</label> <input type=url id=url value="http://www.yahoo.com" class="input-medium search-query"/><button class=btn id=getscreenshot>Get screenshot!</button> </form> <label for=disablejs>Disable JavaScript (recommended, doesn't work well with the proxy)</label> <input type=checkbox id=disablejs checked/><br/> <small>Tested with Google Chrome 12, Firefox 4 and Opera 11.5</small> <h3>Recommended (tested) pages:</h3> <ul id=recommended> <li><a href="http://www.yahoo.com">yahoo.com</a></li> <li><a href="http://www.google.com">google.com</a></li> <li><a href="https://github.com/niklasvh/html2canvas">github.com</a></li> <li><a href="http://www.smashingmagazine.com">smashingmagazine.com</a></li> <li><a href="http://www.mashable.com">mashable.com</a></li> <li><a href="http://www.facebook.com/google">facebook.com/google</a></li> <li><a href="http://www.youtube.com/">youtube.com</a></li> <li><a href="http://www.cnn.com/">cnn.com</a></li> <li><a href="http://www.engadget.com/">engadget.com (lot of elements, very slow)</a></li> <li><a href="http://eu.battle.net/en/">battle.net</a></li> </ul> <h4> About</h4> <p> The whole screenshot is created with JavaScript. The only server interaction that is happening on this page is the proxy for loading the external pages/images into JSONP/CORS enabled page and onwards onto the JavaScript renderer script. There are a lot of problems of loading external pages, even with a proxy, and as such many pages will not render at all. If you wish to try the script properly, I recommend you get a copy of the source from <a href="https://github.com/niklasvh/html2canvas">here</a> instead. </p> <div id=content></div> <hr> <footer> <p> Created by <a href="http://hertzen.com">Niklas von Hertzen</a> <a href="https://twitter.com/Niklasvh" class=twitter-follow-button data-show-count=false>Follow @Niklasvh</a> <script>!function(e,a,f){var c,b=e.getElementsByTagName(a)[0];if(!e.getElementById(f)){c=e.createElement(a);c.id=f;c.src="//platform.twitter.com/widgets.js";b.parentNode.insertBefore(c,b)}}(document,"script","twitter-wjs");</script> </p> </footer> </div> <script src="script.min.js"></script> <script>var _gaq=_gaq||[];_gaq.push(["_setAccount","UA-188600-10"]);_gaq.push(["_trackPageview"]);(function(){var b=document.createElement("script");b.type="text/javascript";b.async=true;b.src=("https:"==document.location.protocol?"https://ssl":"http://www")+".google-analytics.com/ga.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(b,a)})();(function(){var a=document.createElement("script");a.type="text/javascript";a.async=true;a.src="https://apis.google.com/js/plusone.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)})();</script> </body> </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters