New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

pagedjs

Package Overview
Dependencies
Maintainers
1
Versions
62
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

pagedjs - npm Package Compare versions

Comparing version 0.1.2 to 0.1.4

lib/modules/paged-media/print-media.js

4

lib/chunker/chunker.js

@@ -51,3 +51,3 @@ "use strict";

var TEMPLATE = "<div class=\"page\">\n\t<div class=\"top\">\n\t\t<div class=\"top-left-corner\"><div class=\"content\"></div></div>\n\t\t<div class=\"top-left\"><div class=\"content\"></div></div>\n\t\t<div class=\"top-center\"><div class=\"content\"></div></div>\n\t\t<div class=\"top-right\"><div class=\"content\"></div></div>\n\t\t<div class=\"top-right-corner\"><div class=\"content\"></div></div>\n\t</div>\n\t<div class=\"right\">\n\t\t<div class=\"right-top\"><div class=\"content\"></div></div>\n\t\t<div class=\"right-middle\"><div class=\"content\"></div></div>\n\t\t<div class=\"right-bottom\"><div class=\"content\"></div></div>\n\t</div>\n\t<div class=\"left\">\n\t\t<div class=\"left-top\"><div class=\"content\"></div></div>\n\t\t<div class=\"left-middle\"><div class=\"content\"></div></div>\n\t\t<div class=\"left-bottom\"><div class=\"content\"></div></div>\n\t</div>\n\t<div class=\"bottom\">\n\t\t<div class=\"bottom-left-corner\"><div class=\"content\"></div></div>\n\t\t<div class=\"bottom-left\"><div class=\"content\"></div></div>\n\t\t<div class=\"bottom-center\"><div class=\"content\"></div></div>\n\t\t<div class=\"bottom-right\"><div class=\"content\"></div></div>\n\t\t<div class=\"bottom-right-corner\"><div class=\"content\"></div></div>\n\t</div>\n\t<div class=\"area\"></div>\n</div>";
var TEMPLATE = "<div class=\"pagedjs_page\">\n\t<div class=\"pagedjs_margin-top\">\n\t\t<div class=\"pagedjs_margin-top-left-corner\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-top-left\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-top-center\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-top-right\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-top-right-corner\"><div class=\"pagedjs_margin-content\"></div></div>\n\t</div>\n\t<div class=\"pagedjs_margin-right\">\n\t\t<div class=\"pagedjs_margin-right-top\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-right-middle\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-right-bottom\"><div class=\"pagedjs_margin-content\"></div></div>\n\t</div>\n\t<div class=\"pagedjs_margin-left\">\n\t\t<div class=\"pagedjs_margin-left-top\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-left-middle\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-left-bottom\"><div class=\"pagedjs_margin-content\"></div></div>\n\t</div>\n\t<div class=\"pagedjs_margin-bottom\">\n\t\t<div class=\"pagedjs_margin-bottom-left-corner\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-bottom-left\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-bottom-center\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-bottom-right\"><div class=\"pagedjs_margin-content\"></div></div>\n\t\t<div class=\"pagedjs_margin-bottom-right-corner\"><div class=\"pagedjs_margin-content\"></div></div>\n\t</div>\n\t<div class=\"pagedjs_area\"></div>\n</div>";

@@ -88,3 +88,3 @@ /**

this.pagesArea = document.createElement("div");
this.pagesArea.classList.add("pages");
this.pagesArea.classList.add("pagedjs_pages");

@@ -91,0 +91,0 @@ if (renderTo) {

@@ -62,3 +62,3 @@ "use strict";

var area = page.querySelector(".area");
var area = page.querySelector(".pagedjs_area");

@@ -107,19 +107,19 @@ var size = area.getBoundingClientRect();

if (this.name) {
page.classList.add(this.name + "_page");
page.classList.add("pagedjs_" + this.name + "_page");
}
if (this.blank) {
page.classList.add("blank_page");
page.classList.add("pagedjs_blank_page");
}
if (pgnum === 0) {
page.classList.add("first_page");
page.classList.add("pagedjs_first_page");
}
if (pgnum % 2 !== 1) {
page.classList.remove("left_page");
page.classList.add("right_page");
page.classList.remove("pagedjs_left_page");
page.classList.add("pagedjs_right_page");
} else {
page.classList.remove("right_page");
page.classList.add("left_page");
page.classList.remove("pagedjs_right_page");
page.classList.add("pagedjs_left_page");
}

@@ -126,0 +126,0 @@ }

@@ -104,3 +104,3 @@ "use strict";

var query = split[0];
var queried = fragment.querySelectorAll(query + ":not([data-target-counter])");
var queried = chunker.pagesArea.querySelectorAll(query + ":not([data-target-counter])");

@@ -120,3 +120,3 @@ queried.forEach(function (selected, index) {

if (target.counter === "page") {
var pages = chunker.pagesArea.querySelectorAll(".page");
var pages = chunker.pagesArea.querySelectorAll(".pagedjs_page");
var pg = 0;

@@ -123,0 +123,0 @@ for (var i = 0; i < pages.length; i++) {

@@ -427,3 +427,3 @@ 'use strict';

type: 'ClassSelector',
name: 'page'
name: 'pagedjs_page'
}));

@@ -435,3 +435,3 @@

type: 'ClassSelector',
name: page.name + "_page"
name: "pagedjs_" + page.name + "_page"
}));

@@ -451,3 +451,3 @@ }

type: 'ClassSelector',
name: page.psuedo + "_page"
name: "pagedjs_" + page.psuedo + "_page"
}));

@@ -511,5 +511,8 @@ }

if (page.width) {
this.addDimensions(page.width, page.height, children, children.first());
}
// Disabled due to causing issues with Chrome on print
/*
if (page.width) {
this.addDimensions(page.width, page.height, children, children.first());
}
*/

