RAP: screenshot html2canvas [message #896105] |
Tue, 17 July 2012 09:31 |
|
Hi,
I'm developing a RAP application which allows to draw automata.
The application is a porting of a PDE plugin. GEF & Draw2D are used in order to draw automata.
I'm trying to create a screenshot of one automaton. It looks like that RAP has no support for screenshot so I decided to write a plugin which uses html2canvas in order to get the screenshot.
I tested html2canvas outside RAP and it works well. In RAP it looks like it doesn't work.
I created a plugin which uses a Browser widget to open, inside an iframe, the page from which the following js code is called: in brief it tries to get the automaton div from the iframe parent (which is where the automaton is drawn) and then it calls html2canvas to create, inside the iframe, a canvas with the screenshot.
It succeeds in getting automaton div and calling html2canvas but no canvas will be created. html2canvas gets the following errors:
html2canvas: Preload starts: finding background-images html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: failed to get background-image - Exception: computedCSS is null
html2canvas.js (riga 27)
html2canvas: Preload: Finding images
html2canvas.js (riga 27)
html2canvas: Preload: Done.
html2canvas.js (riga 27)
html2canvas: start: images: 1 / 5 (failed: 1)
html2canvas.js (riga 27)
html2canvas: start: images: 2 / 5 (failed: 2)
html2canvas.js (riga 27)
html2canvas: start: images: 3 / 5 (failed: 3)
html2canvas.js (riga 27)
html2canvas: start: images: 4 / 5 (failed: 4)
html2canvas.js (riga 27)
html2canvas: start: images: 5 / 5 (failed: 5)
html2canvas.js (riga 27)
Finished loading images: # 5 (failed: 5)
html2canvas.js (riga 27)
computedCSS is null
[Interrompi per questo errore]
val = computedCSS[ attribute ];
function sendScreenshot2Client()
{
clearInterval(window.screenshotAlrm);
var canvas = document.getElementsByTagName('canvas')[0];
if (typeof canvas === "undefined")
{
alert("sendScreenshot2Client: canvas is " + canvas);
return;
}
try
{
//if a canvas exists then it is converted into a data URI.
//The data URI is sent to the user.
Canvas2Image.saveAsPNG(canvas);
}catch(ec)
{
alert("sendScreenshot2Client: " + ec);
}
}
function loadScript(document, window)
{
var html2canvas = ['html2canvas','jquery.plugin.html2canvas', 'base64', 'canvas2image'], i;
include_dom(document, './js/jquery-1.7.1.js');
for (i = 0; i < html2canvas.length; ++i) {
include_dom(document, './js/' + html2canvas[i] + '.js');
}
}
(function(document, window) {
window.loadJS = function (){
try
{
loadScript(document, window);
//var canvasexp = "/html/body/div[2]/div[6]/div/div[7]/div[6]/div[2]";
//var canvasexp = "/html/body/div[2]/div[6]/div/div[2]/div/div/div[3]/div[3]";
var canvasexp = "/html/body/div[2]/div[6]/div/div[2]/div/div/div[3]/div[3]/div";
var h2cSelector = null;
alert("xpath " + canvasexp);
//select automaton div
h2cSelector = [parent.document.evaluate(canvasexp, parent.document, null, XPathResult.ANY_TYPE, null).iterateNext()];
if (typeof h2cSelector === "undefined")
{
clearInterval(window.intervalID);
alert("h2cSelector is undefined");
return;
}
if (window.setUp) {
window.setUp();
}
//call html2canvas, a new CANVAS element should be created
//inside the iframe
$(h2cSelector).html2canvas({
flashcanvas: "./js/flashcanvas.min.js",
logging: true,
profile: true,
useCORS: true
});
}catch(e)
{
alert("loadJS: " + e);
}
clearInterval(window.intervalID);
};
window.intervalID = setInterval(window.loadJS, 100);
window.screenshotAlrm = setInterval(sendScreenshot2Client, 5000);
}(document,window));
If there is a better tool which allows to create a screenshot inside RAP then I will use it without any problem. At the moment this is the only "solution" which I have found.
I will appreciate any suggestion.
Thanks a lot.
[Updated on: Tue, 17 July 2012 09:47] Report message to a moderator
|
|
|
Powered by
FUDForum. Page generated in 0.04028 seconds