latest pagedjs and footnoteprefix..
This commit is contained in:
parent
4c4f795469
commit
4c3c3195df
3 changed files with 323 additions and 100 deletions
|
|
@ -49,6 +49,9 @@ startLevel = 1
|
|||
|
||||
[markup.goldmark.renderer]
|
||||
unsafe = true
|
||||
[markup.goldmark.extensions]
|
||||
# footnote gets prefix per page (print sequence needs that)
|
||||
footnoteprefix = true
|
||||
|
||||
## Enable custom attribute support for titles and blocks by adding attribute lists inside single curly brackets ({.myclass class="class1 class2" }) and placing it after the Markdown element it decorates, on the same line for titles and on a new line directly below for blocks. introduced in hugo v0.81
|
||||
#
|
||||
|
|
|
|||
|
|
@ -173,6 +173,10 @@
|
|||
break-after: avoid;
|
||||
}
|
||||
|
||||
table {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.glosscontainer,
|
||||
table,
|
||||
table + p,
|
||||
|
|
|
|||
416
static/js/paged.polyfill.js
Executable file → Normal file
416
static/js/paged.polyfill.js
Executable file → Normal file
|
|
@ -1,5 +1,5 @@
|
|||
/**
|
||||
* @license Paged.js v0.3.1 | MIT | https://gitlab.pagedmedia.org/tools/pagedjs
|
||||
* @license Paged.js v0.4.1 | MIT | https://gitlab.pagedmedia.org/tools/pagedjs
|
||||
*/
|
||||
|
||||
(function (global, factory) {
|
||||
|
|
@ -698,7 +698,7 @@
|
|||
let after = elementAfter(node, limiter);
|
||||
|
||||
while (after && after.dataset.undisplayed) {
|
||||
after = elementAfter(after);
|
||||
after = elementAfter(after, limiter);
|
||||
}
|
||||
|
||||
return after;
|
||||
|
|
@ -708,7 +708,7 @@
|
|||
let before = elementBefore(node, limiter);
|
||||
|
||||
while (before && before.dataset.undisplayed) {
|
||||
before = elementBefore(before);
|
||||
before = elementBefore(before, limiter);
|
||||
}
|
||||
|
||||
return before;
|
||||
|
|
@ -766,7 +766,7 @@
|
|||
for (var i = 0; i < ancestors.length; i++) {
|
||||
ancestor = ancestors[i];
|
||||
parent = ancestor.cloneNode(false);
|
||||
|
||||
|
||||
parent.setAttribute("data-split-from", parent.getAttribute("data-ref"));
|
||||
// ancestor.setAttribute("data-split-to", parent.getAttribute("data-ref"));
|
||||
|
||||
|
|
@ -792,12 +792,23 @@
|
|||
fragment.appendChild(parent);
|
||||
}
|
||||
added.push(parent);
|
||||
|
||||
// rebuild table rows
|
||||
if (parent.nodeName === "TD" && ancestor.parentElement.contains(ancestor)) {
|
||||
let td = ancestor;
|
||||
let prev = parent;
|
||||
while ((td = td.previousElementSibling)) {
|
||||
let sib = td.cloneNode(false);
|
||||
parent.parentElement.insertBefore(sib, prev);
|
||||
prev = sib;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
added = undefined;
|
||||
return fragment;
|
||||
}
|
||||
|
||||
/*
|
||||
export function split(bound, cutElement, breakAfter) {
|
||||
let needsRemoval = [];
|
||||
|
|
@ -1014,7 +1025,7 @@
|
|||
case "BLOCKQUOTE":
|
||||
case "PRE":
|
||||
case "LI":
|
||||
case "TR":
|
||||
case "TD":
|
||||
case "DT":
|
||||
case "DD":
|
||||
case "VIDEO":
|
||||
|
|
@ -1032,13 +1043,17 @@
|
|||
return n.cloneNode(deep);
|
||||
}
|
||||
|
||||
function findElement(node, doc) {
|
||||
function findElement(node, doc, forceQuery) {
|
||||
const ref = node.getAttribute("data-ref");
|
||||
return findRef(ref, doc);
|
||||
return findRef(ref, doc, forceQuery);
|
||||
}
|
||||
|
||||
function findRef(ref, doc) {
|
||||
return doc.querySelector(`[data-ref='${ref}']`);
|
||||
function findRef(ref, doc, forceQuery) {
|
||||
if (!forceQuery && doc.indexOfRefs && doc.indexOfRefs[ref]) {
|
||||
return doc.indexOfRefs[ref];
|
||||
} else {
|
||||
return doc.querySelector(`[data-ref='${ref}']`);
|
||||
}
|
||||
}
|
||||
|
||||
function validNode(node) {
|
||||
|
|
@ -1255,7 +1270,7 @@
|
|||
}
|
||||
|
||||
/**
|
||||
* Layout
|
||||
* BreakToken
|
||||
* @class
|
||||
*/
|
||||
class BreakToken {
|
||||
|
|
@ -1280,6 +1295,30 @@
|
|||
return true;
|
||||
}
|
||||
|
||||
toJSON(hash) {
|
||||
let node;
|
||||
let index = 0;
|
||||
if (!this.node) {
|
||||
return {};
|
||||
}
|
||||
if (isElement(this.node) && this.node.dataset.ref) {
|
||||
node = this.node.dataset.ref;
|
||||
} else if (hash) {
|
||||
node = this.node.parentElement.dataset.ref;
|
||||
}
|
||||
|
||||
if (this.node.parentElement) {
|
||||
const children = Array.from(this.node.parentElement.childNodes);
|
||||
index = children.indexOf(this.node);
|
||||
}
|
||||
|
||||
return JSON.stringify({
|
||||
"node": node,
|
||||
"index" : index,
|
||||
"offset": this.offset
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -1313,6 +1352,15 @@
|
|||
this.element = element;
|
||||
|
||||
this.bounds = this.element.getBoundingClientRect();
|
||||
this.parentBounds = this.element.offsetParent.getBoundingClientRect();
|
||||
let gap = parseFloat(window.getComputedStyle(this.element).columnGap);
|
||||
|
||||
if (gap) {
|
||||
let leftMargin = this.bounds.left - this.parentBounds.left;
|
||||
this.gap = gap - leftMargin;
|
||||
} else {
|
||||
this.gap = 0;
|
||||
}
|
||||
|
||||
if (hooks) {
|
||||
this.hooks = hooks;
|
||||
|
|
@ -1369,6 +1417,9 @@
|
|||
console.warn("Unable to layout item: ", prevNode);
|
||||
return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [prevNode]));
|
||||
}
|
||||
|
||||
this.rebuildTableFromBreakToken(newBreakToken, wrapper);
|
||||
|
||||
return new RenderResult(newBreakToken);
|
||||
}
|
||||
|
||||
|
|
@ -1387,11 +1438,18 @@
|
|||
|
||||
if (!newBreakToken) {
|
||||
newBreakToken = this.breakAt(node);
|
||||
} else {
|
||||
this.rebuildTableFromBreakToken(newBreakToken, wrapper);
|
||||
}
|
||||
|
||||
if (newBreakToken && newBreakToken.equals(prevBreakToken)) {
|
||||
console.warn("Unable to layout item: ", node);
|
||||
return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [node]));
|
||||
let after = newBreakToken.node && nodeAfter(newBreakToken.node);
|
||||
if (after) {
|
||||
newBreakToken = new BreakToken(after);
|
||||
} else {
|
||||
return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [node]));
|
||||
}
|
||||
}
|
||||
|
||||
length = 0;
|
||||
|
|
@ -1399,6 +1457,17 @@
|
|||
break;
|
||||
}
|
||||
|
||||
if (node.dataset && node.dataset.page) {
|
||||
let named = node.dataset.page;
|
||||
let page = this.element.closest(".pagedjs_page");
|
||||
page.classList.add("pagedjs_named_page");
|
||||
page.classList.add("pagedjs_" + named + "_page");
|
||||
|
||||
if (!node.dataset.splitFrom) {
|
||||
page.classList.add("pagedjs_" + named + "_first_page");
|
||||
}
|
||||
}
|
||||
|
||||
// Should the Node be a shallow or deep clone
|
||||
let shallow = isContainer(node);
|
||||
|
||||
|
|
@ -1423,6 +1492,8 @@
|
|||
|
||||
if (!newBreakToken) {
|
||||
newBreakToken = this.breakAt(node);
|
||||
} else {
|
||||
this.rebuildTableFromBreakToken(newBreakToken, wrapper);
|
||||
}
|
||||
|
||||
length = 0;
|
||||
|
|
@ -1443,13 +1514,19 @@
|
|||
|
||||
newBreakToken = this.findBreakToken(wrapper, source, bounds, prevBreakToken);
|
||||
|
||||
if (newBreakToken && newBreakToken.equals(prevBreakToken)) {
|
||||
console.warn("Unable to layout item: ", node);
|
||||
return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [node]));
|
||||
}
|
||||
|
||||
if (newBreakToken) {
|
||||
length = 0;
|
||||
this.rebuildTableFromBreakToken(newBreakToken, wrapper);
|
||||
}
|
||||
|
||||
if (newBreakToken && newBreakToken.equals(prevBreakToken)) {
|
||||
console.warn("Unable to layout item: ", node);
|
||||
let after = newBreakToken.node && nodeAfter(newBreakToken.node);
|
||||
if (after) {
|
||||
newBreakToken = new BreakToken(after);
|
||||
} else {
|
||||
return new RenderResult(undefined, new OverflowContentError("Unable to layout item", [node]));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1534,6 +1611,13 @@
|
|||
dest.appendChild(clone);
|
||||
}
|
||||
|
||||
if (clone.dataset && clone.dataset.ref) {
|
||||
if (!dest.indexOfRefs) {
|
||||
dest.indexOfRefs = {};
|
||||
}
|
||||
dest.indexOfRefs[clone.dataset.ref] = clone;
|
||||
}
|
||||
|
||||
let nodeHooks = this.hooks.renderNode.triggerSync(clone, node, this);
|
||||
nodeHooks.forEach((newNode) => {
|
||||
if (typeof newNode != "undefined") {
|
||||
|
|
@ -1544,6 +1628,23 @@
|
|||
return clone;
|
||||
}
|
||||
|
||||
rebuildTableFromBreakToken(breakToken, dest) {
|
||||
if (!breakToken || !breakToken.node) {
|
||||
return;
|
||||
}
|
||||
let node = breakToken.node;
|
||||
let td = isElement(node) ? node.closest("td") : node.parentElement.closest("td");
|
||||
if (td) {
|
||||
let rendered = findElement(td, dest, true);
|
||||
if (!rendered) {
|
||||
return;
|
||||
}
|
||||
while ((td = td.nextElementSibling)) {
|
||||
this.append(td, dest, null, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async waitForImages(imgs) {
|
||||
let results = Array.from(imgs).map(async (img) => {
|
||||
return this.awaitImageLoaded(img);
|
||||
|
|
@ -1723,16 +1824,20 @@
|
|||
|
||||
hasOverflow(element, bounds = this.bounds) {
|
||||
let constrainingElement = element && element.parentNode; // this gets the element, instead of the wrapper for the width workaround
|
||||
let {width} = element.getBoundingClientRect();
|
||||
let {width, height} = element.getBoundingClientRect();
|
||||
let scrollWidth = constrainingElement ? constrainingElement.scrollWidth : 0;
|
||||
return Math.max(Math.floor(width), scrollWidth) > Math.round(bounds.width);
|
||||
let scrollHeight = constrainingElement ? constrainingElement.scrollHeight : 0;
|
||||
return Math.max(Math.floor(width), scrollWidth) > Math.round(bounds.width) ||
|
||||
Math.max(Math.floor(height), scrollHeight) > Math.round(bounds.height);
|
||||
}
|
||||
|
||||
findOverflow(rendered, bounds = this.bounds) {
|
||||
findOverflow(rendered, bounds = this.bounds, gap = this.gap) {
|
||||
if (!this.hasOverflow(rendered, bounds)) return;
|
||||
|
||||
let start = Math.round(bounds.left);
|
||||
let end = Math.round(bounds.right);
|
||||
let start = Math.floor(bounds.left);
|
||||
let end = Math.round(bounds.right + gap);
|
||||
let vStart = Math.round(bounds.top);
|
||||
let vEnd = Math.round(bounds.bottom);
|
||||
let range;
|
||||
|
||||
let walker = walk$2(rendered.firstChild, rendered);
|
||||
|
|
@ -1752,8 +1857,10 @@
|
|||
let pos = getBoundingClientRect(node);
|
||||
let left = Math.round(pos.left);
|
||||
let right = Math.floor(pos.right);
|
||||
let top = Math.round(pos.top);
|
||||
let bottom = Math.floor(pos.bottom);
|
||||
|
||||
if (!range && left >= end) {
|
||||
if (!range && (left >= end || top >= vEnd)) {
|
||||
// Check if it is a float
|
||||
let isFloat = false;
|
||||
|
||||
|
|
@ -1761,7 +1868,8 @@
|
|||
const insideTableCell = parentOf(node, "TD", rendered);
|
||||
if (insideTableCell && window.getComputedStyle(insideTableCell)["break-inside"] === "avoid") {
|
||||
// breaking inside a table cell produces unexpected result, as a workaround, we forcibly avoid break inside in a cell.
|
||||
prev = insideTableCell;
|
||||
// But we take the whole row, not just the cell that is causing the break.
|
||||
prev = insideTableCell.parentElement;
|
||||
} else if (isElement(node)) {
|
||||
let styles = window.getComputedStyle(node);
|
||||
isFloat = styles.getPropertyValue("float") !== "none";
|
||||
|
|
@ -1787,23 +1895,24 @@
|
|||
|
||||
// Check if the node is inside a row with a rowspan
|
||||
const table = parentOf(tableRow, "TABLE", rendered);
|
||||
if (table) {
|
||||
const rowspan = table.querySelector("[colspan]");
|
||||
if (table && rowspan) {
|
||||
let columnCount = 0;
|
||||
for (const cell of Array.from(table.rows[0].cells)) {
|
||||
columnCount += parseInt(cell.getAttribute("COLSPAN") || "1");
|
||||
columnCount += parseInt(cell.getAttribute("colspan") || "1");
|
||||
}
|
||||
if (tableRow.cells.length !== columnCount) {
|
||||
let previousRow = tableRow.previousSibling;
|
||||
let previousRow = tableRow.previousElementSibling;
|
||||
let previousRowColumnCount;
|
||||
while (previousRow !== null) {
|
||||
previousRowColumnCount = 0;
|
||||
for (const cell of Array.from(previousRow.cells)) {
|
||||
previousRowColumnCount += parseInt(cell.getAttribute("COLSPAN") || "1");
|
||||
previousRowColumnCount += parseInt(cell.getAttribute("colspan") || "1");
|
||||
}
|
||||
if (previousRowColumnCount === columnCount) {
|
||||
break;
|
||||
}
|
||||
previousRow = previousRow.previousSibling;
|
||||
previousRow = previousRow.previousElementSibling;
|
||||
}
|
||||
if (previousRowColumnCount === columnCount) {
|
||||
prev = previousRow;
|
||||
|
|
@ -1839,16 +1948,20 @@
|
|||
let rects = getClientRects(node);
|
||||
let rect;
|
||||
left = 0;
|
||||
top = 0;
|
||||
for (var i = 0; i != rects.length; i++) {
|
||||
rect = rects[i];
|
||||
if (rect.width > 0 && (!left || rect.left > left)) {
|
||||
left = rect.left;
|
||||
}
|
||||
if (rect.height > 0 && (!top || rect.top > top)) {
|
||||
top = rect.top;
|
||||
}
|
||||
}
|
||||
|
||||
if (left >= end) {
|
||||
if (left >= end || top >= vEnd) {
|
||||
range = document.createRange();
|
||||
offset = this.textBreak(node, start, end);
|
||||
offset = this.textBreak(node, start, end, vStart, vEnd);
|
||||
if (!offset) {
|
||||
range = undefined;
|
||||
} else {
|
||||
|
|
@ -1859,7 +1972,7 @@
|
|||
}
|
||||
|
||||
// Skip children
|
||||
if (skip || right <= end) {
|
||||
if (skip || (right <= end && bottom <= vEnd)) {
|
||||
next = nodeAfter(node, rendered);
|
||||
if (next) {
|
||||
walker = walk$2(next, rendered);
|
||||
|
|
@ -1878,7 +1991,7 @@
|
|||
|
||||
}
|
||||
|
||||
findEndToken(rendered, source, bounds = this.bounds) {
|
||||
findEndToken(rendered, source) {
|
||||
if (rendered.childNodes.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -1920,10 +2033,12 @@
|
|||
return this.breakAt(after);
|
||||
}
|
||||
|
||||
textBreak(node, start, end) {
|
||||
textBreak(node, start, end, vStart, vEnd) {
|
||||
let wordwalker = words(node);
|
||||
let left = 0;
|
||||
let right = 0;
|
||||
let top = 0;
|
||||
let bottom = 0;
|
||||
let word, next, done, pos;
|
||||
let offset;
|
||||
while (!done) {
|
||||
|
|
@ -1939,13 +2054,15 @@
|
|||
|
||||
left = Math.floor(pos.left);
|
||||
right = Math.floor(pos.right);
|
||||
top = Math.floor(pos.top);
|
||||
bottom = Math.floor(pos.bottom);
|
||||
|
||||
if (left >= end) {
|
||||
if (left >= end || top >= vEnd) {
|
||||
offset = word.startOffset;
|
||||
break;
|
||||
}
|
||||
|
||||
if (right > end) {
|
||||
if (right > end || bottom > vEnd) {
|
||||
let letterwalker = letters(word);
|
||||
let letter, nextLetter, doneLetter;
|
||||
|
||||
|
|
@ -1960,8 +2077,9 @@
|
|||
|
||||
pos = getBoundingClientRect(letter);
|
||||
left = Math.floor(pos.left);
|
||||
top = Math.floor(pos.top);
|
||||
|
||||
if (left >= end) {
|
||||
if (left >= end || top >= vEnd) {
|
||||
offset = letter.startOffset;
|
||||
done = true;
|
||||
|
||||
|
|
@ -2060,7 +2178,7 @@
|
|||
|
||||
|
||||
area.style.columnWidth = Math.round(size.width) + "px";
|
||||
area.style.columnGap = "calc(var(--pagedjs-margin-right) + var(--pagedjs-margin-left))";
|
||||
area.style.columnGap = "calc(var(--pagedjs-margin-right) + var(--pagedjs-margin-left) + var(--pagedjs-bleed-right) + var(--pagedjs-bleed-left) + var(--pagedjs-column-gap-offset))";
|
||||
// area.style.overflow = "scroll";
|
||||
|
||||
this.width = Math.round(size.width);
|
||||
|
|
@ -2677,6 +2795,7 @@
|
|||
this.hooks.afterOverflowRemoved = new Hook(this);
|
||||
this.hooks.onBreakToken = new Hook();
|
||||
this.hooks.afterPageLayout = new Hook(this);
|
||||
this.hooks.finalizePage = new Hook(this);
|
||||
this.hooks.afterRendered = new Hook(this);
|
||||
|
||||
this.pages = [];
|
||||
|
|
@ -2883,12 +3002,14 @@
|
|||
this.emit("page", page);
|
||||
// await this.hooks.layout.trigger(page.element, page, undefined, this);
|
||||
await this.hooks.afterPageLayout.trigger(page.element, page, undefined, this);
|
||||
await this.hooks.finalizePage.trigger(page.element, page, undefined, this);
|
||||
this.emit("renderedPage", page);
|
||||
}
|
||||
}
|
||||
|
||||
async *layout(content, startAt) {
|
||||
let breakToken = startAt || false;
|
||||
let tokens = [];
|
||||
|
||||
while (breakToken !== undefined && (true)) {
|
||||
|
||||
|
|
@ -2906,7 +3027,20 @@
|
|||
// Layout content in the page, starting from the breakToken
|
||||
breakToken = await page.layout(content, breakToken, this.maxChars);
|
||||
|
||||
if (breakToken) {
|
||||
let newToken = breakToken.toJSON(true);
|
||||
if (tokens.lastIndexOf(newToken) > -1) {
|
||||
// loop
|
||||
let err = new OverflowContentError("Layout repeated", [breakToken.node]);
|
||||
console.error("Layout repeated at: ", breakToken.node);
|
||||
return err;
|
||||
} else {
|
||||
tokens.push(newToken);
|
||||
}
|
||||
}
|
||||
|
||||
await this.hooks.afterPageLayout.trigger(page.element, page, breakToken, this);
|
||||
await this.hooks.finalizePage.trigger(page.element, page, undefined, this);
|
||||
this.emit("renderedPage", page);
|
||||
|
||||
this.recoredCharLength(page.wrapper.textContent.length);
|
||||
|
|
@ -3077,6 +3211,7 @@
|
|||
}
|
||||
|
||||
await this.hooks.afterPageLayout.trigger(page.element, page, undefined, this);
|
||||
await this.hooks.finalizePage.trigger(page.element, page, undefined, this);
|
||||
this.emit("renderedPage", page);
|
||||
}
|
||||
|
||||
|
|
@ -26299,9 +26434,10 @@
|
|||
|
||||
insertRule(rule) {
|
||||
let inserted = this.ast.children.appendData(rule);
|
||||
inserted.forEach((item) => {
|
||||
this.declarations(item);
|
||||
});
|
||||
|
||||
this.declarations(rule);
|
||||
|
||||
return inserted;
|
||||
}
|
||||
|
||||
urls(ast) {
|
||||
|
|
@ -26342,7 +26478,6 @@
|
|||
lib.walk(ast, {
|
||||
visit: "Rule",
|
||||
enter: (ruleNode, ruleItem, rulelist) => {
|
||||
// console.log("rule", ruleNode);
|
||||
|
||||
this.hooks.onRule.trigger(ruleNode, ruleItem, rulelist);
|
||||
this.declarations(ruleNode, ruleItem, rulelist);
|
||||
|
|
@ -26356,7 +26491,6 @@
|
|||
lib.walk(ruleNode, {
|
||||
visit: "Declaration",
|
||||
enter: (declarationNode, dItem, dList) => {
|
||||
// console.log(declarationNode);
|
||||
|
||||
this.hooks.onDeclaration.trigger(declarationNode, dItem, dList, {ruleNode, ruleItem, rulelist});
|
||||
|
||||
|
|
@ -26583,6 +26717,7 @@
|
|||
--pagedjs-page-count: 0;
|
||||
--pagedjs-page-counter-increment: 1;
|
||||
--pagedjs-footnotes-count: 0;
|
||||
--pagedjs-column-gap-offset: 1000px;
|
||||
}
|
||||
|
||||
@page {
|
||||
|
|
@ -26981,13 +27116,20 @@
|
|||
counter-reset: unset;
|
||||
}
|
||||
|
||||
[data-footnote-marker]:not([data-split-from]) {
|
||||
counter-increment: footnote-marker;
|
||||
[data-footnote-marker] {
|
||||
text-indent: 0;
|
||||
display: list-item;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
[data-footnote-marker][data-split-from] {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
[data-footnote-marker]:not([data-split-from]) {
|
||||
counter-increment: footnote-marker;
|
||||
}
|
||||
|
||||
[data-footnote-marker]::marker {
|
||||
content: counter(footnote-marker) ". ";
|
||||
}
|
||||
|
|
@ -27607,7 +27749,8 @@
|
|||
backgroundOrigin: undefined,
|
||||
block: {},
|
||||
marks: undefined,
|
||||
notes: undefined
|
||||
notes: undefined,
|
||||
added: false
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -27635,6 +27778,8 @@
|
|||
page = this.pages[selector];
|
||||
marginalia = this.replaceMarginalia(node);
|
||||
needsMerge = true;
|
||||
// Mark page for getting classes added again
|
||||
page.added = false;
|
||||
} else {
|
||||
page = this.pageModel(selector);
|
||||
marginalia = this.replaceMarginalia(node);
|
||||
|
|
@ -27754,9 +27899,11 @@
|
|||
*/
|
||||
|
||||
afterTreeWalk(ast, sheet) {
|
||||
let dirtyPage = "*" in this.pages && this.pages["*"].added === false;
|
||||
|
||||
this.addPageClasses(this.pages, ast, sheet);
|
||||
|
||||
if ("*" in this.pages) {
|
||||
if (dirtyPage) {
|
||||
let width = this.pages["*"].width;
|
||||
let height = this.pages["*"].height;
|
||||
let format = this.pages["*"].format;
|
||||
|
|
@ -28202,41 +28349,48 @@
|
|||
|
||||
addPageClasses(pages, ast, sheet) {
|
||||
// First add * page
|
||||
if ("*" in pages) {
|
||||
if ("*" in pages && pages["*"].added === false) {
|
||||
let p = this.createPage(pages["*"], ast.children, sheet);
|
||||
sheet.insertRule(p);
|
||||
pages["*"].added = true;
|
||||
}
|
||||
// Add :left & :right
|
||||
if (":left" in pages) {
|
||||
if (":left" in pages && pages[":left"].added === false) {
|
||||
let left = this.createPage(pages[":left"], ast.children, sheet);
|
||||
sheet.insertRule(left);
|
||||
pages[":left"].added = true;
|
||||
}
|
||||
if (":right" in pages) {
|
||||
if (":right" in pages && pages[":right"].added === false) {
|
||||
let right = this.createPage(pages[":right"], ast.children, sheet);
|
||||
sheet.insertRule(right);
|
||||
pages[":right"].added = true;
|
||||
}
|
||||
// Add :first & :blank
|
||||
if (":first" in pages) {
|
||||
if (":first" in pages && pages[":first"].added === false) {
|
||||
let first = this.createPage(pages[":first"], ast.children, sheet);
|
||||
sheet.insertRule(first);
|
||||
pages[":first"].added = true;
|
||||
}
|
||||
if (":blank" in pages) {
|
||||
if (":blank" in pages && pages[":blank"].added === false) {
|
||||
let blank = this.createPage(pages[":blank"], ast.children, sheet);
|
||||
sheet.insertRule(blank);
|
||||
pages[":blank"].added = true;
|
||||
}
|
||||
// Add nth pages
|
||||
for (let pg in pages) {
|
||||
if (pages[pg].nth) {
|
||||
if (pages[pg].nth && pages[pg].added === false) {
|
||||
let nth = this.createPage(pages[pg], ast.children, sheet);
|
||||
sheet.insertRule(nth);
|
||||
pages[pg].added = true;
|
||||
}
|
||||
}
|
||||
|
||||
// Add named pages
|
||||
for (let pg in pages) {
|
||||
if (pages[pg].name) {
|
||||
if (pages[pg].name && pages[pg].added === false) {
|
||||
let named = this.createPage(pages[pg], ast.children, sheet);
|
||||
sheet.insertRule(named);
|
||||
pages[pg].added = true;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -29220,15 +29374,20 @@
|
|||
}
|
||||
|
||||
addPageAttributes(page, start, pages) {
|
||||
let named = start.dataset.page;
|
||||
let namedPages = [start.dataset.page];
|
||||
|
||||
if (named) {
|
||||
page.name = named;
|
||||
page.element.classList.add("pagedjs_named_page");
|
||||
page.element.classList.add("pagedjs_" + named + "_page");
|
||||
if (namedPages && namedPages.length) {
|
||||
for (const named of namedPages) {
|
||||
if (!named) {
|
||||
continue;
|
||||
}
|
||||
page.name = named;
|
||||
page.element.classList.add("pagedjs_named_page");
|
||||
page.element.classList.add("pagedjs_" + named + "_page");
|
||||
|
||||
if (!start.dataset.splitFrom) {
|
||||
page.element.classList.add("pagedjs_" + named + "_first_page");
|
||||
if (!start.dataset.splitFrom) {
|
||||
page.element.classList.add("pagedjs_" + named + "_first_page");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -29274,7 +29433,7 @@
|
|||
// page.element.querySelector('.paged_area').style.color = red;
|
||||
}
|
||||
|
||||
afterPageLayout(fragment, page, breakToken, chunker) {
|
||||
finalizePage(fragment, page, breakToken, chunker) {
|
||||
for (let m in this.marginalia) {
|
||||
let margin = this.marginalia[m];
|
||||
let sels = m.split(" ");
|
||||
|
|
@ -29908,21 +30067,45 @@
|
|||
onAtMedia(node, item, list) {
|
||||
let media = this.getMediaName(node);
|
||||
let rules;
|
||||
|
||||
if (media === "print") {
|
||||
if (media.includes("print")) {
|
||||
rules = node.block.children;
|
||||
|
||||
// Remove rules from the @media block
|
||||
node.block.children = new lib.List();
|
||||
// Append rules to the end of main rules list
|
||||
// TODO: this isn't working right, needs to check what is in the prelude
|
||||
/*
|
||||
rules.forEach((selectList) => {
|
||||
if (selectList.prelude) {
|
||||
selectList.prelude.children.forEach((rule) => {
|
||||
|
||||
rule.children.prependData({
|
||||
type: "Combinator",
|
||||
name: " "
|
||||
});
|
||||
|
||||
rule.children.prependData({
|
||||
type: "ClassSelector",
|
||||
name: "pagedjs_page"
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
list.insertList(rules, item);
|
||||
*/
|
||||
|
||||
// Append rules to the end of main rules list
|
||||
list.appendList(rules);
|
||||
|
||||
// Remove rules from the @media block
|
||||
list.remove(item);
|
||||
} else if (!media.includes("all") && !media.includes("pagedjs-ignore")) {
|
||||
list.remove(item);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
getMediaName(node) {
|
||||
let media = "";
|
||||
let media = [];
|
||||
|
||||
if (typeof node.prelude === "undefined" ||
|
||||
node.prelude.type !== "AtrulePrelude" ) {
|
||||
|
|
@ -29932,7 +30115,7 @@
|
|||
lib.walk(node.prelude, {
|
||||
visit: "Identifier",
|
||||
enter: (identNode, iItem, iList) => {
|
||||
media = identNode.name;
|
||||
media.push(identNode.name);
|
||||
}
|
||||
});
|
||||
return media;
|
||||
|
|
@ -31143,9 +31326,9 @@
|
|||
}
|
||||
|
||||
var pagedMediaHandlers = [
|
||||
PrintMedia,
|
||||
AtPage,
|
||||
Breaks,
|
||||
PrintMedia,
|
||||
Splits,
|
||||
Counters,
|
||||
Lists,
|
||||
|
|
@ -31242,18 +31425,16 @@
|
|||
afterPageLayout(fragment) {
|
||||
for (let name of Object.keys(this.runningSelectors)) {
|
||||
let set = this.runningSelectors[name];
|
||||
if (!set.first) {
|
||||
let selected = fragment.querySelector(set.selector);
|
||||
if (selected) {
|
||||
// let cssVar;
|
||||
if (set.identifier === "running") {
|
||||
// cssVar = selected.textContent.replace(/\\([\s\S])|(["|'])/g,"\\$1$2");
|
||||
// this.styleSheet.insertRule(`:root { --string-${name}: "${cssVar}"; }`, this.styleSheet.cssRules.length);
|
||||
// fragment.style.setProperty(`--string-${name}`, `"${cssVar}"`);
|
||||
set.first = selected;
|
||||
} else {
|
||||
console.warn(set.value + "needs css replacement");
|
||||
}
|
||||
let selected = fragment.querySelector(set.selector);
|
||||
if (selected) {
|
||||
// let cssVar;
|
||||
if (set.identifier === "running") {
|
||||
// cssVar = selected.textContent.replace(/\\([\s\S])|(["|'])/g,"\\$1$2");
|
||||
// this.styleSheet.insertRule(`:root { --string-${name}: "${cssVar}"; }`, this.styleSheet.cssRules.length);
|
||||
// fragment.style.setProperty(`--string-${name}`, `"${cssVar}"`);
|
||||
set.first = selected;
|
||||
} else {
|
||||
console.warn(set.value + "needs css replacement");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -31404,7 +31585,7 @@
|
|||
|
||||
this.stringSetSelectors = {};
|
||||
this.type;
|
||||
// pageLastString = last string variable defined on the page
|
||||
// pageLastString = last string variable defined on the page
|
||||
this.pageLastString;
|
||||
|
||||
}
|
||||
|
|
@ -31413,21 +31594,35 @@
|
|||
if (declaration.property === "string-set") {
|
||||
let selector = lib.generate(rule.ruleNode.prelude);
|
||||
|
||||
let identifier = declaration.value.children.first().name;
|
||||
let identifiers = [];
|
||||
let functions = [];
|
||||
let values = [];
|
||||
|
||||
let value;
|
||||
lib.walk(declaration, {
|
||||
visit: "Function",
|
||||
enter: (node, item, list) => {
|
||||
value = lib.generate(node);
|
||||
declaration.value.children.forEach((child) => {
|
||||
if (child.type === "Identifier") {
|
||||
identifiers.push(child.name);
|
||||
}
|
||||
if (child.type === "Function") {
|
||||
functions.push(child.name);
|
||||
child.children.forEach((subchild) => {
|
||||
if (subchild.type === "Identifier") {
|
||||
values.push(subchild.name);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
this.stringSetSelectors[identifier] = {
|
||||
identifier,
|
||||
value,
|
||||
selector
|
||||
};
|
||||
identifiers.forEach((identifier, index) => {
|
||||
let func = functions[index];
|
||||
let value = values[index];
|
||||
this.stringSetSelectors[identifier] = {
|
||||
identifier,
|
||||
func,
|
||||
value,
|
||||
selector
|
||||
};
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -31467,11 +31662,13 @@
|
|||
{
|
||||
this.pageLastString = {};
|
||||
}
|
||||
|
||||
|
||||
|
||||
for (let name of Object.keys(this.stringSetSelectors)) {
|
||||
|
||||
let set = this.stringSetSelectors[name];
|
||||
let value = set.value;
|
||||
let func = set.func;
|
||||
let selected = fragment.querySelectorAll(set.selector);
|
||||
|
||||
// Get the last found string for the current identifier
|
||||
|
|
@ -31489,18 +31686,36 @@
|
|||
|
||||
selected.forEach((sel) => {
|
||||
// push each content into the array to define in the variable the first and the last element of the page.
|
||||
this.pageLastString[name] = selected[selected.length - 1].textContent;
|
||||
|
||||
if (func === "content") {
|
||||
this.pageLastString[name] = selected[selected.length - 1].textContent;
|
||||
}
|
||||
|
||||
if (func === "attr") {
|
||||
this.pageLastString[name] = selected[selected.length - 1].getAttribute(value) || "";
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
/* FIRST */
|
||||
|
||||
varFirst = selected[0].textContent;
|
||||
if (func === "content") {
|
||||
varFirst = selected[0].textContent;
|
||||
}
|
||||
|
||||
if (func === "attr") {
|
||||
varFirst = selected[0].getAttribute(value) || "";
|
||||
}
|
||||
|
||||
|
||||
/* LAST */
|
||||
|
||||
varLast = selected[selected.length - 1].textContent;
|
||||
if (func === "content") {
|
||||
varLast = selected[selected.length - 1].textContent;
|
||||
}
|
||||
|
||||
if (func === "attr") {
|
||||
varLast = selected[selected.length - 1].getAttribute(value) || "";
|
||||
}
|
||||
|
||||
|
||||
/* START */
|
||||
|
|
@ -32703,9 +32918,9 @@
|
|||
|
||||
removeStyles(doc=document) {
|
||||
// Get all stylesheets
|
||||
const stylesheets = Array.from(doc.querySelectorAll("link[rel='stylesheet']"));
|
||||
const stylesheets = Array.from(doc.querySelectorAll("link[rel='stylesheet']:not([data-pagedjs-ignore], [media~='screen'])"));
|
||||
// Get inline styles
|
||||
const inlineStyles = Array.from(doc.querySelectorAll("style:not([data-pagedjs-inserted-styles])"));
|
||||
const inlineStyles = Array.from(doc.querySelectorAll("style:not([data-pagedjs-inserted-styles], [data-pagedjs-ignore], [media~='screen'])"));
|
||||
const elements = [...stylesheets, ...inlineStyles];
|
||||
return elements
|
||||
// preserve order
|
||||
|
|
@ -32779,6 +32994,7 @@
|
|||
Polisher: Polisher,
|
||||
Previewer: Previewer,
|
||||
Handler: Handler,
|
||||
registeredHandlers: registeredHandlers,
|
||||
registerHandlers: registerHandlers,
|
||||
initializeHandlers: initializeHandlers
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue