New bootstrap-based layout #30

Merged
Roflin merged 79 commits from bootstrap into master 2023-03-14 19:11:25 +01:00
13 changed files with 302 additions and 115 deletions
Showing only changes of commit 277611e0ac - Show all commits

View File

@ -22,8 +22,6 @@ abstract class HTMLController
if (Registry::get('user')->isAdmin())
{
$this->page->appendStylesheet(BASEURL . '/css/admin.css');
$this->admin_bar = new AdminBar();
$this->page->adopt($this->admin_bar);
}
}

58
models/AdminMenu.php Normal file
View File

@ -0,0 +1,58 @@
<?php
/*****************************************************************************
* AdminMenu.php
* Contains the admin navigation logic.
*
* Global Data Lab code (C) Radboud University Nijmegen
* Programming (C) Aaron van Geffen, 2015-2022
*****************************************************************************/
class AdminMenu extends Menu
{
public function __construct()
{
$user = Registry::has('user') ? Registry::get('user') : new Guest();
if (!$user->isAdmin())
return;
$this->items[] = [
'label' => 'Admin',
'icon' => 'gear',
'subs' => [
[
'uri' => '/managealbums/',
'label' => 'Albums',
],
[
'uri' => '/manageassets/',
'label' => 'Assets',
],
[
'uri' => '/managetags/',
'label' => 'Tags',
],
[
'uri' => '/manageusers/',
'label' => 'Users',
],
[
'uri' => '/manageerrors/',
'label' => 'Errors',
'badge' => ErrorLog::getCount(),
],
],
];
foreach ($this->items as $i => $item)
{
if (isset($item['uri']))
$this->items[$i]['url'] = BASEURL . $item['uri'];
if (!isset($item['subs']))
continue;
foreach ($item['subs'] as $j => $subitem)
$this->items[$i]['subs'][$j]['url'] = BASEURL . $subitem['uri'];
}
}
}

View File

@ -86,7 +86,6 @@ class Dispatcher
if (Registry::has('user') && Registry::get('user')->isAdmin())
{
$page->appendStylesheet(BASEURL . '/css/admin.css');
$page->adopt(new AdminBar());
}
$page->adopt(new DummyBox('Well, this is a bit embarrassing!', '<p>The page you requested could not be found. Don\'t worry, it\'s probably not your fault. You\'re welcome to browse the website, though!</p>', 'errormsg'));

View File

@ -168,7 +168,6 @@ class ErrorHandler
if ($is_admin)
{
$page->appendStylesheet(BASEURL . '/css/admin.css');
$page->adopt(new AdminBar());
}
}
elseif (!$is_sensitive)

41
models/MainMenu.php Normal file
View File

@ -0,0 +1,41 @@
<?php
/*****************************************************************************
* MainMenu.php
* Contains the main navigation logic.
*
* Global Data Lab code (C) Radboud University Nijmegen
* Programming (C) Aaron van Geffen, 2015-2022
*****************************************************************************/
class MainMenu extends Menu
{
public function __construct()
{
$this->items = [
[
'uri' => '/',
'label' => 'Albums',
],
[
'uri' => '/people/',
'label' => 'People',
],
[
'uri' => '/timeline/',
'label' => 'Timeline',
],
];
foreach ($this->items as $i => $item)
{
if (isset($item['uri']))
$this->items[$i]['url'] = BASEURL . $item['uri'];
if (!isset($item['subs']))
continue;
foreach ($item['subs'] as $j => $subitem)
$this->items[$i]['subs'][$j]['url'] = BASEURL . $subitem['uri'];
}
}
}

18
models/Menu.php Normal file
View File

@ -0,0 +1,18 @@
<?php
/*****************************************************************************
* Menu.php
* Contains all navigational menus.
*
* Global Data Lab code (C) Radboud University Nijmegen
* Programming (C) Aaron van Geffen, 2015-2022
*****************************************************************************/
abstract class Menu
{
protected $items = [];
public function getItems()
{
return $this->items;
}
}

60
models/UserMenu.php Normal file
View File

@ -0,0 +1,60 @@
<?php
/*****************************************************************************
* UserMenu.php
* Contains the user navigation logic.
*
* Global Data Lab code (C) Radboud University Nijmegen
* Programming (C) Aaron van Geffen, 2015-2022
*****************************************************************************/
class UserMenu extends Menu
{
public function __construct()
{
$user = Registry::has('user') ? Registry::get('user') : new Guest();
if ($user->isLoggedIn())
{
$this->items[] = [
'label' => $user->getFirstName(),
'icon' => 'person-circle',
'subs' => [
[
'label' => 'Settings',
'uri' => '/accountsettings/',
],
[
'label' => 'Log out',
'uri' => '/logout/',
],
],
];
}
else
{
$this->items[] = [
'label' => 'Log in',
'icon' => 'person-circle',
'uri' => '/login/',
];
}
$this->items[] = [
'label' => 'Home',
'icon' => 'house-door',
'uri' => '/',
];
foreach ($this->items as $i => $item)
{
if (isset($item['uri']))
$this->items[$i]['url'] = BASEURL . $item['uri'];
if (!isset($item['subs']))
continue;
foreach ($item['subs'] as $j => $subitem)
$this->items[$i]['subs'][$j]['url'] = BASEURL . $subitem['uri'];
}
}
}

View File

@ -11,44 +11,6 @@
margin: 0 0 0.2em;
}
/* Admin bar styles
---------------------*/
body {
padding-top: 30px;
}
#admin_bar {
background: #333;
color: #ccc;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 100;
}
#admin_bar ul {
list-style: none;
margin: 0 auto;
max-width: 1280px;
min-width: 900px;
padding: 2px;
width: 95%;
}
#admin_bar ul > li {
display: inline;
border-right: 1px solid #aaa;
}
#admin_bar ul > li:last-child {
border-right: none;
}
#admin_bar li > a {
color: inherit;
display: inline-block;
padding: 4px 6px;
}
#admin_bar li a:hover {
text-decoration: underline;
}
/* (Tag) autosuggest
----------------------*/

View File

@ -19,17 +19,13 @@ body {
background: #aaa 0 -50% fixed;
}
#wrapper, header {
#wrapper, header .container {
width: 95%;
min-width: 900px;
max-width: 1280px;
margin: 0 auto;
}
header {
overflow: auto;
}
a {
color: #963626;
text-decoration: none;
@ -67,27 +63,10 @@ a:hover h1#logo, a:hover h1#logo:before {
/* Navigation
---------------*/
ul#nav {
margin: 55px 10px 0 0;
padding: 0;
float: right;
list-style: none;
}
ul#nav li {
float: left;
}
ul#nav li a {
color: #fff;
display: block;
float: left;
font: 200 20px 'Press Start 2P', sans-serif;
margin: 0 0 0 32px;
padding: 10px 0;
text-decoration: none;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
ul#nav li a:hover {
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
.nav-divider {
height: 2.5rem;
border-left: .1rem solid rgba(255,255,255, 0.2);
margin: 0 0.5rem;
}

View File

@ -1,38 +0,0 @@
<?php
/*****************************************************************************
* AdminBar.php
* Defines the AdminBar class.
*
* Kabuki CMS (C) 2013-2015, Aaron van Geffen
*****************************************************************************/
class AdminBar extends Template
{
private $extra_items = [];
public function html_main()
{
echo '
<div id="admin_bar">
<ul>
<li><a href="', BASEURL, '/managealbums/">Albums</a></li>
<li><a href="', BASEURL, '/manageassets/">Assets</a></li>
<li><a href="', BASEURL, '/managetags/">Tags</a></li>
<li><a href="', BASEURL, '/manageusers/">Users</a></li>
<li><a href="', BASEURL, '/manageerrors/">Errors [', ErrorLog::getCount(), ']</a></li>';
foreach ($this->extra_items as $item)
echo '
<li><a href="', $item[0], '">', $item[1], '</a></li>';
echo '
<li><a href="', BASEURL, '/logout/">Log out [', Registry::get('user')->getFullName(), ']</a></li>
</ul>
</div>';
}
public function appendItem($url, $caption)
{
$this->extra_items[] = [$url, $caption];
}
}

51
templates/MainNavBar.php Normal file
View File