@@ -622,3 +625,3 @@ if (page.marginalia) {

type: 'ClassSelector',
name: 'page'
name: 'pagedjs_page'
}));

@@ -631,3 +634,3 @@

type: 'ClassSelector',
name: page.name + "_page"
name: "pagedjs_" + page.name + "_page"
}));

@@ -640,3 +643,3 @@ }

type: 'ClassSelector',
name: page.psuedo + "_page"
name: "pagedjs_" + page.psuedo + "_page"
}));

@@ -652,3 +655,3 @@ }

type: 'ClassSelector',
name: loc
name: "pagedjs_margin-" + loc
}));

@@ -663,3 +666,3 @@

type: 'ClassSelector',
name: "content"
name: "pagedjs_margin-content"
}));

@@ -709,3 +712,3 @@

type: 'ClassSelector',
name: 'page'
name: 'pagedjs_page'
}));

@@ -718,3 +721,3 @@

type: 'ClassSelector',
name: page.name + "_page"
name: "pagedjs_" + page.name + "_page"
}));

@@ -727,3 +730,3 @@ }

type: 'ClassSelector',
name: page.psuedo + "_page"
name: "pagedjs_" + page.psuedo + "_page"
}));

@@ -739,3 +742,3 @@ }

type: 'ClassSelector',
name: _loc
name: "pagedjs_margin-" + _loc
}));

@@ -750,3 +753,3 @@

type: 'ClassSelector',
name: "content"
name: "pagedjs_margin-content"
}));

@@ -753,0 +756,0 @@

@@ -249,3 +249,3 @@ "use strict";

page.name = named.dataset.page;
page.element.classList.add(named.dataset.page + "_page");
page.element.classList.add("pagedjs_" + named.dataset.page + "_page");
}

@@ -252,0 +252,0 @@ }

@@ -15,4 +15,8 @@ 'use strict';

var _printMedia = require('./print-media');
var _printMedia2 = _interopRequireDefault(_printMedia);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = [_atpage2.default, _breaks2.default];
exports.default = [_atpage2.default, _breaks2.default, _printMedia2.default];

