Revert, and only keep the off by one fix & new prompt

UI/Web/src/app/book-reader/_components/book-reader/book-reader.component.html

@@ -20,44 +20,38 @@
         </div>
         <div subheader>
           <div class="pagination-cont">
-            <div class="g-0 text-center">
-              {{t('pagination-header')}}
-            </div>
-            <div class="d-flex align-items-center justify-content-between text-center row g-0">
-              <button class="col-1 btn btn-small btn-icon" [disabled]="prevChapterDisabled" (click)="loadPrevChapter()" [title]="t('prev-chapter')"><i class="fa fa-fast-backward" aria-hidden="true"></i></button>
-              <button class="col-1 btn btn-small btn-icon" (click)="prevPage()" [title]="t('prev-page')">
-                <i class="fa-solid fa-caret-left" aria-hidden="true"></i>
-              </button>
-              <div class="col-1" (click)="goToPage(0)"  [title]="t('go-to-first-page')">{{pageNum}}</div>
-              <div class="col-5">
-                <ngb-progressbar class="clickable" [title]="t('go-to-page')" (click)="goToPage()" type="primary" height="5px" [value]="pageNum" [max]="maxPages - 1"></ngb-progressbar>
-              </div>
-              <button class="col-1 btn btn-small btn-icon" (click)="nextPage()" [title]="t('next-page')"><i class="fa-solid fa-caret-right" aria-hidden="true"></i></button>
-              <div class="col-1 btn-icon" (click)="goToPage(maxPages - 1)" [title]="t('go-to-last-page')">{{maxPages - 1}}</div>
-              <button class="col-1 btn btn-small btn-icon"  [disabled]="nextChapterDisabled" (click)="loadNextChapter()" [title]="t('next-chapter')"><i class="fa fa-fast-forward" aria-hidden="true"></i></button>
-            </div>
-
             <!-- Column mode needs virtual pages -->
             @if (layoutMode !== BookPageLayoutMode.Default) {
               @let vp = getVirtualPage();
               <div class="virt-pagination-cont">
                 <div class="g-0 text-center">
-                  {{t('section-label')}}<i class="fa fa-question-circle ms-1" tabindex="0" [ngbTooltip]="t('section-tooltip')" [autoClose]="false"></i>
+                  {{t('page-label')}}
                 </div>
                 <div class="d-flex align-items-center justify-content-between text-center row g-0">
-                  <button class="btn btn-small btn-icon col-1" (click)="prevPage()" [title]="t('prev-section')" [disabled]="vp[0] === 1">
+                  <button class="btn btn-small btn-icon col-1" (click)="prevPage()" [title]="t('prev-page')" [disabled]="vp[0] === 1">
                     <i class="fa-solid fa-caret-left" aria-hidden="true"></i>
                   </button>
                   <div class="col-1">{{vp[0]}}</div>
                   <div class="col-8">
-                    <!-- class="clickable" [title]="t('go-to-section')" (click)="loadSection()" TODO: Implement this -->
                      <ngb-progressbar  type="primary" height="5px" [value]="vp[0]" [max]="vp[1]"></ngb-progressbar>
                   </div>
-                  <div class="col-1 btn-icon" (click)="loadPage()" [title]="t('go-to-last-section')">{{vp[1]}}</div>
+                  <div class="col-1 btn-icon">{{vp[1]}}</div>
-                  <button class="btn btn-small btn-icon col-1" (click)="nextPage()" [title]="t('next-section')"><i class="fa-solid fa-caret-right" aria-hidden="true"></i></button>
+                  <button class="btn btn-small btn-icon col-1" (click)="nextPage()" [title]="t('next-page')"><i class="fa-solid fa-caret-right" aria-hidden="true"></i></button>
                 </div>
               </div>
             }
