@xiee/utils - npm Package Compare versions

Comparing version 1.14.2 to 1.14.3

js/pages.js

@@ -11,6 +11,5 @@ // move elements into page boxes such that each box contains as many elements as
     fr_cls = 'pagesjs-fragmented', fr_1 = 'fragment-first', fr_2 = 'fragment-last',
-    tb = ['top', 'bottom'].map(i => {
-      const v = getComputedStyle(d.documentElement).getPropertyValue(`--paper-margin-${i}`);
-      return parseFloat(v) || 0;
-    });  // top/bottom page margin
+    tb = ['top', 'bottom'].map(i =>
+      parseFloat(getComputedStyle(d.documentElement).getPropertyValue(`--paper-margin-${i}`)) || 0
+    );  // top/bottom page margin
   tpl.className = 'pagesjs-page';
@@ -43,3 +42,4 @@ tpl.innerHTML = `<div class="pagesjs-header"></div>
     if (!el || el.tagName === 'BODY') return false;
-    const v = !el.innerText.trim();
+    // for <p>, don't treat it as empty unless its HTML is empty
+    const v = !(el.tagName === 'P' ? el.innerHTML : el.innerText).trim();
     v && el.remove();
@@ -74,4 +74,3 @@ return v;
     const t = el.tagName, c = el.firstElementChild;
-    if (fr_tag.includes(t)) return true;
-    if (t === 'P') return el.innerText.trim() && !el.matches(':has(img)');
+    if (t === 'P' || fr_tag.includes(t)) return true;
     if (t === 'DIV') {
@@ -99,3 +98,3 @@ const cs = el.children;
     if (tag === 'P') splitP(el, el2);
-    const prev = el2.previousElementSibling;
+    const prev = el2.previousElementSibling || container?.previousElementSibling;
     function fragChildren(action) {
@@ -128,3 +127,3 @@ for (let item of [...el.children]) {
       // when el has no rows left and el2 is not empty, clear el
-      const has_rows = splitTable(el, el2);
+      const has_rows = splitTable(el, el2, prev);
       el2.innerHTML && (has_rows ? nextPage() : (el.innerHTML = ''));
@@ -135,3 +134,3 @@ } else {
         // move item back to el if the clone el2 is not the only element on page or has more than one child
-        (prev || nChild(el2) > 1 || container?.previousElementSibling) && el.prepend(item);
+        (prev || nChild(el2) > 1) && el.prepend(item);
         // update the start number of <ol> on next page
@@ -162,3 +161,3 @@ tag === 'OL' && (el.start += nChild(el2));
   // split table rows
-  function splitTable(el, el2) {
+  function splitTable(el, el2, prev) {
     const tb = el.tBodies[0], tb2 = tb.cloneNode(), rows = [...tb.rows], th = el.tHead;
@@ -172,4 +171,5 @@ el2.append(tb2);
       if (box.offsetHeight > H) {
+        if (i > 0 || prev) tb.prepend(row);
         // clear the clone if current page can't fit even one row
-        tb.prepend(row); if (i === 0) el2.innerHTML = '';
+        if (i === 0 && prev) el2.innerHTML = '';
         break;
@@ -215,16 +215,27 @@ }
     // find the break position of each line (exclude block elements like footnotes)
-    const walker = d.createTreeWalker(el, NodeFilter.SHOW_TEXT);
+    const walker = d.createTreeWalker(el, NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT);
     let node, prev;
+    function collectEnds(el, i) {
+      const rect = el.getBoundingClientRect();
+      // if the previous el is at top-right of current el, assume line
+      // ends before current el (TODO: how about RTL languages?)
+      prev && prev.bottom <= rect.top && prev.right > rect.left && ends.push({node, i});
+      prev = rect;
+    }
     while (node = walker.nextNode()) {
-      const p = node.parentNode;
-      if (p !== el && p.closest('p div')) continue;
-      const txt = node.textContent;
-      if (txt.trim()) for (let i = 0; i < txt.length; i++) {
-        r.setStart(node, i); r.setEnd(node, i + 1);
-        const rect = r.getBoundingClientRect();
-        // if the previous char is at top-right of current char, assume line
-        // ends before current char (TODO: how about RTL languages?)
-        prev && prev.bottom <= rect.top && prev.right > rect.left && ends.push({node, i});
-        prev = rect;
+      if (node.tagName) {
+        if (node.tagName === 'DIV') {
+          node = walker.nextSibling();  // skip DIVs
+          if (!node) break;
+        }
+        if (node.firstChild) continue;  // for element nodes, traverse to bottom
       }
+      if (node.tagName) {
+        collectEnds(node, -1);
+      } else {
+        const txt = node.textContent;
+        if (txt.trim()) for (let i = 0; i < txt.length; i++) {
+          r.setStart(node, i); r.setEnd(node, i + 1); collectEnds(r, i);
+        }
+      }
     }
@@ -237,3 +248,4 @@ el.remove();
       if (i < 0) return;
-      const loc = ends[i]; r.setEnd(loc.node, loc.i);
+      const loc = ends[i];
+      loc.i < 0 ? r.setEndBefore(loc.node) : r.setEnd(loc.node, loc.i);
       el2.append(r.cloneContents());
@@ -268,6 +280,6 @@ done && (r.deleteContents(), nextPage());
     if (!m) return n;
-    function newPages() { return Math.ceil((h + (n - 1) * m)/H); }
-    let n2 = newPages();
+    function nPages() { return Math.ceil((h + (n - 1) * m)/H); }
+    let n2 = nPages();
     while (n2 > n) {
-      n = n2; n2 = newPages();
+      n = n2; n2 = nPages();
     }
@@ -313,4 +325,5 @@ return n;
     $$('.body').forEach(el => {
-      // move <style> into <head> so it can be applied regardless of its presence in <body>
-      const ch = [...el.children].filter(el => el.tagName !== 'STYLE' || d.head.append(el));
+      // move <style>/<link> into <head> so styles can be applied globally
+      const ch = [...el.children]
+        .filter(el => !['STYLE', 'LINK'].includes(el.tagName) || d.head.append(el));
       els.push(ch); ch.forEach(el => el.remove());
@@ -317,0 +330,0 @@ });

js/pages.min.js

@@ -1,2 +0,2 @@
-(e=>{function t(t,n=e){return n?.querySelector(t)}function n(t,n=e){return n?n.querySelectorAll(t):[]}function r(e){return e.childElementCount}const s=e.createElement("div"),i=n("h1").length>1,a=[],o=["TABLE","UL","OL","BLOCKQUOTE"],c="pagesjs-fragmented",l="fragment-first",d=["top","bottom"].map((t=>{const n=getComputedStyle(e.documentElement).getPropertyValue(`--paper-margin-${t}`);return parseFloat(n)||0}));s.className="pagesjs-page",s.innerHTML='<div class="pagesjs-header"></div>\n<div class="pagesjs-body"></div>\n<div class="pagesjs-footer"></div>';let f,p,g,h,u,m=[],E=[];function T(e){return e&&!t(".pagesjs-body",e)&&e.insertAdjacentHTML("afterbegin",s.innerHTML),f=e||s.cloneNode(!0),p=f.children[1],f.classList.add(...m),a.includes(f)||a.push(f),f}function L(e,t){const n=f;n.after(T(e)),t&&t(),H(n)}function H(e){const t=e.scrollHeight;if(t>g&&!e.dataset.pagesOffset){const r=function(e,t){let r=+e.dataset.pagesOffset;if(r)return r;if(r=Math.ceil(t/g),r<=1)return r;const s=d.concat([...n("thead",e)].map((e=>+e.offsetHeight))).reduce(((e,t)=>e+t));if(!s)return r;function i(){return Math.ceil((t+(r-1)*s)/g)}let a=i();for(;a>r;)r=a,a=i();return r}(e,t);r>1&&(e.dataset.pagesOffset=r)}e.remove()}function b(e){if(!e||"BODY"===e.tagName)return!1;const t=!e.innerText.trim();return t&&e.remove(),t}function v(e){e.classList.contains("pagesjs-page")?L(e,(()=>r(e)>3&&(p.append(...[...e.children].slice(3)),L()))):(e.innerText.trim()&&g-f.scrollHeight<h&&L(),p.append(e),f.scrollHeight>g&&(!function(e){E=[];const t=e.tagName,n=e.firstElementChild;if(o.includes(t))return!0;if("P"===t)return e.innerText.trim()&&!e.matches(":has(img)");if("DIV"===t){const t=e.children;return 1===t.length&&o.includes(n?.tagName)||[...t].filter((e=>"TABLE"===e.tagName)).length}if("PRE"!==t)return!1;if("CODE"!==n?.tagName)return!1;E=n.innerHTML.replace(/\n$/,"").split("\n");const r=E.length;return!(r<2)&&(u=n.offsetHeight/r,n.innerHTML="",!0)}(e)?L(0,(()=>p.append(e))):("P"!==e.tagName&&e.remove(),j(e))))}function N(e,t){e.innerHTML=E.slice(0,t).join("\n")}function j(t,n,s){const i=t.tagName,a=t.classList,d=a.contains(c);s?a.add(c):d?a.remove(l):a.add(c,l);const h=t.cloneNode();(n||p).append(h),"P"===i&&function(t,n){if(!t.parentNode&&(p.append(t),f.scrollHeight<=g))return n.innerHTML=t.innerHTML,void(t.innerHTML="");const r=e.createRange(),s=[],i=e.createTreeWalker(t,NodeFilter.SHOW_TEXT);let a,o;for(;a=i.nextNode();){const e=a.parentNode;if(e!==t&&e.closest("p div"))continue;const n=a.textContent;if(n.trim())for(let e=0;e<n.length;e++){r.setStart(a,e),r.setEnd(a,e+1);const t=r.getBoundingClientRect();o&&o.bottom<=t.top&&o.right>t.left&&s.push({node:a,i:e}),o=t}}function c(e,t){if(n.innerHTML="",e<0)return;const i=s[e];r.setEnd(i.node,i.i),n.append(r.cloneContents()),t&&(r.deleteContents(),L())}t.remove(),s.push({node:t,i:t.childNodes.length}),r.setStart(t,0);for(let e=0;e<s.length;e++)if(c(e),f.scrollHeight>g){c(e-1,!0);break}}(t,h);const m=h.previousElementSibling;function T(e){for(let n of[...t.children])if(h.append(n),f.scrollHeight>g){e(n);break}}if("DIV"===i)T((e=>{t.prepend(e),o.includes(e.tagName)?j(e,h,t):r(h)&&L()}));else if("PRE"===i)j(t.firstElementChild,h,t);else if("CODE"===i){const e=function(e){let t=i1=1,n=E.length,r=n+2;const s=[];for(;r>i1+1;){N(e,t);const i=g-f.offsetHeight;if(0===i)return t;if(i<0){if(t<=1)return 0;r=t}else{if(t>=n)return t;i1=t}s.push(t);const a=t+Math.round(i/u);t=s.includes(a)?t+(i>0?1:-1):a,i>0&&t>=n&&(r=n+2,t=n)}return i1}(h);N(h,e),E.splice(0,e),e>0&&(""===E.join("").trim()?E=[]:L())}else if("TABLE"===i){const e=function(e,t){const n=e.tBodies[0],r=n.cloneNode(),s=[...n.rows],i=e.tHead;t.append(r),[i,e.tFoot].forEach((e=>e&&t.append(e.cloneNode(!0))));for(let e=0;e<s.length;e++){const i=s[e];if(r.append(i),f.offsetHeight>g){n.prepend(i),0===e&&(t.innerHTML="");break}}return n.rows.length}(t,h);h.innerHTML&&(e?L():t.innerHTML="")}else o.slice(1).includes(i)&&T((e=>{(m||r(h)>1||n?.previousElementSibling)&&t.prepend(e),"OL"===i&&(t.start+=r(h)),r(h)&&L()}));const H=!E.length&&b(t),v=b(h);if(H){const e=h.classList;s?n.classList.contains(l)&&e.remove(c):e.contains(l)?e.remove(c,l):e.add("fragment-last")}else v&&(a.remove(c,l),s||L()),v&&!m||s||j(t)}function C(e){return e&&(e.dataset.shortTitle||e.innerText)}const M=C(t("h1.title, .frontmatter h1, .title, h1")),O=(i?"h1":"h2")+":not(.frontmatter *)";function S(){if("complete"!==e.readyState)return setTimeout(S,10);const r=e.body.classList;if(r.contains("pagesjs"))return;r.add("pagesjs"),e.body.insertAdjacentElement("afterbegin",T()),g=f.clientHeight||window.innerHeight,n(":is(#TOC, .footnotes, .chapter-before, .chapter-after):is(.side-left, .side-right).side").forEach((e=>{e.classList.remove("side","side-left","side-right")})),r.add("pagesjs-filling");const s=e.createElement("p"),o=f.scrollHeight;s.innerText="A",p.append(s),h=f.scrollHeight-o,s.remove(),n('#TOC a[href^="#"]').forEach((t=>{const n=e.createElement("span"),r=t.firstElementChild;for(r?.classList.contains("section-number")?r.after(n):t.insertAdjacentElement("afterbegin",n);n.nextSibling;)n.append(n.nextSibling);t.insertAdjacentHTML("beforeend",'<span class="dot-leader"></span>'),t.dataset.pageNumber="000"}));const c=[];n(".body").forEach((t=>{const n=[...t.children].filter((t=>"STYLE"!==t.tagName||e.head.append(t)));c.push(n),n.forEach((e=>e.remove()))})),n(".frontmatter, .abstract, #TOC:not(.chapter-toc)").forEach((e=>{v(e),i&&L()})),n(".body").forEach(((e,t)=>{m=["chapter","appendix"].filter((t=>e.classList.contains(t))),i&&(""===f.innerText?T(f):L()),c[t].forEach(v),b(e.parentNode),b(e)})),H(f),r.remove("pagesjs-filling");let l,d=0;a.forEach((e=>{if(i){if(t(".frontmatter",e))return;t(O,e)&&(l="")}const r=+e.dataset.pagesOffset||1;r>1&&e.classList.add("page-multiple"),d+=r,e.classList.add("page-"+(d%2==0?"even":"odd"));const s={pageNumber:d,mainTitle:M,pageTitle:l};let a;[e.children[0],e.children[2]].forEach((e=>{for(const t in s)s[t]&&(e.dataset[t]=s[t])})),l=C([...n(O,e)].pop())||l,n(".footnotes",e).forEach(((t,n)=>{0===n?(a=t,e.children[1].after(t)):(a.append(...t.children),t.remove())}))})),e.body.prepend(...a),n('#TOC a[href^="#"]').forEach((e=>{const n=t(`.pagesjs-page:has(#${CSS.escape(e.getAttribute("href").replace(/^#/,""))}) .pagesjs-header`);e.dataset.pageNumber=n?n.dataset.pageNumber:""}))}addEventListener("beforeprint",S);let y=sessionStorage.getItem("pagesjs");y&&S(),addEventListener("keypress",(e=>"p"===e.key&&(S(),y=y?"":"1",sessionStorage.setItem("pagesjs",y),y||location.reload())))})(document);
+(e=>{function t(t,n=e){return n?.querySelector(t)}function n(t,n=e){return n?n.querySelectorAll(t):[]}function r(e){return e.childElementCount}const i=e.createElement("div"),s=n("h1").length>1,a=[],o=["TABLE","UL","OL","BLOCKQUOTE"],c="pagesjs-fragmented",l="fragment-first",d=["top","bottom"].map((t=>parseFloat(getComputedStyle(e.documentElement).getPropertyValue(`--paper-margin-${t}`))||0));i.className="pagesjs-page",i.innerHTML='<div class="pagesjs-header"></div>\n<div class="pagesjs-body"></div>\n<div class="pagesjs-footer"></div>';let f,p,g,h,u,m=[],E=[];function L(e){return e&&!t(".pagesjs-body",e)&&e.insertAdjacentHTML("afterbegin",i.innerHTML),f=e||i.cloneNode(!0),p=f.children[1],f.classList.add(...m),a.includes(f)||a.push(f),f}function T(e,t){const n=f;n.after(L(e)),t&&t(),H(n)}function H(e){const t=e.scrollHeight;if(t>g&&!e.dataset.pagesOffset){const r=function(e,t){let r=+e.dataset.pagesOffset;if(r)return r;if(r=Math.ceil(t/g),r<=1)return r;const i=d.concat([...n("thead",e)].map((e=>+e.offsetHeight))).reduce(((e,t)=>e+t));if(!i)return r;function s(){return Math.ceil((t+(r-1)*i)/g)}let a=s();for(;a>r;)r=a,a=s();return r}(e,t);r>1&&(e.dataset.pagesOffset=r)}e.remove()}function b(e){if(!e||"BODY"===e.tagName)return!1;const t=!("P"===e.tagName?e.innerHTML:e.innerText).trim();return t&&e.remove(),t}function N(e){e.classList.contains("pagesjs-page")?T(e,(()=>r(e)>3&&(p.append(...[...e.children].slice(3)),T()))):(e.innerText.trim()&&g-f.scrollHeight<h&&T(),p.append(e),f.scrollHeight>g&&(!function(e){E=[];const t=e.tagName,n=e.firstElementChild;if("P"===t||o.includes(t))return!0;if("DIV"===t){const t=e.children;return 1===t.length&&o.includes(n?.tagName)||[...t].filter((e=>"TABLE"===e.tagName)).length}if("PRE"!==t)return!1;if("CODE"!==n?.tagName)return!1;E=n.innerHTML.replace(/\n$/,"").split("\n");const r=E.length;return!(r<2)&&(u=n.offsetHeight/r,n.innerHTML="",!0)}(e)?T(0,(()=>p.append(e))):("P"!==e.tagName&&e.remove(),j(e))))}function v(e,t){e.innerHTML=E.slice(0,t).join("\n")}function j(t,n,i){const s=t.tagName,a=t.classList,d=a.contains(c);i?a.add(c):d?a.remove(l):a.add(c,l);const h=t.cloneNode();(n||p).append(h),"P"===s&&function(t,n){if(!t.parentNode&&(p.append(t),f.scrollHeight<=g))return n.innerHTML=t.innerHTML,void(t.innerHTML="");const r=e.createRange(),i=[],s=e.createTreeWalker(t,NodeFilter.SHOW_TEXT|NodeFilter.SHOW_ELEMENT);let a,o;function c(e,t){const n=e.getBoundingClientRect();o&&o.bottom<=n.top&&o.right>n.left&&i.push({node:a,i:t}),o=n}for(;a=s.nextNode();){if(a.tagName){if("DIV"===a.tagName&&(a=s.nextSibling(),!a))break;if(a.firstChild)continue}if(a.tagName)c(a,-1);else{const e=a.textContent;if(e.trim())for(let t=0;t<e.length;t++)r.setStart(a,t),r.setEnd(a,t+1),c(r,t)}}function l(e,t){if(n.innerHTML="",e<0)return;const s=i[e];s.i<0?r.setEndBefore(s.node):r.setEnd(s.node,s.i),n.append(r.cloneContents()),t&&(r.deleteContents(),T())}t.remove(),i.push({node:t,i:t.childNodes.length}),r.setStart(t,0);for(let e=0;e<i.length;e++)if(l(e),f.scrollHeight>g){l(e-1,!0);break}}(t,h);const m=h.previousElementSibling||n?.previousElementSibling;function L(e){for(let n of[...t.children])if(h.append(n),f.scrollHeight>g){e(n);break}}if("DIV"===s)L((e=>{t.prepend(e),o.includes(e.tagName)?j(e,h,t):r(h)&&T()}));else if("PRE"===s)j(t.firstElementChild,h,t);else if("CODE"===s){const e=function(e){let t=i1=1,n=E.length,r=n+2;const i=[];for(;r>i1+1;){v(e,t);const s=g-f.offsetHeight;if(0===s)return t;if(s<0){if(t<=1)return 0;r=t}else{if(t>=n)return t;i1=t}i.push(t);const a=t+Math.round(s/u);t=i.includes(a)?t+(s>0?1:-1):a,s>0&&t>=n&&(r=n+2,t=n)}return i1}(h);v(h,e),E.splice(0,e),e>0&&(""===E.join("").trim()?E=[]:T())}else if("TABLE"===s){const e=function(e,t,n){const r=e.tBodies[0],i=r.cloneNode(),s=[...r.rows],a=e.tHead;t.append(i),[a,e.tFoot].forEach((e=>e&&t.append(e.cloneNode(!0))));for(let e=0;e<s.length;e++){const a=s[e];if(i.append(a),f.offsetHeight>g){(e>0||n)&&r.prepend(a),0===e&&n&&(t.innerHTML="");break}}return r.rows.length}(t,h,m);h.innerHTML&&(e?T():t.innerHTML="")}else o.slice(1).includes(s)&&L((e=>{(m||r(h)>1)&&t.prepend(e),"OL"===s&&(t.start+=r(h)),r(h)&&T()}));const H=!E.length&&b(t),N=b(h);if(H){const e=h.classList;i?n.classList.contains(l)&&e.remove(c):e.contains(l)?e.remove(c,l):e.add("fragment-last")}else N&&(a.remove(c,l),i||T()),N&&!m||i||j(t)}function M(e){return e&&(e.dataset.shortTitle||e.innerText)}const C=M(t("h1.title, .frontmatter h1, .title, h1")),S=(s?"h1":"h2")+":not(.frontmatter *)";function O(){if("complete"!==e.readyState)return setTimeout(O,10);const r=e.body.classList;if(r.contains("pagesjs"))return;r.add("pagesjs"),e.body.insertAdjacentElement("afterbegin",L()),g=f.clientHeight||window.innerHeight,n(":is(#TOC, .footnotes, .chapter-before, .chapter-after):is(.side-left, .side-right).side").forEach((e=>{e.classList.remove("side","side-left","side-right")})),r.add("pagesjs-filling");const i=e.createElement("p"),o=f.scrollHeight;i.innerText="A",p.append(i),h=f.scrollHeight-o,i.remove(),n('#TOC a[href^="#"]').forEach((t=>{const n=e.createElement("span"),r=t.firstElementChild;for(r?.classList.contains("section-number")?r.after(n):t.insertAdjacentElement("afterbegin",n);n.nextSibling;)n.append(n.nextSibling);t.insertAdjacentHTML("beforeend",'<span class="dot-leader"></span>'),t.dataset.pageNumber="000"}));const c=[];n(".body").forEach((t=>{const n=[...t.children].filter((t=>!["STYLE","LINK"].includes(t.tagName)||e.head.append(t)));c.push(n),n.forEach((e=>e.remove()))})),n(".frontmatter, .abstract, #TOC:not(.chapter-toc)").forEach((e=>{N(e),s&&T()})),n(".body").forEach(((e,t)=>{m=["chapter","appendix"].filter((t=>e.classList.contains(t))),s&&(""===f.innerText?L(f):T()),c[t].forEach(N),b(e.parentNode),b(e)})),H(f),r.remove("pagesjs-filling");let l,d=0;a.forEach((e=>{if(s){if(t(".frontmatter",e))return;t(S,e)&&(l="")}const r=+e.dataset.pagesOffset||1;r>1&&e.classList.add("page-multiple"),d+=r,e.classList.add("page-"+(d%2==0?"even":"odd"));const i={pageNumber:d,mainTitle:C,pageTitle:l};let a;[e.children[0],e.children[2]].forEach((e=>{for(const t in i)i[t]&&(e.dataset[t]=i[t])})),l=M([...n(S,e)].pop())||l,n(".footnotes",e).forEach(((t,n)=>{0===n?(a=t,e.children[1].after(t)):(a.append(...t.children),t.remove())}))})),e.body.prepend(...a),n('#TOC a[href^="#"]').forEach((e=>{const n=t(`.pagesjs-page:has(#${CSS.escape(e.getAttribute("href").replace(/^#/,""))}) .pagesjs-header`);e.dataset.pageNumber=n?n.dataset.pageNumber:""}))}addEventListener("beforeprint",O);let y=sessionStorage.getItem("pagesjs");y&&O(),addEventListener("keypress",(e=>"p"===e.key&&(O(),y=y?"":"1",sessionStorage.setItem("pagesjs",y),y||location.reload())))})(document);
 //# sourceMappingURL=pages.min.js.map

package.json

 {
   "name": "@xiee/utils",
-  "version": "1.14.2",
+  "version": "1.14.3",
   "description": "Miscellaneous tools and utilities to manipulate HTML pages",
@@ -5,0 +5,0 @@ "scripts": {

No alert changes

Improved metrics

Total package byte prevSize

252065

increased by0.31%

Lines of code

3105

increased by0.42%

No dependency changes