@@ -6,2 +6,2 @@ "use strict";

});
exports.default = "\n:root {\n --width: 8.5in;\n --height: 11in;\n --margin-top: 1in;\n --margin-right: 1in;\n --margin-bottom: 1in;\n --margin-left: 1in;\n}\n\n@page {\n size: var(--width) var(--height);\n}\n\n.page {\n box-sizing: border-box;\n width: var(--width);\n height: var(--height);\n overflow: hidden;\n position: relative;\n display: grid;\n grid-template-columns: [left] var(--margin-left) [center] calc(var(--width) - var(--margin-left) - var(--margin-right)) [right] var(--margin-right);\n grid-template-rows: [header] var(--margin-top) [page] calc(var(--height) - var(--margin-top) - var(--margin-bottom)) [footer] var(--margin-bottom);\n}\n\n.page * {\n box-sizing: border-box;\n}\n\n.top {\n width: var(--width);\n height: var(--margin-top);\n display: flex;\n grid-column: left / right;\n grid-row: header;\n}\n\n.top .top-left-corner {\n width: var(--margin-left);\n height: var(--margin-top);\n flex: none;\n}\n\n.top .top-right-corner {\n width: var(--margin-right);\n height: var(--margin-top);\n flex: none;\n}\n\n.top > div {\n flex-grow: 1;\n position: relative;\n}\n\n.right {\n height: calc(var(--height) - var(--margin-top) - var(--margin-bottom));\n width: var(--margin-right);\n display: flex;\n flex-direction: column;\n right: 0;\n grid-column: right;\n grid-row: page;\n}\n\n.right > div {\n flex-grow: 1;\n position: relative;\n}\n\n.bottom {\n width: var(--width);\n height: var(--margin-bottom);\n display: flex;\n grid-column: left / right;\n grid-row: footer;\n}\n\n.bottom .bottom-left-corner {\n width: var(--margin-left);\n height: var(--margin-bottom);\n flex: none;\n}\n\n.bottom .bottom-right-corner {\n width: var(--margin-right);\n height: var(--margin-bottom);\n flex: none;\n}\n\n.bottom > div {\n flex-grow: 1;\n position: relative;\n}\n\n.left {\n height: calc(var(--height) - var(--margin-top) - var(--margin-bottom));\n width: var(--margin-left);\n display: flex;\n flex-direction: column;\n grid-column: left;\n grid-row: page;\n}\n\n.left > div {\n flex-grow: 1;\n position: relative;\n}\n\n.page > .area {\n grid-column: center;\n grid-row: page;\n width: 100%;\n height: 100%;\n}\n\n.page {\n counter-increment: page;\n}\n\n\n.page .top > div,\n.page .bottom > div {\n height: 100%;\n display: flex;\n align-items: center;\n}\n\n.page .left > div,\n.page .right > div {\n width: 100%;\n display: flex;\n align-items: center;\n}\n\n.pages .left .content::after,\n.pages .top .content::after,\n.pages .right .content::after,\n.pages .bottom .content::after {\n display: block;\n}\n\n.pages > .page > .area > div [data-split-from] {\n text-indent: unset;\n margin-top: unset;\n padding-top: unset;\n initial-letter: unset;\n}\n\n.pages > .page > .area > div [data-split-from] > *::first-letter,\n.pages > .page > .area > div [data-split-from]::first-letter {\n color: unset;\n font-size: unset;\n font-wieght: unset;\n font-family: unset;\n color: unset;\n line-height: unset;\n float: unset;\n padding: unset;\n margin: unset;\n}\n\n[data-page]:not([data-split-from]),\n[data-break-before=\"page\"]:not([data-split-from]),\n[data-break-before=\"always\"]:not([data-split-from]),\n[data-break-before=\"left\"]:not([data-split-from]),\n[data-break-before=\"right\"]:not([data-split-from]),\n[data-break-before=\"recto\"]:not([data-split-from]),\n[data-break-before=\"verso\"]:not([data-split-from])\n{\n break-before: column;\n}\n\n[data-page]:not([data-split-to]),\n[data-break-after=\"page\"]:not([data-split-to]),\n[data-break-after=\"always\"]:not([data-split-to]),\n[data-break-after=\"left\"]:not([data-split-to]),\n[data-break-after=\"right\"]:not([data-split-to]),\n[data-break-after=\"recto\"]:not([data-split-to]),\n[data-break-after=\"verso\"]:not([data-split-to])\n{\n break-after: column;\n}\n\n@media print {\n body {\n width: var(--width);\n height: var(--height);\n margin: 0;\n padding: 0;\n }\n .pages {\n width: var(--width);\n flex-direction: column;\n }\n .page {\n break-before: always;\n }\n}\n";
exports.default = "\n:root {\n --width: 8.5in;\n --height: 11in;\n --margin-top: 1in;\n --margin-right: 1in;\n --margin-bottom: 1in;\n --margin-left: 1in;\n}\n\n@page {\n size: letter;\n}\n\n.pagedjs_page {\n box-sizing: border-box;\n width: var(--width);\n height: var(--height);\n overflow: hidden;\n position: relative;\n display: grid;\n grid-template-columns: [left] var(--margin-left) [center] calc(var(--width) - var(--margin-left) - var(--margin-right)) [right] var(--margin-right);\n grid-template-rows: [header] var(--margin-top) [page] calc(var(--height) - var(--margin-top) - var(--margin-bottom)) [footer] var(--margin-bottom);\n}\n\n.pagedjs_page * {\n box-sizing: border-box;\n}\n\n.pagedjs_margin-top {\n width: var(--width);\n height: var(--margin-top);\n display: flex;\n grid-column: left / right;\n grid-row: header;\n}\n\n.pagedjs_margin-top .pagedjs_margin-top-left-corner {\n width: var(--margin-left);\n height: var(--margin-top);\n flex: none;\n}\n\n.pagedjs_margin-top .pagedjs_margin-top-right-corner {\n width: var(--margin-right);\n height: var(--margin-top);\n flex: none;\n}\n\n.pagedjs_margin-top > div {\n flex-grow: 1;\n position: relative;\n}\n\n.pagedjs_margin-right {\n height: calc(var(--height) - var(--margin-top) - var(--margin-bottom));\n width: var(--margin-right);\n display: flex;\n flex-direction: column;\n right: 0;\n grid-column: right;\n grid-row: page;\n}\n\n.pagedjs_margin-right > div {\n flex-grow: 1;\n position: relative;\n}\n\n.pagedjs_margin-bottom {\n width: var(--width);\n height: var(--margin-bottom);\n display: flex;\n grid-column: left / right;\n grid-row: footer;\n}\n\n.pagedjs_margin-bottom .pagedjs_margin-bottom-left-corner {\n width: var(--margin-left);\n height: var(--margin-bottom);\n flex: none;\n}\n\n.pagedjs_margin-bottom .pagedjs_margin-bottom-right-corner {\n width: var(--margin-right);\n height: var(--margin-bottom);\n flex: none;\n}\n\n.pagedjs_margin-bottom > div {\n flex-grow: 1;\n position: relative;\n}\n\n.pagedjs_margin-left {\n height: calc(var(--height) - var(--margin-top) - var(--margin-bottom));\n width: var(--margin-left);\n display: flex;\n flex-direction: column;\n grid-column: left;\n grid-row: page;\n}\n\n.pagedjs_margin-left > div {\n flex-grow: 1;\n position: relative;\n}\n\n.pagedjs_page > .pagedjs_area {\n grid-column: center;\n grid-row: page;\n width: 100%;\n height: 100%;\n}\n\n.pagedjs_page {\n counter-increment: page;\n}\n\n\n.pagedjs_page .pagedjs_margin-top > div,\n.pagedjs_page .pagedjs_margin-bottom > div {\n height: 100%;\n display: flex;\n align-items: center;\n}\n\n.pagedjs_page .pagedjs_margin-left > div,\n.pagedjs_page .pagedjs_margin-right > div {\n width: 100%;\n display: flex;\n align-items: center;\n}\n\n.pagedjs_pages .pagedjs_margin-left .pagedjs_margin-content::after,\n.pagedjs_pages .pagedjs_margin-top .pagedjs_margin-content::after,\n.pagedjs_pages .pagedjs_margin-right .pagedjs_margin-content::after,\n.pagedjs_pages .pagedjs_margin-bottom .pagedjs_margin-content::after {\n display: block;\n}\n\n.pagedjs_pages > .pagedjs_page > .pagedjs_area > div [data-split-from] {\n text-indent: unset;\n margin-top: unset;\n padding-top: unset;\n initial-letter: unset;\n}\n\n.pagedjs_pages > .pagedjs_page > .pagedjs_area > div [data-split-from] > *::first-letter,\n.pagedjs_pages > .pagedjs_page > .pagedjs_area > div [data-split-from]::first-letter {\n color: unset;\n font-size: unset;\n font-wieght: unset;\n font-family: unset;\n color: unset;\n line-height: unset;\n float: unset;\n padding: unset;\n margin: unset;\n}\n\n[data-page]:not([data-split-from]),\n[data-break-before=\"page\"]:not([data-split-from]),\n[data-break-before=\"always\"]:not([data-split-from]),\n[data-break-before=\"left\"]:not([data-split-from]),\n[data-break-before=\"right\"]:not([data-split-from]),\n[data-break-before=\"recto\"]:not([data-split-from]),\n[data-break-before=\"verso\"]:not([data-split-from])\n{\n break-before: column;\n}\n\n[data-page]:not([data-split-to]),\n[data-break-after=\"page\"]:not([data-split-to]),\n[data-break-after=\"always\"]:not([data-split-to]),\n[data-break-after=\"left\"]:not([data-split-to]),\n[data-break-after=\"right\"]:not([data-split-to]),\n[data-break-after=\"recto\"]:not([data-split-to]),\n[data-break-after=\"verso\"]:not([data-split-to])\n{\n break-after: column;\n}\n\n@media print {\n body {\n width: unset;\n height: unset;\n margin: 0;\n padding: 0;\n }\n .pagedjs_pages {\n width: var(--width);\n display: block;\n transform: none !important;\n }\n .pagedjs_page {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n break-before: page;\n break-after: page;\n }\n}\n";