@ -0,0 +1,51 @@
<?php
/*****************************************************************************
* MainNavBar.php
* Contains the primary navigational menu template.
*
* Global Data Lab code (C) Radboud University Nijmegen
* Programming (C) Aaron van Geffen, 2015-2022
*****************************************************************************/
class MainNavBar extends NavBar
{
protected $outerMenuId = 'mainNav';
protected $innerMenuId = 'mainNavigation';
protected $ariaLabel = 'Main navigation';
protected $navBarClasses = 'navbar-dark bg-dark sticky-top mb-4';
protected $primaryBadgeClasses = 'bg-light text-dark';
protected $secondaryBadgeClasses = 'bg-dark text-light';
public function html_main()
{
echo '
<nav id="', $this->outerMenuId, '" class="navbar navbar-expand-lg ', $this->navBarClasses, '" aria-label="', $this->ariaLabel, '">
<div class="container">
<a class="navbar-brand flex-grow-1" href="', BASEURL, '/">
HashRU Pics
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#', $this->innerMenuId, '" aria-controls="', $this->innerMenuId, '" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="', $this->innerMenuId, '">
<ul class="navbar-nav mb-2 mb-lg-0">';
$mainMenu = new MainMenu();
$this->renderMenuItems($mainMenu->getItems());
echo '
<li class="nav-divider d-none d-lg-inline"></li>';
$adminMenu = new AdminMenu();
$this->renderMenuItems($adminMenu->getItems());
$userMenu = new UserMenu();
$this->renderMenuItems($userMenu->getItems());
echo '
</ul>
</div>
</div>
</nav>';
}
}

View File

@ -43,15 +43,12 @@ class MainTemplate extends Template
, $this->header_html, '
</head>
<body', !empty($this->classes) ? ' class="' . implode(' ', $this->classes) . '"' : '', '>
<header>
<a href="', BASEURL, '/">
<h1 id="logo">#pics</h1>
</a>
<ul id="nav">
<li><a href="', BASEURL, '/">albums</a></li>
<li><a href="', BASEURL, '/people/">people</a></li>
<li><a href="', BASEURL, '/timeline/">timeline</a></li>
</ul>
<header>';
$bar = new MainNavBar();
$bar->html_main();
echo '
</header>
<div id="wrapper">';
@ -88,6 +85,7 @@ class MainTemplate extends Template
echo '<pre>', strtr($query, "\t", " "), '</pre>';
echo '
<script type="text/javascript" src="', BASEURL, '/vendor/twbs/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>';
}

62
templates/NavBar.php Normal file
View File

@ -0,0 +1,62 @@
<?php
/*****************************************************************************
* NavBar.php
* Contains the navigational menu template.
*
* Global Data Lab code (C) Radboud University Nijmegen
* Programming (C) Aaron van Geffen, 2015-2022
*****************************************************************************/
abstract class NavBar extends Template
{
protected $primaryBadgeClasses = 'bg-dark text-light';
protected $secondaryBadgeClasses = 'bg-light text-dark';
public function renderMenu(array $items, $navBarClasses = '')
{
echo '
<ul class="navbar-nav ', $navBarClasses, '">';
$this->renderMenuItems($items, $navBarClasses);
echo '
</ul>';
}
public function renderMenuItems(array $items)
{
foreach ($items as $menuId => $item)
{
if (isset($item['icon']))
$item['label'] = '<i class="bi bi-' . $item['icon'] . '"></i> ' . $item['label'];
if (isset($item['badge']))
$item['label'] .= ' <span class="badge ' . $this->primaryBadgeClasses . '">' . $item['badge'] . '</span>';
if (empty($item['subs']))
{
echo '
<li class="nav-item"><a class="nav-link" href="', $item['url'], '">', $item['label'], '</a></li>';
continue;
}
echo '
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="menu', $menuId, '" data-bs-toggle="dropdown" aria-expanded="false">', $item['label'], '</a>
<ul class="dropdown-menu" aria-labelledby="menu', $menuId, '">';
foreach ($item['subs'] as $subitem)
{
if (isset($subitem['badge']))
$subitem['label'] .= ' <span class="badge ' . $this->secondaryBadgeClasses . '">' . $subitem['badge'] . '</span>';
echo '
<li><a class="dropdown-item" href="', $subitem['url'], '">', $subitem['label'], '</a></li>';
}
echo '
</ul>
</li>';
}
}
}