diff --git a/assets/css/main.css b/assets/css/main.css index 8329496..892b00b 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -137,6 +137,50 @@ figure[data-crop="false"] img { column-width: auto!important; } +.print-image{ + position: relative; +} + +.print-image div{ + position: absolute; + top: 0; + left: 0; + mix-blend-mode: multiply; + vertical-align: top; +} + +.print-image figcaption{ + position: absolute; + bottom: 0; +} + +.print-image .print-red{ + background: var(--rouge); +} + +.print-image .print-green{ + background: var(--vert); +} + +.print-image .print-blue{ + background: var(--bleu); +} + +.print-image > div > img{ + mix-blend-mode: screen; + -webkit-filter: grayscale(100%) contrast(200%); + filter: grayscale(100%) contrast(200%); + opacity: 1; +} + +body[data-template="print"] .print-image { + display: block; +} + +body[data-template="print"] .web-image { + display: none; +} + table { border-collapse: collapse; width: 100%; @@ -182,6 +226,28 @@ td:last-child{ } +/* Gestion des couches */ +body.isolate-red-layer .green-layer, +body.isolate-red-layer .blue-layer, +body.isolate-red-layer .black-layer { display: none; } + +body.isolate-green-layer .red-layer, +body.isolate-green-layer .blue-layer, +body.isolate-green-layer .black-layer { display: none; } + +body.isolate-blue-layer .red-layer, +body.isolate-blue-layer .green-layer, +body.isolate-blue-layer .black-layer { display: none; } + +body.isolate-black-layer .red-layer, +body.isolate-black-layer .green-layer, +body.isolate-black-layer .blue-layer { display: none; } + +/* Noir et blanc */ +body.mode-black .print-image > div { + background: transparent; +} + /* fade entre les pages */ #fade{ opacity: 0; diff --git a/assets/css/variables.css b/assets/css/variables.css index 5ce72cb..1c83404 100644 --- a/assets/css/variables.css +++ b/assets/css/variables.css @@ -4,5 +4,9 @@ --fontFamily: sans-serif; --textSize: 17px; --ratio : auto; + + --rouge: #ff665e; + --vert: #44d62c; + --bleu: #0078bf; } \ No newline at end of file diff --git a/assets/pagedjs/interface-header.css b/assets/pagedjs/interface-header.css index 10119a6..275ff05 100644 --- a/assets/pagedjs/interface-header.css +++ b/assets/pagedjs/interface-header.css @@ -156,7 +156,7 @@ #interface-header { all: initial; - /*display: none;*/ + display: none; } #interface-header * { all: unset; @@ -191,17 +191,15 @@ --border-color: #999; --backgroung-button: rgb(195, 195, 195); color: var(--color-interface-header); - border: 1px solid magenta; + border: 1px solid black; position: fixed; top: 20px; left: 20px; z-index: 99999; font-size: 11px; -/* display: flex; - justify-content: space-between; - align-items: center;*/ + display: block; padding: 10px; - font-family: "IBM Plex Mono"; + font-family: sans-serif; } #interface-header input[type="checkbox"] { @@ -297,10 +295,10 @@ form { /* BUTTONS GROUP */ -#header-group-right { +/*#header-group-right { display: flex; align-items: center; -} +}*/ #header-group-right > p { margin-right: 5ch !important; @@ -320,52 +318,42 @@ form { line-height: 1em !important; } -#buttons { - display: flex; - justify-content: flex-end; - /* width: 300px; */ +#preview-form, +#black-form{ + margin-bottom: 20px; + display: block; } -#button-print { - width: 60px; - opacity: 0.2; - background: none; - outline: none; -} - -#label-preview-toggle img { - width: 80%; - height: 80%; -} #label-preview-toggle, -#button-print { - --buttons-size: 36px; - display: flex; - align-items: center; - justify-content: center; - width: var(--buttons-size); - height: var(--buttons-size); - margin-right: 10px; +#label-black-toggle, +#button-print, +#button-print-spread, +#quality-toggle { border: 1px solid var(--color-interface-header); border-radius: 2px; cursor: pointer; -/* box-shadow: 1px 1px 0px 0px #9f9f9f;*/ - padding: 0; - box-sizing: border-box; -} - -.interface-preview #label-preview-toggle { - border: 2px solid var(--color-interface-header); -} - -#button-print { + box-shadow: 1px 1px 0px 0px #9f9f9f; padding: 6px; + box-sizing: border-box; + margin-top: 10px; +} + +.interface-preview #label-preview-toggle, +.mode-black #label-black-toggle{ + background-color: #000; + color: #FFF; + /*border: 2px solid var(--color-interface-header);*/ } #label-preview-toggle:hover, -#button-print:hover { - background-color: var(--backgroung-button); +#label-black-toggle:hover, +#button-print:hover, +#button-print-spread:hover, +#quality-toggle:hover { + background-color: #000; + color: #FFF; + /*background-color: var(--backgroung-button);*/ } #button-print[data-ready="true"] { @@ -373,6 +361,53 @@ form { cursor: pointer; } + +/* LAYER SELECTOR --------------------------------------- */ + +#layer-form { + margin-bottom: 20px; + display: block; +} + +#layer-select { + width: 100%; + background-color: transparent; + border: 1px solid var(--color-interface-header); + border-radius: 2px; + padding: 6px; + box-sizing: border-box; + cursor: pointer; + box-shadow: 1px 1px 0px 0px #9f9f9f; + margin-top: 10px; + font-family: sans-serif; + font-size: 11px; + color: var(--color-interface-header); + appearance: none; + -webkit-appearance: none; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23222'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: right 8px center; + padding-right: 24px; +} + +#layer-select:hover { + background-color: #000; + color: #FFF; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23FFF'/%3E%3C/svg%3E"); + box-shadow: 1px 1px 0px 0px #9f9f9f; +} + +#layer-select:focus { + outline: none; +} + +/* État actif quand une couche est isolée */ +body[class*="isolate-"] #layer-select { + background-color: #000; + color: #FFF; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23FFF'/%3E%3C/svg%3E"); +} + @media print { #interface-header { display: none; diff --git a/assets/pagedjs/interface.html b/assets/pagedjs/interface.html index 11088ad..99d5984 100644 --- a/assets/pagedjs/interface.html +++ b/assets/pagedjs/interface.html @@ -8,7 +8,7 @@
- +
@@ -26,17 +26,37 @@
-

pages

+
+ + +
+
+
+
+ +
+
diff --git a/assets/pagedjs/interface.js b/assets/pagedjs/interface.js index 0b9842c..76937cc 100644 --- a/assets/pagedjs/interface.js +++ b/assets/pagedjs/interface.js @@ -135,6 +135,55 @@ function interfaceEvents(){ body.classList.remove('interface-preview'); } }); + + + /* LAYER SELECTOR ------------------------------------------------------------*/ + document.querySelector("#layer-select").addEventListener("change", (e) => { + const layers = ["red-layer", "green-layer", "blue-layer", "black-layer"]; + const selected = e.target.value; + + layers.forEach(layer => { + body.classList.remove("isolate-" + layer); + }); + + if (selected) { + body.classList.add("isolate-" + selected); + // Active automatiquement le mode noir et blanc + body.classList.add("mode-black"); + document.querySelector("#black-toggle").checked = true; + } else { + // Repasse en couleur si on revient sur "Toutes" + body.classList.remove("mode-black"); + document.querySelector("#black-toggle").checked = false; + } + }); + + + /* Passer le PDF en noir et blanc ---------------------------------------------------------------------------------------------------- + ----------------------------------------------------------------------------------------------------------------*/ + + + document.querySelector("#black-toggle").addEventListener("input", (e) => { + if(e.target.checked){ + /* black mode */ + body.classList.add('mode-black'); + }else{ + body.classList.remove('mode-black'); + } + }); + + + /* PRINT SPREAD ---------------------------------------------------------------------------------------------------- + ----------------------------------------------------------------------------------------------------------------*/ + + window.enableBooklet = false; + document.querySelector("#button-print-spread").addEventListener("click", (e) => { + // not working + // body.style.setProperty("--paged-layout", "booklet"); + // window.print(); + window.enableBooklet = true; + window.print(); + }); } @@ -177,8 +226,8 @@ class interfacePaged extends Paged.Handler { afterPageLayout(pageElement, page, breakToken){ let nbr = page.id.replace('page-', ''); - let span = document.querySelector("#nrb-pages"); - span.innerHTML = nbr; + // let span = document.querySelector("#nrb-pages"); + // span.innerHTML = nbr; } @@ -187,5 +236,4 @@ class interfacePaged extends Paged.Handler { print.dataset.ready = 'true'; } } -Paged.registerHandlers(interfacePaged); - +Paged.registerHandlers(interfacePaged); \ No newline at end of file diff --git a/assets/pagedjs/paged-new.js b/assets/pagedjs/paged-new.js deleted file mode 100644 index 0c3e250..0000000 --- a/assets/pagedjs/paged-new.js +++ /dev/null @@ -1,34388 +0,0 @@ -/** - * @license Paged.js v0.5.0-beta.2 | MIT | https://gitlab.coko.foundation/pagedjs/pagedjs - */ - -(function (global, factory) { - typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : - typeof define === 'function' && define.amd ? define(['exports'], factory) : - (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Paged = {})); -})(this, (function (exports) { 'use strict'; - - function getBoundingClientRect(element) { - if (!element) { - return; - } - let rect; - if (typeof element.getBoundingClientRect !== "undefined") { - rect = element.getBoundingClientRect(); - } else { - let range = document.createRange(); - range.selectNode(element); - rect = range.getBoundingClientRect(); - } - return rect; - } - - /** - * Generates a UUID - * based on: http://stackoverflow.com/questions/105034/how-to-create-a-guid-uuid-in-javascript - * @returns {string} uuid - */ - function UUID() { - var d = new Date().getTime(); - if (typeof performance !== "undefined" && typeof performance.now === "function") { - d += performance.now(); //use high-precision timer if available - } - return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) { - var r = (d + Math.random() * 16) % 16 | 0; - d = Math.floor(d / 16); - return (c === "x" ? r : (r & 0x3 | 0x8)).toString(16); - }); - } - - function attr(element, attributes) { - for (var i = 0; i < attributes.length; i++) { - if (element.hasAttribute(attributes[i])) { - return element.getAttribute(attributes[i]); - } - } - } - - /* Based on by https://mths.be/cssescape v1.5.1 by @mathias | MIT license - * Allows # and . - */ - function querySelectorEscape(value) { - if (arguments.length == 0) { - throw new TypeError("`CSS.escape` requires an argument."); - } - var string = String(value); - - var length = string.length; - var index = -1; - var codeUnit; - var result = ""; - var firstCodeUnit = string.charCodeAt(0); - while (++index < length) { - codeUnit = string.charCodeAt(index); - - - - // Note: there’s no need to special-case astral symbols, surrogate - // pairs, or lone surrogates. - - // If the character is NULL (U+0000), then the REPLACEMENT CHARACTER - // (U+FFFD). - if (codeUnit == 0x0000) { - result += "\uFFFD"; - continue; - } - - if ( - // If the character is in the range [\1-\1F] (U+0001 to U+001F) or is - // U+007F, […] - (codeUnit >= 0x0001 && codeUnit <= 0x001F) || codeUnit == 0x007F || - // If the character is the first character and is in the range [0-9] - // (U+0030 to U+0039), […] - (index == 0 && codeUnit >= 0x0030 && codeUnit <= 0x0039) || - // If the character is the second character and is in the range [0-9] - // (U+0030 to U+0039) and the first character is a `-` (U+002D), […] - ( - index == 1 && - codeUnit >= 0x0030 && codeUnit <= 0x0039 && - firstCodeUnit == 0x002D - ) - ) { - // https://drafts.csswg.org/cssom/#escape-a-character-as-code-point - result += "\\" + codeUnit.toString(16) + " "; - continue; - } - - if ( - // If the character is the first character and is a `-` (U+002D), and - // there is no second character, […] - index == 0 && - length == 1 && - codeUnit == 0x002D - ) { - result += "\\" + string.charAt(index); - continue; - } - - // support for period character in id - if (codeUnit == 0x002E) { - if (string.charAt(0) == "#") { - result += "\\."; - continue; - } - } - - - // If the character is not handled by one of the above rules and is - // greater than or equal to U+0080, is `-` (U+002D) or `_` (U+005F), or - // is in one of the ranges [0-9] (U+0030 to U+0039), [A-Z] (U+0041 to - // U+005A), or [a-z] (U+0061 to U+007A), […] - if ( - codeUnit >= 0x0080 || - codeUnit == 0x002D || - codeUnit == 0x005F || - codeUnit == 35 || // Allow # - codeUnit == 46 || // Allow . - codeUnit >= 0x0030 && codeUnit <= 0x0039 || - codeUnit >= 0x0041 && codeUnit <= 0x005A || - codeUnit >= 0x0061 && codeUnit <= 0x007A - ) { - // the character itself - result += string.charAt(index); - continue; - } - - // Otherwise, the escaped character. - // https://drafts.csswg.org/cssom/#escape-a-character - result += "\\" + string.charAt(index); - - } - return result; - } - - /** - * Creates a new pending promise and provides methods to resolve or reject it. - * From: https://developer.mozilla.org/en-US/docs/Mozilla/JavaScript_code_modules/Promise.jsm/Deferred#backwards_forwards_compatible - * @returns {object} defered - */ - function defer() { - this.resolve = null; - - this.reject = null; - - this.id = UUID(); - - this.promise = new Promise((resolve, reject) => { - this.resolve = resolve; - this.reject = reject; - }); - Object.freeze(this); - } - - const requestIdleCallback = typeof window !== "undefined" && ("requestIdleCallback" in window ? window.requestIdleCallback : window.requestAnimationFrame); - - function CSSValueToString(obj) { - return obj.value + (obj.unit || ""); - } - - function isElement(node) { - - return node && node.nodeType === 1; - } - - function isText(node) { - return node && node.nodeType === 3; - } - - function* walk$2(start, limiter) { - let node = start; - - while (node) { - - yield node; - - if (node.childNodes.length) { - node = node.firstChild; - } else if (node.nextSibling) { - if (limiter && node === limiter) { - node = undefined; - break; - } - node = node.nextSibling; - } else { - while (node) { - node = node.parentNode; - if (limiter && node === limiter) { - node = undefined; - break; - } - if (node && node.nextSibling) { - node = node.nextSibling; - break; - } - - } - } - } - } - - function nodeAfter(node, limiter, descend = false) { - if (limiter && node === limiter) { - return; - } - if (descend && node.childNodes.length) { - let child = node.firstChild; - if (isIgnorable(child)) { - child = nextSignificantNode(child); - } - if (child) { - return child; - } - } - let significantNode = nextSignificantNode(node); - if (significantNode) { - return significantNode; - } - if (node.parentNode) { - while ((node = node.parentNode)) { - if (limiter && node === limiter) { - return; - } - significantNode = nextSignificantNode(node); - if (significantNode) { - return significantNode; - } - } - } - } - - function findLastSignificantDescendant(node) { - let done = false; - - while (!done) { - let child = node.lastChild; - if (child && isIgnorable(child)) { - child = previousSignificantNode(child); - } - if (child && isElement(child)) { - node = child; - } - else { - done = true; - } - } - - return node; - } - - function nodeBefore(node, limiter, descend = false) { - do { - if (limiter && node === limiter) { - return; - } - - let significantNode = previousSignificantNode(node); - if (significantNode) { - if (descend) { - significantNode = findLastSignificantDescendant(significantNode); - } - return significantNode; - } - - node = node.parentNode; - } while (node); - } - - function elementAfter(node, limiter, descend = false) { - let after = nodeAfter(node, limiter, descend); - - while (after && after.nodeType !== 1) { - after = nodeAfter(after, limiter, descend); - } - - return after; - } - - function elementBefore(node, limiter, descend = false) { - let before = nodeBefore(node, limiter, descend); - - while (before && before.nodeType !== 1) { - before = nodeBefore(before, limiter, descend); - } - - return before; - } - - function displayedElementAfter(node, limiter, descend = false) { - let after = elementAfter(node, limiter, descend); - - while (after && after.dataset.undisplayed) { - after = elementAfter(after, limiter, descend); - } - - return after; - } - - function displayedElementBefore(node, limiter, descend = false) { - let before = elementBefore(node, limiter, descend); - - while (before && before.dataset.undisplayed) { - before = elementBefore(before, limiter, descend); - } - - return before; - } - - function copyWidth(originalElement, destElement) { - let originalStyle = getComputedStyle(originalElement); - let bounds = getBoundingClientRect(originalElement); - let width = parseInt(originalStyle.width || bounds.width); - if (width) { - destElement.style.width = width + 'px'; - } - } - - function rebuildTableRow(node, alreadyRendered, existingChildren) { - let currentCol = 0, maxCols = 0, nextInitialColumn = 0; - let rebuilt = node.cloneNode(false); - const initialColumns = Array.from(node.children); - - // Find the max number of columns. - let earlierRow = node.parentElement.children[0]; - while (earlierRow && earlierRow !== node) { - if (earlierRow.children.length > maxCols) { - maxCols = earlierRow.children.length; - } - earlierRow = earlierRow.nextElementSibling; - } - - if (!maxCols) { - let existing = findElement(node, alreadyRendered); - maxCols = existing?.children.length || 0; - } - - // The next td to use in each tr. - // Doesn't take account of rowspans above that might make extra columns. - let rowOffsets = Array(maxCols).fill(0); - - // Duplicate rowspans and our initial columns. - while (currentCol < maxCols) { - let earlierRow = node.parentElement.children[0]; - let rowspan, column; - // Find the nth column we'll duplicate (rowspan) or use. - while (earlierRow && earlierRow !== node) { - if (rowspan == undefined) { - column = earlierRow.children[currentCol - rowOffsets[nextInitialColumn]]; - if (column && column.rowSpan !== undefined && column.rowSpan > 1) { - rowspan = column.rowSpan; - } - } - // If rowspan === 0 the entire remainder of the table row is used. - if (rowspan) { - // Tracking how many rows in the overflow. - if (rowspan < 2) { - rowspan = undefined; - } - else { - rowspan--; - } - } - earlierRow = earlierRow.nextElementSibling; - } - - let destColumn; - if (rowspan) { - if (!existingChildren) { - destColumn = column.cloneNode(false); - // Adjust rowspan value. - destColumn.rowSpan = !column.rowSpan ? 0 : rowspan; - } - } else { - // Fill the gap with the initial columns (if exists). - destColumn = column = initialColumns[nextInitialColumn++]?.cloneNode(false); - } - if (column && destColumn) { - if (alreadyRendered) { - let existing = findElement(column, alreadyRendered); - if (existing) { - column = existing; - } - } - copyWidth(column, destColumn); - if (destColumn) { - rebuilt.appendChild(destColumn); - } - } - currentCol++; - } - return rebuilt; - } - - function rebuildTree (node, fragment, alreadyRendered) { - let parent, subject; - let ancestors = []; - let added = []; - let dupSiblings = false; - let freshPage = !fragment; - let numListItems = 0; - - if (!fragment) { - fragment = document.createDocumentFragment(); - } - - // Gather all ancestors - let element = node; - - if (!isText(node)) { - ancestors.unshift(node); - if (node.tagName == "LI") { - numListItems++; - } - } - while (element.parentNode && element.parentNode.nodeType === 1) { - ancestors.unshift(element.parentNode); - if (element.parentNode.tagName == "LI") { - numListItems++; - } - element = element.parentNode; - } - - for (var i = 0; i < ancestors.length; i++) { - subject = ancestors[i]; - - let container, split; - if (added.length) { - container = added[added.length - 1]; - } else { - container = fragment; - } - - if (subject.nodeName == "TR") { - parent = findElement(subject, container); - if (!parent) { - parent = rebuildTableRow(subject, alreadyRendered, container.childElementCount); - container.appendChild(parent); - } - } - else if (dupSiblings) { - let sibling = subject.parentElement ? subject.parentElement.children[0] : subject; - - while (sibling) { - let existing = findElement(sibling, container), siblingClone; - if (!existing) { - inIndexOfRefs(subject, alreadyRendered); - siblingClone = cloneNodeAncestor(sibling); - if (alreadyRendered) { - let originalElement = findElement(sibling, alreadyRendered); - if (originalElement) { - copyWidth(originalElement, siblingClone); - } - } - container.appendChild(siblingClone); - } - - if (sibling == subject) { - parent = siblingClone || existing; - } - sibling = sibling.nextElementSibling; - } - } else { - parent = findElement(subject, container); - if (!parent) { - parent = cloneNodeAncestor(subject); - if (alreadyRendered) { - let originalElement = findElement(subject, alreadyRendered); - if (originalElement) { - copyWidth(originalElement, parent); - - // Colgroup to clone? - Array.from(originalElement.children).forEach(child => { - if (child.tagName == "COLGROUP") { - parent.append(child.cloneNode(true)); - } - }); - } - } - container.appendChild(parent); - } - } - - if (subject.previousElementSibling?.nodeName == 'THEAD') { - // Clone the THEAD too. - let sibling = subject.previousElementSibling; - - let existing = findElement(sibling, container), siblingClone; - if (!existing) { - siblingClone = cloneNodeAncestor(sibling, true); - if (alreadyRendered) { - let originalElement = findElement(sibling, alreadyRendered); - if (originalElement) { - let walker = walk$2(siblingClone, siblingClone); - let next, pos, done; - while (!done) { - next = walker.next(); - pos = next.value; - done = next.done; - - if (isElement(pos)) { - originalElement = findElement(pos, alreadyRendered); - copyWidth(originalElement, pos); - - // I've tried to make the THEAD invisible; this is the best - // I could achieve. It gets a zero height but still somehow - // affects the container height by a couple of pixels in my - // testing. :( - // Next step is to change the "true" below to use a custom - // attribute that lets you control whether the header is shown. - { - pos.style.visibility = 'collapse'; - pos.style.marginTop = '0px'; - pos.style.marginBottom = '0px'; - pos.style.paddingTop = '0px'; - pos.style.paddingBottom = '0px'; - pos.style.borderTop = '0px'; - pos.style.borderBottom = '0px'; - pos.style.lineHeight = '0px'; - pos.style.opacity = 0; - } - } - } - } - } - container.insertBefore(siblingClone, container.firstChild); - } - - if (sibling == subject) { - parent = siblingClone || existing; - } - sibling = sibling.nextElementSibling; - } - - split = inIndexOfRefs(subject, alreadyRendered); - if (split) { - setSplit(split, parent); - } - - dupSiblings = (subject.dataset.clonesiblings == true || - ['grid', 'flex', 'table-row'].indexOf(subject.style.display) > -1); - added.push(parent); - - if (subject.tagName == "LI") { - numListItems--; - } - - if (freshPage && (isText(node) || numListItems)) { - // Flag the first node on the page so we can suppress list styles on - // a continued item and list item numbers except the list one - // if an item number should be printed. - parent.dataset.suppressListStyle = true; - } - } - - added = undefined; - return fragment; - } - - function setSplit(orig, clone) { - if (orig.dataset.splitTo) { - clone.setAttribute("data-split-from", clone.getAttribute("data-ref")); - } - - // This will let us split a table with multiple columns correctly. - orig.setAttribute("data-split-to", clone.getAttribute("data-ref")); - } - - function cloneNodeAncestor (node, deep=false) { - let result = node.cloneNode(deep); - - if (result.hasAttribute("id")) { - let dataID = result.getAttribute("id"); - result.setAttribute("data-id", dataID); - result.removeAttribute("id"); - } - - // This is handled by css :not, but also tidied up here - if (result.hasAttribute("data-break-before")) { - result.removeAttribute("data-break-before"); - } - - if (result.hasAttribute("data-previous-break-after")) { - result.removeAttribute("data-previous-break-after"); - } - - return result; - } - - function rebuildAncestors (node) { - let parent, ancestor; - let ancestors = []; - let added = []; - - let fragment = document.createDocumentFragment(); - - // Gather all ancestors - let element = node; - while(element.parentNode && element.parentNode.nodeType === 1) { - ancestors.unshift(element.parentNode); - element = element.parentNode; - } - - for (var i = 0; i < ancestors.length; i++) { - ancestor = ancestors[i]; - parent = ancestor.cloneNode(false); - - parent.setAttribute("data-split-from", parent.getAttribute("data-ref")); - - if (parent.hasAttribute("id")) { - let dataID = parent.getAttribute("id"); - parent.setAttribute("data-id", dataID); - parent.removeAttribute("id"); - } - - // This is handled by css :not, but also tidied up here - if (parent.hasAttribute("data-break-before")) { - parent.removeAttribute("data-break-before"); - } - - if (parent.hasAttribute("data-previous-break-after")) { - parent.removeAttribute("data-previous-break-after"); - } - - if (added.length) { - let container = added[added.length-1]; - container.appendChild(parent); - } else { - 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 = []; - let index = indexOf(cutElement); - - if (!breakAfter && index === 0) { - return; - } - - if (breakAfter && index === (cutElement.parentNode.children.length - 1)) { - return; - } - - // Create a fragment with rebuilt ancestors - let fragment = rebuildTree(cutElement); - - // Clone cut - if (!breakAfter) { - let clone = cutElement.cloneNode(true); - let ref = cutElement.parentNode.getAttribute('data-ref'); - let parent = fragment.querySelector("[data-ref='" + ref + "']"); - parent.appendChild(clone); - needsRemoval.push(cutElement); - } - - // Remove all after cut - let next = nodeAfter(cutElement, bound); - while (next) { - let clone = next.cloneNode(true); - let ref = next.parentNode.getAttribute('data-ref'); - let parent = fragment.querySelector("[data-ref='" + ref + "']"); - parent.appendChild(clone); - needsRemoval.push(next); - next = nodeAfter(next, bound); - } - - // Remove originals - needsRemoval.forEach((node) => { - if (node) { - node.remove(); - } - }); - - // Insert after bounds - bound.parentNode.insertBefore(fragment, bound.nextSibling); - return [bound, bound.nextSibling]; - } - */ - - function needsBreakBefore(node) { - if( typeof node !== "undefined" && - typeof node.dataset !== "undefined" && - typeof node.dataset.breakBefore !== "undefined" && - (node.dataset.breakBefore === "always" || - node.dataset.breakBefore === "page" || - node.dataset.breakBefore === "left" || - node.dataset.breakBefore === "right" || - node.dataset.breakBefore === "recto" || - node.dataset.breakBefore === "verso") - ) { - return true; - } - - return false; - } - - function needsPreviousBreakAfter(node) { - if( typeof node !== "undefined" && - typeof node.dataset !== "undefined" && - typeof node.dataset.previousBreakAfter !== "undefined" && - (node.dataset.previousBreakAfter === "always" || - node.dataset.previousBreakAfter === "page" || - node.dataset.previousBreakAfter === "left" || - node.dataset.previousBreakAfter === "right" || - node.dataset.previousBreakAfter === "recto" || - node.dataset.previousBreakAfter === "verso") - ) { - return true; - } - - return false; - } - - function needsPageBreak(node, previousSignificantNode) { - if (typeof node === "undefined" || !previousSignificantNode || isIgnorable(node)) { - return false; - } - if (node.dataset && node.dataset.undisplayed) { - return false; - } - let previousSignificantNodePage = previousSignificantNode.dataset ? previousSignificantNode.dataset.page : undefined; - if (typeof previousSignificantNodePage === "undefined") { - const nodeWithNamedPage = getNodeWithNamedPage(previousSignificantNode); - if (nodeWithNamedPage) { - previousSignificantNodePage = nodeWithNamedPage.dataset.page; - } - } - let currentNodePage = node.dataset ? node.dataset.page : undefined; - if (typeof currentNodePage === "undefined") { - const nodeWithNamedPage = getNodeWithNamedPage(node, previousSignificantNode); - if (nodeWithNamedPage) { - currentNodePage = nodeWithNamedPage.dataset.page; - } - } - return currentNodePage !== previousSignificantNodePage; - } - - function *words(node) { - let currentText = node.nodeValue; - let max = currentText.length; - let currentOffset = 0; - let currentLetter; - - let range; - const significantWhitespaces = node.parentElement && node.parentElement.nodeName === "PRE"; - - while (currentOffset < max) { - currentLetter = currentText[currentOffset]; - if (/^[\S\u202F\u00A0]$/.test(currentLetter) || significantWhitespaces) { - if (!range) { - range = document.createRange(); - range.setStart(node, currentOffset); - } - } else { - if (range) { - range.setEnd(node, currentOffset); - yield range; - range = undefined; - } - } - - currentOffset += 1; - } - - if (range) { - range.setEnd(node, currentOffset); - yield range; - } - } - - function *letters(wordRange) { - let currentText = wordRange.startContainer; - let max = currentText.length; - let currentOffset = wordRange.startOffset; - // let currentLetter; - - let range; - - while(currentOffset < max) { - // currentLetter = currentText[currentOffset]; - range = document.createRange(); - range.setStart(currentText, currentOffset); - range.setEnd(currentText, currentOffset+1); - - yield range; - - currentOffset += 1; - } - } - - function isContainer(node) { - let container; - - if (typeof node.tagName === "undefined") { - return true; - } - - if (node.style && node.style.display === "none") { - return false; - } - - switch (node.tagName) { - // Inline - case "A": - case "ABBR": - case "ACRONYM": - case "B": - case "BDO": - case "BIG": - case "BR": - case "BUTTON": - case "CITE": - case "CODE": - case "DFN": - case "EM": - case "I": - case "IMG": - case "INPUT": - case "KBD": - case "LABEL": - case "MAP": - case "OBJECT": - case "Q": - case "SAMP": - case "SCRIPT": - case "SELECT": - case "SMALL": - case "SPAN": - case "STRONG": - case "SUB": - case "SUP": - case "TEXTAREA": - case "TIME": - case "TT": - case "VAR": - case "P": - case "H1": - case "H2": - case "H3": - case "H4": - case "H5": - case "H6": - case "FIGCAPTION": - case "BLOCKQUOTE": - case "PRE": - case "LI": - case "TD": - case "DT": - case "DD": - case "VIDEO": - case "CANVAS": - container = false; - break; - default: - container = true; - } - - return container; - } - - function cloneNode(n, deep=false) { - return n.cloneNode(deep); - } - - function inIndexOfRefs(node, doc) { - if (!doc || !doc.indexOfRefs) return; - const ref = node.getAttribute("data-ref"); - return doc.indexOfRefs[ref]; - } - - function replaceOrAppendElement(parentNode, child) { - if (!isText(child)) { - let childRef = child.getAttribute("data-ref"); - for (let index = 0; index < parentNode.children.length; index++) { - if (parentNode.children[index].getAttribute("data-ref") == childRef) { - parentNode.replaceChild(child, parentNode.childNodes[index]); - return; - } - } - } - - parentNode.appendChild(child); - } - - function findElement(node, doc, forceQuery) { - if (!doc) return; - const ref = node.getAttribute("data-ref"); - return findRef(ref, doc, forceQuery); - } - - 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) { - if (isText(node)) { - return true; - } - - if (isElement(node) && node.dataset.ref) { - return true; - } - - return false; - } - - function prevValidNode(node) { - while (!validNode(node)) { - if (node.previousSibling) { - node = node.previousSibling; - } else { - node = node.parentNode; - } - - if (!node) { - break; - } - } - - return node; - } - - - function indexOf$2(node) { - let parent = node.parentNode; - if (!parent) { - return 0; - } - return Array.prototype.indexOf.call(parent.childNodes, node); - } - - function child(node, index) { - return node.childNodes[index]; - } - - function hasContent(node) { - if (isElement(node)) { - return true; - } else if (isText(node) && - node.textContent.trim().length) { - return true; - } - return false; - } - - function indexOfTextNode(node, parent, hyphen) { - if (!isText(node)) { - return -1; - } - - // Use previous element's dataref to match if possible. Matching the text - // will potentially return the wrong node. - if (node.previousSibling) { - let matchingNode = parent.querySelector(`[data-ref='${node.previousSibling.dataset.ref}']`); - return Array.prototype.indexOf.call(parent.childNodes, matchingNode) + 1; - } - - let nodeTextContent = node.textContent; - // Remove hyphenation if necessary. - if (nodeTextContent.substring(nodeTextContent.length - hyphen.length) == hyphen) { - nodeTextContent = nodeTextContent.substring(0, nodeTextContent.length - hyphen.length); - } - let child; - let index = -1; - for (var i = 0; i < parent.childNodes.length; i++) { - child = parent.childNodes[i]; - if (child.nodeType === 3) { - let text = parent.childNodes[i].textContent; - if (text.includes(nodeTextContent)) { - index = i; - break; - } - } - } - - return index; - } - - - /** - * Throughout, whitespace is defined as one of the characters - * "\t" TAB \u0009 - * "\n" LF \u000A - * "\r" CR \u000D - * " " SPC \u0020 - * - * This does not use Javascript's "\s" because that includes non-breaking - * spaces (and also some other characters). - */ - - /** - * Determine if a node should be ignored by the iterator functions. - * taken from https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Whitespace#Whitespace_helper_functions - * - * @param {Node} node An object implementing the DOM1 |Node| interface. - * @return {boolean} true if the node is: - * 1) A |Text| node that is all whitespace - * 2) A |Comment| node - * and otherwise false. - */ - function isIgnorable(node) { - return (node.nodeType === 8) || // A comment node - ((node.nodeType === 3) && isAllWhitespace(node)); // a text node, all whitespace - } - - /** - * Determine whether a node's text content is entirely whitespace. - * - * @param {Node} node A node implementing the |CharacterData| interface (i.e., a |Text|, |Comment|, or |CDATASection| node - * @return {boolean} true if all of the text content of |nod| is whitespace, otherwise false. - */ - function isAllWhitespace(node) { - return !(/[^\t\n\r ]/.test(node.textContent)); - } - - /** - * Version of |previousSibling| that skips nodes that are entirely - * whitespace or comments. (Normally |previousSibling| is a property - * of all DOM nodes that gives the sibling node, the node that is - * a child of the same parent, that occurs immediately before the - * reference node.) - * - * @param {ChildNode} sib The reference node. - * @return {Node|null} Either: - * 1) The closest previous sibling to |sib| that is not ignorable according to |is_ignorable|, or - * 2) null if no such node exists. - */ - function previousSignificantNode(sib) { - while ((sib = sib.previousSibling)) { - if (!isIgnorable(sib)) return sib; - } - return null; - } - - function getNodeWithNamedPage(node, limiter) { - if (node && node.dataset && node.dataset.page) { - return node; - } - if (node.parentNode) { - while ((node = node.parentNode)) { - if (limiter && node === limiter) { - return; - } - if (node.dataset && node.dataset.page) { - return node; - } - } - } - return null; - } - - /** - * Find a parent with a given node name. - * @param {Node} node - initial Node - * @param {string} nodeName - node name (eg. "TD", "TABLE", "STRONG"...) - * @param {Node} limiter - go up to the parent until there's no more parent or the current node is equals to the limiter - * @returns {Node|undefined} - Either: - * 1) The closest parent for a the given node name, or - * 2) undefined if no such node exists. - */ - function parentOf(node, nodeName, limiter) { - if (limiter && node === limiter) { - return; - } - if (node.parentNode) { - while ((node = node.parentNode)) { - if (limiter && node === limiter) { - return; - } - if (node.nodeName === nodeName) { - return node; - } - } - } - } - - /** - * Version of |nextSibling| that skips nodes that are entirely - * whitespace or comments. - * - * @param {ChildNode} sib The reference node. - * @return {Node|null} Either: - * 1) The closest next sibling to |sib| that is not ignorable according to |is_ignorable|, or - * 2) null if no such node exists. - */ - function nextSignificantNode(sib) { - while ((sib = sib.nextSibling)) { - if (!isIgnorable(sib)) return sib; - } - return null; - } - - function filterTree(content, func, what) { - const treeWalker = document.createTreeWalker( - content || this.dom, - what || NodeFilter.SHOW_ALL, - func ? { acceptNode: func } : null, - false - ); - - let node; - let current; - node = treeWalker.nextNode(); - while(node) { - current = node; - node = treeWalker.nextNode(); - current.parentNode.removeChild(current); - } - } - - /** - * BreakToken - * @class - */ - class BreakToken { - - constructor(node, overflowArray) { - this.node = node; - this.overflow = overflowArray || []; - this.finished = false; - this.breakNeededAt = []; - } - - equals(otherBreakToken) { - if (this.node !== otherBreakToken.node) { - return false; - } - - if (otherBreakToken.overflow.length !== this.overflow.length) { - return false; - } - - for (const index in this.overflow) { - if (!this.overflow[index].equals(otherBreakToken.overflow[index])) { - return false; - } - } - - let otherQueue = otherBreakToken.getForcedBreakQueue(); - for (const index in this.breakNeededAt) { - if (!this.breakNeededAt[index].isEqualNode(otherQueue[index])) { - return false; - } - } - - return true; - } - - setFinished() { - this.finished = true; - } - - isFinished() { - return this.finished; - } - - addNeedsBreak(needsBreak) { - this.breakNeededAt.push(needsBreak); - } - - getNextNeedsBreak() { - return this.breakNeededAt.shift(); - } - - getForcedBreakQueue() { - return this.breakNeededAt; - } - - setForcedBreakQueue(queue) { - return this.breakNeededAt = queue; - } - } - - /** - * Render result. - * @class - */ - class RenderResult { - - constructor(breakToken, error) { - this.breakToken = breakToken; - this.error = error; - } - } - - function getDefaultExportFromCjs (x) { - return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x; - } - - var eventEmitter = {exports: {}}; - - var d$2 = {exports: {}}; - - var isImplemented$6 = function () { - var assign = Object.assign, obj; - if (typeof assign !== "function") return false; - obj = { foo: "raz" }; - assign(obj, { bar: "dwa" }, { trzy: "trzy" }); - return (obj.foo + obj.bar + obj.trzy) === "razdwatrzy"; - }; - - var isImplemented$5; - var hasRequiredIsImplemented$1; - - function requireIsImplemented$1 () { - if (hasRequiredIsImplemented$1) return isImplemented$5; - hasRequiredIsImplemented$1 = 1; - - isImplemented$5 = function () { - try { - Object.keys("primitive"); - return true; - } catch (e) { - return false; - } - }; - return isImplemented$5; - } - - // eslint-disable-next-line no-empty-function - var noop$4 = function () {}; - - var _undefined = noop$4(); // Support ES3 engines - - var isValue$3 = function (val) { - return (val !== _undefined) && (val !== null); - }; - - var shim$5; - var hasRequiredShim$5; - - function requireShim$5 () { - if (hasRequiredShim$5) return shim$5; - hasRequiredShim$5 = 1; - - var isValue = isValue$3; - - var keys = Object.keys; - - shim$5 = function (object) { - return keys(isValue(object) ? Object(object) : object); - }; - return shim$5; - } - - var keys; - var hasRequiredKeys; - - function requireKeys () { - if (hasRequiredKeys) return keys; - hasRequiredKeys = 1; - - keys = requireIsImplemented$1()() - ? Object.keys - : requireShim$5(); - return keys; - } - - var isValue$2 = isValue$3; - - var validValue = function (value) { - if (!isValue$2(value)) throw new TypeError("Cannot use null or undefined"); - return value; - }; - - var shim$4; - var hasRequiredShim$4; - - function requireShim$4 () { - if (hasRequiredShim$4) return shim$4; - hasRequiredShim$4 = 1; - - var keys = requireKeys() - , value = validValue - , max = Math.max; - - shim$4 = function (dest, src /*, …srcn*/) { - var error, i, length = max(arguments.length, 2), assign; - dest = Object(value(dest)); - assign = function (key) { - try { - dest[key] = src[key]; - } catch (e) { - if (!error) error = e; - } - }; - for (i = 1; i < length; ++i) { - src = arguments[i]; - keys(src).forEach(assign); - } - if (error !== undefined) throw error; - return dest; - }; - return shim$4; - } - - var assign$2 = isImplemented$6() - ? Object.assign - : requireShim$4(); - - var isValue$1 = isValue$3; - - var forEach$1 = Array.prototype.forEach, create$5 = Object.create; - - var process = function (src, obj) { - var key; - for (key in src) obj[key] = src[key]; - }; - - // eslint-disable-next-line no-unused-vars - var normalizeOptions = function (opts1 /*, …options*/) { - var result = create$5(null); - forEach$1.call(arguments, function (options) { - if (!isValue$1(options)) return; - process(Object(options), result); - }); - return result; - }; - - var isCallable$1 = function (obj) { - return typeof obj === "function"; - }; - - var str = "razdwatrzy"; - - var isImplemented$4 = function () { - if (typeof str.contains !== "function") return false; - return (str.contains("dwa") === true) && (str.contains("foo") === false); - }; - - var shim$3; - var hasRequiredShim$3; - - function requireShim$3 () { - if (hasRequiredShim$3) return shim$3; - hasRequiredShim$3 = 1; - - var indexOf = String.prototype.indexOf; - - shim$3 = function (searchString/*, position*/) { - return indexOf.call(this, searchString, arguments[1]) > -1; - }; - return shim$3; - } - - var contains$1 = isImplemented$4() - ? String.prototype.contains - : requireShim$3(); - - var assign$1 = assign$2 - , normalizeOpts = normalizeOptions - , isCallable = isCallable$1 - , contains = contains$1 - - , d$1; - - d$1 = d$2.exports = function (dscr, value/*, options*/) { - var c, e, w, options, desc; - if ((arguments.length < 2) || (typeof dscr !== 'string')) { - options = value; - value = dscr; - dscr = null; - } else { - options = arguments[2]; - } - if (dscr == null) { - c = w = true; - e = false; - } else { - c = contains.call(dscr, 'c'); - e = contains.call(dscr, 'e'); - w = contains.call(dscr, 'w'); - } - - desc = { value: value, configurable: c, enumerable: e, writable: w }; - return !options ? desc : assign$1(normalizeOpts(options), desc); - }; - - d$1.gs = function (dscr, get, set/*, options*/) { - var c, e, options, desc; - if (typeof dscr !== 'string') { - options = set; - set = get; - get = dscr; - dscr = null; - } else { - options = arguments[3]; - } - if (get == null) { - get = undefined; - } else if (!isCallable(get)) { - options = get; - get = set = undefined; - } else if (set == null) { - set = undefined; - } else if (!isCallable(set)) { - options = set; - set = undefined; - } - if (dscr == null) { - c = true; - e = false; - } else { - c = contains.call(dscr, 'c'); - e = contains.call(dscr, 'e'); - } - - desc = { get: get, set: set, configurable: c, enumerable: e }; - return !options ? desc : assign$1(normalizeOpts(options), desc); - }; - - var dExports = d$2.exports; - - var validCallable = function (fn) { - if (typeof fn !== "function") throw new TypeError(fn + " is not a function"); - return fn; - }; - - (function (module, exports) { - - var d = dExports - , callable = validCallable - - , apply = Function.prototype.apply, call = Function.prototype.call - , create = Object.create, defineProperty = Object.defineProperty - , defineProperties = Object.defineProperties - , hasOwnProperty = Object.prototype.hasOwnProperty - , descriptor = { configurable: true, enumerable: false, writable: true } - - , on, once, off, emit, methods, descriptors, base; - - on = function (type, listener) { - var data; - - callable(listener); - - if (!hasOwnProperty.call(this, '__ee__')) { - data = descriptor.value = create(null); - defineProperty(this, '__ee__', descriptor); - descriptor.value = null; - } else { - data = this.__ee__; - } - if (!data[type]) data[type] = listener; - else if (typeof data[type] === 'object') data[type].push(listener); - else data[type] = [data[type], listener]; - - return this; - }; - - once = function (type, listener) { - var once, self; - - callable(listener); - self = this; - on.call(this, type, once = function () { - off.call(self, type, once); - apply.call(listener, this, arguments); - }); - - once.__eeOnceListener__ = listener; - return this; - }; - - off = function (type, listener) { - var data, listeners, candidate, i; - - callable(listener); - - if (!hasOwnProperty.call(this, '__ee__')) return this; - data = this.__ee__; - if (!data[type]) return this; - listeners = data[type]; - - if (typeof listeners === 'object') { - for (i = 0; (candidate = listeners[i]); ++i) { - if ((candidate === listener) || - (candidate.__eeOnceListener__ === listener)) { - if (listeners.length === 2) data[type] = listeners[i ? 0 : 1]; - else listeners.splice(i, 1); - } - } - } else { - if ((listeners === listener) || - (listeners.__eeOnceListener__ === listener)) { - delete data[type]; - } - } - - return this; - }; - - emit = function (type) { - var i, l, listener, listeners, args; - - if (!hasOwnProperty.call(this, '__ee__')) return; - listeners = this.__ee__[type]; - if (!listeners) return; - - if (typeof listeners === 'object') { - l = arguments.length; - args = new Array(l - 1); - for (i = 1; i < l; ++i) args[i - 1] = arguments[i]; - - listeners = listeners.slice(); - for (i = 0; (listener = listeners[i]); ++i) { - apply.call(listener, this, args); - } - } else { - switch (arguments.length) { - case 1: - call.call(listeners, this); - break; - case 2: - call.call(listeners, this, arguments[1]); - break; - case 3: - call.call(listeners, this, arguments[1], arguments[2]); - break; - default: - l = arguments.length; - args = new Array(l - 1); - for (i = 1; i < l; ++i) { - args[i - 1] = arguments[i]; - } - apply.call(listeners, this, args); - } - } - }; - - methods = { - on: on, - once: once, - off: off, - emit: emit - }; - - descriptors = { - on: d(on), - once: d(once), - off: d(off), - emit: d(emit) - }; - - base = defineProperties({}, descriptors); - - module.exports = exports = function (o) { - return (o == null) ? create(base) : defineProperties(Object(o), descriptors); - }; - exports.methods = methods; - } (eventEmitter, eventEmitter.exports)); - - var eventEmitterExports = eventEmitter.exports; - var EventEmitter = /*@__PURE__*/getDefaultExportFromCjs(eventEmitterExports); - - /** - * Hooks allow for injecting functions that must all complete in order before finishing - * They will execute in parallel but all must finish before continuing - * Functions may return a promise if they are asycn. - * From epubjs/src/utils/hooks - * @param {any} context scope of this - * @example this.content = new Hook(this); - */ - class Hook { - constructor(context){ - this.context = context || this; - this.hooks = []; - } - - /** - * Adds a function to be run before a hook completes - * @example this.content.register(function(){...}); - * @return {undefined} void - */ - register(){ - for(var i = 0; i < arguments.length; ++i) { - if (typeof arguments[i] === "function") { - this.hooks.push(arguments[i]); - } else { - // unpack array - for(var j = 0; j < arguments[i].length; ++j) { - this.hooks.push(arguments[i][j]); - } - } - } - } - - /** - * Triggers a hook to run all functions - * @example this.content.trigger(args).then(function(){...}); - * @return {Promise} results - */ - trigger(){ - var args = arguments; - var context = this.context; - var promises = []; - - this.hooks.forEach(function(task) { - var executing = task.apply(context, args); - - if(executing && typeof executing["then"] === "function") { - // Task is a function that returns a promise - promises.push(executing); - } else { - // Otherwise Task resolves immediately, add resolved promise with result - promises.push(new Promise((resolve, reject) => { - resolve(executing); - })); - } - }); - - - return Promise.all(promises); - } - - /** - * Triggers a hook to run all functions synchronously - * @example this.content.trigger(args).then(function(){...}); - * @return {Array} results - */ - triggerSync(){ - var args = arguments; - var context = this.context; - var results = []; - - this.hooks.forEach(function(task) { - var executing = task.apply(context, args); - - results.push(executing); - }); - - - return results; - } - - // Adds a function to be run before a hook completes - list(){ - return this.hooks; - } - - clear(){ - return this.hooks = []; - } - } - - /** - * Overflow - * @class - */ - class Overflow { - - constructor(node, offset, overflowHeight, range, topLevel) { - this.node = node; - this.offset = offset; - this.overflowHeight = overflowHeight; - this.range = range; - this.topLevel = topLevel; - } - - equals(otherOffset) { - if (!otherOffset) { - return false; - } - if (this["node"] && otherOffset["node"] && - this["node"] !== otherOffset["node"]) { - return false; - } - if (this["offset"] && otherOffset["offset"] && - this["offset"] !== otherOffset["offset"]) { - return false; - } - return true; - } - - } - - const MAX_CHARS_PER_BREAK = 1500; - - /** - * Layout - * @class - */ - class Layout { - - constructor(element, hooks, options) { - this.element = element; - - this.bounds = this.element.getBoundingClientRect(); - this.parentBounds = this.element.offsetParent?.getBoundingClientRect() || - { left: 0 }; - 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; - } else { - this.hooks = {}; - this.hooks.onPageLayout = new Hook(); - this.hooks.layout = new Hook(); - this.hooks.renderNode = new Hook(); - this.hooks.layoutNode = new Hook(); - this.hooks.beforeOverflow = new Hook(); - this.hooks.onOverflow = new Hook(); - this.hooks.afterOverflowRemoved = new Hook(); - this.hooks.afterOverflowAdded = new Hook(); - this.hooks.onBreakToken = new Hook(); - this.hooks.beforeRenderResult = new Hook(); - } - - this.settings = options || {}; - - this.maxChars = this.settings.maxChars || MAX_CHARS_PER_BREAK; - this.forceRenderBreak = false; - - this.temporaryIndex = 0; - } - - async renderTo(wrapper, source, breakToken, prevPage = null, bounds = this.bounds) { - let start = this.getStart(source, breakToken); - let firstDivisible = source; - - while (firstDivisible.children.length == 1) { - firstDivisible = firstDivisible.children[0]; - } - - let walker = walk$2(start, source); - - let node; - let done; - let next; - let forcedBreakQueue = []; - - let prevBreakToken = breakToken || new BreakToken(start); - - this.hooks && this.hooks.onPageLayout.trigger(wrapper, prevBreakToken, this); - - // Add overflow, and check that it doesn't have overflow itself. - this.addOverflowToPage(wrapper, breakToken, prevPage); - - // Footnotes may change the bounds. - bounds = this.element.getBoundingClientRect(); - - let newBreakToken = this.findBreakToken(wrapper, source, bounds, prevBreakToken, start); - - if (prevBreakToken.isFinished()) { - if (newBreakToken) { - newBreakToken.setFinished(); - } - return new RenderResult(newBreakToken); - } - - let hasRenderedContent = !!wrapper.childNodes.length; - - if (prevBreakToken) { - forcedBreakQueue = prevBreakToken.getForcedBreakQueue(); - } - - while (!done && !newBreakToken) { - next = walker.next(); - node = next.value; - done = next.done; - - if (node) { - this.hooks && this.hooks.layoutNode.trigger(node); - - // Footnotes may change the bounds. - bounds = this.element.getBoundingClientRect(); - - // Check if the rendered element has a break set - // Remember the node but don't apply the break until we have laid - // out the rest of any parent content - this lets a table or divs - // side by side still add content to this page before we start a new - // one. - if (this.shouldBreak(node) && hasRenderedContent) { - forcedBreakQueue.push(node); - } - - if (!forcedBreakQueue.length && node.dataset && node.dataset.page) { - let named = node.dataset.page; - let page = this.element.closest(".pagedjs_page"); - page.classList.add("pagejs_named_page"); - page.classList.add("pagedjs_" + named + "_page"); - if (!node.dataset.splitFrom) { - page.classList.add("pagedjs_" + named + "_first_page"); - } - } - } - - // Check whether we have overflow when we've completed laying out a top - // level element. This lets it have multiple children overflowing and - // allows us to move all of the overflows onto the next page together. - if (forcedBreakQueue.length || !node || !node.parentElement) { - this.hooks && this.hooks.layout.trigger(wrapper, this); - - let imgs = wrapper.querySelectorAll("img"); - if (imgs.length) { - await this.waitForImages(imgs); - } - - newBreakToken = this.findBreakToken(wrapper, source, bounds, prevBreakToken, node); - - if (newBreakToken && node === undefined) { - // We have run out of content. Do add the overflow to a new page but - // don't repeat the whole thing again. - newBreakToken.setFinished(); - } - - if (forcedBreakQueue.length) { - if (newBreakToken) { - newBreakToken.setForcedBreakQueue(forcedBreakQueue); - } - else { - newBreakToken = this.breakAt(forcedBreakQueue.shift(), 0, forcedBreakQueue); - } - } - - if (newBreakToken && newBreakToken.equals(prevBreakToken)) { - this.failed = true; - return new RenderResult(undefined, "Unable to layout item: " + node); - } - - if (!node || newBreakToken) { - return new RenderResult(newBreakToken); - } - } - - // Should the Node be a shallow or deep clone? - let shallow = isContainer(node); - - this.append(node, wrapper, source, breakToken, shallow); - bounds = this.element.getBoundingClientRect(); - - // Check whether layout has content yet. - if (!hasRenderedContent) { - hasRenderedContent = hasContent(node); - } - - // Skip to the next node if a deep clone was rendered. - if (!shallow) { - walker = walk$2(nodeAfter(node, source), source); - } - } - - this.hooks && this.hooks.beforeRenderResult.trigger(newBreakToken, wrapper, this); - return new RenderResult(newBreakToken); - } - - breakAt(node, offset = 0, forcedBreakQueue = []) { - let newBreakToken = new BreakToken( - node, - offset, - forcedBreakQueue - ); - let breakHooks = this.hooks.onBreakToken.triggerSync(newBreakToken, undefined, node, this); - breakHooks.forEach((newToken) => { - if (typeof newToken != "undefined") { - newBreakToken = newToken; - } - }); - - return newBreakToken; - } - - shouldBreak(node, limiter) { - let previousNode = nodeBefore(node, limiter); - let parentNode = node.parentNode; - let parentBreakBefore = needsBreakBefore(node) && parentNode && !previousNode && needsBreakBefore(parentNode); - let doubleBreakBefore; - - if (parentBreakBefore) { - doubleBreakBefore = node.dataset.breakBefore === parentNode.dataset.breakBefore; - } - - return !doubleBreakBefore && needsBreakBefore(node) || needsPreviousBreakAfter(node) || needsPageBreak(node, previousNode); - } - - forceBreak() { - this.forceRenderBreak = true; - } - - getStart(source, breakToken) { - let start; - let node = breakToken && breakToken.node; - let finished = breakToken && breakToken.finished; - - if (node) { - start = node; - } else { - start = source.firstChild; - } - - return finished ? undefined : start; - } - - /** - * Merge items from source into dest which don't yet exist in dest. - * - * @param {element} dest - * A destination DOM node tree. - * @param {element} source - * A source DOM node tree. - * - * @returns {void} - */ - addOverflowNodes(dest, source) { - // Since we are modifying source as we go, we need to remember what - Array.from(source.childNodes).forEach((item) => { - if (isText(item)) { - // If we get to a text node, we assume for now an earlier element - // would have prevented duplication. - dest.append(item); - } else { - let match = findElement(item, dest); - if (match) { - this.addOverflowNodes(match, item); - } else { - dest.appendChild(item); - } - } - }); - } - - /** - * Add overflow to new page. - * - * @param {element} dest - * The page content being built. - * @param {breakToken} breakToken - * The current break cotent. - * @param {element} alreadyRendered - * The content that has already been rendered. - * - * @returns {void} - */ - addOverflowToPage(dest, breakToken, alreadyRendered) { - - if (!breakToken || !breakToken.overflow.length) { - return; - } - - let fragment; - - breakToken.overflow.forEach((overflow) => { - // A handy way to dump the contents of a fragment. - // console.log([].map.call(overflow.content.children, e => e.outerHTML).join('\n')); - - fragment = rebuildTree(overflow.node, fragment, alreadyRendered); - // Find the parent to which overflow.content should be added. - // Overflow.content can be a much shallower start than - // overflow.node, if the range end was outside of the range - // start part of the tree. For this reason, we use a match against - // the parent element of overflow.content if it exists, or fall back - // to overflow.node's parent element. - let addTo = overflow.ancestor ? findElement(overflow.ancestor, fragment) : fragment; - this.addOverflowNodes(addTo, overflow.content); - }); - - // Record refs. - Array.from(fragment.querySelectorAll('[data-ref]')).forEach(ref => { - let refId = ref.dataset.ref; - if (!dest.querySelector(`[data-ref='${refId}']`)) { - if (!dest.indexOfRefs) { - dest.indexOfRefs = {}; - } - dest.indexOfRefs[refId] = ref; - } - }); - - let tags = [ 'overflow-tagged', 'overflow-partial', 'range-start-overflow', 'range-end-overflow' ]; - tags.forEach((tag) => { - let camel = tag.replace(/(?:^\w|[A-Z]|\b\w)/g, function (word, index) { - return index == 0 ? word.toLowerCase() : word.toUpperCase(); - }).replace(/[-\s]+/g, ''); - let instances = fragment.querySelectorAll(`[data-${tag}]`); - instances.forEach((instance) => { - delete instance.dataset[camel]; - }); - }); - - dest.appendChild(fragment); - - this.hooks && this.hooks.afterOverflowAdded.trigger(dest); - } - - /** - * Add text to new page. - * - * @param {element} node - * The node being appended to the destination. - * @param {element} dest - * The destination to which content is being added. - * @param {element} source - * The source DOM - * @param {breakToken} breakToken - * The current breakToken. - * @param {bool} shallow - * Whether to do a shallow copy of the node. - * @param {bool} rebuild - * Whether to rebuild parents. - * - * @returns {ChildNode} - * The cloned node. - */ - append(node, dest, source, breakToken, shallow = true, rebuild = true) { - - let clone = cloneNode(node, !shallow); - - if (node.parentNode && isElement(node.parentNode)) { - let parent = findElement(node.parentNode, dest); - if (parent) { - replaceOrAppendElement(parent, clone); - } else if (rebuild) { - let fragment = rebuildTree(node.parentElement, undefined, source); - parent = findElement(node.parentNode, fragment); - replaceOrAppendElement(parent, clone); - dest.appendChild(fragment); - } else { - dest.appendChild(clone); - } - - } else { - 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") { - clone = newNode; - } - }); - - return clone; - } - - rebuildTableFromBreakToken(breakToken, dest, source) { - 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, source, null, true); - } - } - } - - async waitForImages(imgs) { - let results = Array.from(imgs).map(async (img) => { - return this.awaitImageLoaded(img); - }); - await Promise.all(results); - } - - async awaitImageLoaded(image) { - return new Promise(resolve => { - if (image.complete !== true) { - image.onload = function () { - let { width, height } = window.getComputedStyle(image); - resolve(width, height); - }; - image.onerror = function (e) { - let { width, height } = window.getComputedStyle(image); - resolve(width, height, e); - }; - } else { - let { width, height } = window.getComputedStyle(image); - resolve(width, height); - } - }); - } - - avoidBreakInside(node, limiter) { - let breakNode; - - while (node.parentNode) { - if (node === limiter) { - break; - } - - if (isElement(node) && node.dataset.originalBreakInside === "avoid") { - breakNode = node; - break; - } - - node = node.parentNode; - } - return breakNode; - } - - createOverflow(overflow, rendered, source) { - let container = overflow.startContainer; - let offset = overflow.startOffset; - let node, renderedNode, parent, index, temp; - let hyphen = this.settings.hyphenGlyph || "\u2011"; - let topLevel = false; - - if (isElement(container)) { - if (container.nodeName == "INPUT") { - temp = container; - } else { - temp = child(container, offset); - } - - if (isElement(temp)) { - renderedNode = findElement(temp, rendered); - - if (!renderedNode) { - // Find closest element with data-ref - let prevNode = prevValidNode(temp); - if (!isElement(prevNode)) { - prevNode = prevNode.parentElement; - } - renderedNode = findElement(prevNode, rendered); - // Check if temp is the last rendered node at its level. - if (!temp.nextSibling) { - // We need to ensure that the previous sibling of temp is fully rendered. - const renderedNodeFromSource = findElement(renderedNode, source); - const walker = document.createTreeWalker(renderedNodeFromSource, NodeFilter.SHOW_ELEMENT); - const lastChildOfRenderedNodeFromSource = walker.lastChild(); - const lastChildOfRenderedNodeMatchingFromRendered = findElement(lastChildOfRenderedNodeFromSource, rendered); - // Check if we found that the last child in source - if (!lastChildOfRenderedNodeMatchingFromRendered) { - // Pending content to be rendered before virtual break token - return; - } - // Otherwise we will return a break token as per below - } - // renderedNode is actually the last unbroken box that does not overflow. - // Break Token is therefore the next sibling of renderedNode within source node. - node = findElement(renderedNode, source).nextSibling; - offset = 0; - } else { - node = findElement(renderedNode, source); - offset = 0; - } - } else { - if (container == rendered) { - parent = renderedNode = source; - topLevel = true; - } - else { - renderedNode = findElement(container, rendered); - - if (!renderedNode) { - renderedNode = findElement(prevValidNode(container), rendered); - } - - parent = findElement(renderedNode, source); - } - index = indexOfTextNode(temp, parent, hyphen); - // No seperation for the first textNode of an element - if (index === 0) { - node = parent; - offset = 0; - } else { - node = child(parent, index); - offset = 0; - } - } - } else { - renderedNode = findElement(container.parentNode, rendered); - - if (!renderedNode) { - renderedNode = findElement(prevValidNode(container.parentNode), rendered); - } - - parent = findElement(renderedNode, source); - index = indexOfTextNode(container, parent, hyphen); - - if (index === -1) { - return; - } - - node = child(parent, index); - - offset += node.textContent.indexOf(container.textContent); - } - - if (!node) { - return; - } - - return new Overflow( - node, - offset, - overflow.getBoundingClientRect().height, - overflow, - topLevel - ); - - } - - lastChildCheck(parentElement, rootElement) { - if (parentElement.childElementCount) { - this.lastChildCheck(parentElement.lastElementChild, rootElement); - } - - let refId = parentElement.dataset.ref; - - // A table row, math element or paragraph from which all content has been removed - // can itself also be removed. It will be added on the next page. - if (parentElement.dataset.overflowTagged && parentElement.textContent.trim() == '') { - parentElement.parentNode.removeChild(parentElement); - } - else if (refId && !rootElement.indexOfRefs[refId]) { - rootElement.indexOfRefs[refId] = parentElement; - } - } - - processOverflowResult(ranges, rendered, source, bounds, prevBreakToken, node, extract) { - let breakToken, breakLetter; - - ranges.forEach((overflowRange) => { - - let overflowHooks = this.hooks.onOverflow.triggerSync(overflowRange, rendered, bounds, this); - overflowHooks.forEach((newOverflow) => { - if (typeof newOverflow != "undefined") { - overflowRange = newOverflow; - } - }); - - let overflow = this.createOverflow(overflowRange, rendered, source); - if (!breakToken) { - breakToken = new BreakToken(node, [overflow]); - } else { - breakToken.overflow.push(overflow); - } - - // breakToken is nullable - let breakHooks = this.hooks.onBreakToken.triggerSync(breakToken, overflowRange, rendered, this); - breakHooks.forEach((newToken) => { - if (typeof newToken != "undefined") { - breakToken = newToken; - } - }); - - // Stop removal if we are in a loop - if (breakToken.equals(prevBreakToken)) { - return; - } - - if (overflow?.node && overflow?.offset && overflow?.node?.textContent) { - breakLetter = overflow.node.textContent.charAt(overflow.offset); - } else { - breakLetter = undefined; - } - - if (overflow?.node && extract) { - overflow.ancestor = findElement(overflow.range.commonAncestorContainer, source); - overflow.content = this.removeOverflow(overflowRange, breakLetter); - } - }); - - // For each overflow that is removed, see if we have an empty td that can be removed. - // Also check that the data-ref is set so we get all the split-froms and tos. If a copy - // of a node wasn't shallow, the indexOfRefs entry won't be there yet. - ranges.forEach((overflowRange) => { - this.lastChildCheck(rendered, rendered); - }); - - // And then see if the last element has been completely removed and not split. - if (rendered.indexOfRefs && extract && breakToken.overflow.length) { - let firstOverflow = breakToken.overflow[0]; - if (firstOverflow?.node && firstOverflow.content) { - // Remove data-refs in the overflow from the index. - Array.from(firstOverflow.content.querySelectorAll('[data-ref]')).forEach(ref => { - let refId = ref.dataset.ref; - if (!rendered.querySelector(`[data-ref='${refId}']`)) { - delete(rendered.indexOfRefs[refId]); - } - }); - } - } - - breakToken.overflow.forEach((overflow) => { - this.hooks && this.hooks.afterOverflowRemoved.trigger(overflow.content, rendered, this); - }); - - - return breakToken; - } - - findBreakToken(rendered, source, bounds = this.bounds, prevBreakToken, node = null, extract = true) { - let breakToken, overflow = []; - - let overflowResult = this.findOverflow(rendered, bounds, source); - while (overflowResult) { - // Check whether overflow already added - multiple overflows might result in the - // same range via avoid break rules. - let existing = false; - overflow.forEach((item) => { - if ( - item.startContainer == overflowResult.startContainer && - item.endContainer == overflowResult.endContainer) { - if (item.startOffset >= overflowResult.startOffset && - item.endOffset <= overflowResult.endOffset) { - item.setStart(overflowResult.startContainer, overflowResult.startOffset); - existing = true; - } - if (item.endOffset > overflowResult.endOffset && - item.startOffset == overflowResult.startOffset) { - item.EndOffset = overflowResult.EndOffset; - item.setEnd(overflowResult.endContainer, overflowResult.endOffset); - existing = true; - } - } - }); - if (!existing) { - overflow.push(overflowResult); - } - overflowResult = this.findOverflow(rendered, bounds, source); - } - - if (overflow.length) { - breakToken = this.processOverflowResult(overflow, rendered, source, bounds, prevBreakToken, node, extract); - } - return breakToken; - } - - /** - * Does the element exceed the bounds? - * - * @param {element} element - * The element being constrained. - * @param {array} bounds - * The bounding element. - * - * @returns {bool} - * Whether the element is within bounds. - */ - hasOverflow(element, bounds = this.bounds) { - let constrainingElement = element && element.parentNode; // this gets the element, instead of the wrapper for the width workaround - if (constrainingElement.classList.contains("pagedjs_page_content")) { - constrainingElement = element; - } - let { width, height } = element.getBoundingClientRect(); - let scrollWidth = constrainingElement ? constrainingElement.scrollWidth : 0; - let scrollHeight = constrainingElement ? constrainingElement.scrollHeight : 0; - return (Math.max(Math.ceil(width), scrollWidth) > Math.ceil(bounds.width)) || - Math.max(Math.ceil(height), scrollHeight) > Math.ceil(bounds.height); - } - - /** - * Sums padding, borders and margins for bottom/right of parent elements. - * - * Assumes no margin collapsing because we're considering overflow - * on a page. - * - * This and callers need to be extended to handle right-to-left text and - * flow but I'll get LTR going first in the hope that it will simplify - * the task of getting RTL sorted later. Need test cases too. - */ - getAncestorPaddingBorderAndMarginSums(element) { - let attribs = [ - 'padding-top', - 'padding-right', - 'padding-bottom', - 'padding-left', - 'border-top-width', - 'border-right-width', - 'border-bottom-width', - 'border-left-width', - 'margin-top', - 'margin-right', - 'margin-bottom', - 'margin-left', - ]; - let result = {}; - attribs.forEach(attrib => result[attrib] = 0); - - while (element && - !element.classList.contains('pagedjs_page_content') && - !element.classList.contains('pagedjs_footnote_inner_content')) { - let style = window.getComputedStyle(element); - attribs.forEach(attrib => result[attrib] += parseInt(style[attrib])); - element = element.parentElement; - } - - return result; - } - - /** - * Checks whether an element is within a table and gets any THEAD sizes. - */ - getAncestorTheadSizes(element) { - let result = 0; - - while (element && - !element.classList.contains('pagedjs_page_content') && - !element.classList.contains('pagedjs_footnote_inner_content')) { - if (element.tagName == 'TABLE') { - element.childNodes.forEach(node => { - if (node.tagName == 'THEAD') { - let style = getComputedStyle(node); - result += parseInt(style.height); - } - }); - } - element = element.parentElement; - } - - return result; - } - - /** - * Adds temporary data-split-to/from attribute where needed. - * - * @param DomElement element - * The deepest child, from which to start. - */ - addTemporarySplit(element, isTo = true) { - this.temporaryIndex++; - let name = isTo ? 'data-split-to' : 'data-split-from'; - while (element && - !element.classList.contains('pagedjs_page_content') && - !element.classList.contains('pagedjs_footnote_inner_content')) { - - if (!element.getAttribute(name)) { - element.setAttribute(name, 'temp-' + this.temporaryIndex); - } - - element = element.parentElement; - } - } - - /** - * Removes temporary data-split-to/from attribute where added. - * - * @param DomElement element - * The deepest child, from which to start. - * @param boolean isTo - * Whether a split-to or -from was added. - */ - deleteTemporarySplit(element, isTo = true) { - let name = isTo ? 'data-split-to' : 'data-split-from'; - while (element && - !element.classList.contains('pagedjs_page_content') && - !element.classList.contains('pagedjs_footnote_inner_content')) { - - let value = element.getAttribute(name); - if (value == 'temp-' + this.temporaryIndex) { - element.removeAttribute(name); - } - - element = element.parentElement; - } - } - - /** - * Returns the first child that overflows the bounds. - * - * There may be no children that overflow (the height might be extended - * by a sibling). In this case, this function returns NULL. - * - * @param {node} node - * The parent node of the children we are searching. - * @param {array} bounds - * The bounds of the page area. - * @returns {ChildNode | null | undefined} - * The first overflowing child within the node. - */ - firstOverflowingChild(node, bounds) { - let bLeft = Math.ceil(bounds.left); - let bRight = Math.floor(bounds.right); - let bTop = Math.ceil(bounds.top); - let bBottom = Math.floor(bounds.bottom); - let result = undefined; - let skipRange = false; - let parentBottomPaddingBorder = 0, parentBottomMargin = 0; - - if (isElement(node)) { - let result = this.getAncestorPaddingBorderAndMarginSums(node); - parentBottomPaddingBorder = result['border-bottom-width']; - parentBottomMargin = result['margin-bottom']; - } - - for (const child of node.childNodes) { - if (child.tagName == "COLGROUP") { - continue; - } - - let pos = getBoundingClientRect(child); - let bottomMargin = 0; - - if (isElement(child)) { - let styles = window.getComputedStyle(child); - - bottomMargin = parseInt(styles["margin-bottom"]); - - if (child.dataset.rangeStartOverflow !== undefined) { - skipRange = true; - result = null; - // Don't continue. The start may also be the end. - } - - if (child.dataset.rangeEndOverflow !== undefined) { - skipRange = false; - result = undefined; - continue; - } - - if (child.dataset.overflowTagged !== undefined) { - continue; - } - - } - else { - bottomMargin = parentBottomMargin; - } - - if (skipRange) { - continue; - } - - let left = Math.ceil(pos.left); - let right = Math.floor(pos.right); - let top = Math.ceil(pos.top); - let bottom = Math.floor(pos.bottom + bottomMargin + - (node.lastChild == child ? parentBottomPaddingBorder : 0)); - - if (!(pos.height + bottomMargin)) { - continue; - } - - if (left < bLeft || right > bRight || top < bTop || bottom > bBottom) { - return child; - } - } - - return result; - } - - removeHeightConstraint(element) { - let pageBox = element.parentElement.closest('.pagedjs_page'); - pageBox.style.setProperty('--pagedjs-pagebox-height', '5000px'); - this.addTemporarySplit(element.parentElement, false); - } - - restoreHeightConstraint(element) { - let pageBox = element.parentElement.closest('.pagedjs_page'); - this.deleteTemporarySplit(element.parentElement, false); - pageBox.style.removeProperty('--pagedjs-pagebox-height'); - } - - getUnconstrainedElementHeight(element, includeAncestors = true, includeTableHead = true) { - this.removeHeightConstraint(element); - let unconstrainedHeight = getBoundingClientRect(element).height; - if (includeAncestors) { - let extra = this.getAncestorPaddingBorderAndMarginSums(element.parentElement); - ['top', 'bottom'].forEach(direction => { - unconstrainedHeight += extra[`padding-${direction}`] + - extra[`border-${direction}-width`] + - extra[`margin-${direction}`]; - }); - } - if (includeTableHead) { - unconstrainedHeight += this.getAncestorTheadSizes(element.parentElement); - } - this.restoreHeightConstraint(element); - return unconstrainedHeight; - } - - getRange(rangeStart, offset, rangeEnd) { - let range = document.createRange(); - if (isText(rangeStart)) { - range.setStart(rangeStart, offset); - } else { - range.selectNode(rangeStart); - } - - // Additional nodes may have been added that will overflow further beyond - // node. Include them in the range. - rangeEnd = rangeEnd || rangeStart; - range.setEndAfter(rangeEnd); - return range; - } - - startOfNewOverflow(node, rendered, bounds) { - let childNode, done = false; - let prev; - let anyOverflowFound = false; - let topNode = node; - - do { - prev = node; - do { - let parentBottomPaddingBorder, parentBottomMargin; - childNode = this.firstOverflowingChild(node, bounds); - if (childNode) { - anyOverflowFound = true; - } else if (childNode === undefined) { - // The overflow isn't caused by children. It could be caused by: - // * a sibling div / td / element with height that stretches this - // element - // * margin / padding on this element - // In the former case, we want to ignore this node and take the - // sibling. In the later case, we want to move this node. - let intrinsicBottom = 0, intrinsicRight = 0; - let childBounds = getBoundingClientRect(node); - if (isElement(node)) { - // Assume that any height is the result of matching the - // height of surrounding content if there's no content. - let result = this.getAncestorPaddingBorderAndMarginSums(node); - parentBottomPaddingBorder = result['border-bottom-width'] + result['padding-bottom']; - parentBottomMargin = result['margin-bottom']; - - if (node.childNodes.length) { - let lastChild = node.lastChild; - if ( - (isText(lastChild) && !node.dataset.overflowTagged) || - (!isText(lastChild) && !lastChild.dataset.overflowTagged) - ) { - childBounds = getBoundingClientRect(lastChild); - intrinsicRight = childBounds.right; - intrinsicBottom = childBounds.bottom; - } - } - else { - // Do we count this node even though it has no children? - // Seems to only be needed for BR. - if (node instanceof HTMLBRElement) { - intrinsicRight = childBounds.right; - intrinsicBottom = childBounds.bottom; - } - } - - } else { - intrinsicRight = childBounds.right; - intrinsicBottom = childBounds.bottom; - - let result = this.getAncestorPaddingBorderAndMarginSums(node.parentElement); - parentBottomPaddingBorder = result['border-bottom-width']; - parentBottomMargin = result['margin-bottom']; - } - intrinsicBottom += parentBottomPaddingBorder + parentBottomMargin; - if (intrinsicBottom <= bounds.bottom && - intrinsicRight <= bounds.right) { - let ascended; - do { - ascended = false; - do { - node = node.nextElementSibling; - } while (node && node.dataset.overflowTagged) - if (!node && rendered !== prev) { - ascended = true; - prev = node = prev.parentElement; - } - } while (ascended && node && node !== topNode); - if (!node || node == topNode) { - return [null, false]; - } - } else { - // Node is causing the overflow via padding and margin or text content. - done = true; - } - } else { - // childNode is null. Overflowing children have been ignored and no other - // overflowing children were found. Check the node's next sibling or one of - // an ancestor. - do { - while (!node.nextElementSibling) { - if (node == rendered) { - return [null, false]; - } - node = node.parentElement; - } - do { - node = node.nextElementSibling; - } while (node.nextElementSibling && node.dataset.overflowTagged); - } while (node.dataset.overflowTagged); - } - } while (node && !childNode && !done); - - if (node) { - node = childNode; - } - } while (node && !done); - - return [prev, anyOverflowFound]; - } - - tagAndCreateOverflowRange(startOfOverflow, rangeStart, rangeEnd, bounds, rendered) { - let offset = 0; - let start = bounds.left; - let end = bounds.right; - let vStart = bounds.top; - let vEnd = bounds.bottom; - let range; - - if (isText(rangeStart) && rangeStart.textContent.trim().length) { - offset = this.textBreak(rangeStart, start, end, vStart, vEnd); - if (offset === undefined) { - // Adding split-to changed the CSS and meant we don't need to - // split this node. - let next = rangeStart; - while (!next.nextElementSibling) { - next = next.parentElement; - if (next == rendered) { - return; - } - } - rangeStart = next.nextElementSibling; - } - } - - let previousElement = nodeBefore(rangeStart, rendered, true); - let shouldContinue = true; - let newRangeStart = rangeStart; - while (!offset && previousElement && shouldContinue && ( - (isText(newRangeStart) && ( - newRangeStart.parentElement.dataset.previousBreakAfter == 'avoid' || - newRangeStart.parentElement.dataset.breakBefore == 'avoid' - )) || - (!isText(newRangeStart) && ( - newRangeStart.dataset.previousBreakAfter == 'avoid' || - newRangeStart.dataset.breakBefore == 'avoid' - )))) { - // We are trying to avoid putting a break at newRangeStart. - // See if we can move some of the content above into the overflow. - let newPreviousElement = nodeBefore(previousElement, rendered, true); - // Don't go back into stuff already rendered. - if (!newPreviousElement || newPreviousElement.dataset.splitFrom) { - shouldContinue = false; - } - else { - newRangeStart = previousElement; - previousElement = newPreviousElement; - } - } - - if (shouldContinue) { - // We found earlier content that doesn't want to avoid having a break after it. - // newRangeStart is the next node (new overflow start). - rangeStart = newRangeStart; - } - - // Set the start of the range and record on node or the previous element - // that overflow was moved. - let position = rangeStart; - range = this.getRange(rangeStart, offset, rangeEnd); - if (isText(rangeStart)) { - rangeStart.parentElement.dataset.splitTo = rangeStart.parentElement.dataset.ref; - rangeStart.parentElement.dataset.rangeStartOverflow = true; - rangeStart.parentElement.dataset.overflowTagged = true; - position = rangeStart.parentElement; - } else { - rangeStart.dataset.rangeStartOverflow = true; - } - - rangeEnd = rangeEnd || rangeStart; - if (isElement(rangeEnd)) { - if (rangeStart.parentElement.closest(`[data-ref='${rangeEnd.dataset.ref}']`)) { - let nextNode = nodeAfter(rangeEnd); - if (nextNode) { - nextNode.dataset.rangeEndOverflow = true; - nextNode.dataset.overflowTagged = true; - } - } - else { - rangeEnd.dataset.rangeEndOverflow = true; - rangeEnd.dataset.overflowTagged = true; - } - } - else { - rangeEnd.parentElement.dataset.rangeEndOverflow = true; - } - - // Add splitTo - while (position !== rendered) { - if (position.previousSibling) { - position.parentElement.dataset.splitTo = position.parentElement.dataset.ref; - } - position = position.parentElement; - } - - // Tag ancestors in the range so we don't generate additional ranges - // that then cause problems when removing the ranges. - position = rangeStart; - while (position.parentElement !== range.commonAncestorContainer) { - position = position.parentElement; - position.dataset.overflowTagged = true; - } - - if (isElement(position)) { - let stopAt = rangeEnd; - while (stopAt.parentElement !== range.commonAncestorContainer) { - stopAt = stopAt.parentElement; - } - - while (position !== stopAt) { - position = position.nextSibling; - if (isElement(position)) { - position.dataset.overflowTagged = true; - } - } - } - else { - position = position.parentElement; - } - while (!position.nextElementSibling && position !== rendered) { - position = position.parentElement; - position.dataset.overflowTagged = true; - } - - return range; - } - - rowspanNeedsBreakAt(tableRow, rendered) { - if (tableRow.nodeName !== 'TR') { - return; - } - - const table = parentOf(tableRow, "TABLE", rendered); - if (!table) { - return; - } - - const rowspan = table.querySelector("[colspan]"); - if (!rowspan) { - return; - } - - let columnCount = 0; - for (const cell of Array.from(table.rows[0].cells)) { - columnCount += parseInt(cell.getAttribute("colspan") || "1"); - } - if (tableRow.cells.length !== columnCount) { - let previousRow = tableRow; - let previousRowColumnCount; - while (previousRow !== null) { - previousRowColumnCount = 0; - for (const cell of Array.from(previousRow.cells)) { - previousRowColumnCount += parseInt(cell.getAttribute("colspan") || "1"); - } - if (previousRowColumnCount === columnCount) { - break; - } - previousRow = previousRow.previousElementSibling; - } - if (previousRowColumnCount === columnCount) { - return previousRow; - } - } - } - - findOverflow(rendered, bounds, source) { - - if (!this.hasOverflow(rendered, bounds) || rendered.dataset.overflowTagged) { - return; - } - - // The pattern here is: - // Round the bounds towards the smaller rectangle (round up top & left and - // round down bottom and right) and round the content towards the larger - // rectangle (round down top and left and round up bottom and right). Then - // use > and < to check if bounds are exceeded. That way portions of pixels - // will be correctly handled - you can't render a fraction of a pixel so - // bounds should have any fraction treated like that pixel isn't available - // and content should have any fraction of a pixel treated like the whole - // pixel is required. - let end = bounds.right; - let vEnd = bounds.bottom; - let anyOverflowFound; - - // Find the deepest element that is the first in set of siblings with - // overflow. There may be others. We just take the first we find and - // are called again to check for additional instances. - let node = rendered, startOfOverflow, check; - - while (isText(node)) { - node = node.nextElementSibling; - } - - [startOfOverflow, anyOverflowFound] = this.startOfNewOverflow(node, rendered, bounds); - - if (!anyOverflowFound) { - return; - } - - let startOfOverflowIsText = isText(startOfOverflow); - if (startOfOverflowIsText && startOfOverflow.parentElement.dataset.overflowTagged || - (!startOfOverflowIsText && startOfOverflow.dataset.overflowTagged)) { - return; - } - - // The node we finished on may be within something asking not to have its - // contents split. It - or a parent - may also have to be split because - // the content is just too big for the page. - // Resolve those requirements, deciding on a node that will be split in - // the following way: - // 1) Prefer the smallest node we can (start with the one we ended on). - // While going back up the ancestors, check that subsequent children - // of the ancestor are all entirely in overflow too. If they are, we - // can take a range starting at our initial node and going to the end - // of the ancestor's children. - - let rangeStart = check = node = startOfOverflow; - let visibleSiblings = false; - let rangeEnd = rendered.lastElementChild; - - do { - let checkBounds = getBoundingClientRect(check); - let hasOverflow = (checkBounds.bottom > vEnd || checkBounds.right > end); - - let rowspanNeedsBreakAt; - - if (hasOverflow && this.avoidBreakInside(check, rendered)) { - rowspanNeedsBreakAt = this.rowspanNeedsBreakAt(check, rendered); - if (rowspanNeedsBreakAt) { - // No question - break earlier. - rangeStart = rowspanNeedsBreakAt; - rangeEnd = rendered.lastChild; - break; - } - else { - // If there is an element with overflow and it is within a - // break-inside: avoid, we take the whole container, provided that it - // will fit on a page by itself. But calculating whether it will fit - // by itself is non-trivial. If it is within a dom structure, the - // space available will be reduced by the containers. We can use the - // current container (that will get duplicated) but there might be - // subtle differences in styling due to the split-from class being - // added. We therefore temporary add the split-from to the current - // structure and find out how much space we need for the whole thing. - // - // To calculate whether we must split the element, we need to know its - // unconstrained height. If it has been wrapped into another column - // by .pagedjs_pagebox's display:grid, we need to temporarily lengthen - // the current column to get the maximum width it would take. Go from - // check's parent to simplify handling where check is a text node. - let unconstrainedHeight; - if (checkBounds.width > bounds.width) { - unconstrainedHeight = this.getUnconstrainedElementHeight(check); - } - else { - unconstrainedHeight = checkBounds.height; - } - - let mustSplit = (unconstrainedHeight > bounds.height); - - if (!mustSplit) { - // Move the whole thing. - rangeStart = check; - } - } - } - - let sibling = check, siblingBounds; - do { - sibling = sibling.nextSibling; - siblingBounds = sibling ? getBoundingClientRect(sibling) : undefined; - } while (sibling && !siblingBounds?.height); - - if (sibling && siblingBounds?.height && !rowspanNeedsBreakAt) { - - // Is the sibling entirely in overflow? If yes, so must all following - // siblings be - add them to this range; they can't have anything we - // want to keep on this page. - if ((siblingBounds.left > end || siblingBounds.top > vEnd) && !visibleSiblings) { - if (!rowspanNeedsBreakAt) { - rangeEnd = check.parentElement.lastChild; - } - } else { - visibleSiblings = true; - rangeEnd = undefined; - } - } - - // Get the columns widths and make them attributes so removal of - // overflow doesn't do strange things - they may be affecting - // widths on this page. - Array.from(check.parentElement.children).forEach((childNode) => { - let style = getComputedStyle(childNode); - childNode.width = style.width; - }); - - if (isElement(check) && Array.from(check.classList).filter(value => ['region-content', 'pagedjs_page_content'].includes(value)).length) { - break; - } - check = check.parentElement; - } while (check && check !== rendered); - - return this.tagAndCreateOverflowRange(startOfOverflow, rangeStart, rangeEnd, bounds, rendered); - } - - findEndToken(rendered, source) { - if (rendered.childNodes.length === 0) { - return; - } - - let lastChild = rendered.lastChild; - - let lastNodeIndex; - while (lastChild && lastChild.lastChild) { - if (!validNode(lastChild)) { - // Only get elements with refs - lastChild = lastChild.previousSibling; - } else if (!validNode(lastChild.lastChild)) { - // Deal with invalid dom items - lastChild = prevValidNode(lastChild.lastChild); - break; - } else { - lastChild = lastChild.lastChild; - } - } - - if (isText(lastChild)) { - - if (lastChild.parentNode.dataset.ref) { - lastNodeIndex = indexOf$2(lastChild); - lastChild = lastChild.parentNode; - } else { - lastChild = lastChild.previousSibling; - } - } - - let original = findElement(lastChild, source); - - if (lastNodeIndex) { - original = original.childNodes[lastNodeIndex]; - } - - let after = nodeAfter(original); - - return this.breakAt(after); - } - - 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; - - // Margin bottom is needed when the node is in a block level element - // such as a table, grid or flex, where margins don't collapse. - // Temporarily add data-split-to as this may change margins too - // (It always does in current code but let's not assume that). - // With the split-to set, margin might be removed, resulting in us - // not actually needing to split this text. In that case, the return - // result will be undefined and the split should be done at the next - // node. In this case we also keep the data-split-to=foo so the - // styling that removes the need for the overflow remains active. - // "Margin" includes bottom padding and border in this calculation. - - this.addTemporarySplit(node.parentElement); - - let parentAdditions = this.getAncestorPaddingBorderAndMarginSums(node.parentElement); - parentAdditions = parentAdditions['padding-bottom'] + - parentAdditions['border-bottom-width'] + parentAdditions['margin-bottom']; - - while (!done) { - next = wordwalker.next(); - word = next.value; - done = next.done; - - if (!word) { - break; - } - - pos = getBoundingClientRect(word); - - left = Math.floor(pos.left); - right = Math.floor(pos.right); - top = pos.top; - bottom = pos.bottom; - - if (left > end || top > (vEnd - parentAdditions)) { - offset = word.startOffset; - break; - } - - // The bounds won't be exceeded so we need >= rather than >. - // Also below for the letters. - if (right > end || bottom > (vEnd - parentAdditions)) { - let letterwalker = letters(word); - let letter, nextLetter, doneLetter; - - while (!doneLetter) { - // Note that the letter walker continues to walk beyond the end of the word, until the end of the - // text node. - nextLetter = letterwalker.next(); - letter = nextLetter.value; - doneLetter = nextLetter.done; - - if (!letter) { - break; - } - - pos = getBoundingClientRect(letter); - right = pos.right; - bottom = pos.bottom; - - if (right > end || bottom > (vEnd - parentAdditions)) { - offset = letter.startOffset; - done = true; - - break; - } - } - } - } - - // See comment above the addTemporarySplit call above for the offset == - // undefined part of why we may leave the temporary split-to attribute in - // place. This should be overridden though if a break is to be avoided. - // In that case, - if (offset != undefined) { - this.deleteTemporarySplit(node.parentElement); - } - - // Don't get tricked into doing a split by whitespace at the start of a string. - if (node.textContent.substring(0, offset).trim() == '') { - return 0; - } - - return offset; - } - - removeOverflow(overflow, breakLetter) { - let { startContainer } = overflow; - let extracted = overflow.extractContents(); - - this.hyphenateAtBreak(startContainer, breakLetter); - - return extracted; - } - - hyphenateAtBreak(startContainer, breakLetter) { - if (isText(startContainer)) { - let startText = startContainer.textContent; - let prevLetter = startText[startText.length - 1]; - - // Add a hyphen if previous character is a letter or soft hyphen - if ( - (breakLetter && /^\w|\u00AD$/.test(prevLetter) && /^\w|\u00AD$/.test(breakLetter)) || - (!breakLetter && prevLetter && /^\w|\u00AD$/.test(prevLetter)) - ) { - startContainer.parentNode.classList.add("pagedjs_hyphen"); - startContainer.textContent += this.settings.hyphenGlyph || "\u2011"; - } - } - } - - equalTokens(a, b) { - if (!a || !b) { - return false; - } - if (a["node"] && b["node"] && a["node"] !== b["node"]) { - return false; - } - if (a["offset"] && b["offset"] && a["offset"] !== b["offset"]) { - return false; - } - return true; - } - } - - EventEmitter(Layout.prototype); - - /** - * Render a page - * @class - */ - class Page { - constructor(pagesArea, pageTemplate, blank, hooks, options) { - this.pagesArea = pagesArea; - this.pageTemplate = pageTemplate; - this.blank = blank; - - this.width = undefined; - this.height = undefined; - - this.hooks = hooks; - this.settings = options || {}; - - // this.element = this.create(this.pageTemplate); - } - - create(template, after) { - //let documentFragment = document.createRange().createContextualFragment( TEMPLATE ); - //let page = documentFragment.children[0]; - let clone = document.importNode(this.pageTemplate.content, true); - - let page, index; - if (after) { - this.pagesArea.insertBefore(clone, after.nextElementSibling); - index = Array.prototype.indexOf.call(this.pagesArea.children, after.nextElementSibling); - page = this.pagesArea.children[index]; - } else { - this.pagesArea.appendChild(clone); - page = this.pagesArea.lastChild; - } - - let pagebox = page.querySelector(".pagedjs_pagebox"); - let area = page.querySelector(".pagedjs_page_content"); - let footnotesArea = page.querySelector(".pagedjs_footnote_area"); - - - let size = area.getBoundingClientRect(); - - area.style.columnWidth = Math.round(size.width) + "px"; - 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); - this.height = Math.round(size.height); - - this.element = page; - this.pagebox = pagebox; - this.area = area; - this.footnotesArea = footnotesArea; - - return page; - } - - createWrapper() { - let wrapper = document.createElement("div"); - - this.area.appendChild(wrapper); - - this.wrapper = wrapper; - - return wrapper; - } - - index(pgnum) { - this.position = pgnum; - - let page = this.element; - // let pagebox = this.pagebox; - - let index = pgnum + 1; - - let id = `page-${index}`; - - this.id = id; - - // page.dataset.pageNumber = index; - - page.dataset.pageNumber = index; - page.setAttribute("id", id); - - if (this.name) { - page.classList.add("pagedjs_" + this.name + "_page"); - } - - if (this.blank) { - page.classList.add("pagedjs_blank_page"); - } - - if (pgnum === 0) { - page.classList.add("pagedjs_first_page"); - } - - if (pgnum % 2 !== 1) { - page.classList.remove("pagedjs_left_page"); - page.classList.add("pagedjs_right_page"); - } else { - page.classList.remove("pagedjs_right_page"); - page.classList.add("pagedjs_left_page"); - } - } - - /* - size(width, height) { - if (width === this.width && height === this.height) { - return; - } - this.width = width; - this.height = height; - - this.element.style.width = Math.round(width) + "px"; - this.element.style.height = Math.round(height) + "px"; - this.element.style.columnWidth = Math.round(width) + "px"; - } - */ - - async layout (contents, breakToken, prevPage) { - - this.clear(); - - this.startToken = breakToken; - - this.layoutMethod = new Layout(this.area, this.hooks, this.settings); - - let renderResult = await this.layoutMethod.renderTo(this.wrapper, contents, breakToken, prevPage); - let newBreakToken = renderResult.breakToken; - - if (breakToken && newBreakToken && breakToken.equals(newBreakToken)) { - return; - } - - this.addListeners(contents); - - this.endToken = newBreakToken; - - return newBreakToken; - } - - async append(contents, breakToken) { - - if (!this.layoutMethod) { - return this.layout(contents, breakToken); - } - - let renderResult = await this.layoutMethod.renderTo(this.wrapper, contents, breakToken); - let newBreakToken = renderResult.breakToken; - - this.endToken = newBreakToken; - - return newBreakToken; - } - - getByParent(ref, entries) { - let e; - for (var i = 0; i < entries.length; i++) { - e = entries[i]; - if (e.dataset.ref === ref) { - return e; - } - } - } - - onOverflow(func) { - this._onOverflow = func; - } - - onUnderflow(func) { - this._onUnderflow = func; - } - - clear() { - this.removeListeners(); - this.wrapper && this.wrapper.remove(); - this.createWrapper(); - } - - addListeners(contents) { - if (typeof ResizeObserver !== "undefined") { - this.addResizeObserver(contents); - } else { - this._checkOverflowAfterResize = this.checkOverflowAfterResize.bind(this, contents); - this.element.addEventListener("overflow", this._checkOverflowAfterResize, false); - this.element.addEventListener("underflow", this._checkOverflowAfterResize, false); - } - // TODO: fall back to mutation observer? - - this._onScroll = function () { - if (this.listening) { - this.element.scrollLeft = 0; - } - }.bind(this); - - // Keep scroll left from changing - this.element.addEventListener("scroll", this._onScroll); - - this.listening = true; - - return true; - } - - removeListeners() { - this.listening = false; - - if (typeof ResizeObserver !== "undefined" && this.ro) { - this.ro.disconnect(); - } else if (this.element) { - this.element.removeEventListener("overflow", this._checkOverflowAfterResize, false); - this.element.removeEventListener("underflow", this._checkOverflowAfterResize, false); - } - - this.element && this.element.removeEventListener("scroll", this._onScroll); - - } - - addResizeObserver(contents) { - let wrapper = this.wrapper; - let prevHeight = wrapper.getBoundingClientRect().height; - this.ro = new ResizeObserver(entries => { - - if (!this.listening) { - return; - } - requestAnimationFrame(() => { - for (let entry of entries) { - const cr = entry.contentRect; - - if (cr.height > prevHeight) { - this.checkOverflowAfterResize(contents); - prevHeight = wrapper.getBoundingClientRect().height; - } else if (cr.height < prevHeight) { // TODO: calc line height && (prevHeight - cr.height) >= 22 - this.checkUnderflowAfterResize(contents); - prevHeight = cr.height; - } - } - }); - }); - - this.ro.observe(wrapper); - } - - checkOverflowAfterResize(contents) { - if (!this.listening || !this.layoutMethod) { - return; - } - - let newBreakToken = this.layoutMethod.findBreakToken(this.wrapper, contents, undefined, this.startToken); - - if (newBreakToken) { - this.endToken = newBreakToken; - this._onOverflow && this._onOverflow(newBreakToken); - } - } - - checkUnderflowAfterResize(contents) { - if (!this.listening || !this.layoutMethod) { - return; - } - - let endToken = this.layoutMethod.findEndToken(this.wrapper, contents); - - if (endToken) { - this._onUnderflow && this._onUnderflow(endToken); - } - } - - - destroy() { - this.removeListeners(); - - this.element.remove(); - - this.element = undefined; - this.wrapper = undefined; - } - } - - EventEmitter(Page.prototype); - - /** - * Render a flow of text offscreen - * @class - */ - class ContentParser { - - constructor(content, cb) { - if (content && content.nodeType) { - // handle dom - this.dom = this.add(content); - } else if (typeof content === "string") { - this.dom = this.parse(content); - } - - return this.dom; - } - - parse(markup, mime) { - let range = document.createRange(); - let fragment = range.createContextualFragment(markup); - - this.addRefs(fragment); - - return fragment; - } - - add(contents) { - // let fragment = document.createDocumentFragment(); - // - // let children = [...contents.childNodes]; - // for (let child of children) { - // let clone = child.cloneNode(true); - // fragment.appendChild(clone); - // } - - this.addRefs(contents); - - return contents; - } - - addRefs(content) { - var treeWalker = document.createTreeWalker( - content, - NodeFilter.SHOW_ELEMENT, - null, - false - ); - - let node = treeWalker.nextNode(); - while(node) { - - if (!node.hasAttribute("data-ref")) { - let uuid = UUID(); - node.setAttribute("data-ref", uuid); - } - - if (node.id) { - node.setAttribute("data-id", node.id); - } - - // node.setAttribute("data-children", node.childNodes.length); - - // node.setAttribute("data-text", node.textContent.trim().length); - node = treeWalker.nextNode(); - } - } - - find(ref) { - return this.refs[ref]; - } - - destroy() { - this.refs = undefined; - this.dom = undefined; - } - } - - /** - * Queue for handling tasks one at a time - * @class - * @param {scope} context what this will resolve to in the tasks - */ - class Queue { - constructor(context){ - this._q = []; - this.context = context; - this.tick = requestAnimationFrame; - this.running = false; - this.paused = false; - } - - /** - * Add an item to the queue - * @return {Promise} enqueued - */ - enqueue() { - var deferred, promise; - var queued; - var task = [].shift.call(arguments); - var args = arguments; - - // Handle single args without context - // if(args && !Array.isArray(args)) { - // args = [args]; - // } - if(!task) { - throw new Error("No Task Provided"); - } - - if(typeof task === "function"){ - - deferred = new defer(); - promise = deferred.promise; - - queued = { - "task" : task, - "args" : args, - //"context" : context, - "deferred" : deferred, - "promise" : promise - }; - - } else { - // Task is a promise - queued = { - "promise" : task - }; - - } - - this._q.push(queued); - - // Wait to start queue flush - if (this.paused == false && !this.running) { - this.run(); - } - - return queued.promise; - } - - /** - * Run one item - * @return {Promise} dequeued - */ - dequeue(){ - var inwait, task, result; - - if(this._q.length && !this.paused) { - inwait = this._q.shift(); - task = inwait.task; - if(task){ - // console.log(task) - - result = task.apply(this.context, inwait.args); - - if(result && typeof result["then"] === "function") { - // Task is a function that returns a promise - return result.then(function(){ - inwait.deferred.resolve.apply(this.context, arguments); - }.bind(this), function() { - inwait.deferred.reject.apply(this.context, arguments); - }.bind(this)); - } else { - // Task resolves immediately - inwait.deferred.resolve.apply(this.context, result); - return inwait.promise; - } - - - - } else if(inwait.promise) { - // Task is a promise - return inwait.promise; - } - - } else { - inwait = new defer(); - inwait.deferred.resolve(); - return inwait.promise; - } - - } - - // Run All Immediately - dump(){ - while(this._q.length) { - this.dequeue(); - } - } - - /** - * Run all tasks sequentially, at convince - * @return {Promise} all run - */ - run(){ - - if(!this.running){ - this.running = true; - this.defered = new defer(); - } - - this.tick.call(window, () => { - - if(this._q.length) { - - this.dequeue() - .then(function(){ - this.run(); - }.bind(this)); - - } else { - this.defered.resolve(); - this.running = undefined; - } - - }); - - // Unpause - if(this.paused == true) { - this.paused = false; - } - - return this.defered.promise; - } - - /** - * Flush all, as quickly as possible - * @return {Promise} ran - */ - flush(){ - - if(this.running){ - return this.running; - } - - if(this._q.length) { - this.running = this.dequeue() - .then(function(){ - this.running = undefined; - return this.flush(); - }.bind(this)); - - return this.running; - } - - } - - /** - * Clear all items in wait - * @return {void} - */ - clear(){ - this._q = []; - } - - /** - * Get the number of tasks in the queue - * @return {number} tasks - */ - length(){ - return this._q.length; - } - - /** - * Pause a running queue - * @return {void} - */ - pause(){ - this.paused = true; - } - - /** - * End the queue - * @return {void} - */ - stop(){ - this._q = []; - this.running = false; - this.paused = true; - } - } - - const TEMPLATE = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
`; - - /** - * Chop up text into flows - * @class - */ - class Chunker { - constructor(content, renderTo, options) { - // this.preview = preview; - - this.settings = options || {}; - - this.hooks = {}; - this.hooks.beforeParsed = new Hook(this); - this.hooks.filter = new Hook(this); - this.hooks.afterParsed = new Hook(this); - this.hooks.beforePageLayout = new Hook(this); - this.hooks.onPageLayout = new Hook(this); - this.hooks.layout = new Hook(this); - this.hooks.renderNode = new Hook(this); - this.hooks.layoutNode = new Hook(this); - this.hooks.onOverflow = new Hook(this); - this.hooks.afterOverflowRemoved = new Hook(this); - this.hooks.afterOverflowAdded = new Hook(this); - this.hooks.onBreakToken = new Hook(); - this.hooks.beforeRenderResult = new Hook(this); - this.hooks.afterPageLayout = new Hook(this); - this.hooks.finalizePage = new Hook(this); - this.hooks.afterRendered = new Hook(this); - - this.pages = []; - this.total = 0; - - this.q = new Queue(this); - this.stopped = false; - this.rendered = false; - - this.content = content; - - this.modifiedRules = {}; - - this.charsPerBreak = []; - this.maxChars; - - if (content) { - this.flow(content, renderTo); - } - } - - setup(renderTo) { - this.pagesArea = document.createElement("div"); - this.pagesArea.classList.add("pagedjs_pages"); - - if (renderTo) { - renderTo.appendChild(this.pagesArea); - } else { - document.querySelector("body").appendChild(this.pagesArea); - } - - this.pageTemplate = document.createElement("template"); - this.pageTemplate.innerHTML = TEMPLATE; - - } - - rulesToDisable = [ - 'breakInside', - 'overflow', - 'overflowX', - 'overflowY', - ]; - - recordRulesToDisable() { - for (var i in document.styleSheets) { - let sheet = document.styleSheets[i]; - for (var j in sheet.cssRules) { - let rule = sheet.cssRules.item(j); - if (rule && rule.style) { - for (var k in this.rulesToDisable) { - let skip = false; - let disable = this.rulesToDisable[k]; - let attribName = disable; - if (typeof disable == 'object') { - attribName = Object.keys(disable)[0]; - let value = disable[attribName]; - skip = !rule.style[attribName] || rule.style[attribName] !== value; - } - else { - skip = !rule.style[attribName]; - } - if (!skip) { - if (!this.modifiedRules[attribName]) { - this.modifiedRules[attribName] = []; - } - if (!this.modifiedRules[attribName][rule.style[attribName]]) { - this.modifiedRules[attribName][rule.style[attribName]] = []; - } - this.modifiedRules[attribName][rule.style[attribName]].push(rule); - } - } - } - } - } - } - - disableRules(rendered) { - for (var i in this.modifiedRules) { - for (var j in this.modifiedRules[i]) { - for (var k in this.modifiedRules[i][j]) { - let rule = this.modifiedRules[i][j][k]; - rule.style[i] = ''; - let nodes = rendered.querySelectorAll(rule.selectorText); - nodes.forEach((node) => { - let attribName = i.substring(0, 1).toUpperCase() + i.substring(1); - node.dataset[`original${attribName}`] = j; - }); - } - } - } - } - - enableRules(rendered) { - for (var i in this.modifiedRules) { - for (var j in this.modifiedRules[i]) { - for (var k in this.modifiedRules[i][j]) { - let rule = this.modifiedRules[i][j][k]; - rule.style[i] = j; - let nodes = rendered.querySelectorAll(rule.selectorText); - nodes.forEach((node) => { - let attribName = i.substring(0, 1).toUpperCase() + i.substring(2); - delete(node.dataset[`original${attribName}`]); - }); - } - } - } - } - - async flow(content, renderTo) { - let parsed; - - await this.hooks.beforeParsed.trigger(content, this); - - if (content) { - this.recordRulesToDisable(); - this.disableRules(content); - } - - parsed = new ContentParser(content); - - this.hooks.filter.triggerSync(parsed); - - this.source = parsed; - this.breakToken = undefined; - - if (this.pagesArea && this.pageTemplate) { - this.q.clear(); - this.removePages(); - } else { - this.setup(renderTo); - } - - this.emit("rendering", parsed); - - await this.hooks.afterParsed.trigger(parsed, this); - - await this.loadFonts(); - - let rendered = await this.render(parsed, this.breakToken); - while (rendered.canceled) { - this.start(); - rendered = await this.render(parsed, this.breakToken); - } - - this.rendered = true; - this.pagesArea.style.setProperty("--pagedjs-page-count", this.total); - - await this.hooks.afterRendered.trigger(this.pages, this); - - this.emit("rendered", this.pages); - - this.enableRules(content); - - return this; - } - - // oversetPages() { - // let overset = []; - // for (let i = 0; i < this.pages.length; i++) { - // let page = this.pages[i]; - // if (page.overset) { - // overset.push(page); - // // page.overset = false; - // } - // } - // return overset; - // } - // - // async handleOverset(parsed) { - // let overset = this.oversetPages(); - // if (overset.length) { - // console.log("overset", overset); - // let index = this.pages.indexOf(overset[0]) + 1; - // console.log("INDEX", index); - // - // // Remove pages - // // this.removePages(index); - // - // // await this.render(parsed, overset[0].overset); - // - // // return this.handleOverset(parsed); - // } - // } - - async render(parsed, startAt) { - let renderer = this.layout(parsed, startAt); - - let done = false; - let result; - while (!done) { - result = await this.q.enqueue(() => { return this.renderAsync(renderer); }); - done = result.done; - } - - return result; - } - - start() { - this.rendered = false; - this.stopped = false; - } - - stop() { - this.stopped = true; - // this.q.clear(); - } - - renderOnIdle(renderer) { - return new Promise(resolve => { - requestIdleCallback(async () => { - if (this.stopped) { - return resolve({ done: true, canceled: true }); - } - let result = await renderer.next(); - if (this.stopped) { - resolve({ done: true, canceled: true }); - } else { - resolve(result); - } - }); - }); - } - - async renderAsync(renderer) { - if (this.stopped) { - return { done: true, canceled: true }; - } - let result = await renderer.next(); - if (this.stopped) { - return { done: true, canceled: true }; - } else { - return result; - } - } - - async handleBreaks(node, force) { - let currentPage = this.total + 1; - let currentPosition = currentPage % 2 === 0 ? "left" : "right"; - // TODO: Recto and Verso should reverse for rtl languages - let currentSide = currentPage % 2 === 0 ? "verso" : "recto"; - let previousBreakAfter; - let breakBefore; - let page; - - if (currentPage === 1) { - return; - } - - if (node && - typeof node.dataset !== "undefined" && - typeof node.dataset.previousBreakAfter !== "undefined") { - previousBreakAfter = node.dataset.previousBreakAfter; - } - - if (node && - typeof node.dataset !== "undefined" && - typeof node.dataset.breakBefore !== "undefined") { - breakBefore = node.dataset.breakBefore; - } - - if (force) { - page = this.addPage(true); - } else if( previousBreakAfter && - (previousBreakAfter === "left" || previousBreakAfter === "right") && - previousBreakAfter !== currentPosition) { - page = this.addPage(true); - } else if( previousBreakAfter && - (previousBreakAfter === "verso" || previousBreakAfter === "recto") && - previousBreakAfter !== currentSide) { - page = this.addPage(true); - } else if( breakBefore && - (breakBefore === "left" || breakBefore === "right") && - breakBefore !== currentPosition) { - page = this.addPage(true); - } else if( breakBefore && - (breakBefore === "verso" || breakBefore === "recto") && - breakBefore !== currentSide) { - page = this.addPage(true); - } - - if (page) { - await this.hooks.beforePageLayout.trigger(page, undefined, undefined, this); - 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 page, prevPage, prevNumPages; - - while (breakToken !== undefined && (true)) { - - let range; - if (page && page.area.firstElementChild && page.area.firstElementChild.childElementCount) { - range = document.createRange(); - range.selectNode(page.area.firstElementChild.childNodes[0]); - range.setEndAfter(page.area.firstElementChild.lastChild); - } - - let addedExtra = false; - let emptyBody = !range || !range.getBoundingClientRect().height; - let emptyFootnotes = !page || !page.footnotesArea.firstElementChild || !page.footnotesArea.firstElementChild.childElementCount || !page.footnotesArea.firstElementChild.firstElementChild.getBoundingClientRect().height; - let emptyPage = (emptyBody && emptyFootnotes); - - prevNumPages = this.total; - - if (!page || !emptyPage) { - if (breakToken) { - if (breakToken.overflow.length && breakToken.overflow[0].node) { - // Overflow. - await this.handleBreaks(breakToken.overflow[0].node); - } - else { - await this.handleBreaks(breakToken.node); - } - } else { - await this.handleBreaks(content.firstChild); - } - } - - addedExtra = this.total != prevNumPages; - - // Don't add a page if we have a forced break now and we just - // did a break due to overflow but have nothing displayed on - // the current page, unless there's overflow and we're finished. - if (!page || addedExtra || !emptyPage) { - this.addPage(); - } - - page = this.pages[this.total - 1]; - - await this.hooks.beforePageLayout.trigger(page, content, breakToken, this); - this.emit("page", page); - - // Layout content in the page, starting from the breakToken. - breakToken = await page.layout(content, breakToken, prevPage); - - await this.hooks.afterPageLayout.trigger(page.element, page, breakToken, this); - await this.hooks.finalizePage.trigger(page.element, page, undefined, this); - this.emit("renderedPage", page); - - prevPage = page.wrapper; - - this.recoredCharLength(page.wrapper.textContent.length); - - yield breakToken; - } - - } - - recoredCharLength(length) { - if (length === 0) { - return; - } - - this.charsPerBreak.push(length); - - // Keep the length of the last few breaks - if (this.charsPerBreak.length > 4) { - this.charsPerBreak.shift(); - } - - this.maxChars = this.charsPerBreak.reduce((a, b) => a + b, 0) / (this.charsPerBreak.length); - } - - removePages(fromIndex=0) { - - if (fromIndex >= this.pages.length) { - return; - } - - // Remove pages - for (let i = fromIndex; i < this.pages.length; i++) { - this.pages[i].destroy(); - } - - if (fromIndex > 0) { - this.pages.splice(fromIndex); - } else { - this.pages = []; - } - - this.total = this.pages.length; - } - - addPage(blank) { - let lastPage = this.pages[this.pages.length - 1]; - // Create a new page from the template - let page = new Page(this.pagesArea, this.pageTemplate, blank, this.hooks, this.settings); - - this.pages.push(page); - - // Create the pages - page.create(undefined, lastPage && lastPage.element); - - page.index(this.total); - - if (!blank) { - // Listen for page overflow - page.onOverflow((overflowToken) => { - console.warn("overflow on", page.id, overflowToken); - - // Only reflow while rendering - if (this.rendered) { - return; - } - - let index = this.pages.indexOf(page) + 1; - - // Stop the rendering - this.stop(); - - // Set the breakToken to resume at - this.breakToken = overflowToken; - - // Remove pages - this.removePages(index); - - if (this.rendered === true) { - this.rendered = false; - - this.q.enqueue(async () => { - - this.start(); - - await this.render(this.source, this.breakToken); - - this.rendered = true; - - }); - } - - - }); - - page.onUnderflow((overflowToken) => { - // console.log("underflow on", page.id, overflowToken); - - // page.append(this.source, overflowToken); - - }); - } - - this.total = this.pages.length; - - return page; - } - /* - insertPage(index, blank) { - let lastPage = this.pages[index]; - // Create a new page from the template - let page = new Page(this.pagesArea, this.pageTemplate, blank, this.hooks); - - let total = this.pages.splice(index, 0, page); - - // Create the pages - page.create(undefined, lastPage && lastPage.element); - - page.index(index + 1); - - for (let i = index + 2; i < this.pages.length; i++) { - this.pages[i].index(i); - } - - if (!blank) { - // Listen for page overflow - page.onOverflow((overflowToken) => { - if (total < this.pages.length) { - this.pages[total].layout(this.source, overflowToken); - } else { - let newPage = this.addPage(); - newPage.layout(this.source, overflowToken); - } - }); - - page.onUnderflow(() => { - // console.log("underflow on", page.id); - }); - } - - this.total += 1; - - return page; - } - */ - - async clonePage(originalPage) { - let lastPage = this.pages[this.pages.length - 1]; - - let page = new Page(this.pagesArea, this.pageTemplate, false, this.hooks); - - this.pages.push(page); - - // Create the pages - page.create(undefined, lastPage && lastPage.element); - - page.index(this.total); - - await this.hooks.beforePageLayout.trigger(page, undefined, undefined, this); - this.emit("page", page); - - for (const className of originalPage.element.classList) { - if (className !== "pagedjs_left_page" && className !== "pagedjs_right_page") { - page.element.classList.add(className); - } - } - - await this.hooks.afterPageLayout.trigger(page.element, page, undefined, this); - await this.hooks.finalizePage.trigger(page.element, page, undefined, this); - this.emit("renderedPage", page); - } - - loadFonts() { - let fontPromises = []; - (document.fonts || []).forEach((fontFace) => { - if (fontFace.status !== "loaded") { - let fontLoaded = fontFace.load().then((r) => { - return fontFace.family; - }, (r) => { - console.warn("Failed to preload font-family:", fontFace.family); - return fontFace.family; - }); - fontPromises.push(fontLoaded); - } - }); - return Promise.all(fontPromises).catch((err) => { - console.warn(err); - }); - } - - destroy() { - this.pagesArea.remove(); - this.pageTemplate.remove(); - } - - } - - EventEmitter(Chunker.prototype); - - var syntax = {exports: {}}; - - var create$4 = {}; - - // - // list - // ┌──────┐ - // ┌──────────────┼─head │ - // │ │ tail─┼──────────────┐ - // │ └──────┘ │ - // ▼ ▼ - // item item item item - // ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ - // null ◀──┼─prev │◀───┼─prev │◀───┼─prev │◀───┼─prev │ - // │ next─┼───▶│ next─┼───▶│ next─┼───▶│ next─┼──▶ null - // ├──────┤ ├──────┤ ├──────┤ ├──────┤ - // │ data │ │ data │ │ data │ │ data │ - // └──────┘ └──────┘ └──────┘ └──────┘ - // - - function createItem(data) { - return { - prev: null, - next: null, - data: data - }; - } - - function allocateCursor(node, prev, next) { - var cursor; - - if (cursors !== null) { - cursor = cursors; - cursors = cursors.cursor; - cursor.prev = prev; - cursor.next = next; - cursor.cursor = node.cursor; - } else { - cursor = { - prev: prev, - next: next, - cursor: node.cursor - }; - } - - node.cursor = cursor; - - return cursor; - } - - function releaseCursor(node) { - var cursor = node.cursor; - - node.cursor = cursor.cursor; - cursor.prev = null; - cursor.next = null; - cursor.cursor = cursors; - cursors = cursor; - } - - var cursors = null; - var List$6 = function() { - this.cursor = null; - this.head = null; - this.tail = null; - }; - - List$6.createItem = createItem; - List$6.prototype.createItem = createItem; - - List$6.prototype.updateCursors = function(prevOld, prevNew, nextOld, nextNew) { - var cursor = this.cursor; - - while (cursor !== null) { - if (cursor.prev === prevOld) { - cursor.prev = prevNew; - } - - if (cursor.next === nextOld) { - cursor.next = nextNew; - } - - cursor = cursor.cursor; - } - }; - - List$6.prototype.getSize = function() { - var size = 0; - var cursor = this.head; - - while (cursor) { - size++; - cursor = cursor.next; - } - - return size; - }; - - List$6.prototype.fromArray = function(array) { - var cursor = null; - - this.head = null; - - for (var i = 0; i < array.length; i++) { - var item = createItem(array[i]); - - if (cursor !== null) { - cursor.next = item; - } else { - this.head = item; - } - - item.prev = cursor; - cursor = item; - } - - this.tail = cursor; - - return this; - }; - - List$6.prototype.toArray = function() { - var cursor = this.head; - var result = []; - - while (cursor) { - result.push(cursor.data); - cursor = cursor.next; - } - - return result; - }; - - List$6.prototype.toJSON = List$6.prototype.toArray; - - List$6.prototype.isEmpty = function() { - return this.head === null; - }; - - List$6.prototype.first = function() { - return this.head && this.head.data; - }; - - List$6.prototype.last = function() { - return this.tail && this.tail.data; - }; - - List$6.prototype.each = function(fn, context) { - var item; - - if (context === undefined) { - context = this; - } - - // push cursor - var cursor = allocateCursor(this, null, this.head); - - while (cursor.next !== null) { - item = cursor.next; - cursor.next = item.next; - - fn.call(context, item.data, item, this); - } - - // pop cursor - releaseCursor(this); - }; - - List$6.prototype.forEach = List$6.prototype.each; - - List$6.prototype.eachRight = function(fn, context) { - var item; - - if (context === undefined) { - context = this; - } - - // push cursor - var cursor = allocateCursor(this, this.tail, null); - - while (cursor.prev !== null) { - item = cursor.prev; - cursor.prev = item.prev; - - fn.call(context, item.data, item, this); - } - - // pop cursor - releaseCursor(this); - }; - - List$6.prototype.forEachRight = List$6.prototype.eachRight; - - List$6.prototype.reduce = function(fn, initialValue, context) { - var item; - - if (context === undefined) { - context = this; - } - - // push cursor - var cursor = allocateCursor(this, null, this.head); - var acc = initialValue; - - while (cursor.next !== null) { - item = cursor.next; - cursor.next = item.next; - - acc = fn.call(context, acc, item.data, item, this); - } - - // pop cursor - releaseCursor(this); - - return acc; - }; - - List$6.prototype.reduceRight = function(fn, initialValue, context) { - var item; - - if (context === undefined) { - context = this; - } - - // push cursor - var cursor = allocateCursor(this, this.tail, null); - var acc = initialValue; - - while (cursor.prev !== null) { - item = cursor.prev; - cursor.prev = item.prev; - - acc = fn.call(context, acc, item.data, item, this); - } - - // pop cursor - releaseCursor(this); - - return acc; - }; - - List$6.prototype.nextUntil = function(start, fn, context) { - if (start === null) { - return; - } - - var item; - - if (context === undefined) { - context = this; - } - - // push cursor - var cursor = allocateCursor(this, null, start); - - while (cursor.next !== null) { - item = cursor.next; - cursor.next = item.next; - - if (fn.call(context, item.data, item, this)) { - break; - } - } - - // pop cursor - releaseCursor(this); - }; - - List$6.prototype.prevUntil = function(start, fn, context) { - if (start === null) { - return; - } - - var item; - - if (context === undefined) { - context = this; - } - - // push cursor - var cursor = allocateCursor(this, start, null); - - while (cursor.prev !== null) { - item = cursor.prev; - cursor.prev = item.prev; - - if (fn.call(context, item.data, item, this)) { - break; - } - } - - // pop cursor - releaseCursor(this); - }; - - List$6.prototype.some = function(fn, context) { - var cursor = this.head; - - if (context === undefined) { - context = this; - } - - while (cursor !== null) { - if (fn.call(context, cursor.data, cursor, this)) { - return true; - } - - cursor = cursor.next; - } - - return false; - }; - - List$6.prototype.map = function(fn, context) { - var result = new List$6(); - var cursor = this.head; - - if (context === undefined) { - context = this; - } - - while (cursor !== null) { - result.appendData(fn.call(context, cursor.data, cursor, this)); - cursor = cursor.next; - } - - return result; - }; - - List$6.prototype.filter = function(fn, context) { - var result = new List$6(); - var cursor = this.head; - - if (context === undefined) { - context = this; - } - - while (cursor !== null) { - if (fn.call(context, cursor.data, cursor, this)) { - result.appendData(cursor.data); - } - cursor = cursor.next; - } - - return result; - }; - - List$6.prototype.clear = function() { - this.head = null; - this.tail = null; - }; - - List$6.prototype.copy = function() { - var result = new List$6(); - var cursor = this.head; - - while (cursor !== null) { - result.insert(createItem(cursor.data)); - cursor = cursor.next; - } - - return result; - }; - - List$6.prototype.prepend = function(item) { - // head - // ^ - // item - this.updateCursors(null, item, this.head, item); - - // insert to the beginning of the list - if (this.head !== null) { - // new item <- first item - this.head.prev = item; - - // new item -> first item - item.next = this.head; - } else { - // if list has no head, then it also has no tail - // in this case tail points to the new item - this.tail = item; - } - - // head always points to new item - this.head = item; - - return this; - }; - - List$6.prototype.prependData = function(data) { - return this.prepend(createItem(data)); - }; - - List$6.prototype.append = function(item) { - return this.insert(item); - }; - - List$6.prototype.appendData = function(data) { - return this.insert(createItem(data)); - }; - - List$6.prototype.insert = function(item, before) { - if (before !== undefined && before !== null) { - // prev before - // ^ - // item - this.updateCursors(before.prev, item, before, item); - - if (before.prev === null) { - // insert to the beginning of list - if (this.head !== before) { - throw new Error('before doesn\'t belong to list'); - } - - // since head points to before therefore list doesn't empty - // no need to check tail - this.head = item; - before.prev = item; - item.next = before; - - this.updateCursors(null, item); - } else { - - // insert between two items - before.prev.next = item; - item.prev = before.prev; - - before.prev = item; - item.next = before; - } - } else { - // tail - // ^ - // item - this.updateCursors(this.tail, item, null, item); - - // insert to the ending of the list - if (this.tail !== null) { - // last item -> new item - this.tail.next = item; - - // last item <- new item - item.prev = this.tail; - } else { - // if list has no tail, then it also has no head - // in this case head points to new item - this.head = item; - } - - // tail always points to new item - this.tail = item; - } - - return this; - }; - - List$6.prototype.insertData = function(data, before) { - return this.insert(createItem(data), before); - }; - - List$6.prototype.remove = function(item) { - // item - // ^ - // prev next - this.updateCursors(item, item.prev, item, item.next); - - if (item.prev !== null) { - item.prev.next = item.next; - } else { - if (this.head !== item) { - throw new Error('item doesn\'t belong to list'); - } - - this.head = item.next; - } - - if (item.next !== null) { - item.next.prev = item.prev; - } else { - if (this.tail !== item) { - throw new Error('item doesn\'t belong to list'); - } - - this.tail = item.prev; - } - - item.prev = null; - item.next = null; - - return item; - }; - - List$6.prototype.push = function(data) { - this.insert(createItem(data)); - }; - - List$6.prototype.pop = function() { - if (this.tail !== null) { - return this.remove(this.tail); - } - }; - - List$6.prototype.unshift = function(data) { - this.prepend(createItem(data)); - }; - - List$6.prototype.shift = function() { - if (this.head !== null) { - return this.remove(this.head); - } - }; - - List$6.prototype.prependList = function(list) { - return this.insertList(list, this.head); - }; - - List$6.prototype.appendList = function(list) { - return this.insertList(list); - }; - - List$6.prototype.insertList = function(list, before) { - // ignore empty lists - if (list.head === null) { - return this; - } - - if (before !== undefined && before !== null) { - this.updateCursors(before.prev, list.tail, before, list.head); - - // insert in the middle of dist list - if (before.prev !== null) { - // before.prev <-> list.head - before.prev.next = list.head; - list.head.prev = before.prev; - } else { - this.head = list.head; - } - - before.prev = list.tail; - list.tail.next = before; - } else { - this.updateCursors(this.tail, list.tail, null, list.head); - - // insert to end of the list - if (this.tail !== null) { - // if destination list has a tail, then it also has a head, - // but head doesn't change - - // dest tail -> source head - this.tail.next = list.head; - - // dest tail <- source head - list.head.prev = this.tail; - } else { - // if list has no a tail, then it also has no a head - // in this case points head to new item - this.head = list.head; - } - - // tail always start point to new item - this.tail = list.tail; - } - - list.head = null; - list.tail = null; - - return this; - }; - - List$6.prototype.replace = function(oldItem, newItemOrList) { - if ('head' in newItemOrList) { - this.insertList(newItemOrList, oldItem); - } else { - this.insert(newItemOrList, oldItem); - } - - this.remove(oldItem); - }; - - var List_1 = List$6; - - var createCustomError$3 = function createCustomError(name, message) { - // use Object.create(), because some VMs prevent setting line/column otherwise - // (iOS Safari 10 even throws an exception) - var error = Object.create(SyntaxError.prototype); - var errorStack = new Error(); - - error.name = name; - error.message = message; - - Object.defineProperty(error, 'stack', { - get: function() { - return (errorStack.stack || '').replace(/^(.+\n){1,3}/, name + ': ' + message + '\n'); - } - }); - - return error; - }; - - var createCustomError$2 = createCustomError$3; - var MAX_LINE_LENGTH = 100; - var OFFSET_CORRECTION = 60; - var TAB_REPLACEMENT = ' '; - - function sourceFragment(error, extraLines) { - function processLines(start, end) { - return lines.slice(start, end).map(function(line, idx) { - var num = String(start + idx + 1); - - while (num.length < maxNumLength) { - num = ' ' + num; - } - - return num + ' |' + line; - }).join('\n'); - } - - var lines = error.source.split(/\r\n?|\n|\f/); - var line = error.line; - var column = error.column; - var startLine = Math.max(1, line - extraLines) - 1; - var endLine = Math.min(line + extraLines, lines.length + 1); - var maxNumLength = Math.max(4, String(endLine).length) + 1; - var cutLeft = 0; - - // column correction according to replaced tab before column - column += (TAB_REPLACEMENT.length - 1) * (lines[line - 1].substr(0, column - 1).match(/\t/g) || []).length; - - if (column > MAX_LINE_LENGTH) { - cutLeft = column - OFFSET_CORRECTION + 3; - column = OFFSET_CORRECTION - 2; - } - - for (var i = startLine; i <= endLine; i++) { - if (i >= 0 && i < lines.length) { - lines[i] = lines[i].replace(/\t/g, TAB_REPLACEMENT); - lines[i] = - (cutLeft > 0 && lines[i].length > cutLeft ? '\u2026' : '') + - lines[i].substr(cutLeft, MAX_LINE_LENGTH - 2) + - (lines[i].length > cutLeft + MAX_LINE_LENGTH - 1 ? '\u2026' : ''); - } - } - - return [ - processLines(startLine, line), - new Array(column + maxNumLength + 2).join('-') + '^', - processLines(line, endLine) - ].filter(Boolean).join('\n'); - } - - var SyntaxError$4 = function(message, source, offset, line, column) { - var error = createCustomError$2('SyntaxError', message); - - error.source = source; - error.offset = offset; - error.line = line; - error.column = column; - - error.sourceFragment = function(extraLines) { - return sourceFragment(error, isNaN(extraLines) ? 0 : extraLines); - }; - Object.defineProperty(error, 'formattedMessage', { - get: function() { - return ( - 'Parse error: ' + error.message + '\n' + - sourceFragment(error, 2) - ); - } - }); - - // for backward capability - error.parseError = { - offset: offset, - line: line, - column: column - }; - - return error; - }; - - var _SyntaxError$1 = SyntaxError$4; - - // CSS Syntax Module Level 3 - // https://www.w3.org/TR/css-syntax-3/ - var TYPE$H = { - EOF: 0, // - Ident: 1, // - Function: 2, // - AtKeyword: 3, // - Hash: 4, // - String: 5, // - BadString: 6, // - Url: 7, // - BadUrl: 8, // - Delim: 9, // - Number: 10, // - Percentage: 11, // - Dimension: 12, // - WhiteSpace: 13, // - CDO: 14, // - CDC: 15, // - Colon: 16, // : - Semicolon: 17, // ; - Comma: 18, // , - LeftSquareBracket: 19, // <[-token> - RightSquareBracket: 20, // <]-token> - LeftParenthesis: 21, // <(-token> - RightParenthesis: 22, // <)-token> - LeftCurlyBracket: 23, // <{-token> - RightCurlyBracket: 24, // <}-token> - Comment: 25 - }; - - var NAME$3 = Object.keys(TYPE$H).reduce(function(result, key) { - result[TYPE$H[key]] = key; - return result; - }, {}); - - var _const = { - TYPE: TYPE$H, - NAME: NAME$3 - }; - - var EOF$1 = 0; - - // https://drafts.csswg.org/css-syntax-3/ - // § 4.2. Definitions - - // digit - // A code point between U+0030 DIGIT ZERO (0) and U+0039 DIGIT NINE (9). - function isDigit$5(code) { - return code >= 0x0030 && code <= 0x0039; - } - - // hex digit - // A digit, or a code point between U+0041 LATIN CAPITAL LETTER A (A) and U+0046 LATIN CAPITAL LETTER F (F), - // or a code point between U+0061 LATIN SMALL LETTER A (a) and U+0066 LATIN SMALL LETTER F (f). - function isHexDigit$4(code) { - return ( - isDigit$5(code) || // 0 .. 9 - (code >= 0x0041 && code <= 0x0046) || // A .. F - (code >= 0x0061 && code <= 0x0066) // a .. f - ); - } - - // uppercase letter - // A code point between U+0041 LATIN CAPITAL LETTER A (A) and U+005A LATIN CAPITAL LETTER Z (Z). - function isUppercaseLetter$1(code) { - return code >= 0x0041 && code <= 0x005A; - } - - // lowercase letter - // A code point between U+0061 LATIN SMALL LETTER A (a) and U+007A LATIN SMALL LETTER Z (z). - function isLowercaseLetter(code) { - return code >= 0x0061 && code <= 0x007A; - } - - // letter - // An uppercase letter or a lowercase letter. - function isLetter(code) { - return isUppercaseLetter$1(code) || isLowercaseLetter(code); - } - - // non-ASCII code point - // A code point with a value equal to or greater than U+0080 . - function isNonAscii(code) { - return code >= 0x0080; - } - - // name-start code point - // A letter, a non-ASCII code point, or U+005F LOW LINE (_). - function isNameStart(code) { - return isLetter(code) || isNonAscii(code) || code === 0x005F; - } - - // name code point - // A name-start code point, a digit, or U+002D HYPHEN-MINUS (-). - function isName$2(code) { - return isNameStart(code) || isDigit$5(code) || code === 0x002D; - } - - // non-printable code point - // A code point between U+0000 NULL and U+0008 BACKSPACE, or U+000B LINE TABULATION, - // or a code point between U+000E SHIFT OUT and U+001F INFORMATION SEPARATOR ONE, or U+007F DELETE. - function isNonPrintable(code) { - return ( - (code >= 0x0000 && code <= 0x0008) || - (code === 0x000B) || - (code >= 0x000E && code <= 0x001F) || - (code === 0x007F) - ); - } - - // newline - // U+000A LINE FEED. Note that U+000D CARRIAGE RETURN and U+000C FORM FEED are not included in this definition, - // as they are converted to U+000A LINE FEED during preprocessing. - // TODO: we doesn't do a preprocessing, so check a code point for U+000D CARRIAGE RETURN and U+000C FORM FEED - function isNewline$1(code) { - return code === 0x000A || code === 0x000D || code === 0x000C; - } - - // whitespace - // A newline, U+0009 CHARACTER TABULATION, or U+0020 SPACE. - function isWhiteSpace$2(code) { - return isNewline$1(code) || code === 0x0020 || code === 0x0009; - } - - // § 4.3.8. Check if two code points are a valid escape - function isValidEscape$2(first, second) { - // If the first code point is not U+005C REVERSE SOLIDUS (\), return false. - if (first !== 0x005C) { - return false; - } - - // Otherwise, if the second code point is a newline or EOF, return false. - if (isNewline$1(second) || second === EOF$1) { - return false; - } - - // Otherwise, return true. - return true; - } - - // § 4.3.9. Check if three code points would start an identifier - function isIdentifierStart$2(first, second, third) { - // Look at the first code point: - - // U+002D HYPHEN-MINUS - if (first === 0x002D) { - // If the second code point is a name-start code point or a U+002D HYPHEN-MINUS, - // or the second and third code points are a valid escape, return true. Otherwise, return false. - return ( - isNameStart(second) || - second === 0x002D || - isValidEscape$2(second, third) - ); - } - - // name-start code point - if (isNameStart(first)) { - // Return true. - return true; - } - - // U+005C REVERSE SOLIDUS (\) - if (first === 0x005C) { - // If the first and second code points are a valid escape, return true. Otherwise, return false. - return isValidEscape$2(first, second); - } - - // anything else - // Return false. - return false; - } - - // § 4.3.10. Check if three code points would start a number - function isNumberStart$1(first, second, third) { - // Look at the first code point: - - // U+002B PLUS SIGN (+) - // U+002D HYPHEN-MINUS (-) - if (first === 0x002B || first === 0x002D) { - // If the second code point is a digit, return true. - if (isDigit$5(second)) { - return 2; - } - - // Otherwise, if the second code point is a U+002E FULL STOP (.) - // and the third code point is a digit, return true. - // Otherwise, return false. - return second === 0x002E && isDigit$5(third) ? 3 : 0; - } - - // U+002E FULL STOP (.) - if (first === 0x002E) { - // If the second code point is a digit, return true. Otherwise, return false. - return isDigit$5(second) ? 2 : 0; - } - - // digit - if (isDigit$5(first)) { - // Return true. - return 1; - } - - // anything else - // Return false. - return 0; - } - - // - // Misc - // - - // detect BOM (https://en.wikipedia.org/wiki/Byte_order_mark) - function isBOM$2(code) { - // UTF-16BE - if (code === 0xFEFF) { - return 1; - } - - // UTF-16LE - if (code === 0xFFFE) { - return 1; - } - - return 0; - } - - // Fast code category - // - // https://drafts.csswg.org/css-syntax/#tokenizer-definitions - // > non-ASCII code point - // > A code point with a value equal to or greater than U+0080 - // > name-start code point - // > A letter, a non-ASCII code point, or U+005F LOW LINE (_). - // > name code point - // > A name-start code point, a digit, or U+002D HYPHEN-MINUS (-) - // That means only ASCII code points has a special meaning and we define a maps for 0..127 codes only - var CATEGORY = new Array(0x80); - charCodeCategory$1.Eof = 0x80; - charCodeCategory$1.WhiteSpace = 0x82; - charCodeCategory$1.Digit = 0x83; - charCodeCategory$1.NameStart = 0x84; - charCodeCategory$1.NonPrintable = 0x85; - - for (var i = 0; i < CATEGORY.length; i++) { - switch (true) { - case isWhiteSpace$2(i): - CATEGORY[i] = charCodeCategory$1.WhiteSpace; - break; - - case isDigit$5(i): - CATEGORY[i] = charCodeCategory$1.Digit; - break; - - case isNameStart(i): - CATEGORY[i] = charCodeCategory$1.NameStart; - break; - - case isNonPrintable(i): - CATEGORY[i] = charCodeCategory$1.NonPrintable; - break; - - default: - CATEGORY[i] = i || charCodeCategory$1.Eof; - } - } - - function charCodeCategory$1(code) { - return code < 0x80 ? CATEGORY[code] : charCodeCategory$1.NameStart; - } - var charCodeDefinitions$1 = { - isDigit: isDigit$5, - isHexDigit: isHexDigit$4, - isUppercaseLetter: isUppercaseLetter$1, - isLowercaseLetter: isLowercaseLetter, - isLetter: isLetter, - isNonAscii: isNonAscii, - isNameStart: isNameStart, - isName: isName$2, - isNonPrintable: isNonPrintable, - isNewline: isNewline$1, - isWhiteSpace: isWhiteSpace$2, - isValidEscape: isValidEscape$2, - isIdentifierStart: isIdentifierStart$2, - isNumberStart: isNumberStart$1, - - isBOM: isBOM$2, - charCodeCategory: charCodeCategory$1 - }; - - var charCodeDef = charCodeDefinitions$1; - var isDigit$4 = charCodeDef.isDigit; - var isHexDigit$3 = charCodeDef.isHexDigit; - var isUppercaseLetter = charCodeDef.isUppercaseLetter; - var isName$1 = charCodeDef.isName; - var isWhiteSpace$1 = charCodeDef.isWhiteSpace; - var isValidEscape$1 = charCodeDef.isValidEscape; - - function getCharCode(source, offset) { - return offset < source.length ? source.charCodeAt(offset) : 0; - } - - function getNewlineLength$1(source, offset, code) { - if (code === 13 /* \r */ && getCharCode(source, offset + 1) === 10 /* \n */) { - return 2; - } - - return 1; - } - - function cmpChar$5(testStr, offset, referenceCode) { - var code = testStr.charCodeAt(offset); - - // code.toLowerCase() for A..Z - if (isUppercaseLetter(code)) { - code = code | 32; - } - - return code === referenceCode; - } - - function cmpStr$6(testStr, start, end, referenceStr) { - if (end - start !== referenceStr.length) { - return false; - } - - if (start < 0 || end > testStr.length) { - return false; - } - - for (var i = start; i < end; i++) { - var testCode = testStr.charCodeAt(i); - var referenceCode = referenceStr.charCodeAt(i - start); - - // testCode.toLowerCase() for A..Z - if (isUppercaseLetter(testCode)) { - testCode = testCode | 32; - } - - if (testCode !== referenceCode) { - return false; - } - } - - return true; - } - - function findWhiteSpaceStart$1(source, offset) { - for (; offset >= 0; offset--) { - if (!isWhiteSpace$1(source.charCodeAt(offset))) { - break; - } - } - - return offset + 1; - } - - function findWhiteSpaceEnd$1(source, offset) { - for (; offset < source.length; offset++) { - if (!isWhiteSpace$1(source.charCodeAt(offset))) { - break; - } - } - - return offset; - } - - function findDecimalNumberEnd(source, offset) { - for (; offset < source.length; offset++) { - if (!isDigit$4(source.charCodeAt(offset))) { - break; - } - } - - return offset; - } - - // § 4.3.7. Consume an escaped code point - function consumeEscaped$1(source, offset) { - // It assumes that the U+005C REVERSE SOLIDUS (\) has already been consumed and - // that the next input code point has already been verified to be part of a valid escape. - offset += 2; - - // hex digit - if (isHexDigit$3(getCharCode(source, offset - 1))) { - // Consume as many hex digits as possible, but no more than 5. - // Note that this means 1-6 hex digits have been consumed in total. - for (var maxOffset = Math.min(source.length, offset + 5); offset < maxOffset; offset++) { - if (!isHexDigit$3(getCharCode(source, offset))) { - break; - } - } - - // If the next input code point is whitespace, consume it as well. - var code = getCharCode(source, offset); - if (isWhiteSpace$1(code)) { - offset += getNewlineLength$1(source, offset, code); - } - } - - return offset; - } - - // §4.3.11. Consume a name - // Note: This algorithm does not do the verification of the first few code points that are necessary - // to ensure the returned code points would constitute an . If that is the intended use, - // ensure that the stream starts with an identifier before calling this algorithm. - function consumeName$1(source, offset) { - // Let result initially be an empty string. - // Repeatedly consume the next input code point from the stream: - for (; offset < source.length; offset++) { - var code = source.charCodeAt(offset); - - // name code point - if (isName$1(code)) { - // Append the code point to result. - continue; - } - - // the stream starts with a valid escape - if (isValidEscape$1(code, getCharCode(source, offset + 1))) { - // Consume an escaped code point. Append the returned code point to result. - offset = consumeEscaped$1(source, offset) - 1; - continue; - } - - // anything else - // Reconsume the current input code point. Return result. - break; - } - - return offset; - } - - // §4.3.12. Consume a number - function consumeNumber$5(source, offset) { - var code = source.charCodeAt(offset); - - // 2. If the next input code point is U+002B PLUS SIGN (+) or U+002D HYPHEN-MINUS (-), - // consume it and append it to repr. - if (code === 0x002B || code === 0x002D) { - code = source.charCodeAt(offset += 1); - } - - // 3. While the next input code point is a digit, consume it and append it to repr. - if (isDigit$4(code)) { - offset = findDecimalNumberEnd(source, offset + 1); - code = source.charCodeAt(offset); - } - - // 4. If the next 2 input code points are U+002E FULL STOP (.) followed by a digit, then: - if (code === 0x002E && isDigit$4(source.charCodeAt(offset + 1))) { - // 4.1 Consume them. - // 4.2 Append them to repr. - code = source.charCodeAt(offset += 2); - - // 4.3 Set type to "number". - // TODO - - // 4.4 While the next input code point is a digit, consume it and append it to repr. - - offset = findDecimalNumberEnd(source, offset); - } - - // 5. If the next 2 or 3 input code points are U+0045 LATIN CAPITAL LETTER E (E) - // or U+0065 LATIN SMALL LETTER E (e), ... , followed by a digit, then: - if (cmpChar$5(source, offset, 101 /* e */)) { - var sign = 0; - code = source.charCodeAt(offset + 1); - - // ... optionally followed by U+002D HYPHEN-MINUS (-) or U+002B PLUS SIGN (+) ... - if (code === 0x002D || code === 0x002B) { - sign = 1; - code = source.charCodeAt(offset + 2); - } - - // ... followed by a digit - if (isDigit$4(code)) { - // 5.1 Consume them. - // 5.2 Append them to repr. - - // 5.3 Set type to "number". - // TODO - - // 5.4 While the next input code point is a digit, consume it and append it to repr. - offset = findDecimalNumberEnd(source, offset + 1 + sign + 1); - } - } - - return offset; - } - - // § 4.3.14. Consume the remnants of a bad url - // ... its sole use is to consume enough of the input stream to reach a recovery point - // where normal tokenizing can resume. - function consumeBadUrlRemnants$1(source, offset) { - // Repeatedly consume the next input code point from the stream: - for (; offset < source.length; offset++) { - var code = source.charCodeAt(offset); - - // U+0029 RIGHT PARENTHESIS ()) - // EOF - if (code === 0x0029) { - // Return. - offset++; - break; - } - - if (isValidEscape$1(code, getCharCode(source, offset + 1))) { - // Consume an escaped code point. - // Note: This allows an escaped right parenthesis ("\)") to be encountered - // without ending the . This is otherwise identical to - // the "anything else" clause. - offset = consumeEscaped$1(source, offset); - } - } - - return offset; - } - - var utils$2 = { - consumeEscaped: consumeEscaped$1, - consumeName: consumeName$1, - consumeNumber: consumeNumber$5, - consumeBadUrlRemnants: consumeBadUrlRemnants$1, - - cmpChar: cmpChar$5, - cmpStr: cmpStr$6, - - getNewlineLength: getNewlineLength$1, - findWhiteSpaceStart: findWhiteSpaceStart$1, - findWhiteSpaceEnd: findWhiteSpaceEnd$1 - }; - - var constants$2 = _const; - var TYPE$G = constants$2.TYPE; - var NAME$2 = constants$2.NAME; - - var utils$1 = utils$2; - var cmpStr$5 = utils$1.cmpStr; - - var EOF = TYPE$G.EOF; - var WHITESPACE$c = TYPE$G.WhiteSpace; - var COMMENT$a = TYPE$G.Comment; - - var OFFSET_MASK$1 = 0x00FFFFFF; - var TYPE_SHIFT$1 = 24; - - var TokenStream$4 = function() { - this.offsetAndType = null; - this.balance = null; - - this.reset(); - }; - - TokenStream$4.prototype = { - reset: function() { - this.eof = false; - this.tokenIndex = -1; - this.tokenType = 0; - this.tokenStart = this.firstCharOffset; - this.tokenEnd = this.firstCharOffset; - }, - - lookupType: function(offset) { - offset += this.tokenIndex; - - if (offset < this.tokenCount) { - return this.offsetAndType[offset] >> TYPE_SHIFT$1; - } - - return EOF; - }, - lookupOffset: function(offset) { - offset += this.tokenIndex; - - if (offset < this.tokenCount) { - return this.offsetAndType[offset - 1] & OFFSET_MASK$1; - } - - return this.source.length; - }, - lookupValue: function(offset, referenceStr) { - offset += this.tokenIndex; - - if (offset < this.tokenCount) { - return cmpStr$5( - this.source, - this.offsetAndType[offset - 1] & OFFSET_MASK$1, - this.offsetAndType[offset] & OFFSET_MASK$1, - referenceStr - ); - } - - return false; - }, - getTokenStart: function(tokenIndex) { - if (tokenIndex === this.tokenIndex) { - return this.tokenStart; - } - - if (tokenIndex > 0) { - return tokenIndex < this.tokenCount - ? this.offsetAndType[tokenIndex - 1] & OFFSET_MASK$1 - : this.offsetAndType[this.tokenCount] & OFFSET_MASK$1; - } - - return this.firstCharOffset; - }, - - // TODO: -> skipUntilBalanced - getRawLength: function(startToken, mode) { - var cursor = startToken; - var balanceEnd; - var offset = this.offsetAndType[Math.max(cursor - 1, 0)] & OFFSET_MASK$1; - var type; - - loop: - for (; cursor < this.tokenCount; cursor++) { - balanceEnd = this.balance[cursor]; - - // stop scanning on balance edge that points to offset before start token - if (balanceEnd < startToken) { - break loop; - } - - type = this.offsetAndType[cursor] >> TYPE_SHIFT$1; - - // check token is stop type - switch (mode(type, this.source, offset)) { - case 1: - break loop; - - case 2: - cursor++; - break loop; - - default: - // fast forward to the end of balanced block - if (this.balance[balanceEnd] === cursor) { - cursor = balanceEnd; - } - - offset = this.offsetAndType[cursor] & OFFSET_MASK$1; - } - } - - return cursor - this.tokenIndex; - }, - isBalanceEdge: function(pos) { - return this.balance[this.tokenIndex] < pos; - }, - isDelim: function(code, offset) { - if (offset) { - return ( - this.lookupType(offset) === TYPE$G.Delim && - this.source.charCodeAt(this.lookupOffset(offset)) === code - ); - } - - return ( - this.tokenType === TYPE$G.Delim && - this.source.charCodeAt(this.tokenStart) === code - ); - }, - - getTokenValue: function() { - return this.source.substring(this.tokenStart, this.tokenEnd); - }, - getTokenLength: function() { - return this.tokenEnd - this.tokenStart; - }, - substrToCursor: function(start) { - return this.source.substring(start, this.tokenStart); - }, - - skipWS: function() { - for (var i = this.tokenIndex, skipTokenCount = 0; i < this.tokenCount; i++, skipTokenCount++) { - if ((this.offsetAndType[i] >> TYPE_SHIFT$1) !== WHITESPACE$c) { - break; - } - } - - if (skipTokenCount > 0) { - this.skip(skipTokenCount); - } - }, - skipSC: function() { - while (this.tokenType === WHITESPACE$c || this.tokenType === COMMENT$a) { - this.next(); - } - }, - skip: function(tokenCount) { - var next = this.tokenIndex + tokenCount; - - if (next < this.tokenCount) { - this.tokenIndex = next; - this.tokenStart = this.offsetAndType[next - 1] & OFFSET_MASK$1; - next = this.offsetAndType[next]; - this.tokenType = next >> TYPE_SHIFT$1; - this.tokenEnd = next & OFFSET_MASK$1; - } else { - this.tokenIndex = this.tokenCount; - this.next(); - } - }, - next: function() { - var next = this.tokenIndex + 1; - - if (next < this.tokenCount) { - this.tokenIndex = next; - this.tokenStart = this.tokenEnd; - next = this.offsetAndType[next]; - this.tokenType = next >> TYPE_SHIFT$1; - this.tokenEnd = next & OFFSET_MASK$1; - } else { - this.tokenIndex = this.tokenCount; - this.eof = true; - this.tokenType = EOF; - this.tokenStart = this.tokenEnd = this.source.length; - } - }, - - forEachToken(fn) { - for (var i = 0, offset = this.firstCharOffset; i < this.tokenCount; i++) { - var start = offset; - var item = this.offsetAndType[i]; - var end = item & OFFSET_MASK$1; - var type = item >> TYPE_SHIFT$1; - - offset = end; - - fn(type, start, end, i); - } - }, - - dump() { - var tokens = new Array(this.tokenCount); - - this.forEachToken((type, start, end, index) => { - tokens[index] = { - idx: index, - type: NAME$2[type], - chunk: this.source.substring(start, end), - balance: this.balance[index] - }; - }); - - return tokens; - } - }; - - var TokenStream_1 = TokenStream$4; - - function noop$3(value) { - return value; - } - - function generateMultiplier(multiplier) { - if (multiplier.min === 0 && multiplier.max === 0) { - return '*'; - } - - if (multiplier.min === 0 && multiplier.max === 1) { - return '?'; - } - - if (multiplier.min === 1 && multiplier.max === 0) { - return multiplier.comma ? '#' : '+'; - } - - if (multiplier.min === 1 && multiplier.max === 1) { - return ''; - } - - return ( - (multiplier.comma ? '#' : '') + - (multiplier.min === multiplier.max - ? '{' + multiplier.min + '}' - : '{' + multiplier.min + ',' + (multiplier.max !== 0 ? multiplier.max : '') + '}' - ) - ); - } - - function generateTypeOpts(node) { - switch (node.type) { - case 'Range': - return ( - ' [' + - (node.min === null ? '-∞' : node.min) + - ',' + - (node.max === null ? '∞' : node.max) + - ']' - ); - - default: - throw new Error('Unknown node type `' + node.type + '`'); - } - } - - function generateSequence(node, decorate, forceBraces, compact) { - var combinator = node.combinator === ' ' || compact ? node.combinator : ' ' + node.combinator + ' '; - var result = node.terms.map(function(term) { - return generate$2(term, decorate, forceBraces, compact); - }).join(combinator); - - if (node.explicit || forceBraces) { - result = (compact || result[0] === ',' ? '[' : '[ ') + result + (compact ? ']' : ' ]'); - } - - return result; - } - - function generate$2(node, decorate, forceBraces, compact) { - var result; - - switch (node.type) { - case 'Group': - result = - generateSequence(node, decorate, forceBraces, compact) + - (node.disallowEmpty ? '!' : ''); - break; - - case 'Multiplier': - // return since node is a composition - return ( - generate$2(node.term, decorate, forceBraces, compact) + - decorate(generateMultiplier(node), node) - ); - - case 'Type': - result = '<' + node.name + (node.opts ? decorate(generateTypeOpts(node.opts), node.opts) : '') + '>'; - break; - - case 'Property': - result = '<\'' + node.name + '\'>'; - break; - - case 'Keyword': - result = node.name; - break; - - case 'AtKeyword': - result = '@' + node.name; - break; - - case 'Function': - result = node.name + '('; - break; - - case 'String': - case 'Token': - result = node.value; - break; - - case 'Comma': - result = ','; - break; - - default: - throw new Error('Unknown node type `' + node.type + '`'); - } - - return decorate(result, node); - } - - var generate_1 = function(node, options) { - var decorate = noop$3; - var forceBraces = false; - var compact = false; - - if (typeof options === 'function') { - decorate = options; - } else if (options) { - forceBraces = Boolean(options.forceBraces); - compact = Boolean(options.compact); - if (typeof options.decorate === 'function') { - decorate = options.decorate; - } - } - - return generate$2(node, decorate, forceBraces, compact); - }; - - const createCustomError$1 = createCustomError$3; - const generate$1 = generate_1; - const defaultLoc = { offset: 0, line: 1, column: 1 }; - - function locateMismatch(matchResult, node) { - const tokens = matchResult.tokens; - const longestMatch = matchResult.longestMatch; - const mismatchNode = longestMatch < tokens.length ? tokens[longestMatch].node || null : null; - const badNode = mismatchNode !== node ? mismatchNode : null; - let mismatchOffset = 0; - let mismatchLength = 0; - let entries = 0; - let css = ''; - let start; - let end; - - for (let i = 0; i < tokens.length; i++) { - const token = tokens[i].value; - - if (i === longestMatch) { - mismatchLength = token.length; - mismatchOffset = css.length; - } - - if (badNode !== null && tokens[i].node === badNode) { - if (i <= longestMatch) { - entries++; - } else { - entries = 0; - } - } - - css += token; - } - - if (longestMatch === tokens.length || entries > 1) { // last - start = fromLoc(badNode || node, 'end') || buildLoc(defaultLoc, css); - end = buildLoc(start); - } else { - start = fromLoc(badNode, 'start') || - buildLoc(fromLoc(node, 'start') || defaultLoc, css.slice(0, mismatchOffset)); - end = fromLoc(badNode, 'end') || - buildLoc(start, css.substr(mismatchOffset, mismatchLength)); - } - - return { - css, - mismatchOffset, - mismatchLength, - start, - end - }; - } - - function fromLoc(node, point) { - const value = node && node.loc && node.loc[point]; - - if (value) { - return 'line' in value ? buildLoc(value) : value; - } - - return null; - } - - function buildLoc({ offset, line, column }, extra) { - const loc = { - offset, - line, - column - }; - - if (extra) { - const lines = extra.split(/\n|\r\n?|\f/); - - loc.offset += extra.length; - loc.line += lines.length - 1; - loc.column = lines.length === 1 ? loc.column + extra.length : lines.pop().length + 1; - } - - return loc; - } - - const SyntaxReferenceError$1 = function(type, referenceName) { - const error = createCustomError$1( - 'SyntaxReferenceError', - type + (referenceName ? ' `' + referenceName + '`' : '') - ); - - error.reference = referenceName; - - return error; - }; - - const SyntaxMatchError$1 = function(message, syntax, node, matchResult) { - const error = createCustomError$1('SyntaxMatchError', message); - const { - css, - mismatchOffset, - mismatchLength, - start, - end - } = locateMismatch(matchResult, node); - - error.rawMessage = message; - error.syntax = syntax ? generate$1(syntax) : ''; - error.css = css; - error.mismatchOffset = mismatchOffset; - error.mismatchLength = mismatchLength; - error.message = message + '\n' + - ' syntax: ' + error.syntax + '\n' + - ' value: ' + (css || '') + '\n' + - ' --------' + new Array(error.mismatchOffset + 1).join('-') + '^'; - - Object.assign(error, start); - error.loc = { - source: (node && node.loc && node.loc.source) || '', - start, - end - }; - - return error; - }; - - var error = { - SyntaxReferenceError: SyntaxReferenceError$1, - SyntaxMatchError: SyntaxMatchError$1 - }; - - var hasOwnProperty$7 = Object.prototype.hasOwnProperty; - var keywords$1 = Object.create(null); - var properties$1 = Object.create(null); - var HYPHENMINUS$5 = 45; // '-'.charCodeAt() - - function isCustomProperty$1(str, offset) { - offset = offset || 0; - - return str.length - offset >= 2 && - str.charCodeAt(offset) === HYPHENMINUS$5 && - str.charCodeAt(offset + 1) === HYPHENMINUS$5; - } - - function getVendorPrefix(str, offset) { - offset = offset || 0; - - // verdor prefix should be at least 3 chars length - if (str.length - offset >= 3) { - // vendor prefix starts with hyper minus following non-hyper minus - if (str.charCodeAt(offset) === HYPHENMINUS$5 && - str.charCodeAt(offset + 1) !== HYPHENMINUS$5) { - // vendor prefix should contain a hyper minus at the ending - var secondDashIndex = str.indexOf('-', offset + 2); - - if (secondDashIndex !== -1) { - return str.substring(offset, secondDashIndex + 1); - } - } - } - - return ''; - } - - function getKeywordDescriptor(keyword) { - if (hasOwnProperty$7.call(keywords$1, keyword)) { - return keywords$1[keyword]; - } - - var name = keyword.toLowerCase(); - - if (hasOwnProperty$7.call(keywords$1, name)) { - return keywords$1[keyword] = keywords$1[name]; - } - - var custom = isCustomProperty$1(name, 0); - var vendor = !custom ? getVendorPrefix(name, 0) : ''; - - return keywords$1[keyword] = Object.freeze({ - basename: name.substr(vendor.length), - name: name, - vendor: vendor, - prefix: vendor, - custom: custom - }); - } - - function getPropertyDescriptor(property) { - if (hasOwnProperty$7.call(properties$1, property)) { - return properties$1[property]; - } - - var name = property; - var hack = property[0]; - - if (hack === '/') { - hack = property[1] === '/' ? '//' : '/'; - } else if (hack !== '_' && - hack !== '*' && - hack !== '$' && - hack !== '#' && - hack !== '+' && - hack !== '&') { - hack = ''; - } - - var custom = isCustomProperty$1(name, hack.length); - - // re-use result when possible (the same as for lower case) - if (!custom) { - name = name.toLowerCase(); - if (hasOwnProperty$7.call(properties$1, name)) { - return properties$1[property] = properties$1[name]; - } - } - - var vendor = !custom ? getVendorPrefix(name, hack.length) : ''; - var prefix = name.substr(0, hack.length + vendor.length); - - return properties$1[property] = Object.freeze({ - basename: name.substr(prefix.length), - name: name.substr(hack.length), - hack: hack, - vendor: vendor, - prefix: prefix, - custom: custom - }); - } - - var names$2 = { - keyword: getKeywordDescriptor, - property: getPropertyDescriptor, - isCustomProperty: isCustomProperty$1, - vendorPrefix: getVendorPrefix - }; - - var MIN_SIZE = 16 * 1024; - var SafeUint32Array = typeof Uint32Array !== 'undefined' ? Uint32Array : Array; // fallback on Array when TypedArray is not supported - - var adoptBuffer$2 = function adoptBuffer(buffer, size) { - if (buffer === null || buffer.length < size) { - return new SafeUint32Array(Math.max(size + 1024, MIN_SIZE)); - } - - return buffer; - }; - - var TokenStream$3 = TokenStream_1; - var adoptBuffer$1 = adoptBuffer$2; - - var constants$1 = _const; - var TYPE$F = constants$1.TYPE; - - var charCodeDefinitions = charCodeDefinitions$1; - var isNewline = charCodeDefinitions.isNewline; - var isName = charCodeDefinitions.isName; - var isValidEscape = charCodeDefinitions.isValidEscape; - var isNumberStart = charCodeDefinitions.isNumberStart; - var isIdentifierStart$1 = charCodeDefinitions.isIdentifierStart; - var charCodeCategory = charCodeDefinitions.charCodeCategory; - var isBOM$1 = charCodeDefinitions.isBOM; - - var utils = utils$2; - var cmpStr$4 = utils.cmpStr; - var getNewlineLength = utils.getNewlineLength; - var findWhiteSpaceEnd = utils.findWhiteSpaceEnd; - var consumeEscaped = utils.consumeEscaped; - var consumeName = utils.consumeName; - var consumeNumber$4 = utils.consumeNumber; - var consumeBadUrlRemnants = utils.consumeBadUrlRemnants; - - var OFFSET_MASK = 0x00FFFFFF; - var TYPE_SHIFT = 24; - - function tokenize$3(source, stream) { - function getCharCode(offset) { - return offset < sourceLength ? source.charCodeAt(offset) : 0; - } - - // § 4.3.3. Consume a numeric token - function consumeNumericToken() { - // Consume a number and let number be the result. - offset = consumeNumber$4(source, offset); - - // If the next 3 input code points would start an identifier, then: - if (isIdentifierStart$1(getCharCode(offset), getCharCode(offset + 1), getCharCode(offset + 2))) { - // Create a with the same value and type flag as number, and a unit set initially to the empty string. - // Consume a name. Set the ’s unit to the returned value. - // Return the . - type = TYPE$F.Dimension; - offset = consumeName(source, offset); - return; - } - - // Otherwise, if the next input code point is U+0025 PERCENTAGE SIGN (%), consume it. - if (getCharCode(offset) === 0x0025) { - // Create a with the same value as number, and return it. - type = TYPE$F.Percentage; - offset++; - return; - } - - // Otherwise, create a with the same value and type flag as number, and return it. - type = TYPE$F.Number; - } - - // § 4.3.4. Consume an ident-like token - function consumeIdentLikeToken() { - const nameStartOffset = offset; - - // Consume a name, and let string be the result. - offset = consumeName(source, offset); - - // If string’s value is an ASCII case-insensitive match for "url", - // and the next input code point is U+0028 LEFT PARENTHESIS ((), consume it. - if (cmpStr$4(source, nameStartOffset, offset, 'url') && getCharCode(offset) === 0x0028) { - // While the next two input code points are whitespace, consume the next input code point. - offset = findWhiteSpaceEnd(source, offset + 1); - - // If the next one or two input code points are U+0022 QUOTATION MARK ("), U+0027 APOSTROPHE ('), - // or whitespace followed by U+0022 QUOTATION MARK (") or U+0027 APOSTROPHE ('), - // then create a with its value set to string and return it. - if (getCharCode(offset) === 0x0022 || - getCharCode(offset) === 0x0027) { - type = TYPE$F.Function; - offset = nameStartOffset + 4; - return; - } - - // Otherwise, consume a url token, and return it. - consumeUrlToken(); - return; - } - - // Otherwise, if the next input code point is U+0028 LEFT PARENTHESIS ((), consume it. - // Create a with its value set to string and return it. - if (getCharCode(offset) === 0x0028) { - type = TYPE$F.Function; - offset++; - return; - } - - // Otherwise, create an with its value set to string and return it. - type = TYPE$F.Ident; - } - - // § 4.3.5. Consume a string token - function consumeStringToken(endingCodePoint) { - // This algorithm may be called with an ending code point, which denotes the code point - // that ends the string. If an ending code point is not specified, - // the current input code point is used. - if (!endingCodePoint) { - endingCodePoint = getCharCode(offset++); - } - - // Initially create a with its value set to the empty string. - type = TYPE$F.String; - - // Repeatedly consume the next input code point from the stream: - for (; offset < source.length; offset++) { - var code = source.charCodeAt(offset); - - switch (charCodeCategory(code)) { - // ending code point - case endingCodePoint: - // Return the . - offset++; - return; - - // EOF - case charCodeCategory.Eof: - // This is a parse error. Return the . - return; - - // newline - case charCodeCategory.WhiteSpace: - if (isNewline(code)) { - // This is a parse error. Reconsume the current input code point, - // create a , and return it. - offset += getNewlineLength(source, offset, code); - type = TYPE$F.BadString; - return; - } - break; - - // U+005C REVERSE SOLIDUS (\) - case 0x005C: - // If the next input code point is EOF, do nothing. - if (offset === source.length - 1) { - break; - } - - var nextCode = getCharCode(offset + 1); - - // Otherwise, if the next input code point is a newline, consume it. - if (isNewline(nextCode)) { - offset += getNewlineLength(source, offset + 1, nextCode); - } else if (isValidEscape(code, nextCode)) { - // Otherwise, (the stream starts with a valid escape) consume - // an escaped code point and append the returned code point to - // the ’s value. - offset = consumeEscaped(source, offset) - 1; - } - break; - - // anything else - // Append the current input code point to the ’s value. - } - } - } - - // § 4.3.6. Consume a url token - // Note: This algorithm assumes that the initial "url(" has already been consumed. - // This algorithm also assumes that it’s being called to consume an "unquoted" value, like url(foo). - // A quoted value, like url("foo"), is parsed as a . Consume an ident-like token - // automatically handles this distinction; this algorithm shouldn’t be called directly otherwise. - function consumeUrlToken() { - // Initially create a with its value set to the empty string. - type = TYPE$F.Url; - - // Consume as much whitespace as possible. - offset = findWhiteSpaceEnd(source, offset); - - // Repeatedly consume the next input code point from the stream: - for (; offset < source.length; offset++) { - var code = source.charCodeAt(offset); - - switch (charCodeCategory(code)) { - // U+0029 RIGHT PARENTHESIS ()) - case 0x0029: - // Return the . - offset++; - return; - - // EOF - case charCodeCategory.Eof: - // This is a parse error. Return the . - return; - - // whitespace - case charCodeCategory.WhiteSpace: - // Consume as much whitespace as possible. - offset = findWhiteSpaceEnd(source, offset); - - // If the next input code point is U+0029 RIGHT PARENTHESIS ()) or EOF, - // consume it and return the - // (if EOF was encountered, this is a parse error); - if (getCharCode(offset) === 0x0029 || offset >= source.length) { - if (offset < source.length) { - offset++; - } - return; - } - - // otherwise, consume the remnants of a bad url, create a , - // and return it. - offset = consumeBadUrlRemnants(source, offset); - type = TYPE$F.BadUrl; - return; - - // U+0022 QUOTATION MARK (") - // U+0027 APOSTROPHE (') - // U+0028 LEFT PARENTHESIS (() - // non-printable code point - case 0x0022: - case 0x0027: - case 0x0028: - case charCodeCategory.NonPrintable: - // This is a parse error. Consume the remnants of a bad url, - // create a , and return it. - offset = consumeBadUrlRemnants(source, offset); - type = TYPE$F.BadUrl; - return; - - // U+005C REVERSE SOLIDUS (\) - case 0x005C: - // If the stream starts with a valid escape, consume an escaped code point and - // append the returned code point to the ’s value. - if (isValidEscape(code, getCharCode(offset + 1))) { - offset = consumeEscaped(source, offset) - 1; - break; - } - - // Otherwise, this is a parse error. Consume the remnants of a bad url, - // create a , and return it. - offset = consumeBadUrlRemnants(source, offset); - type = TYPE$F.BadUrl; - return; - - // anything else - // Append the current input code point to the ’s value. - } - } - } - - if (!stream) { - stream = new TokenStream$3(); - } - - // ensure source is a string - source = String(source || ''); - - var sourceLength = source.length; - var offsetAndType = adoptBuffer$1(stream.offsetAndType, sourceLength + 1); // +1 because of eof-token - var balance = adoptBuffer$1(stream.balance, sourceLength + 1); - var tokenCount = 0; - var start = isBOM$1(getCharCode(0)); - var offset = start; - var balanceCloseType = 0; - var balanceStart = 0; - var balancePrev = 0; - - // https://drafts.csswg.org/css-syntax-3/#consume-token - // § 4.3.1. Consume a token - while (offset < sourceLength) { - var code = source.charCodeAt(offset); - var type = 0; - - balance[tokenCount] = sourceLength; - - switch (charCodeCategory(code)) { - // whitespace - case charCodeCategory.WhiteSpace: - // Consume as much whitespace as possible. Return a . - type = TYPE$F.WhiteSpace; - offset = findWhiteSpaceEnd(source, offset + 1); - break; - - // U+0022 QUOTATION MARK (") - case 0x0022: - // Consume a string token and return it. - consumeStringToken(); - break; - - // U+0023 NUMBER SIGN (#) - case 0x0023: - // If the next input code point is a name code point or the next two input code points are a valid escape, then: - if (isName(getCharCode(offset + 1)) || isValidEscape(getCharCode(offset + 1), getCharCode(offset + 2))) { - // Create a . - type = TYPE$F.Hash; - - // If the next 3 input code points would start an identifier, set the ’s type flag to "id". - // if (isIdentifierStart(getCharCode(offset + 1), getCharCode(offset + 2), getCharCode(offset + 3))) { - // // TODO: set id flag - // } - - // Consume a name, and set the ’s value to the returned string. - offset = consumeName(source, offset + 1); - - // Return the . - } else { - // Otherwise, return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - - break; - - // U+0027 APOSTROPHE (') - case 0x0027: - // Consume a string token and return it. - consumeStringToken(); - break; - - // U+0028 LEFT PARENTHESIS (() - case 0x0028: - // Return a <(-token>. - type = TYPE$F.LeftParenthesis; - offset++; - break; - - // U+0029 RIGHT PARENTHESIS ()) - case 0x0029: - // Return a <)-token>. - type = TYPE$F.RightParenthesis; - offset++; - break; - - // U+002B PLUS SIGN (+) - case 0x002B: - // If the input stream starts with a number, ... - if (isNumberStart(code, getCharCode(offset + 1), getCharCode(offset + 2))) { - // ... reconsume the current input code point, consume a numeric token, and return it. - consumeNumericToken(); - } else { - // Otherwise, return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - break; - - // U+002C COMMA (,) - case 0x002C: - // Return a . - type = TYPE$F.Comma; - offset++; - break; - - // U+002D HYPHEN-MINUS (-) - case 0x002D: - // If the input stream starts with a number, reconsume the current input code point, consume a numeric token, and return it. - if (isNumberStart(code, getCharCode(offset + 1), getCharCode(offset + 2))) { - consumeNumericToken(); - } else { - // Otherwise, if the next 2 input code points are U+002D HYPHEN-MINUS U+003E GREATER-THAN SIGN (->), consume them and return a . - if (getCharCode(offset + 1) === 0x002D && - getCharCode(offset + 2) === 0x003E) { - type = TYPE$F.CDC; - offset = offset + 3; - } else { - // Otherwise, if the input stream starts with an identifier, ... - if (isIdentifierStart$1(code, getCharCode(offset + 1), getCharCode(offset + 2))) { - // ... reconsume the current input code point, consume an ident-like token, and return it. - consumeIdentLikeToken(); - } else { - // Otherwise, return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - } - } - break; - - // U+002E FULL STOP (.) - case 0x002E: - // If the input stream starts with a number, ... - if (isNumberStart(code, getCharCode(offset + 1), getCharCode(offset + 2))) { - // ... reconsume the current input code point, consume a numeric token, and return it. - consumeNumericToken(); - } else { - // Otherwise, return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - - break; - - // U+002F SOLIDUS (/) - case 0x002F: - // If the next two input code point are U+002F SOLIDUS (/) followed by a U+002A ASTERISK (*), - if (getCharCode(offset + 1) === 0x002A) { - // ... consume them and all following code points up to and including the first U+002A ASTERISK (*) - // followed by a U+002F SOLIDUS (/), or up to an EOF code point. - type = TYPE$F.Comment; - offset = source.indexOf('*/', offset + 2) + 2; - if (offset === 1) { - offset = source.length; - } - } else { - type = TYPE$F.Delim; - offset++; - } - break; - - // U+003A COLON (:) - case 0x003A: - // Return a . - type = TYPE$F.Colon; - offset++; - break; - - // U+003B SEMICOLON (;) - case 0x003B: - // Return a . - type = TYPE$F.Semicolon; - offset++; - break; - - // U+003C LESS-THAN SIGN (<) - case 0x003C: - // If the next 3 input code points are U+0021 EXCLAMATION MARK U+002D HYPHEN-MINUS U+002D HYPHEN-MINUS (!--), ... - if (getCharCode(offset + 1) === 0x0021 && - getCharCode(offset + 2) === 0x002D && - getCharCode(offset + 3) === 0x002D) { - // ... consume them and return a . - type = TYPE$F.CDO; - offset = offset + 4; - } else { - // Otherwise, return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - - break; - - // U+0040 COMMERCIAL AT (@) - case 0x0040: - // If the next 3 input code points would start an identifier, ... - if (isIdentifierStart$1(getCharCode(offset + 1), getCharCode(offset + 2), getCharCode(offset + 3))) { - // ... consume a name, create an with its value set to the returned value, and return it. - type = TYPE$F.AtKeyword; - offset = consumeName(source, offset + 1); - } else { - // Otherwise, return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - - break; - - // U+005B LEFT SQUARE BRACKET ([) - case 0x005B: - // Return a <[-token>. - type = TYPE$F.LeftSquareBracket; - offset++; - break; - - // U+005C REVERSE SOLIDUS (\) - case 0x005C: - // If the input stream starts with a valid escape, ... - if (isValidEscape(code, getCharCode(offset + 1))) { - // ... reconsume the current input code point, consume an ident-like token, and return it. - consumeIdentLikeToken(); - } else { - // Otherwise, this is a parse error. Return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - break; - - // U+005D RIGHT SQUARE BRACKET (]) - case 0x005D: - // Return a <]-token>. - type = TYPE$F.RightSquareBracket; - offset++; - break; - - // U+007B LEFT CURLY BRACKET ({) - case 0x007B: - // Return a <{-token>. - type = TYPE$F.LeftCurlyBracket; - offset++; - break; - - // U+007D RIGHT CURLY BRACKET (}) - case 0x007D: - // Return a <}-token>. - type = TYPE$F.RightCurlyBracket; - offset++; - break; - - // digit - case charCodeCategory.Digit: - // Reconsume the current input code point, consume a numeric token, and return it. - consumeNumericToken(); - break; - - // name-start code point - case charCodeCategory.NameStart: - // Reconsume the current input code point, consume an ident-like token, and return it. - consumeIdentLikeToken(); - break; - - // EOF - case charCodeCategory.Eof: - // Return an . - break; - - // anything else - default: - // Return a with its value set to the current input code point. - type = TYPE$F.Delim; - offset++; - } - - switch (type) { - case balanceCloseType: - balancePrev = balanceStart & OFFSET_MASK; - balanceStart = balance[balancePrev]; - balanceCloseType = balanceStart >> TYPE_SHIFT; - balance[tokenCount] = balancePrev; - balance[balancePrev++] = tokenCount; - for (; balancePrev < tokenCount; balancePrev++) { - if (balance[balancePrev] === sourceLength) { - balance[balancePrev] = tokenCount; - } - } - break; - - case TYPE$F.LeftParenthesis: - case TYPE$F.Function: - balance[tokenCount] = balanceStart; - balanceCloseType = TYPE$F.RightParenthesis; - balanceStart = (balanceCloseType << TYPE_SHIFT) | tokenCount; - break; - - case TYPE$F.LeftSquareBracket: - balance[tokenCount] = balanceStart; - balanceCloseType = TYPE$F.RightSquareBracket; - balanceStart = (balanceCloseType << TYPE_SHIFT) | tokenCount; - break; - - case TYPE$F.LeftCurlyBracket: - balance[tokenCount] = balanceStart; - balanceCloseType = TYPE$F.RightCurlyBracket; - balanceStart = (balanceCloseType << TYPE_SHIFT) | tokenCount; - break; - } - - offsetAndType[tokenCount++] = (type << TYPE_SHIFT) | offset; - } - - // finalize buffers - offsetAndType[tokenCount] = (TYPE$F.EOF << TYPE_SHIFT) | offset; // - balance[tokenCount] = sourceLength; - balance[sourceLength] = sourceLength; // prevents false positive balance match with any token - while (balanceStart !== 0) { - balancePrev = balanceStart & OFFSET_MASK; - balanceStart = balance[balancePrev]; - balance[balancePrev] = sourceLength; - } - - // update stream - stream.source = source; - stream.firstCharOffset = start; - stream.offsetAndType = offsetAndType; - stream.tokenCount = tokenCount; - stream.balance = balance; - stream.reset(); - stream.next(); - - return stream; - } - - // extend tokenizer with constants - Object.keys(constants$1).forEach(function(key) { - tokenize$3[key] = constants$1[key]; - }); - - // extend tokenizer with static methods from utils - Object.keys(charCodeDefinitions).forEach(function(key) { - tokenize$3[key] = charCodeDefinitions[key]; - }); - Object.keys(utils).forEach(function(key) { - tokenize$3[key] = utils[key]; - }); - - var tokenizer$3 = tokenize$3; - - var isDigit$3 = tokenizer$3.isDigit; - var cmpChar$4 = tokenizer$3.cmpChar; - var TYPE$E = tokenizer$3.TYPE; - - var DELIM$6 = TYPE$E.Delim; - var WHITESPACE$b = TYPE$E.WhiteSpace; - var COMMENT$9 = TYPE$E.Comment; - var IDENT$i = TYPE$E.Ident; - var NUMBER$9 = TYPE$E.Number; - var DIMENSION$7 = TYPE$E.Dimension; - var PLUSSIGN$8 = 0x002B; // U+002B PLUS SIGN (+) - var HYPHENMINUS$4 = 0x002D; // U+002D HYPHEN-MINUS (-) - var N$4 = 0x006E; // U+006E LATIN SMALL LETTER N (n) - var DISALLOW_SIGN$1 = true; - var ALLOW_SIGN$1 = false; - - function isDelim$1(token, code) { - return token !== null && token.type === DELIM$6 && token.value.charCodeAt(0) === code; - } - - function skipSC(token, offset, getNextToken) { - while (token !== null && (token.type === WHITESPACE$b || token.type === COMMENT$9)) { - token = getNextToken(++offset); - } - - return offset; - } - - function checkInteger$1(token, valueOffset, disallowSign, offset) { - if (!token) { - return 0; - } - - var code = token.value.charCodeAt(valueOffset); - - if (code === PLUSSIGN$8 || code === HYPHENMINUS$4) { - if (disallowSign) { - // Number sign is not allowed - return 0; - } - valueOffset++; - } - - for (; valueOffset < token.value.length; valueOffset++) { - if (!isDigit$3(token.value.charCodeAt(valueOffset))) { - // Integer is expected - return 0; - } - } - - return offset + 1; - } - - // ... - // ... ['+' | '-'] - function consumeB$1(token, offset_, getNextToken) { - var sign = false; - var offset = skipSC(token, offset_, getNextToken); - - token = getNextToken(offset); - - if (token === null) { - return offset_; - } - - if (token.type !== NUMBER$9) { - if (isDelim$1(token, PLUSSIGN$8) || isDelim$1(token, HYPHENMINUS$4)) { - sign = true; - offset = skipSC(getNextToken(++offset), offset, getNextToken); - token = getNextToken(offset); - - if (token === null && token.type !== NUMBER$9) { - return 0; - } - } else { - return offset_; - } - } - - if (!sign) { - var code = token.value.charCodeAt(0); - if (code !== PLUSSIGN$8 && code !== HYPHENMINUS$4) { - // Number sign is expected - return 0; - } - } - - return checkInteger$1(token, sign ? 0 : 1, sign, offset); - } - - // An+B microsyntax https://www.w3.org/TR/css-syntax-3/#anb - var genericAnPlusB = function anPlusB(token, getNextToken) { - /* eslint-disable brace-style*/ - var offset = 0; - - if (!token) { - return 0; - } - - // - if (token.type === NUMBER$9) { - return checkInteger$1(token, 0, ALLOW_SIGN$1, offset); // b - } - - // -n - // -n - // -n ['+' | '-'] - // -n- - // - else if (token.type === IDENT$i && token.value.charCodeAt(0) === HYPHENMINUS$4) { - // expect 1st char is N - if (!cmpChar$4(token.value, 1, N$4)) { - return 0; - } - - switch (token.value.length) { - // -n - // -n - // -n ['+' | '-'] - case 2: - return consumeB$1(getNextToken(++offset), offset, getNextToken); - - // -n- - case 3: - if (token.value.charCodeAt(2) !== HYPHENMINUS$4) { - return 0; - } - - offset = skipSC(getNextToken(++offset), offset, getNextToken); - token = getNextToken(offset); - - return checkInteger$1(token, 0, DISALLOW_SIGN$1, offset); - - // - default: - if (token.value.charCodeAt(2) !== HYPHENMINUS$4) { - return 0; - } - - return checkInteger$1(token, 3, DISALLOW_SIGN$1, offset); - } - } - - // '+'? n - // '+'? n - // '+'? n ['+' | '-'] - // '+'? n- - // '+'? - else if (token.type === IDENT$i || (isDelim$1(token, PLUSSIGN$8) && getNextToken(offset + 1).type === IDENT$i)) { - // just ignore a plus - if (token.type !== IDENT$i) { - token = getNextToken(++offset); - } - - if (token === null || !cmpChar$4(token.value, 0, N$4)) { - return 0; - } - - switch (token.value.length) { - // '+'? n - // '+'? n - // '+'? n ['+' | '-'] - case 1: - return consumeB$1(getNextToken(++offset), offset, getNextToken); - - // '+'? n- - case 2: - if (token.value.charCodeAt(1) !== HYPHENMINUS$4) { - return 0; - } - - offset = skipSC(getNextToken(++offset), offset, getNextToken); - token = getNextToken(offset); - - return checkInteger$1(token, 0, DISALLOW_SIGN$1, offset); - - // '+'? - default: - if (token.value.charCodeAt(1) !== HYPHENMINUS$4) { - return 0; - } - - return checkInteger$1(token, 2, DISALLOW_SIGN$1, offset); - } - } - - // - // - // - // - // ['+' | '-'] - else if (token.type === DIMENSION$7) { - var code = token.value.charCodeAt(0); - var sign = code === PLUSSIGN$8 || code === HYPHENMINUS$4 ? 1 : 0; - - for (var i = sign; i < token.value.length; i++) { - if (!isDigit$3(token.value.charCodeAt(i))) { - break; - } - } - - if (i === sign) { - // Integer is expected - return 0; - } - - if (!cmpChar$4(token.value, i, N$4)) { - return 0; - } - - // - // - // ['+' | '-'] - if (i + 1 === token.value.length) { - return consumeB$1(getNextToken(++offset), offset, getNextToken); - } else { - if (token.value.charCodeAt(i + 1) !== HYPHENMINUS$4) { - return 0; - } - - // - if (i + 2 === token.value.length) { - offset = skipSC(getNextToken(++offset), offset, getNextToken); - token = getNextToken(offset); - - return checkInteger$1(token, 0, DISALLOW_SIGN$1, offset); - } - // - else { - return checkInteger$1(token, i + 2, DISALLOW_SIGN$1, offset); - } - } - } - - return 0; - }; - - var isHexDigit$2 = tokenizer$3.isHexDigit; - var cmpChar$3 = tokenizer$3.cmpChar; - var TYPE$D = tokenizer$3.TYPE; - - var IDENT$h = TYPE$D.Ident; - var DELIM$5 = TYPE$D.Delim; - var NUMBER$8 = TYPE$D.Number; - var DIMENSION$6 = TYPE$D.Dimension; - var PLUSSIGN$7 = 0x002B; // U+002B PLUS SIGN (+) - var HYPHENMINUS$3 = 0x002D; // U+002D HYPHEN-MINUS (-) - var QUESTIONMARK$2 = 0x003F; // U+003F QUESTION MARK (?) - var U$2 = 0x0075; // U+0075 LATIN SMALL LETTER U (u) - - function isDelim(token, code) { - return token !== null && token.type === DELIM$5 && token.value.charCodeAt(0) === code; - } - - function startsWith$1(token, code) { - return token.value.charCodeAt(0) === code; - } - - function hexSequence(token, offset, allowDash) { - for (var pos = offset, hexlen = 0; pos < token.value.length; pos++) { - var code = token.value.charCodeAt(pos); - - if (code === HYPHENMINUS$3 && allowDash && hexlen !== 0) { - if (hexSequence(token, offset + hexlen + 1, false) > 0) { - return 6; // dissallow following question marks - } - - return 0; // dash at the ending of a hex sequence is not allowed - } - - if (!isHexDigit$2(code)) { - return 0; // not a hex digit - } - - if (++hexlen > 6) { - return 0; // too many hex digits - } } - - return hexlen; - } - - function withQuestionMarkSequence(consumed, length, getNextToken) { - if (!consumed) { - return 0; // nothing consumed - } - - while (isDelim(getNextToken(length), QUESTIONMARK$2)) { - if (++consumed > 6) { - return 0; // too many question marks - } - - length++; - } - - return length; - } - - // https://drafts.csswg.org/css-syntax/#urange - // Informally, the production has three forms: - // U+0001 - // Defines a range consisting of a single code point, in this case the code point "1". - // U+0001-00ff - // Defines a range of codepoints between the first and the second value, in this case - // the range between "1" and "ff" (255 in decimal) inclusive. - // U+00?? - // Defines a range of codepoints where the "?" characters range over all hex digits, - // in this case defining the same as the value U+0000-00ff. - // In each form, a maximum of 6 digits is allowed for each hexadecimal number (if you treat "?" as a hexadecimal digit). - // - // = - // u '+' '?'* | - // u '?'* | - // u '?'* | - // u | - // u | - // u '+' '?'+ - var genericUrange = function urange(token, getNextToken) { - var length = 0; - - // should start with `u` or `U` - if (token === null || token.type !== IDENT$h || !cmpChar$3(token.value, 0, U$2)) { - return 0; - } - - token = getNextToken(++length); - if (token === null) { - return 0; - } - - // u '+' '?'* - // u '+' '?'+ - if (isDelim(token, PLUSSIGN$7)) { - token = getNextToken(++length); - if (token === null) { - return 0; - } - - if (token.type === IDENT$h) { - // u '+' '?'* - return withQuestionMarkSequence(hexSequence(token, 0, true), ++length, getNextToken); - } - - if (isDelim(token, QUESTIONMARK$2)) { - // u '+' '?'+ - return withQuestionMarkSequence(1, ++length, getNextToken); - } - - // Hex digit or question mark is expected - return 0; - } - - // u '?'* - // u - // u - if (token.type === NUMBER$8) { - if (!startsWith$1(token, PLUSSIGN$7)) { - return 0; - } - - var consumedHexLength = hexSequence(token, 1, true); - if (consumedHexLength === 0) { - return 0; - } - - token = getNextToken(++length); - if (token === null) { - // u - return length; - } - - if (token.type === DIMENSION$6 || token.type === NUMBER$8) { - // u - // u - if (!startsWith$1(token, HYPHENMINUS$3) || !hexSequence(token, 1, false)) { - return 0; - } - - return length + 1; - } - - // u '?'* - return withQuestionMarkSequence(consumedHexLength, length, getNextToken); - } - - // u '?'* - if (token.type === DIMENSION$6) { - if (!startsWith$1(token, PLUSSIGN$7)) { - return 0; - } - - return withQuestionMarkSequence(hexSequence(token, 1, true), ++length, getNextToken); - } - - return 0; - }; - - var tokenizer$2 = tokenizer$3; - var isIdentifierStart = tokenizer$2.isIdentifierStart; - var isHexDigit$1 = tokenizer$2.isHexDigit; - var isDigit$2 = tokenizer$2.isDigit; - var cmpStr$3 = tokenizer$2.cmpStr; - var consumeNumber$3 = tokenizer$2.consumeNumber; - var TYPE$C = tokenizer$2.TYPE; - var anPlusB = genericAnPlusB; - var urange = genericUrange; - - var cssWideKeywords$1 = ['unset', 'initial', 'inherit']; - var calcFunctionNames = ['calc(', '-moz-calc(', '-webkit-calc(']; - - // https://www.w3.org/TR/css-values-3/#lengths - var LENGTH = { - // absolute length units - 'px': true, - 'mm': true, - 'cm': true, - 'in': true, - 'pt': true, - 'pc': true, - 'q': true, - - // relative length units - 'em': true, - 'ex': true, - 'ch': true, - 'rem': true, - - // viewport-percentage lengths - 'vh': true, - 'vw': true, - 'vmin': true, - 'vmax': true, - 'vm': true - }; - - var ANGLE = { - 'deg': true, - 'grad': true, - 'rad': true, - 'turn': true - }; - - var TIME = { - 's': true, - 'ms': true - }; - - var FREQUENCY = { - 'hz': true, - 'khz': true - }; - - // https://www.w3.org/TR/css-values-3/#resolution (https://drafts.csswg.org/css-values/#resolution) - var RESOLUTION = { - 'dpi': true, - 'dpcm': true, - 'dppx': true, - 'x': true // https://github.com/w3c/csswg-drafts/issues/461 - }; - - // https://drafts.csswg.org/css-grid/#fr-unit - var FLEX = { - 'fr': true - }; - - // https://www.w3.org/TR/css3-speech/#mixing-props-voice-volume - var DECIBEL = { - 'db': true - }; - - // https://www.w3.org/TR/css3-speech/#voice-props-voice-pitch - var SEMITONES = { - 'st': true - }; - - // safe char code getter - function charCode(str, index) { - return index < str.length ? str.charCodeAt(index) : 0; - } - - function eqStr(actual, expected) { - return cmpStr$3(actual, 0, actual.length, expected); - } - - function eqStrAny(actual, expected) { - for (var i = 0; i < expected.length; i++) { - if (eqStr(actual, expected[i])) { - return true; - } - } - - return false; - } - - // IE postfix hack, i.e. 123\0 or 123px\9 - function isPostfixIeHack(str, offset) { - if (offset !== str.length - 2) { - return false; - } - - return ( - str.charCodeAt(offset) === 0x005C && // U+005C REVERSE SOLIDUS (\) - isDigit$2(str.charCodeAt(offset + 1)) - ); - } - - function outOfRange(opts, value, numEnd) { - if (opts && opts.type === 'Range') { - var num = Number( - numEnd !== undefined && numEnd !== value.length - ? value.substr(0, numEnd) - : value - ); - - if (isNaN(num)) { - return true; - } - - if (opts.min !== null && num < opts.min) { - return true; - } - - if (opts.max !== null && num > opts.max) { - return true; - } - } - - return false; - } - - function consumeFunction(token, getNextToken) { - var startIdx = token.index; - var length = 0; - - // balanced token consuming - do { - length++; - - if (token.balance <= startIdx) { - break; - } - } while (token = getNextToken(length)); - - return length; - } - - // TODO: implement - // can be used wherever , , ,