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 @@ ...@@ -33,9 +33,8 @@
var gadget = this; var gadget = this;
var devtools; var devtools;
var targetId; var targetId;
var frameId; var sessionId;
var base64data; var base64data;
/** /**
* Steps: * Steps:
* *
...@@ -59,6 +58,10 @@ ...@@ -59,6 +58,10 @@
* // cleanup * // cleanup
* Target.detachFromTarget(); * Target.detachFromTarget();
* Target.closeTarget(); * 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") return gadget.getDeclaredGadget("devtools")
...@@ -67,10 +70,44 @@ ...@@ -67,10 +70,44 @@
}) })
.push(function (result) { .push(function (result) {
devtools = 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) { .push(function (result) {
console.log(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)); }(window, rJS));
\ No newline at end of file
...@@ -70,6 +70,7 @@ var BROWSER_PASSWORD = "ignored"; ...@@ -70,6 +70,7 @@ var BROWSER_PASSWORD = "ignored";
params: params, params: params,
} }
var message = JSON.stringify(command); var message = JSON.stringify(command);
console.log(message);
gadget.state.websocket.send(message); gadget.state.websocket.send(message);
var handler = { var handler = {
...@@ -140,7 +141,7 @@ var BROWSER_PASSWORD = "ignored"; ...@@ -140,7 +141,7 @@ var BROWSER_PASSWORD = "ignored";
return detachFromTarget(params) return detachFromTarget(params)
.push(function (result) { .push(function (result) {
response = result; response = result;
return gadget.changeState({sessionId: undefined}); return gadget.changeState({sessionId: gadget.state.browserId});
}) })
.push(function () { .push(function () {
return response; return response;
...@@ -180,6 +181,7 @@ var BROWSER_PASSWORD = "ignored"; ...@@ -180,6 +181,7 @@ var BROWSER_PASSWORD = "ignored";
rJS(window) rJS(window)
.setState({ .setState({
websocket: null, websocket: null,
browserId: undefined,
sessionId: undefined, sessionId: undefined,
nextIndex: 0, nextIndex: 0,
handlers: null, handlers: null,
...@@ -192,7 +194,13 @@ var BROWSER_PASSWORD = "ignored"; ...@@ -192,7 +194,13 @@ var BROWSER_PASSWORD = "ignored";
gadget.state.messages = new Set(); gadget.state.messages = new Set();
return getBrowserJSON("json/version") return getBrowserJSON("json/version")
.push(function (result) { .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 () { .push(function () {
return getBrowserJSON("json/protocol") return getBrowserJSON("json/protocol")
...@@ -212,10 +220,6 @@ var BROWSER_PASSWORD = "ignored"; ...@@ -212,10 +220,6 @@ var BROWSER_PASSWORD = "ignored";
return gadget.state.devtools; return gadget.state.devtools;
}) })
}) })
.declareMethod("clearMessages", function () {
var gadget = this;
gadget.state.messages = [];
})
.onStateChange(function (modifications) { .onStateChange(function (modifications) {
var gadget = this; var gadget = this;
/* /*
......
...@@ -21,7 +21,6 @@ ...@@ -21,7 +21,6 @@
indentUnit: 4, indentUnit: 4,
tabsize: 4 tabsize: 4
}); });
return gadget.changeState({update: true});
}) })
.onEvent("click", function (event) { .onEvent("click", function (event) {
var gadget = this; var gadget = this;
...@@ -44,6 +43,7 @@ ...@@ -44,6 +43,7 @@
return converter.convert(html); return converter.convert(html);
}) })
.push(function (base64data) { .push(function (base64data) {
console.log(base64data);
viewer.src = "data:application/pdf;base64," + base64data; viewer.src = "data:application/pdf;base64," + base64data;
}) })
.push(function () { .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