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(
|
2017-09-04 18:36:19 +03:00
|
|
|
'<script type="text/javascript" src="' +
|
|
|
|
window.location.protocol +
|
|
|
|
'//' +
|
|
|
|
window.location.host +
|
|
|
|
src +
|
|
|
|
'.js?' +
|
|
|
|
Math.random() +
|
|
|
|
'"></script>'
|
2017-08-08 19:50:31 +03:00
|
|
|
);
|
2011-12-11 21:06:57 +04:00
|
|
|
}
|
2014-05-18 22:17:59 +04:00
|
|
|
|
2019-05-26 01:54:41 +03:00
|
|
|
(typeof Promise === 'undefined' ? ['/node_modules/es6-promise/dist/es6-promise.auto.min'] : [])
|
2017-08-08 19:50:31 +03:00
|
|
|
.concat([
|
|
|
|
'/node_modules/jquery/dist/jquery.min',
|
2019-04-09 07:56:22 +03:00
|
|
|
'/dist/html2canvas'
|
2017-08-08 19:50:31 +03:00
|
|
|
])
|
|
|
|
.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
|
|
|
(function($) {
|
2014-09-04 19:46:17 +04:00
|
|
|
$.fn.html2canvas = function(options) {
|
|
|
|
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
|
|
|
});
|
|
|
|
|
2019-05-26 01:54:41 +03:00
|
|
|
promise.then(function(canvas) {
|
2014-09-04 19:46:17 +04:00
|
|
|
var $canvas = $(canvas),
|
|
|
|
finishTime = new Date();
|
|
|
|
|
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-10 16:59:26 +03:00
|
|
|
$(window).click(function(event) {
|
|
|
|
if (event.button === 0) {
|
|
|
|
var scrollTop = $(window).scrollTop();
|
|
|
|
$canvas.toggle().siblings().toggle();
|
|
|
|
$(document.documentElement).css(
|
|
|
|
'background',
|
|
|
|
$canvas.is(':visible') ? 'none' : ''
|
|
|
|
);
|
|
|
|
$(document.body).css(
|
|
|
|
'background',
|
|
|
|
$canvas.is(':visible') ? 'none' : ''
|
|
|
|
);
|
|
|
|
throwMessage(
|
|
|
|
'Canvas Render ' +
|
|
|
|
($canvas.is(':visible') ? 'visible' : 'hidden')
|
|
|
|
);
|
|
|
|
$(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);
|
|
|
|
|
2017-09-27 17:14:50 +03:00
|
|
|
h2cSelector = typeof h2cSelector === 'undefined' ? [document.documentElement] : h2cSelector;
|
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,
|
2017-09-04 18:36:19 +03:00
|
|
|
proxy: 'http://localhost:8081/proxy',
|
2017-08-08 19:50:31 +03:00
|
|
|
useCORS: false,
|
2019-05-26 01:54:41 +03:00
|
|
|
removeContainer: true
|
2017-08-08 19:50:31 +03:00
|
|
|
},
|
|
|
|
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);
|