From 9e16ea14ad2c8e43c6de8bdf7cca5cb95f3dad13 Mon Sep 17 00:00:00 2001 From: Adam Goldsmith Date: Sun, 6 Jan 2019 09:47:19 -0500 Subject: [PATCH] Allow for using CSS in PhantomJS deck rendering --- src/Deck.vue | 23 ++++++++++++++++++----- src/Editor.vue | 1 + src/server.js | 45 ++++++++++++++++++++++++--------------------- 3 files changed, 43 insertions(+), 26 deletions(-) diff --git a/src/Deck.vue b/src/Deck.vue index 618c385..4a9df9d 100644 --- a/src/Deck.vue +++ b/src/Deck.vue @@ -1,10 +1,8 @@ @@ -43,3 +41,18 @@ }, } + + diff --git a/src/Editor.vue b/src/Editor.vue index 5e660fa..b4060df 100644 --- a/src/Editor.vue +++ b/src/Editor.vue @@ -124,6 +124,7 @@ deck: this.deckInfo, _id: this.deckID === 'new' ? undefined : this.deckID, dom: (new XMLSerializer()).serializeToString(this.$refs.deck.$el), + css: document.styleSheets[0].href, })}) .then(r => r.json()) .then(j => this.$router.replace('/edit/' + j.id)) diff --git a/src/server.js b/src/server.js index 113a9de..fc9d8c5 100644 --- a/src/server.js +++ b/src/server.js @@ -94,28 +94,31 @@ function getTTSJSON(req, res) { }); } -function handleUpload(req, res) { +async function handleUpload(req, res) { const json = req.body; console.log("Making deck image"); - phantom.create().then(ph => ph.createPage().then( - page => { - page.on('onLoadFinished', status => { - if (status === 'success') { - page.renderBase64(`PNG`).then(image => { - db.update({_id: json.id}, - {deck: json.deck, image: image}, - {upsert: true, returnUpdatedDocs: true}) - .then(doc => res.status(201).json({id: doc._id})); - page.close().then(() => ph.exit()); - }); - } - else { - console.log('Failed to load page'); - ph.exit(1); - } - }); - page.property('zoomFactor', 2); // pretty arbitrary - page.property('content', '' + json.dom + ''); - })); + const ph = await phantom.create(); + const page = await ph.createPage(); + + page.on('onLoadFinished', status => { + if (status === 'success') { + page.renderBase64(`PNG`) + .then(image => db.update( + {_id: json.id}, + {deck: json.deck, image: image}, + {upsert: true, returnUpdatedDocs: true})) + .then(doc => res.status(201).json({id: doc._id})) + .then(() => page.close().then(() => ph.exit())); + } + else { + console.log('Failed to load page'); + ph.exit(1); + } + }); + + page.property('zoomFactor', 2); // pretty arbitrary + page.property('content', + '' + + '' + json.dom + ''); }