You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
106 lines
3.3 KiB
106 lines
3.3 KiB
// Shrink up the spacing and change the size of the headers
|
|
u("#ingredients").attr("style", "margin-bottom: .5em;");
|
|
u("#ingredients").attr("class", "is-size-5");
|
|
u("#directions").attr("style", "margin: 0px;");
|
|
u("#directions").attr("class", "is-size-5");
|
|
|
|
// If we have ingredients subheadings, change the h4 headings
|
|
u("h4").addClass("is-size-6");
|
|
u("h4").attr("style", "margin: 0px;");
|
|
|
|
// Change the title size
|
|
u("#mainTitle").addClass("is-size-4");
|
|
|
|
// Change the lists margins
|
|
var directions = u("ol");
|
|
directions.attr("style", "margin-top: 0px; margin-bottom: 0px;");
|
|
|
|
var ingredients = u("ul");
|
|
ingredients.attr("style", "margin-top: 0px; margin-bottom: 0px;");
|
|
|
|
var listItems = u("li");
|
|
listItems.attr("style", "margin-top: 0px;");
|
|
|
|
// Remove the last <hr> if we have a footnote
|
|
var hrs = u("hr");
|
|
if (hrs.length > 2) {
|
|
hrs.last().remove();
|
|
}
|
|
|
|
// Remove the footnote links
|
|
u(document.getElementsByClassName("footnote-backref")).remove();
|
|
|
|
// Break ingredients into column-able blocks
|
|
window.addEventListener("load", function () {
|
|
const zutatenNode = document
|
|
.evaluate('//*[@id="zutaten"]', document)
|
|
.iterateNext();
|
|
|
|
let nodeBlocks = [[]];
|
|
let nextNode = zutatenNode.nextElementSibling;
|
|
while (nextNode && nextNode.tagName != "H2") {
|
|
if (nextNode.tagName == "H4") {
|
|
nodeBlocks.push([]);
|
|
}
|
|
nodeBlocks[nodeBlocks.length - 1].push(nextNode);
|
|
|
|
nextNode = nextNode.nextElementSibling;
|
|
}
|
|
|
|
let allIngredientsDiv = document.createElement("div");
|
|
allIngredientsDiv.id = "allZutaten";
|
|
allIngredientsDiv.classList.add("allZutaten");
|
|
let nodeBlockIndex = 0;
|
|
nodeBlocks.forEach(function (nodeArray) {
|
|
let outerDiv = document.createElement("div");
|
|
outerDiv.id = `wrap${nodeBlockIndex}`;
|
|
|
|
outerDiv.classList.add("zutatenWrapper");
|
|
allIngredientsDiv.appendChild(outerDiv);
|
|
for (elem of nodeArray) {
|
|
outerDiv.appendChild(elem);
|
|
}
|
|
|
|
nodeBlockIndex += 1;
|
|
});
|
|
zutatenNode.parentNode.insertBefore(
|
|
allIngredientsDiv,
|
|
zutatenNode.nextSibling
|
|
);
|
|
|
|
// space to full pages and add kirby background on every page
|
|
const pageHeightInPx = 860;
|
|
const docHeight = document.children[0].offsetHeight;
|
|
const pages = Math.ceil(docHeight / pageHeightInPx);
|
|
|
|
if ((docHeight / pageHeightInPx) % 1 != 0) {
|
|
// need spacing
|
|
const spacer = document
|
|
.evaluate('//*[@id="spacer"]', document)
|
|
.iterateNext();
|
|
// spacer.style.border = "1px solid red";
|
|
spacer.style.height = `${pages * pageHeightInPx}px`;
|
|
console.log("docHeight", docHeight);
|
|
console.log("pages", pages);
|
|
console.log("pages * pageHeightInPx", pages * pageHeightInPx);
|
|
console.log(
|
|
"(docHeight/pageHeightInPx)%1",
|
|
(docHeight / pageHeightInPx) % 1
|
|
);
|
|
}
|
|
|
|
// fill all pages with kirby background
|
|
const imageString = 'url("../../recipeskirby.svg")';
|
|
imageArray = [imageString];
|
|
let positionString = "background-position: 10mm 55mm";
|
|
for (let i = 1; i < pages; i += 1) {
|
|
positionString += `, 10mm ${230 * i + 55}mm`;
|
|
imageArray.push(imageString);
|
|
}
|
|
|
|
const styleString = `#spacer { background-image: ${imageArray.join(
|
|
", "
|
|
)}; ${positionString}; background-blend-mode: normal; background-repeat: no-repeat; }`;
|
|
window.document.styleSheets[2].insertRule(styleString, 0);
|
|
});
|