Add support for startCanvas

src/main.js

@@ -25,7 +25,7 @@ window.Tify = function Tify(options = {}) {
 		manifestUrl: null,
 		viewer: {},
 		pageLabelFormat: 'P : L',
-		pages: [1],
+		pages: null,
 		pan: {},
 		rotation: null,
 		translationsDirUrl: null,

src/mixins/params.js

@@ -11,6 +11,20 @@ export default {
 		clearTimeout(this.urlUpdateTimeout);
 	},
 	methods: {
+		getStartPages() {
+			const { pages } = this.options;
+
+			if (pages) {
+				return pages;
+			}
+
+			const { startCanvas } = this.manifest.sequences[0];
+			const startPage = startCanvas
+				? this.canvases.findIndex((canvas) => canvas['@id'] === startCanvas) + 1
+				: 1;
+
+			return [startPage];
+		},
 		isValidPagesArray(pages) {
 			if (!Array.isArray(pages)) {
 				return false;
@@ -42,6 +56,7 @@ export default {
 			}
 
 			if (pages.length === 1
+				&& this.options.pages
 				&& this.options.pages[0] % 2 < 1
 				&& (this.options.pages[1] === this.options.pages[0] + 1 || this.options.pages[1] === 0)
 			) {
@@ -105,12 +120,12 @@ export default {
 			}
 
 			if (params.pages && !this.isValidPagesArray(params.pages)) {
-				this.$root.error = 'Invalid pages, reset to first page';
-				params.pages = [1];
+				this.$root.error = 'Invalid pages, reset to start page';
+				params.pages = this.getStartPages();
 			}
 
 			this.options.filters = params.filters || this.options.filters;
-			this.options.pages = params.pages || this.options.pages;
+			this.options.pages = params.pages || this.getStartPages();
 			this.options.pan = params.panX || params.panY
 				? { x: params.panX, y: params.panY }
 				: params.pan || this.options.pan;

tests/e2e/specs/export.spec.js

@@ -4,9 +4,9 @@ describe('Export', () => {
 		cy.get('.tify').then(() => {
 			cy.contains('Export').click();
 			cy.contains('Download Individual Images').should('be.visible');
-			cy.contains('Page 1').should('be.visible');
+			cy.contains('Page 2').should('be.visible'); // NOTE: Page set by startCanvas
 			cy.get('[title="Next page"]').first().click();
-			cy.contains('Page 2').should('be.visible');
+			cy.contains('Page 3').should('be.visible');
 
 			cy.contains('PDFs for each element').click();
 			cy.contains('Titelseite').should('be.visible');

tests/iiif-api/data/manifests/gdz-PPN857449303.json

@@ -50,7 +50,7 @@
 			"label": "Current Page Order",
 			"viewingDirection": "left-to-right",
 			"viewingHint": "paged",
-			"startCanvas": "//localhost:8081/info/canvas/gdz:PPN857449303:00000001",
+			"startCanvas": "//localhost:8081/info/canvas/gdz:PPN857449303:00000002",
 			"canvases": [
 				{
 					"@id": "//localhost:8081/info/canvas/gdz:PPN857449303:00000001",

tests/unit/main.spec.js

@@ -6,6 +6,10 @@ const { app } = new Tify();
 describe('main', () => {
 	app.manifest = manifest;
 
+	it('should determine the start page based on startCanvas', () => {
+		expect(app.getStartPages()).toEqual([2]);
+	});
+
 	it('should validate page numbers', () => {
 		expect(app.isValidPagesArray([1])).toEqual(true);
 		expect(app.isValidPagesArray([0, 1])).toEqual(true);