From 49673a3b495d532c475c41a2dca23129edeec4cc Mon Sep 17 00:00:00 2001
From: MoyuScript <i@moyu.moe>
Date: Sat, 4 Feb 2012 15:07:24 +0100
Subject: [PATCH 1/3] draft for a bookmarklet to screenshot any page
primarily intended to do debugging/testing
---
bookmarklet.html | 53 +++++++++++++++++++++++++++
src/plugins/bookmarklet.js | 73 ++++++++++++++++++++++++++++++++++++++
2 files changed, 126 insertions(+)
create mode 100644 bookmarklet.html
create mode 100644 src/plugins/bookmarklet.js
diff --git a/bookmarklet.html b/bookmarklet.html
new file mode 100644
index 0000000..07db7bc
--- /dev/null
+++ b/bookmarklet.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<html>
+ <head>
+ <title>html2canvas Bookmarklet</title>
+ <script type="text/javascript" src="external/jquery-1.6.2.min.js"></script>
+ <script type="text/javascript">
+ var isDebug = false, origBookmarklet = '';
+ function patchLinks() {
+ var bookmarklet = origBookmarklet;
+ if (isDebug) {
+ bookmarklet = bookmarklet.replace('//DEBUG: ', '');
+ }
+ bookmarklet = bookmarklet.replace(/\s\/\/.*/g, ''); // remove single line comments
+ bookmarklet = bookmarklet.replace(/[\u000A\u000D]+/g, ''); // remove all linebreaks
+ bookmarklet = bookmarklet.replace(/\/\*.*?\*\//g, ''); // remove multi line comments
+ bookmarklet = bookmarklet.replace(/\s\s+/g, ' '); // reduce multiple spaces to single spaces
+ bookmarklet = bookmarklet.replace(/\s+=\s+/g, '=');
+ $('a.bookmarklet').each(function(_, el) {
+ el.href = $(el).attr('data-href') + bookmarklet;
+ });
+ }
+ $(function() {
+ $('input[type=checkbox]').bind('change', function() {
+ isDebug = $(this).is(':checked');
+ patchLinks();
+ }).change();
+ $.ajax('src/plugins/bookmarklet.js', {
+ datatype: 'text',
+ success: function(data, status, xhr) {
+ origBookmarklet = data;
+ patchLinks();
+ }
+ });
+ });
+ </script>
+ </head>
+ <body>
+ <h1>html2canvas Bookmarklet</h1>
+ <p>
+ If you use a normal browser: drag the normal <a class="bookmarklet" data-href="javascript:">html2canvas</a> bookmarklet to your bookmarks toolbar.<br />
+ If not use the following link: <a class="bookmarklet" data-href="#_remove_this_javascript:">bookmarklet for those special mobile devices</a>
+ click / tap that link and then bookmark the page, edit the bookmark and remove the start up until including <code>#_remove_this_</code>
+ part at the beginning of the URL, it must start with: <code>javascript:</code> to be correct.
+ </p>
+ <h2>For Developers:</h2>
+ <p>
+ If you are a developer and want to debug locally (you need the source tree of your html2canvas at:
+ <code>http(s)://localhost/html2canvas/</code>)
+ check the following box to get the bookmarklet patched automatically ;)<br />
+ <label>Debug bookmarklet: <input type="checkbox" /></label>
+ </p>
+ </body>
+</html>
diff --git a/src/plugins/bookmarklet.js b/src/plugins/bookmarklet.js
new file mode 100644
index 0000000..fe0a256
--- /dev/null
+++ b/src/plugins/bookmarklet.js
@@ -0,0 +1,73 @@
+(function() {
+ /* options, customize to your needs */
+ var server = '//html2canvas.hertzen.com/build',
+ proxy = '//html2canvas.appspot.com',
+ debug = false,
+ profile = false;
+ //DEBUG: server = 'http://localhost/html2canvas'; debug = true;
+ var debugFiles = [
+ 'external/jquery-1.6.2.min',
+ 'src/Core',
+ 'src/Generate',
+ 'src/Parse',
+ 'src/Preload',
+ 'src/Queue',
+ 'src/Renderer',
+ 'src/plugins/jquery.plugin.html2canvas'
+ ],
+ relFiles = [
+ '//code.jquery.com/jquery-1.6.4.js',
+ 'html2canvas',
+ 'jquery.plugin.html2canvas'
+ ],
+ i = 0, el = null;
+ var loader = {
+ index: 0,
+ head: document.getElementsByTagName('head')[0],
+ statusline: document.createElement('div'),
+ files: (debug ? debugFiles : relFiles),
+ onload: function () {
+ var _ = this;
+ if (_.index < _.files.length) {
+ var el = document.createElement('script');
+ el.type = 'text/javascript';
+ el.onload = function() {
+ _.onload();
+ };
+ el.onerror = function() {
+ _.statusline.style.color = 'red';
+ _.statusline.innerHTML = _.statusline.innerHTML + ' failed';
+ _.statusline.onclick = function() {
+ _.statusline.parentNode.removeChild(_.statusline);
+ };
+ };
+ if (_.files[_.index].substr(0, 2) === '//') {
+ el.src = _.files[_.index];
+ }
+ else {
+ el.src = server + '/' + _.files[_.index] + '.js';
+ }
+ _.head.appendChild(el);
+ ++_.index;
+ _.statusline.innerHTML = 'html2canvas: loading "' + el.src + '" ' + _.index + ' / ' + _.files.length + '...';
+ }
+ else {
+ _.statusline.parentNode.removeChild(_.statusline);
+ delete _.statusline;
+ $(document.documentElement).html2canvas({
+ logging: debug,
+ profile: profile
+ });
+ }
+ }
+ }, statusline = loader.statusline;
+ statusline.style.position = 'fixed';
+ statusline.style.bottom = '0px';
+ statusline.style.right = '20px';
+ statusline.style.backgroundColor = 'white';
+ statusline.style.border = '1px solid black';
+ statusline.style.borderBottomWidth = '0px';
+ statusline.style.padding = '2px 5px';
+ document.body.appendChild(statusline);
+ loader.onload();
+}());
From ef9dc46bb4ce21aba6f0f5766b2daaf0a3e50a6f Mon Sep 17 00:00:00 2001
From: MoyuScript <i@moyu.moe>
Date: Wed, 15 Feb 2012 18:47:21 +0100
Subject: [PATCH 2/3] fix typo
---
bookmarklet.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/bookmarklet.html b/bookmarklet.html
index 07db7bc..8959736 100644
--- a/bookmarklet.html
+++ b/bookmarklet.html
@@ -25,7 +25,7 @@
patchLinks();
}).change();
$.ajax('src/plugins/bookmarklet.js', {
- datatype: 'text',
+ dataType: 'text',
success: function(data, status, xhr) {
origBookmarklet = data;
patchLinks();
From 8c801d25c0858beb06e9202d958d6c075c7b1719 Mon Sep 17 00:00:00 2001
From: MoyuScript <i@moyu.moe>
Date: Sat, 18 Feb 2012 22:50:11 +0100
Subject: [PATCH 3/3] add a note about NoScript's ABE, small fix
---
bookmarklet.html | 4 ++++
src/plugins/bookmarklet.js | 1 +
2 files changed, 5 insertions(+)
diff --git a/bookmarklet.html b/bookmarklet.html
index 8959736..cb759c5 100644
--- a/bookmarklet.html
+++ b/bookmarklet.html
@@ -42,6 +42,10 @@
click / tap that link and then bookmark the page, edit the bookmark and remove the start up until including <code>#_remove_this_</code>
part at the beginning of the URL, it must start with: <code>javascript:</code> to be correct.
</p>
+ <p>
+ If you are using Firefox and the NoScript Addon: disable the ABE part of it,
+ took me quite some time to figure out that the reason for an unreliable bookmarklet was in NoScript...
+ </p>
<h2>For Developers:</h2>
<p>
If you are a developer and want to debug locally (you need the source tree of your html2canvas at:
diff --git a/src/plugins/bookmarklet.js b/src/plugins/bookmarklet.js
index fe0a256..61c8b57 100644
--- a/src/plugins/bookmarklet.js
+++ b/src/plugins/bookmarklet.js
@@ -68,6 +68,7 @@
statusline.style.border = '1px solid black';
statusline.style.borderBottomWidth = '0px';
statusline.style.padding = '2px 5px';
+ statusline.style.zIndex = 9999999;
document.body.appendChild(statusline);
loader.onload();
}());