Merge branch 'prev-next-button' of https://github.com/shubhamosmosys/BookStack into shubhamosmosys-prev-next-button

app/Entities/Models/Page.php

@@ -138,4 +138,13 @@ class Page extends BookChild
         $refreshed->html = (new PageContent($refreshed))->render();
         return $refreshed;
     }
+    /**
+     * Get the parent chapter ID.
+     */
+    public function getParentChapter()
+    {
+        $chapterId = $this->chapter()->visible()
+        ->get('id');
+        return $chapterId;
+    }
 }

app/Entities/Repos/PageRepo.php

@@ -468,4 +468,10 @@ class PageRepo
             ->where('page_id', '=', $page->id)
             ->orderBy('created_at', 'desc');
     }
+    /**
+     * Get page details by chapter ID.
+     */
+    public function getPageByChapterID(int $id){
+        return Page::visible()->where('chapter_id', '=', $id)->get(['id','slug']);
+    }
 }

app/Http/Controllers/PageController.php

@@ -142,6 +142,39 @@ class PageController extends Controller
             $page->load(['comments.createdBy']);
         }
 
+        $chapterId = $page->getParentChapter();
+        $allPageSlugs = $this->pageRepo->getPageByChapterID($chapterId[0]->id);
+        $pos = 0;
+        foreach ($allPageSlugs as $slug){
+            if($pageSlug === $slug->slug){
+                $currPagePos = $pos;
+            }
+            $pos++;
+            $pageUrl = $this->pageRepo->getBySlug($bookSlug, $slug->slug);
+            $urlLink[] = $pageUrl->getUrl();
+        }
+        for($i=0; $i <= $currPagePos; $i++){
+            $nextCount = $i+1;
+            $prevCount = $i-1;
+            $prevPage = '#';
+            $nextPage = '#';
+            if($nextCount < count($urlLink)){
+                $nextPage = $urlLink[$nextCount];
+            }
+            if($currPagePos == $i && $currPagePos != 0){
+                $prevPage = $urlLink[$prevCount];    
+            }
+        }
+
+        $disablePrev = "";
+        $disableNxt = "";
+        if($prevPage == "#"){
+            $disablePrev = "disabled";
+        }
+        if($nextPage == "#"){
+            $disableNxt = "disabled";
+        }
+        
         View::incrementFor($page);
         $this->setPageTitle($page->getShortName());
         return view('pages.show', [
@@ -150,7 +183,11 @@ class PageController extends Controller
             'current' => $page,
             'sidebarTree' => $sidebarTree,
             'commentsEnabled' => $commentsEnabled,
-            'pageNav' => $pageNav
+            'pageNav' => $pageNav,
+            'prevPage' => $prevPage,
+            'nextPage' => $nextPage,
+            'disablePrev' => $disablePrev,
+            'disableNxt' => $disableNxt
         ]);
     }
 

resources/sass/_layout.scss

@@ -62,6 +62,9 @@
 }
 
 @include smaller-than($m) {
+  .grid.third.prev-next:not(.no-break) {
+    grid-template-columns: 1fr 1fr 1fr;
+  }
   .grid.third:not(.no-break) {
     grid-template-columns: 1fr 1fr;
   }
@@ -81,12 +84,24 @@
   .grid.right-focus.reverse-collapse > *:nth-child(1) {
     order: 1;
   }
+  .grid.third:not(.no-break) .text-m-left {
+    margin-left: 20%;
+  }
+  .grid.third:not(.no-break) .text-m-right {
+    margin-left: 45%;
+  }
 }
 
 @include smaller-than($s) {
   .grid.third:not(.no-break) {
     grid-template-columns: 1fr;
   }
+  .grid.third:not(.no-break) .text-m-left {
+    margin-left: 18%;
+  }
+  .grid.third:not(.no-break) .text-m-right {
+    margin-left: 20%;
+  }
 }
 
 @include smaller-than($xs) {
@@ -367,3 +382,7 @@ body.flexbox {
     margin-inline-end: 0;
   }
 }
+
+.prev-next-btn {
+  height: 50px;
+}

resources/sass/_text.scss

@@ -112,6 +112,12 @@ a {
   }
 }
 
+a.disabled {
+  pointer-events: none;
+  cursor: default;
+  opacity: 0.6;
+}
+
 .blended-links a {
   color: inherit;
   svg {

resources/views/pages/show.blade.php

@@ -17,6 +17,18 @@
         </div>
     </main>
        
+    <div class="prev-next-btn">
+        <div class="grid third no-row-gap prev-next">
+            <div class="text-m-left">
+                <a class="{{ $disablePrev }}" href="{{ $prevPage }}">Previous Page</a>
+            </div>
+            <div></div>
+            <div class="text-m-right">
+                <a class="{{ $disableNxt }}" href="{{ $nextPage }}">Next Page</a>
+            </div>
+        </div>
+    </div>
+
     @if ($commentsEnabled)
         <div class="container small p-none comments-container mb-l print-hidden">
             @include('comments.comments', ['page' => $page])