Commit bb01303d authored by lukas.niegsch's avatar lukas.niegsch

converted html string to pdf

parent 2cc58b53
<html style="color: green">
<!-- this is a comment -->
<head>
<title>Mixed HTML Example</title>
<style>
h1 {font-family: comic sans; color: #f0f;}
div {background: yellow !important;}
body {
max-width: 50em;
margin: 1em 2em 1em 5em;
}
</style>
</head>
<body>
<h1>Mixed HTML Example</h1>
<h2 id="test">Testing</h2>
<script>
let element = document.getElementById("test");
element.innerHTML = "I am a script!";
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<!--
This will be removed later. Implementing each function inside CDP
manually takes is too much work. So gadget_devtools.html will provide
a dynamic solution.
--->
<head>
<title>Browser Gadget</title>
<script src="include/nexedi/rsvp.js"></script>
<script src="include/nexedi/jio.js"></script>
<script src="include/nexedi/renderjs.js"></script>
<script src="gadget_browser.js"></script>
</head>
<div
data-gadget-url="gadget_devtools.html"
data-gadget-scope="devtools"
data-gadget-sandbox="public">
</div>
</html>
\ No newline at end of file
(function(window, rJS, RSVP) {
"use strict";
var BROWSER_URL = "http://localhost:9222";
var BROWSER_USERNAME = "optional"
var BROWSER_PASSWORD = "optional"
rJS(window)
.declareMethod("makeBrowserRequest", function (url) {
return RSVP.Queue()
.push(function () {
return new RSVP.Promise(function (resolve, reject) {
var request = new XMLHttpRequest();
request.open("GET", BROWSER_URL + "/" + url, true,
BROWSER_USERNAME, BROWSER_PASSWORD);
request.withCredentials = true;
request.onload = () => {
var response = JSON.parse(request.responseText);
resolve(response);
}
request.onerror = (error) => {
reject("Could not connect to browser!");
}
request.send();
})
})
})
.declareMethod("getBrowserWebSocketUrl", function () {
var gadget = this;
return gadget.makeBrowserRequest("json/version")
.push(function (response) {
return response.webSocketDebuggerUrl;
})
})
.declareMethod("getPageWebsocketUrl", function (page) {
var gadget = this;
return gadget.makeBrowserRequest("json/list")
.push(function (response) {
for (const key in response) {
if (!response.hasOwnProperty(key)) {
continue;
}
var target = response[key];
if (target.id == page) {
return target.webSocketDebuggerUrl
}
}
})
})
.declareMethod("runCommand", function (websocket, command, params = {}) {
return RSVP.Queue()
.push(function () {
return new RSVP.Promise(function (resolve, reject) {
var server = new WebSocket(websocket);
server.onopen = () => {
var message = {id: 0, method: command, params: params}
server.send(JSON.stringify(message))
}
server.onmessage = (response) => {
server.close()
var data = JSON.parse(response.data)
if ('error' in data) reject(data.error)
if ('result' in data) resolve(data.result)
if ('method' in data) resolve(data.method)
reject(data)
}
server.onerror = (error) => {
server.close()
reject(error)
}
})
})
})
.declareMethod("runBrowserCommand", function (command, params = {}) {
var gadget = this;
return gadget.getBrowserWebSocketUrl()
.push(function (websocket) {
return gadget.runCommand(websocket, command, params);
})
})
.declareMethod("runPageCommand", function (page, command, params = {}) {
var gadget = this;
return gadget.getPageWebsocketUrl(page)
.push(function (websocket) {
return gadget.runCommand(websocket, command, params);
})
})
.declareMethod("getVersion", function () {
var gadget = this;
return gadget.getDeclaredGadget("devtools")
.push(function (subgadget) {
return subgadget.getDevtools();
})
.push(function (devtools) {
console.log(devtools.Browser.getVersion());
return gadget.runBrowserCommand("Browser.getVersion");
})
})
.declareMethod("openNewPage", function (url) {
var gadget = this;
return gadget.runBrowserCommand("Target.createTarget", {url: "" + url})
.push(function (response) {
return response.targetId;
})
})
.declareMethod("closePage", function (page) {
var gadget = this;
return gadget.runBrowserCommand("Target.closeTarget", {targetId: page});
})
.declareMethod("enablePage", function (page) {
var gadget = this;
return gadget.runPageCommand(page, "Page.enable");
})
.declareMethod("setPageContent", function (page, html) {
var gadget = this;
// TODO: implement this method
})
.declareMethod("printToPdf", function (page, options) {
var gadget = this;
return gadget.runPageCommand(page, "Page.printToPDF", options)
.push(function (result) {
return result.data;
});
})
}(window, rJS, RSVP));
\ No newline at end of file
......@@ -33,9 +33,8 @@
var gadget = this;
var devtools;
var targetId;
var frameId;
var sessionId;
var base64data;
/**
* Steps:
*
......@@ -59,6 +58,10 @@
* // cleanup
* Target.detachFromTarget();
* Target.closeTarget();
*
* todo: detaching should reset session properly
* todo: implement receiving events to avoid waiting
* todo: close target stops receiving messages ...
*/
return gadget.getDeclaredGadget("devtools")
......@@ -67,10 +70,44 @@
})
.push(function (result) {
devtools = result;
return devtools.Browser.getVersion();
return devtools.Target.createTarget({url: ""});
})
.push(function (result) {
targetId = result.targetId;
return devtools.Target.attachToTarget({targetId: targetId, flatten: true});
})
.push(function (result) {
sessionId = result.sessionId;
return devtools.Target.activateTarget({targetId: targetId});
})
.push(function () {
return devtools.Network.enable();
})
.push(function () {
return devtools.Page.enable();
})
.push(function () {
return devtools.Page.getFrameTree();
})
.push(function (result) {
console.log(result);
var frameId = result.frameTree.frame.id;
return devtools.Page.setDocumentContent({frameId: frameId, html: html});
})
.push(function () {
console.log("begin delay");
return RSVP.delay(3 /* seconds*/ * 1000);
})
.push(function () {
console.log("end delay");
return devtools.Page.printToPDF(optionsForPrintToPdf);
})
.push(function (result) {
base64data = result.data;
// return devtools.Target.closeTarget({targetId: targetId});
})
.push(function () {
return base64data;
})
})
}(window, rJS));
\ No newline at end of file
......@@ -70,6 +70,7 @@ var BROWSER_PASSWORD = "ignored";
params: params,
}
var message = JSON.stringify(command);
console.log(message);
gadget.state.websocket.send(message);
var handler = {
......@@ -140,7 +141,7 @@ var BROWSER_PASSWORD = "ignored";
return detachFromTarget(params)
.push(function (result) {
response = result;
return gadget.changeState({sessionId: undefined});
return gadget.changeState({sessionId: gadget.state.browserId});
})
.push(function () {
return response;
......@@ -180,6 +181,7 @@ var BROWSER_PASSWORD = "ignored";
rJS(window)
.setState({
websocket: null,
browserId: undefined,
sessionId: undefined,
nextIndex: 0,
handlers: null,
......@@ -192,7 +194,13 @@ var BROWSER_PASSWORD = "ignored";
gadget.state.messages = new Set();
return getBrowserJSON("json/version")
.push(function (result) {
return updateWebsocket(gadget, result.webSocketDebuggerUrl);
var browserUrl = result.webSocketDebuggerUrl;
// todo: somehow fetch browser id:
// -> not: browserUrl.split("/").slice(-1)[0]
// -> not: Target.getTargets()[x].browserContextId
// -> not: reopen new websocket on Target.detachFromTarget()
gadget.state.browserId = undefined;
return updateWebsocket(gadget, browserUrl);
})
.push(function () {
return getBrowserJSON("json/protocol")
......@@ -212,10 +220,6 @@ var BROWSER_PASSWORD = "ignored";
return gadget.state.devtools;
})
})
.declareMethod("clearMessages", function () {
var gadget = this;
gadget.state.messages = [];
})
.onStateChange(function (modifications) {
var gadget = this;
/*
......
......@@ -21,7 +21,6 @@
indentUnit: 4,
tabsize: 4
});
return gadget.changeState({update: true});
})
.onEvent("click", function (event) {
var gadget = this;
......@@ -44,6 +43,7 @@
return converter.convert(html);
})
.push(function (base64data) {
console.log(base64data);
viewer.src = "data:application/pdf;base64," + base64data;
})
.push(function () {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment