Merge branch 'issue-220-counter-reset-scope' into 'master'

resolves #220 reset the page counter once per unique element Closes #220 See merge request tools/pagedjs!130

Merge branch 'issue-220-counter-reset-scope' into 'master'
resolves #220 reset the page counter once per unique element Closes #220 See merge request tools/pagedjs!130
fa6a12af · Fred Chasen · 2160824e · 04d2a0c4 · fa6a12af · fa6a12af
Commit fa6a12af authored Jul 15, 2020 by Fred Chasen
6 changed files
--- a/specs/counters/counter-page-reset/__image_snapshots_linux__/counter-page-reset-scope-spec-js-counter-page-reset-scope-should-create-a-pdf-1-snap.png
+++ b/specs/counters/counter-page-reset/__image_snapshots_linux__/counter-page-reset-scope-spec-js-counter-page-reset-scope-should-create-a-pdf-1-snap.png
--- a/specs/counters/counter-page-reset/__image_snapshots_linux__/counter-page-reset-scope-spec-js-counter-page-reset-scope-should-create-a-pdf-2-snap.png
+++ b/specs/counters/counter-page-reset/__image_snapshots_linux__/counter-page-reset-scope-spec-js-counter-page-reset-scope-should-create-a-pdf-2-snap.png
--- a/specs/counters/counter-page-reset/__image_snapshots_linux__/counter-page-reset-scope-spec-js-counter-page-reset-scope-should-create-a-pdf-3-snap.png
+++ b/specs/counters/counter-page-reset/__image_snapshots_linux__/counter-page-reset-scope-spec-js-counter-page-reset-scope-should-create-a-pdf-3-snap.png
--- a/specs/counters/counter-page-reset/counter-page-reset-scope.html
+++ b/specs/counters/counter-page-reset/counter-page-reset-scope.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8"/>
+	<title>counter-page-reset-scope</title>
+	<style>
+		@page {
+			size: A4;
+		}
+
+		@page {
+			@bottom-center {
+				content: "Page " counter(page);
+			}
+		}
+
+		@page frontmatter {
+			@bottom-center {
+				content: none;
+			}
+		}
+
+		header {
+			page: frontmatter;
+		}
+
+		.cover {
+			page: cover;
+		}
+
+		main {
+			counter-reset: page 1;
+			break-before: right;
+		}
+
+		section {
+			break-after: page;
+		}
+	</style>
+	<script src="../../../dist/paged.polyfill.js"></script>
+</head>
+<body>
+<header>
+	<div class="cover">
+		<h1>Test Document</h1>
+	</div>
+	<div class="tableofcontents">
+		<h2>Table Of Contents</h2>
+	</div>
+</header>
+<main>
+	<section>
+		<h2>Section 1</h2>
+	</section>
+	<section>
+		<h2>Section 2</h2>
+	</section>
+	<section>
+		<h2>Section 3</h2>
+	</section>
+</main>
+</body>
+</html>
--- a/specs/counters/counter-page-reset/counter-page-reset-scope.spec.js
+++ b/specs/counters/counter-page-reset/counter-page-reset-scope.spec.js
+const TIMEOUT = 10000; // Some book might take longer than this to renderer
+
+describe("counter-page-reset-scope", () => {
+	let page;
+	beforeAll(async () => {
+		page = await loadPage("counters/counter-page-reset/counter-page-reset-scope.html");
+		return page.rendered;
+	}, TIMEOUT);
+
+	afterAll(async () => {
+		if (!DEBUG) {
+			await page.close();
+		}
+	});
+
+	if (!DEBUG) {
+		it("should create a pdf", async () => {
+			let pdf = await page.pdf(PDF_SETTINGS);
+
+			expect(pdf).toMatchPDFSnapshot(3);
+			expect(pdf).toMatchPDFSnapshot(4);
+			expect(pdf).toMatchPDFSnapshot(5);
+		});
+	}
+}
+);
--- a/src/modules/paged-media/counters.js
+++ b/src/modules/paged-media/counters.js
@@ -7,6 +7,7 @@ class Counters extends Handler {

 		this.styleSheet = polisher.styleSheet;
 		this.counters = {};
+		this.resetCountersMap = new Map();
 	}

 	onDeclaration(declaration, dItem, dList, rule) {
@@ -219,8 +220,16 @@ class Counters extends Handler {
 	afterPageLayout(pageElement, page) {
 		let pgreset = pageElement.querySelectorAll("[data-counter-page-reset]");
 		pgreset.forEach((reset) => {
-			let value = reset.dataset.counterPageReset;
-			this.styleSheet.insertRule(`[data-page-number="${pageElement.dataset.pageNumber}"] { counter-increment: none; counter-reset: page ${value}; }`, this.styleSheet.cssRules.length);
+			const ref = reset.dataset && reset.dataset.ref;
+			if (ref && this.resetCountersMap.has(ref)) {
+				// ignoring, the counter-reset directive has already been taken into account.
+			} else {
+				if (ref) {
+					this.resetCountersMap.set(ref, "");
+				}
+				let value = reset.dataset.counterPageReset;
+				this.styleSheet.insertRule(`[data-page-number="${pageElement.dataset.pageNumber}"] { counter-increment: none; counter-reset: page ${value}; }`, this.styleSheet.cssRules.length);
+			}
 		});
 	}