1
0
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:
til-schneider
2015-12-21 10:19:59 +01:00
parent ec191181cb
commit 4942af7072
8 changed files with 116 additions and 18 deletions

View File

@@ -0,0 +1,4 @@
Cheat sheets
============
If you add an `index.md` into a directory, it will become a part of the breadcrumbs.

View File

@@ -1,2 +1,4 @@
@import "config.less";
@import "layout.less";
@import "view.less";
@import "markdown.less";

View File

@@ -0,0 +1,6 @@
@contentMaxWidth: 800px;
@contentMinMarginX: 30px;
@colorText: #666;
@colorLink: #1982C4;
@colorLinkHover: #000;

View File

@@ -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;
}

View File

@@ -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
View 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;
}
}

View File

@@ -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 -->

View File

@@ -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');
}
}