From 889f3ad189bf42f915ae99e6e6a566a3470904fb Mon Sep 17 00:00:00 2001 From: julien Date: Mon, 29 Oct 2018 14:54:20 -1000 Subject: [PATCH] cover --- index.js | 10 +++++++++- src/blueprints.js | 4 ++++ src/enhancements.js | 22 +++++++++++++++++++++ templates/default.css | 4 +++- templates/default.html | 4 ++++ templates/default_cover.css | 38 ++++++++++++++++++++++++++++++++++++ templates/default_cover.html | 16 +++++++++++++++ templates/default_toc.css | 3 +++ 8 files changed, 99 insertions(+), 2 deletions(-) diff --git a/index.js b/index.js index c06f2c3..2fbe8e3 100755 --- a/index.js +++ b/index.js @@ -16,6 +16,7 @@ const blueprints = require('./src/blueprints'); const { ampToHtml, fixLazyLoadedImages, + extractImage, imagesAtFullSize, wikipediaSpecific, noUselessHref, @@ -92,6 +93,7 @@ async function cleanup(item, blueprint) { ---------------- */ enhancePage(dom); + const img = extractImage(dom.window.document); // Run through readability and return const parsed = new Readability(dom.window.document, { @@ -112,7 +114,7 @@ async function cleanup(item, blueprint) { .toString(36) .replace(/[^a-z]+/g, '') .substr(2, 10); - return Object.assign({}, parsed, item, { _id: _id }); + return Object.assign({}, parsed, item, { _id: _id, img: img }); } catch (error) { spinner.fail(error.message); throw error; @@ -131,6 +133,12 @@ async function bundle(blueprint) { let style = fs.readFileSync(stylesheet, 'utf8'); if (blueprint.cover.generate) { style += fs.readFileSync(resolve(blueprint.cover.css), 'utf8'); + if (!blueprint.cover.title) { + blueprint.cover.title = blueprint.document.items[0].title; + } + if (!blueprint.cover.picture) { + blueprint.cover.picture = blueprint.document.items[0].img; + } } if (blueprint.toc.generate) { style += fs.readFileSync(resolve(blueprint.toc.css), 'utf8'); diff --git a/src/blueprints.js b/src/blueprints.js index 1fcf5ac..439d225 100644 --- a/src/blueprints.js +++ b/src/blueprints.js @@ -57,6 +57,10 @@ function _defaultCover() { generate: false, template: './templates/default_cover.html', css: './templates/default_cover.css', + title: null, + picture: null, + header: 'Percollate', + footer: new Date(), assets: {} }; } diff --git a/src/enhancements.js b/src/enhancements.js index 0c8b04b..e226efb 100644 --- a/src/enhancements.js +++ b/src/enhancements.js @@ -13,6 +13,27 @@ function ampToHtml(doc) { }); } +function extractImage(doc) { + const selectors = [ + "meta[name='og:image']", + "meta[name='twitter:image']", + 'amp-img', + 'img' + ]; + for (let idx = 0; idx < selectors.length; idx++) { + let imgs = Array.from(doc.querySelectorAll(selectors[idx])); + console.log(imgs); + if (imgs && imgs.length > 0) { + if (imgs[0].getAttribute('content')) { + return imgs[0].getAttribute('content'); + } else { + return imgs[0].getAttribute('src'); + } + } + } + return null; +} + function fixLazyLoadedImages(doc) { Array.from( doc.querySelectorAll(` @@ -152,6 +173,7 @@ function singleImgToFigure(doc) { module.exports = { ampToHtml, fixLazyLoadedImages, + extractImage, imagesAtFullSize, noUselessHref, wikipediaSpecific, diff --git a/templates/default.css b/templates/default.css index 4104900..d7bff78 100644 --- a/templates/default.css +++ b/templates/default.css @@ -9,7 +9,7 @@ @page { size: A5 portrait; - margin: 1cm 1cm 2cm; + margin: 0.5cm 0.5cm 1cm; } html { @@ -17,11 +17,13 @@ html { line-height: 1.3; font-family: var(--main-font); -webkit-print-color-adjust: exact; + height: 100%; } body { margin: 0; padding: 0; + height: 100%; } h1, diff --git a/templates/default.html b/templates/default.html index 4581029..e202b16 100644 --- a/templates/default.html +++ b/templates/default.html @@ -10,6 +10,10 @@ + {% if blueprint.cover.generate %} + {% include blueprint.cover.template %} + {% endif %} + {% if blueprint.toc.generate %} {% include blueprint.toc.template %} {% endif %} diff --git a/templates/default_cover.css b/templates/default_cover.css index e69de29..4f6d8f6 100644 --- a/templates/default_cover.css +++ b/templates/default_cover.css @@ -0,0 +1,38 @@ +.cover { + display: block; + position: relative; + height: 100%; + page-break-after: always; +} +.cover-header { + position: absolute; + top: 5px; + left: 5px; +} +.cover-jumbo { + position: relative; + height: 40%; + width: 90%; + margin: auto; + border-bottom: 1px solid #eaeaea; +} +.cover-jumbo > h1 { + font-size: 1.5rem; + position: absolute; + bottom: 10px; +} +.cover-picture { + position: relative; + height: 40%; + width: 90%; + margin: auto; +} +.cover-picture > img { + max-width: 100%; + max-height: 100%; +} +.cover-footer { + position: absolute; + bottom: 25px; + left: 5px; +} diff --git a/templates/default_cover.html b/templates/default_cover.html index e69de29..d8c231b 100644 --- a/templates/default_cover.html +++ b/templates/default_cover.html @@ -0,0 +1,16 @@ +
+
+ {{blueprint.cover.header}} +
+
+

{{blueprint.cover.title}}

+
+
+ {% if blueprint.cover.picture %} + + {% endif %} +
+
+ {{blueprint.cover.footer}} +
+
\ No newline at end of file diff --git a/templates/default_toc.css b/templates/default_toc.css index 3a443de..cccae35 100644 --- a/templates/default_toc.css +++ b/templates/default_toc.css @@ -1,3 +1,6 @@ nav.toc { + display: block; + position: relative; + height: 100%; page-break-after: always; }