@@ -57,2 +57,3 @@ 'use strict';

this.hooks.onAtPage = new _hook2.default(this);
this.hooks.onAtMedia = new _hook2.default(this);
this.hooks.onRule = new _hook2.default(this);

@@ -59,0 +60,0 @@ this.hooks.onDeclaration = new _hook2.default(this);

@@ -38,2 +38,3 @@ "use strict";

this.hooks.onAtPage = new _hook2.default(this);
this.hooks.onAtMedia = new _hook2.default(this);
this.hooks.onRule = new _hook2.default(this);

@@ -73,3 +74,3 @@ this.hooks.onDeclaration = new _hook2.default(this);

this.rules(this.ast);
this.pages(this.ast);
this.atrules(this.ast);

@@ -113,4 +114,4 @@ this.hooks.afterTreeWalk.trigger(this.ast, this);

}, {
key: "pages",
value: function pages(ast) {
key: "atrules",
value: function atrules(ast) {
var _this3 = this;

@@ -127,2 +128,7 @@

}
if (basename === "media") {
_this3.hooks.onAtMedia.trigger(node, item, list);
_this3.declarations(node, item, list);
}
}

@@ -129,0 +135,0 @@ });

@@ -208,5 +208,5 @@ 'use strict';

this.emit("rendered", msg, this.width && this.width.value + this.width.unit, this.height && this.height.value + this.height.unit, this.orientation);
this.emit("rendered", msg, this.size.width && this.size.width.value + this.size.width.unit, this.size.height && this.size.height.value + this.size.height.unit, this.size.orientation);
if (typeof window.onPagesRendered !== "undefined") {
window.onPagesRendered(msg, this.width && this.width.value + this.width.unit, this.height && this.height.value + this.height.unit, this.orientation);
window.onPagesRendered(msg, this.size.width && this.size.width.value + this.size.width.unit, this.size.height && this.size.height.value + this.size.height.unit, this.size.orientation);
}

