diff --git a/README.md b/README.md index b720be8d..0c8c836e 100644 --- a/README.md +++ b/README.md @@ -87,7 +87,7 @@ new Tify({ container: '#tify', language: 'de', manifestUrl: 'https://example.org/iiif-manifest.json', - pageLabelFormat: 'P (L)', + pageLabelFormat: 'P (L) / T', pages: [2, 3], pan: { x: .45, y: .6 }, translationsDirUrl: '/translations/tify', diff --git a/src/components/PageName.vue b/src/components/PageName.vue index f3ea5f68..b76128b8 100644 --- a/src/components/PageName.vue +++ b/src/components/PageName.vue @@ -26,6 +26,7 @@ export default { html() { return `${this.$store.options.pageLabelFormat}` .replace('P', `${this.number}`) + .replace('T', `${this.$store.pageCount}`) .replace('L', `${this.label}`) .replace('', ''); }, diff --git a/src/config.js b/src/config.js index d47d7a13..3ce83793 100644 --- a/src/config.js +++ b/src/config.js @@ -127,6 +127,7 @@ export default { * thumbnails view. The placeholder `P` is replaced by the page number * (consecutive numbers starting at `1`) while `L` is replaced by the * page label, which can be any string, defined by the manifest. + * The placeholder `T` is replaced by the total number of pages. * If the page label is missing, only the page number is displayed, * regardless of the format. * diff --git a/src/plugins/store.js b/src/plugins/store.js index 9be53058..ced6b950 100644 --- a/src/plugins/store.js +++ b/src/plugins/store.js @@ -337,7 +337,10 @@ function Store(args = {}) { const label = store.localize(labelObject, ''); if (label) { - return store.options.pageLabelFormat.replace('P', number).replace('L', label); + return store.options.pageLabelFormat + .replace('P', number) + .replace('T', store.pageCount) + .replace('L', label); } return store.options.pageLabelFormat.includes('P')