@everchron/ec-shards 7.4.5 → 7.4.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everchron/ec-shards",
-  "version": "7.4.5",
+  "version": "7.4.7",
   "private": false,
   "description": "Everchron Shards UI Library",
   "repository": "https://github.com/everchron/ec-shards.git",

package/src/components/jumper-page/jumper-page.vue

@@ -2,7 +2,7 @@
   <div class="ecs-viewer-pages">
     <div class="ecs-viewer-pages-inner">
 
-      <template v-if="showRelative">
+      <template v-if="showAltPageNumbers">
         <div class="ecs-viewer-pages-pagination">
           <div @click="$emit('selectCurPageText')" @keydown="pageKeyPressed($event, 'relative')" @blur="$emit('currentPageBlurred')" contenteditable class="current-page" id="currPage">
             {{ currentPage }}
@@ -11,7 +11,7 @@
           <span v-if="isTranscriptMissingPages" style="color:tomato">*</span>
         </div>
         <div class="ecs-viewer-pages-pagination">
-          <div class="total-pages-relative">{{ relativePage }}&nbsp;</div>
+          <div class="total-pages-relative">{{ altPageNumber }}&nbsp;</div>
           <div class="total-pages-relative">of {{ pageCount }}</div>
         </div>
       </template>
@@ -48,6 +48,11 @@
         type: Number,
         default: null
       },
+      /** Adds a secondary count below the main count which reflects the relative current position in the document, if the document has page gaps */
+      sequentialPage: {
+        type: Number,
+        default: null
+      },
       /** If relative page count is used, this determines the total page count of the current document, but not the document collection. */
       lastPage: {
         type: Number,
@@ -61,8 +66,14 @@
     },
 
     computed:{
-      showRelative(){
-        return this.relativePage && (this.relativePage != this.currentPage)
+      showAltPageNumbers(){
+        return (this.relativePage && (this.relativePage != this.currentPage)) || this.isTranscriptMissingPages
+      },
+
+      altPageNumber(){
+        if (this.sequentialPage && (this.sequentialPage != this.currentPage))
+          return this.sequentialPage
+        return this.relativePage
       }
     },