@@ -213,0 +213,0 @@

{
"name": "pagedjs",
"version": "0.1.2",
"version": "0.1.4",
"description": "Chunks up a document into paged media flows and applies print styles",

@@ -12,5 +12,5 @@ "author": "Fred Chasen",

"dependencies": {
"css-tree": "^1.0.0-alpha.28",
"css-tree": "1.0.0-alpha.28",
"event-emitter": "^0.3.5",
"lodash": "^4.17.5"
"lodash": "^4.17.10"
},

@@ -22,3 +22,3 @@ "devDependencies": {

"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.1",
"babel-preset-env": "^1.7.0",
"chalk": "^2.4.1",

@@ -28,10 +28,10 @@ "express": "^4.16.3",

"jest-image-snapshot": "^2.4.1",
"puppeteer": "^1.3.0",
"puppeteer": "^1.4.0",
"rimraf": "^2.6.2",
"rollup": "^0.57.0",
"rollup-plugin-commonjs": "^9.1.0",
"rollup-plugin-json": "^2.3.0",
"rollup-plugin-commonjs": "^9.1.3",
"rollup-plugin-json": "^2.3.1",
"rollup-plugin-livereload": "^0.6.0",
"rollup-plugin-node-builtins": "^2.1.2",
"rollup-plugin-node-resolve": "^3.0.0",
"rollup-plugin-node-resolve": "^3.3.0",
"rollup-plugin-serve": "^0.4.2"

@@ -38,0 +38,0 @@ },

@@ -26,3 +26,3 @@ Paged.js - Paged Media Tools

Test with Aurorae: [https://s3.amazonaws.com/pagedmedia/pagedjs/examples/aurorae/index.html](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/aurorae/index.html).
Try the [polyfill with Aurorae](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/polyfill.html).

@@ -32,5 +32,6 @@ ## Chunker

Process the first 50 pages of Moby Dick: [https://s3.amazonaws.com/pagedmedia/pagedjs/examples/index.html](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/index.html).
Examples:
Upload and chunk an Epub (using Epub.js): [https://s3.amazonaws.com/pagedmedia/pagedjs/examples/epub.html](https://s3.amazonaws.com/pagedmedia/examples/epub.html).
* Process the [first 50 pages of Moby Dick](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/index.html).
* Upload and [chunk an Epub using Epub.js](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/epub.html).

@@ -40,4 +41,6 @@ ## Polisher

Test styles for Aurorae: [https://s3.amazonaws.com/pagedmedia/pagedjs/examples/polisher.html](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/polisher.html).
Examples:
* Test [styles for print](https://s3.amazonaws.com/pagedmedia/pagedjs/examples/polisher.html).
### CLI

@@ -126,3 +129,3 @@

brew install ghostscript
npm install ghostscript4js
npm install ghostscript4js --no-save
```

@@ -129,0 +132,0 @@

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc