Skip to content

Bookmarklet #53

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Feb 20, 2012
Merged

Bookmarklet #53

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
db21131
draft for a bookmarklet to screenshot any page
cobexer Feb 4, 2012
45fa471
fix typo
cobexer Feb 15, 2012
014c0ed
add a note about NoScript's ABE, small fix
cobexer Feb 18, 2012
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
57 changes: 57 additions & 0 deletions bookmarklet.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
<!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>
<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:
<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>
74 changes: 74 additions & 0 deletions src/plugins/bookmarklet.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
(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';
statusline.style.zIndex = 9999999;
document.body.appendChild(statusline);
loader.onload();
}());