+            <div class="g-0 text-center">
+              {{t('pagination-header')}}
+            </div>
+            <div class="d-flex align-items-center justify-content-between text-center row g-0">
+              <button class="btn btn-small btn-icon col-1" [disabled]="prevChapterDisabled" (click)="loadPrevChapter()" [title]="t('prev-chapter')"><i class="fa fa-fast-backward" aria-hidden="true"></i></button>
+              <div class="col-1" (click)="goToPage(0)">{{pageNum}}</div>
+              <div class="col-8">
+                <ngb-progressbar class="clickable" [title]="t('go-to-page')" (click)="goToPage()" type="primary" height="5px" [value]="pageNum" [max]="maxPages - 1"></ngb-progressbar>
+              </div>
+              <div class="col-1 btn-icon" (click)="goToPage(maxPages - 1)" [title]="t('go-to-last-page')">{{maxPages - 1}}</div>
+              <button class="btn btn-small btn-icon col-1"  [disabled]="nextChapterDisabled" (click)="loadNextChapter()" [title]="t('next-chapter')"><i class="fa fa-fast-forward" aria-hidden="true"></i></button>
+            </div>
           </div>
         </div>
         <div body class="drawer-body">

UI/Web/src/app/book-reader/_components/book-reader/book-reader.component.ts

@@ -918,18 +918,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
     return goToPageNum;
   }
 
-  async promptForSection() {
-    const [_, totalVirtualPages, _2] = this.getVirtualPage();
-    const promptConfig = {...this.confirmService.defaultPrompt};
-    promptConfig.header = translate('book-reader.go-to-section');
-    promptConfig.content = translate('book-reader.go-to-section-prompt', {totalSections: totalVirtualPages});
-
-    const goToPageNum = await this.confirmService.prompt(undefined, promptConfig);
-    if (goToPageNum === null || goToPageNum.trim().length === 0 || !/^[0-9]+$/.test(goToPageNum)) { return null; }
-
-    return Math.min(Math.max(parseInt(goToPageNum, 10), 0), totalVirtualPages - 1) + '';
-  }
-
   async goToPage(pageNum?: number) {
     let page = pageNum;
     if (pageNum === null || pageNum === undefined) {
@@ -951,25 +939,6 @@ export class BookReaderComponent implements OnInit, AfterViewInit, OnDestroy {
     this.loadPage();
   }
 
-  async loadSection(sectionNum?: number) {
-    let section = sectionNum;
-    if (sectionNum === null || sectionNum === undefined) {
-      const goToPageNum = await this.promptForSection();
-      if (goToPageNum === null) { return; }
-      section = parseInt(goToPageNum.trim(), 10);
-    }
-
-    if (section === undefined || this.pageNum === section) { return; }
-
-    if (section > this.maxPages - 1) {
-      section = this.maxPages - 1;
-    } else if (section < 0) {
-      section = 0;
-    }
-
-    // HACK
-  }
-
 
 
 

UI/Web/src/assets/langs/en.json

@@ -858,10 +858,9 @@
 
     "book-reader": {
         "title": "Book Settings",
-        "section-label": "Section",
+        "page-label": "Page",
-        "section-tooltip": "A virtual page when using Column mode",
 
-        "pagination-header": "Page",
+        "pagination-header": "Section",
         "go-to-page": "Go to page",
         "go-to-first-page": "Go to first page",
         "go-to-last-page": "Go to last page",
@@ -871,10 +870,6 @@
         "next-chapter": "Next Chapter/Volume",
         "skip-header": "Skip to main content",
         "virtual-pages": "virtual pages",
-        "next-section": "Next section",
-        "prev-section": "Prev section",
-        "go-to-section": "Go to section",
-        "go-to-last-section": "Go to last section",
 
         "settings-header": "Settings",
         "table-of-contents-header": "Table of Contents",
@@ -888,8 +883,7 @@
         "incognito-mode-label": "Incognito Mode",
         "next": "Next",
         "previous": "Previous",
-        "go-to-page-prompt": "There are {{totalPages}} pages. What page do you want to go to?",
+        "go-to-page-prompt": "There are {{totalPages}} sections. What section do you want to go to?"
-        "go-to-section-prompt": "There are {{totalSections}} sections. What section do you want to go to?"
     },
 
     "personal-table-of-contents": {