Skip to content

Commit 3c9c1cd

Browse files
lcharettelcharette
committed
Add navigation pager (back & forward links)
1 parent 6aaad06 commit 3c9c1cd

11 files changed

Lines changed: 304 additions & 18 deletions

File tree

‎app/assets/css/docs.less‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -33,14 +33,6 @@
3333
text-decoration: none;
3434
}
3535

36-
// a.nav-next, a.nav-prev {
37-
// color: #f77e83;
38-
// }
39-
40-
// a.nav-next:hover, a.nav-prev:hover {
41-
// color: #ff8b8e;
42-
// }
43-
4436
/* Images */
4537
img {
4638
display: block;

‎app/assets/css/pager.less‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
@pager-width: 60px;
2+
@pager-font-size: 50px;
3+
4+
main > .uk-container {
5+
padding-left: @pager-width + @global-gutter;
6+
padding-right: @pager-width + @global-gutter;
7+
}
8+
9+
.pager {
10+
a.pager-next,
11+
a.pager-prev {
12+
position: fixed;
13+
top: 0;
14+
bottom: 0;
15+
width: @pager-width;
16+
font-size: @pager-font-size;
17+
height: 100%;
18+
cursor: pointer;
19+
display: table;
20+
text-align: center;
21+
color: @global-theme-color;
22+
}
23+
24+
a.pager-next > i,
25+
a.pager-prev > i {
26+
display: table-cell;
27+
vertical-align: middle;
28+
text-align: center;
29+
}
30+
31+
a.pager-next:hover,
32+
a.pager-prev:hover {
33+
background: @global-muted-background;
34+
color: @global-theme-color;
35+
text-decoration: none;
36+
}
37+
38+
a.pager-prev {
39+
left: @sidebar-width;
40+
}
41+
a.pager-next {
42+
right: 0;
43+
}
44+
45+
// @media only all and (max-width: 59.938em) {
46+
// .pager {
47+
// display: table-cell;
48+
// position: static;
49+
// top: auto;
50+
// width: 50%;
51+
// text-align: center;
52+
// height: 100px;
53+
// line-height: 100px;
54+
// padding-top: 0;
55+
// }
56+
// .pager > i {
57+
// display: inline-block;
58+
// }
59+
// }
60+
}

‎app/assets/css/sidebar.less‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
*/
44
@sidebar-special-padding-horizontal: 12px;
55

6-
aside.uf-sidenav {
6+
aside.uf-sidenav,
7+
aside {
78

89
// Set nav header padding
910
.uk-nav-header {

‎app/assets/theme.less‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
*/
1111
@import 'css/docs.less';
1212
@import 'css/sidebar.less';
13+
@import 'css/pager.less';
1314

1415
/**
1516
* Override Pink Cupcake default variables
@@ -43,3 +44,7 @@ aside.uf-sidenav .uk-nav-default .uk-nav-sub a {
4344
padding-bottom: 4px;
4445
padding-top: 4px;
4546
}
47+
48+
aside ~ main {
49+
margin-left: @sidebar-width;
50+
}

‎app/src/Controller/DocumentationController.php‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,10 @@ public function pageVersioned(string $version, string $path, Response $response,
5252
$template = sprintf('pages/%s.html.twig', $page->getTemplate());
5353

5454
return $twig->render($response, $template, [
55-
'page' => $page,
56-
'breadcrumbs' => $this->pagesDirectory->getBreadcrumbsForPage($page),
55+
'page' => $page,
56+
'breadcrumbs' => $this->pagesDirectory->getBreadcrumbsForPage($page),
57+
'previousPage' => $this->pagesDirectory->getPreviousPageForPage($page),
58+
'nextPage' => $this->pagesDirectory->getNextPageForPage($page),
5759
]);
5860
}
5961

‎app/src/Documentation/DocumentationRepository.php‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -224,6 +224,84 @@ public function getBreadcrumbsForPage(PageResource $page): array
224224
return $breadcrumbs;
225225
}
226226

227+
/**
228+
* Get the next page in the documentation tree after the given page.
229+
*
230+
* Traverses the documentation tree in depth-first order to determine
231+
* the next page. Returns null if the given page is the last page.
232+
*
233+
* @param PageResource $page The current page
234+
*
235+
* @return PageResource|null The next page, or null if at the end
236+
*/
237+
public function getNextPageForPage(PageResource $page): ?PageResource
238+
{
239+
return $this->getAdjacentPage($page, 1);
240+
}
241+
242+
/**
243+
* Get the previous page in the documentation tree before the given page.
244+
*
245+
* Traverses the documentation tree in depth-first order to determine
246+
* the previous page. Returns null if the given page is the first page.
247+
*
248+
* @param PageResource $page The current page
249+
*
250+
* @return PageResource|null The previous page, or null if at the beginning
251+
*/
252+
public function getPreviousPageForPage(PageResource $page): ?PageResource
253+
{
254+
return $this->getAdjacentPage($page, -1);
255+
}
256+
257+
/**
258+
* Get an adjacent page in the documentation tree relative to the given page.
259+
*
260+
* @param PageResource $page The current page
261+
* @param int $offset The offset (+1 for next, -1 for previous)
262+
*
263+
* @return PageResource|null The adjacent page, or null if not found
264+
*/
265+
protected function getAdjacentPage(PageResource $page, int $offset): ?PageResource
266+
{
267+
$flatPages = $this->getFlattenedTree($page->getVersion()->id);
268+
$slugs = array_keys($flatPages);
269+
$currentIndex = array_search($page->getSlug(), $slugs, true);
270+
271+
if ($currentIndex === false || !isset($slugs[$currentIndex + $offset])) {
272+
return null;
273+
}
274+
275+
return $flatPages[$slugs[$currentIndex + $offset]];
276+
}
277+
278+
/**
279+
* Get a flattened list of pages in tree order (depth-first traversal).
280+
* Uses page slugs as array keys for efficient lookups.
281+
*
282+
* @param string|null $version
283+
*
284+
* @return array<string, PageResource> Array keyed by page slug
285+
*/
286+
protected function getFlattenedTree(?string $version = null): array
287+
{
288+
$tree = $this->getTree($version);
289+
$flat = [];
290+
291+
$flatten = function (array $pages) use (&$flatten, &$flat) {
292+
foreach ($pages as $page) {
293+
$flat[$page->getSlug()] = $page;
294+
if ($page->getChildren()) {
295+
$flatten($page->getChildren());
296+
}
297+
}
298+
};
299+
300+
$flatten($tree);
301+
302+
return $flat;
303+
}
304+
227305
/**
228306
* Get a versioned image resource by path and version.
229307
*

‎app/templates/layout/dashboard.html.twig‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,17 @@
44
<div>
55
{% include "partials/header.html.twig" %}
66
{% include "partials/sidebar.html.twig" %}
7-
<div class="uf-main uk-section uk-section-default">
7+
<main class="uk-section uk-section-default uk-section-xsmall">
88
<div class="uk-container">
99
{% include "partials/breadcrumbs.html.twig" %}
10-
<main>
10+
<div class="uk-section">
1111
{% block page_content %}{% endblock %}
12-
</main>
12+
</div>
13+
<div class="pager">
14+
<a class="pager-prev" href="{{ previousPage.getRoute() }}"> <i class="fa fa-chevron-left"></i></a>
15+
<a class="pager-next" href="{{ nextPage.getRoute() }}"><i class="fa fa-chevron-right"></i></a>
16+
</div>
1317
</div>
14-
</div>
18+
</main>
1519
</div>
1620
{% endblock %}

‎app/templates/partials/breadcrumbs.html.twig‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="uf-page-header" uk-grid>
1+
<div class="uk-section" uk-grid>
22
<div class="uk-width-expand">
33
<nav aria-label="Breadcrumb">
44
<ul class="uk-breadcrumb">

‎app/templates/partials/header.html.twig‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<li>
88
<a
99
class="uk-navbar-item uk-logo"
10-
uk-toggle="target: #uf-sidenav-aside; cls: open">
10+
uk-toggle="target: aside; cls: open">
1111
<font-awesome-icon icon="bars" />
1212
</a>
1313
</li>

‎app/templates/partials/sidebar.html.twig‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<aside class="uf-sidenav" id="uf-sidenav-aside">
1+
<aside class="uf-sidenav">
22
<ul class="uk-nav-default" uk-nav>
33
{% include 'content/navigation/sidebar.html.twig' %}
44
</ul>

0 commit comments

Comments
 (0)