mirror of
https://github.com/til-schneider/slim-wiki.git
synced 2025-08-11 02:54:13 +02:00
Added breadcrumbs
This commit is contained in:
4
src/articles/cheat-sheets/index.md
Normal file
4
src/articles/cheat-sheets/index.md
Normal file
@@ -0,0 +1,4 @@
|
||||
Cheat sheets
|
||||
============
|
||||
|
||||
If you add an `index.md` into a directory, it will become a part of the breadcrumbs.
|
@@ -1,2 +1,4 @@
|
||||
@import "config.less";
|
||||
@import "layout.less";
|
||||
@import "view.less";
|
||||
@import "markdown.less";
|
||||
|
6
src/client/less/config.less
Normal file
6
src/client/less/config.less
Normal file
@@ -0,0 +1,6 @@
|
||||
@contentMaxWidth: 800px;
|
||||
@contentMinMarginX: 30px;
|
||||
|
||||
@colorText: #666;
|
||||
@colorLink: #1982C4;
|
||||
@colorLinkHover: #000;
|
@@ -1,5 +1,5 @@
|
||||
|
||||
// Reset browser styles
|
||||
// Reset browser sizes
|
||||
|
||||
//ol, ul, li,
|
||||
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, img, b, u, i, form, label, table, tbody, tfoot, thead, tr, th, td {
|
||||
@@ -22,14 +22,19 @@ table {
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
// Basic styling
|
||||
// Layout
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
// We need a variable using brackets here, otherwise less won't calculate the width
|
||||
// See: https://github.com/less/less.js/issues/1903
|
||||
@small-screen-breakpoint: (@contentMaxWidth + 2 * @contentMinMarginX);
|
||||
|
||||
.main-column {
|
||||
width: @contentMaxWidth;
|
||||
margin: 0 auto;
|
||||
|
||||
@media (max-width: @small-screen-breakpoint) {
|
||||
width: auto;
|
||||
margin: 0 @contentMinMarginX;
|
||||
}
|
||||
|
||||
article {
|
||||
margin: 0 50px 100px;
|
||||
}
|
||||
|
@@ -1,6 +1,6 @@
|
||||
.markdown-body {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
color: @colorText;
|
||||
line-height: 1.4;
|
||||
|
||||
p, blockquote, ul, ol, dl, li, table, pre, h5, h6 {
|
||||
@@ -39,7 +39,6 @@
|
||||
|
||||
ul, ol {
|
||||
margin: 0 0 45px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
|
33
src/client/less/view.less
Normal file
33
src/client/less/view.less
Normal file
@@ -0,0 +1,33 @@
|
||||
|
||||
// Basic styling
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
color: @colorText;
|
||||
}
|
||||
|
||||
a, a:visited {
|
||||
color: @colorLink;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover, a:active {
|
||||
color: @colorLinkHover;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
// Views
|
||||
|
||||
.breadcrumbs {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
|
||||
background-color: white;
|
||||
|
||||
.main-column {
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
}
|
@@ -5,9 +5,9 @@
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
|
||||
|
||||
<title>Slim Wiki</title>
|
||||
<title><?php echo $data['wikiName']; ?></title>
|
||||
|
||||
<base href="<?php echo $baseUrl; ?>/">
|
||||
<base href="<?php echo $data['baseUrl']; ?>/">
|
||||
|
||||
<!-- build:css client/view.css -->
|
||||
<!--
|
||||
@@ -22,7 +22,21 @@
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<article class="markdown-body"><?php echo $articleMarkup; ?></article>
|
||||
<nav class="breadcrumbs"><div class="main-column"><?php
|
||||
$isFirst = true;
|
||||
foreach ($data['breadcrumbs'] as $item) {
|
||||
if (! $isFirst) {
|
||||
echo ' / ';
|
||||
}
|
||||
if ($item['active']) {
|
||||
echo $item['name'];
|
||||
} else {
|
||||
?><a href="<?php echo $data['basePath'] . $item['path']; ?>"><?php echo $item['name']; ?></a><?php
|
||||
}
|
||||
$isFirst = false;
|
||||
}
|
||||
?></div></nav>
|
||||
<article class="markdown-body main-column"><?php echo $data['articleHtml']; ?></article>
|
||||
</body>
|
||||
|
||||
<!-- build:js client/view.js -->
|
||||
|
@@ -9,17 +9,27 @@ class Main {
|
||||
// - $basePath: E.g. '/slim-wiki/'
|
||||
// - $requestPathArray: E.g. array('myfolder', 'mypage')
|
||||
public function dispatch($baseUrl, $basePath, $requestPathArray) {
|
||||
$articleBaseDir = realpath(__DIR__ . '/../../articles');
|
||||
$articleFilename = $articleBaseDir . '/' . implode('/', $requestPathArray);
|
||||
$articleBaseDir = realpath(__DIR__ . '/../../articles') . '/';
|
||||
$articleFilename = $articleBaseDir . implode('/', $requestPathArray);
|
||||
|
||||
if (is_dir($articleFilename)) {
|
||||
$articleFilename = rtrim($articleFilename, '/') . '/index.md';
|
||||
}
|
||||
|
||||
if (($articleFilename == realpath($articleFilename)) && file_exists($articleFilename) && is_readable($articleFilename)) {
|
||||
$wikiName = 'Slim Wiki'; // TODO: Make this configurable
|
||||
|
||||
$data = array();
|
||||
$data['baseUrl'] = $baseUrl;
|
||||
$data['basePath'] = $basePath;
|
||||
$data['wikiName'] = $wikiName;
|
||||
|
||||
$data['breadcrumbs'] = $this->createBreadcrumbs($articleBaseDir, $requestPathArray, $wikiName);
|
||||
|
||||
$articleContent = file_get_contents($articleFilename);
|
||||
$articleMarkup = Parsedown::instance()->text($articleContent);
|
||||
include(__DIR__ . '/../layout/page.php');
|
||||
$data['articleHtml'] = Parsedown::instance()->text($articleContent);
|
||||
|
||||
$this->renderPage($data);
|
||||
} else {
|
||||
// TODO: Show error page
|
||||
echo '<p style="color:#990000">File does not exist or is not readable: '.$articleFilename.'</p>';
|
||||
@@ -27,4 +37,29 @@ class Main {
|
||||
|
||||
}
|
||||
|
||||
|
||||
private function createBreadcrumbs($articleBaseDir, $requestPathArray, $wikiName) {
|
||||
$pathCount = count($requestPathArray);
|
||||
$breadcrumbArray = array(array('name' => $wikiName, 'path' => '', 'active' => ($pathCount == 0)));
|
||||
|
||||
$currentPath = '';
|
||||
for ($i = 0; $i < $pathCount; $i++) {
|
||||
$pathPart = $requestPathArray[$i];
|
||||
$currentPath .= ($i == 0 ? '' : '/') . $pathPart;
|
||||
$isLast = ($i == $pathCount - 1);
|
||||
|
||||
if ($isLast || file_exists($articleBaseDir . $currentPath . '/index.md')) {
|
||||
// This is the requested file or an directory having an index -> Add it
|
||||
$breadcrumbArray[] = array('name' => $pathPart, 'path' => urlencode($currentPath), 'active' => $isLast);
|
||||
}
|
||||
}
|
||||
|
||||
return $breadcrumbArray;
|
||||
}
|
||||
|
||||
|
||||
private function renderPage($data) {
|
||||
include(__DIR__ . '/../layout/page.php');
|
||||
}
|
||||
|
||||
}
|
||||
|
Reference in New Issue
Block a user