import { Handler } from '/csspageweaver/lib/paged.esm.js'; export default class snapToBaseline extends Handler { constructor(chunker, polisher, caller) { super(chunker, polisher, caller); this.baseline; } beforeParsed(content){ this.baseline = parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--baseline').trim()); content.querySelectorAll('blockquote').forEach((bq) => { const prev = bq.previousElementSibling; if (!prev || prev.nodeName !== 'P') { bq.style.color = 'red'; } }); } renderNode(node, sourceNode){ if (node.nodeName === 'P') { this.baseline = parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--baseline').trim()); if (!shouldSnap(node)) return node; const area = node.closest('.pagedjs_area'); if (area) { const areaRect = area.getBoundingClientRect(); const nodeRect = node.getBoundingClientRect(); const relativeTop = nodeRect.top - areaRect.top; const modulo = relativeTop % this.baseline; if (modulo !== 0) { node.style.paddingTop = (this.baseline - modulo) + 'px'; } } return node; } } afterPageLayout(pageElement, page, breakToken){ const area = pageElement.querySelector('.pagedjs_area'); if (!area) return; const areaRect = area.getBoundingClientRect(); const paragraphs = pageElement.querySelectorAll('p'); paragraphs.forEach((node) => { const nodeRect = node.getBoundingClientRect(); if (nodeRect.bottom < areaRect.bottom - this.baseline) return; if (!shouldSnap(node)) return; const relativeTop = nodeRect.top - areaRect.top; const modulo = relativeTop % this.baseline; if (modulo !== 0) { node.style.paddingTop = (this.baseline - modulo) + 'px'; } }); } } function shouldSnap(node) { return !node.closest('blockquote'); }