2012-03-03 21:18:39 +04:00
|
|
|
var h2cSelector, h2cOptions;
|
2017-08-08 19:50:31 +03:00
|
|
|
var CI = window.location.search.indexOf('selenium') !== -1;
|
|
|
|
var AUTORUN = window.location.search.indexOf('run=false') === -1;
|
|
|
|
var REFTEST = window.location.search.indexOf('reftest') !== -1;
|
|
|
|
|
2011-12-11 21:06:57 +04:00
|
|
|
(function(document, window) {
|
2014-09-04 19:46:17 +04:00
|
|
|
function appendScript(src) {
|
2017-08-08 19:50:31 +03:00
|
|
|
document.write(
|
|
|
|
'<script type="text/javascript" src="' + src + '.js?' + Math.random() + '"></script>'
|
|
|
|
);
|
2011-12-11 21:06:57 +04:00
|
|
|
}
|
2014-05-18 22:17:59 +04:00
|
|
|
|
2017-08-08 19:50:31 +03:00
|
|
|
(typeof Promise === 'undefined' ? ['/node_modules/promise-polyfill/promise.min'] : [])
|
|
|
|
.concat([
|
|
|
|
'/node_modules/jquery/dist/jquery.min',
|
|
|
|
'/dist/html2canvas',
|
|
|
|
'/dist/RefTestRenderer'
|
|
|
|
])
|
|
|
|
.forEach(appendScript);
|
2014-09-04 21:50:31 +04:00
|
|
|
|
2012-03-02 20:05:03 +04:00
|
|
|
window.onload = function() {
|
2017-08-08 19:50:31 +03:00
|
|
|
var targets = REFTEST
|
|
|
|
? [new html2canvas.CanvasRenderer(), new RefTestRenderer()]
|
|
|
|
: new html2canvas.CanvasRenderer();
|
|
|
|
(function($) {
|
2014-09-04 19:46:17 +04:00
|
|
|
$.fn.html2canvas = function(options) {
|
2017-08-08 19:50:31 +03:00
|
|
|
if (options && options.profile && window.console && window.console.profile && !CI) {
|
2014-09-04 19:46:17 +04:00
|
|
|
window.console.profile();
|
|
|
|
}
|
|
|
|
var date = new Date(),
|
|
|
|
$message = null,
|
|
|
|
timeoutTimer = false,
|
|
|
|
timer = date.getTime();
|
|
|
|
options = options || {};
|
2017-07-29 05:07:42 +03:00
|
|
|
var promise = html2canvas(this[0], options);
|
2014-09-04 19:46:17 +04:00
|
|
|
promise['catch'](function(err) {
|
2017-08-08 19:50:31 +03:00
|
|
|
console.log('html2canvas threw an error', err);
|
2014-09-04 19:46:17 +04:00
|
|
|
});
|
|
|
|
|
2017-08-08 19:50:31 +03:00
|
|
|
promise.then(function(output) {
|
|
|
|
var canvas = Array.isArray(targets) ? output[0] : output;
|
|
|
|
if (Array.isArray(targets)) {
|
2017-08-09 07:05:16 +03:00
|
|
|
console.log(
|
|
|
|
output[1]
|
|
|
|
.split('\n')
|
|
|
|
.map(function(line, i) {
|
|
|
|
return i + 1 + ':' + line;
|
|
|
|
})
|
|
|
|
.join('\n')
|
|
|
|
);
|
2017-08-08 19:50:31 +03:00
|
|
|
}
|
2014-09-04 19:46:17 +04:00
|
|
|
var $canvas = $(canvas),
|
|
|
|
finishTime = new Date();
|
|
|
|
|
|
|
|
if (options && options.profile && window.console && window.console.profileEnd) {
|
|
|
|
window.console.profileEnd();
|
|
|
|
}
|
2017-08-08 19:50:31 +03:00
|
|
|
$canvas
|
|
|
|
.addClass('html2canvas')
|
2014-09-04 19:46:17 +04:00
|
|
|
.css({
|
|
|
|
position: 'absolute',
|
|
|
|
left: 0,
|
|
|
|
top: 0
|
2017-08-08 19:50:31 +03:00
|
|
|
})
|
|
|
|
.appendTo(document.body);
|
|
|
|
if (!CI) {
|
2014-09-04 19:46:17 +04:00
|
|
|
$canvas.siblings().toggle();
|
2017-08-08 19:50:31 +03:00
|
|
|
$(window).click(function() {
|
2017-08-02 15:15:39 +03:00
|
|
|
var scrollTop = $(window).scrollTop();
|
2014-09-04 19:46:17 +04:00
|
|
|
$canvas.toggle().siblings().toggle();
|
2017-08-08 19:50:31 +03:00
|
|
|
$(document.documentElement).css(
|
|
|
|
'background',
|
|
|
|
$canvas.is(':visible') ? 'none' : ''
|
|
|
|
);
|
|
|
|
$(document.body).css(
|
|
|
|
'background',
|
|
|
|
$canvas.is(':visible') ? 'none' : ''
|
|
|
|
);
|
|
|
|
throwMessage(
|
|
|
|
'Canvas Render ' + ($canvas.is(':visible') ? 'visible' : 'hidden')
|
|
|
|
);
|
2017-08-02 15:15:39 +03:00
|
|
|
$(window).scrollTop(scrollTop);
|
2014-09-04 19:46:17 +04:00
|
|
|
});
|
2017-08-08 19:50:31 +03:00
|
|
|
$(document.documentElement).css(
|
|
|
|
'background',
|
|
|
|
$canvas.is(':visible') ? 'none' : ''
|
|
|
|
);
|
|
|
|
$(document.body).css('background', $canvas.is(':visible') ? 'none' : '');
|
|
|
|
throwMessage(
|
|
|
|
'Screenshot created in ' + (finishTime.getTime() - timer) + ' ms<br />',
|
|
|
|
4000
|
|
|
|
);
|
2014-09-04 19:46:17 +04:00
|
|
|
} else {
|
|
|
|
$canvas.css('display', 'none');
|
|
|
|
}
|
|
|
|
// test if canvas is read-able
|
|
|
|
try {
|
|
|
|
$canvas[0].toDataURL();
|
2017-08-08 19:50:31 +03:00
|
|
|
} catch (e) {
|
|
|
|
if ($canvas[0].nodeName.toLowerCase() === 'canvas') {
|
2014-09-04 19:46:17 +04:00
|
|
|
// TODO, maybe add a bit less offensive way to present this, but still something that can easily be noticed
|
2017-08-08 19:50:31 +03:00
|
|
|
window.alert('Canvas is tainted, unable to read data');
|
2014-09-04 19:46:17 +04:00
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2017-08-08 19:50:31 +03:00
|
|
|
function throwMessage(msg, duration) {
|
2014-09-04 19:46:17 +04:00
|
|
|
window.clearTimeout(timeoutTimer);
|
2017-08-08 19:50:31 +03:00
|
|
|
timeoutTimer = window.setTimeout(function() {
|
|
|
|
$message.fadeOut(function() {
|
2014-09-04 19:46:17 +04:00
|
|
|
$message.remove();
|
|
|
|
$message = null;
|
|
|
|
});
|
2017-08-08 19:50:31 +03:00
|
|
|
}, duration || 2000);
|
|
|
|
if ($message) $message.remove();
|
|
|
|
$message = $('<div />')
|
|
|
|
.html(msg)
|
|
|
|
.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',
|
|
|
|
display: 'none'
|
|
|
|
})
|
|
|
|
.appendTo(document.body)
|
|
|
|
.fadeIn();
|
2014-09-04 19:46:17 +04:00
|
|
|
}
|
|
|
|
};
|
|
|
|
})(jQuery);
|
|
|
|
|
2014-02-23 19:02:49 +04:00
|
|
|
h2cSelector = [document.documentElement];
|
2012-05-29 05:26:26 +04:00
|
|
|
|
2012-03-02 20:05:03 +04:00
|
|
|
if (window.setUp) {
|
|
|
|
window.setUp();
|
|
|
|
}
|
2012-05-29 05:26:26 +04:00
|
|
|
|
2014-09-27 21:20:08 +04:00
|
|
|
window.run = function() {
|
2017-08-08 19:50:31 +03:00
|
|
|
$(h2cSelector).html2canvas(
|
|
|
|
$.extend(
|
|
|
|
{
|
|
|
|
logging: true,
|
|
|
|
profile: true,
|
|
|
|
proxy: 'http://localhost:8082',
|
|
|
|
useCORS: false,
|
|
|
|
removeContainer: false,
|
|
|
|
target: targets
|
|
|
|
},
|
|
|
|
h2cOptions,
|
|
|
|
REFTEST ? {windowWidth: 800, windowHeight: 600} : {}
|
|
|
|
)
|
|
|
|
);
|
2014-09-27 21:20:08 +04:00
|
|
|
};
|
|
|
|
|
2017-08-08 19:50:31 +03:00
|
|
|
if (typeof dontRun === 'undefined' && AUTORUN) {
|
2014-09-27 21:20:08 +04:00
|
|
|
setTimeout(window.run, 100);
|
|
|
|
}
|
2012-03-02 20:05:03 +04:00
|
|
|
};
|
2017-08-08 19:50:31 +03:00
|
|
|
})(document, window);
|