Management beginnings.
This commit is contained in:
parent
98de031d03
commit
f19d95b2d7
20 changed files with 404 additions and 15 deletions
4
assets/less/manage/classes/container.less
Normal file
4
assets/less/manage/classes/container.less
Normal file
|
@ -0,0 +1,4 @@
|
|||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 2px auto;
|
||||
}
|
13
assets/less/manage/classes/footer.less
Normal file
13
assets/less/manage/classes/footer.less
Normal file
|
@ -0,0 +1,13 @@
|
|||
.footer {
|
||||
text-align: center;
|
||||
padding: 1em;
|
||||
|
||||
&__link {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
126
assets/less/manage/classes/header.less
Normal file
126
assets/less/manage/classes/header.less
Normal file
|
@ -0,0 +1,126 @@
|
|||
.header {
|
||||
background-color: #111;
|
||||
background-image: linear-gradient(0deg, #222, #333);
|
||||
font-size: 1.5em;
|
||||
|
||||
&__wrapper {
|
||||
display: flex;
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
&__logo,
|
||||
&__link {
|
||||
padding: 8px 10px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
&__navigation {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&__navigation {
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
}
|
||||
|
||||
&__logo {
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__link {
|
||||
cursor: pointer;
|
||||
transition: background-color .2s;
|
||||
|
||||
&:hover {
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
&--active,
|
||||
&:active {
|
||||
background-color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
&__user {
|
||||
flex-grow: 0;
|
||||
flex-shrink: 1;
|
||||
|
||||
&__toggle {
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
background-position: right;
|
||||
padding-right: 45px;
|
||||
min-width: 100px;
|
||||
transition: background-color .2s, min-width .2s;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
&__state {
|
||||
display: none;
|
||||
|
||||
&:checked ~ .header__user__toggle {
|
||||
background-color: #333;
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
&:checked ~ .header__user__menu {
|
||||
max-height: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
&__menu {
|
||||
overflow: hidden;
|
||||
text-align: right;
|
||||
max-height: 0px;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
background-color: #333;
|
||||
z-index: 1000;
|
||||
transition: max-height .2s;
|
||||
box-shadow: 0 5px 5px 0 fade(#444, 80%);
|
||||
}
|
||||
|
||||
&__link {
|
||||
padding: 8px 10px;
|
||||
display: block;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
transition: background-color .2s;
|
||||
|
||||
&:hover {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: #2a2a2a;
|
||||
}
|
||||
}
|
||||
|
||||
&__section {
|
||||
margin: 1px 2px;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
padding-bottom: 1px;
|
||||
margin-bottom: 1px;
|
||||
border-bottom: 1px solid #444;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
20
assets/less/manage/classes/listing.less
Normal file
20
assets/less/manage/classes/listing.less
Normal file
|
@ -0,0 +1,20 @@
|
|||
.listing {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__entry {
|
||||
border-right: 4px solid #a00;
|
||||
padding-right: 1px;
|
||||
display: block;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
&__content {
|
||||
width: 100%;
|
||||
background-color: #333;
|
||||
min-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
10
assets/less/manage/classes/user-listing.less
Normal file
10
assets/less/manage/classes/user-listing.less
Normal file
|
@ -0,0 +1,10 @@
|
|||
.user-listing {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
||||
&__entry {
|
||||
min-width: 296px;
|
||||
margin: 2px;
|
||||
}
|
||||
}
|
25
assets/less/manage/main.less
Normal file
25
assets/less/manage/main.less
Normal file
|
@ -0,0 +1,25 @@
|
|||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.manage {
|
||||
background-color: #222;
|
||||
font: 12px/20px 'Open Sans', sans-serif;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@import "classes/container";
|
||||
@import "classes/footer";
|
||||
@import "classes/header";
|
||||
@import "classes/listing";
|
||||
|
||||
@import "classes/user-listing";
|
|
@ -51,7 +51,7 @@ switch ($mode) {
|
|||
return;
|
||||
}
|
||||
|
||||
echo $app->templating->render('logout');
|
||||
echo $app->templating->render('@auth.logout');
|
||||
break;
|
||||
|
||||
case 'login':
|
||||
|
@ -175,6 +175,6 @@ switch ($mode) {
|
|||
$app->templating->var('auth_register_error', $auth_register_error);
|
||||
}
|
||||
|
||||
echo $app->templating->render('auth');
|
||||
echo $app->templating->render('@auth.auth');
|
||||
break;
|
||||
}
|
||||
|
|
52
public/manage.php
Normal file
52
public/manage.php
Normal file
|
@ -0,0 +1,52 @@
|
|||
<?php
|
||||
use Misuzu\Application;
|
||||
use Misuzu\Users\User;
|
||||
|
||||
require_once __DIR__ . '/../misuzu.php';
|
||||
|
||||
$manage_session = Application::getInstance()->getSession();
|
||||
|
||||
if ($manage_session === null) {
|
||||
header('Location: /');
|
||||
return;
|
||||
}
|
||||
|
||||
$app->templating->addPath('manage', __DIR__ . '/../views/manage');
|
||||
|
||||
$manage_user = $manage_session->user;
|
||||
$manage_modes = [
|
||||
'overview' => [
|
||||
'title' => 'Overview',
|
||||
],
|
||||
'forums' => [
|
||||
'title' => 'Forums',
|
||||
],
|
||||
'users' => [
|
||||
'title' => 'Users',
|
||||
],
|
||||
'roles' => [
|
||||
'title' => 'Roles',
|
||||
],
|
||||
];
|
||||
$manage_mode = $_GET['m'] ?? key($manage_modes);
|
||||
|
||||
$app->templating->vars(compact('manage_mode', 'manage_modes', 'manage_user', 'manage_session'));
|
||||
|
||||
if (!array_key_exists($manage_mode, $manage_modes)) {
|
||||
http_response_code(404);
|
||||
$app->templating->var('manage_title', 'Not Found');
|
||||
echo $app->templating->render('@manage.notfound');
|
||||
return;
|
||||
}
|
||||
|
||||
$app->templating->var('title', $manage_modes[$manage_mode]['title']);
|
||||
|
||||
switch ($manage_mode) {
|
||||
case 'users':
|
||||
$users_page = (int)($_GET['p'] ?? 1);
|
||||
$manage_users = User::paginate(32, ['*'], 'p', $users_page);
|
||||
$app->templating->vars(compact('manage_users', 'users_page'));
|
||||
break;
|
||||
}
|
||||
|
||||
echo $app->templating->render("@manage.{$manage_mode}");
|
|
@ -71,25 +71,20 @@ $settings_profile_fields = [
|
|||
|
||||
$settings_user = $settings_session->user;
|
||||
|
||||
$settings_mode = $_GET['m'] ?? null;
|
||||
$settings_modes = [
|
||||
'account' => 'Account',
|
||||
'avatar' => 'Avatar',
|
||||
'sessions' => 'Sessions',
|
||||
'login-history' => 'Login History',
|
||||
];
|
||||
|
||||
// if no mode is explicitly set just go to the index
|
||||
if ($settings_mode === null) {
|
||||
$settings_mode = key($settings_modes);
|
||||
}
|
||||
$settings_mode = $_GET['m'] ?? key($settings_modes);
|
||||
|
||||
$app->templating->vars(compact('settings_mode', 'settings_modes', 'settings_user', 'settings_session'));
|
||||
|
||||
if (!array_key_exists($settings_mode, $settings_modes)) {
|
||||
http_response_code(404);
|
||||
$app->templating->var('settings_title', 'Not Found');
|
||||
echo $app->templating->render("settings.notfound");
|
||||
echo $app->templating->render('settings.notfound');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
@ -164,6 +164,7 @@ class Application extends ApplicationBase
|
|||
$twig->addFilter('byte_symbol');
|
||||
$twig->addFilter('country_name', 'get_country_name');
|
||||
$twig->addFilter('flip', 'array_flip');
|
||||
$twig->addFilter('create_pagination');
|
||||
|
||||
// avoid using config() in templates whenever possible
|
||||
// in all honesty this shouldn't even be a thing
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<?php
|
||||
namespace Misuzu;
|
||||
|
||||
use Illuminate\Database\Eloquent\Collection;
|
||||
use Illuminate\Database\Eloquent\Model as BaseModel;
|
||||
|
||||
abstract class Model extends BaseModel
|
||||
|
|
18
utility.php
18
utility.php
|
@ -197,6 +197,24 @@ function crop_image_centred(Imagick $image, int $target_width, int $target_heigh
|
|||
return $image->deconstructImages();
|
||||
}
|
||||
|
||||
function create_pagination($paginator)
|
||||
{
|
||||
$window = \Illuminate\Pagination\UrlWindow::make($paginator);
|
||||
|
||||
$pagination = array_map(
|
||||
function ($str) {
|
||||
return substr($str, 2);
|
||||
},
|
||||
array_merge(
|
||||
$window['first'] ?? [],
|
||||
$window['slider'] ?? [],
|
||||
$window['last'] ?? []
|
||||
)
|
||||
);
|
||||
|
||||
return $pagination;
|
||||
}
|
||||
|
||||
function is_int_ex($value, int $boundary_low, int $boundary_high): bool
|
||||
{
|
||||
return is_int($value) && $value >= $boundary_low && $value <= $boundary_high;
|
||||
|
|
1
views/manage/forums.twig
Normal file
1
views/manage/forums.twig
Normal file
|
@ -0,0 +1 @@
|
|||
{% extends '@manage/master.twig' %}
|
38
views/manage/macros.twig
Normal file
38
views/manage/macros.twig
Normal file
|
@ -0,0 +1,38 @@
|
|||
{% macro link(url, content, class) %}
|
||||
{% spaceless %}
|
||||
<a href="{{ url }}" {% if '://' in url %} target="_blank" rel="noreferrer noopener"{% endif %} {% if class is defined %}class="{{ class }}"{% endif %}>{{ content|raw }}</a>
|
||||
{% endspaceless %}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro pagination(url, pages, current, class, name) %}
|
||||
{% set pagess = pages|create_pagination %}
|
||||
{% set separator %}{% if '%3F' in url|default('')|url_encode %}&{% else %}?{% endif %}{% endset %}
|
||||
{% set current_page = current|default(1) %}
|
||||
{% set url = url ~ separator ~ name|default('page') ~ "=" %}
|
||||
|
||||
<div class="pagination {{ class }}">
|
||||
{% if pages is defined and pages|length > 1 %}
|
||||
{% if current_page > 1 %}
|
||||
{% if pages|length > 2 %}
|
||||
<a class="pagination__button" href="{{ url ~ 1 }}" title="Jump to first page"><<</a>
|
||||
{% endif %}
|
||||
|
||||
<a class="pagination__button" href="{{ url ~ (current_page - 1) }}" title="Previous page"><</a>
|
||||
{% endif %}
|
||||
|
||||
{% for id, page in pages %}
|
||||
{% if (id + 1) > (current_page - 5) and (id + 1) < (current_page + 5) %}
|
||||
<a class="pagination__button{% if id == current_page - 1 %} pagination__button--current{% endif %}" href="{{ url ~ (id + 1) }}" title="Page {{ id + 1 }}">{{ id + 1 }}</a>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if current_page < pages|length %}
|
||||
<a class="pagination__button" href="{{ url ~ (current_page + 1) }}" title="Next page">></a>
|
||||
|
||||
{% if pages|length > 2 %}
|
||||
<a class="pagination__button" href="{{ url ~ pages|length }}" title="Jump to last page">>></a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endmacro %}
|
55
views/manage/master.twig
Normal file
55
views/manage/master.twig
Normal file
|
@ -0,0 +1,55 @@
|
|||
{% from '@manage/macros.twig' import link %}
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Flashii Broom Closet</title>
|
||||
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
|
||||
<link href="/css/manage.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="manage">
|
||||
<div class="wrapper">
|
||||
<nav class="header">
|
||||
<div class="header__wrapper">
|
||||
<a class="header__logo" href="/manage.php">
|
||||
Broom Closet
|
||||
</a>
|
||||
|
||||
<div class="header__navigation">
|
||||
{% for mode, data in manage_modes %}
|
||||
<a class="header__link{% if mode == manage_mode %} header__link--active{% endif %}" href="?m={{ mode }}">{{ data.title }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="header__user">
|
||||
<input type="checkbox" id="manage-user-menu-state" class="header__user__state">
|
||||
<label for="manage-user-menu-state" class="header__link header__user__toggle" style="background-image:url('/profile.php?u={{ manage_user.user_id }}&m=avatar');">{{ manage_user.username }}</label>
|
||||
<div class="header__user__menu">
|
||||
<div class="header__user__section">
|
||||
<a class="header__user__link" href="/profile.php?u={{ manage_user.user_id }}">Profile</a>
|
||||
<a class="header__user__link" href="/settings.php">Settings</a>
|
||||
</div>
|
||||
<div class="header__user__section">
|
||||
<a class="header__user__link" href="/">Return</a>
|
||||
<a class="header__user__link" href="/auth.php?m=logout&s={{ csrf_token() }}">Logout</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<p> This page has no content.</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
<footer class="footer">
|
||||
{{ link('https://flash.moe', 'flash.moe', 'footer__link') }} 2013-{{
|
||||
''|date('Y') }} /
|
||||
{{ link('https://github.com/flashwave/misuzu/tree/' ~ git_branch(), git_branch(), 'footer__link') }} # {{ link('https://github.com/flashwave/misuzu/commit/' ~ git_hash(true), git_hash(), 'footer__link') }}
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
7
views/manage/notfound.twig
Normal file
7
views/manage/notfound.twig
Normal file
|
@ -0,0 +1,7 @@
|
|||
{% extends '@manage/master.twig' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<p>Could not find what you were looking for.</p>
|
||||
</div>
|
||||
{% endblock %}
|
1
views/manage/overview.twig
Normal file
1
views/manage/overview.twig
Normal file
|
@ -0,0 +1 @@
|
|||
{% extends '@manage/master.twig' %}
|
1
views/manage/roles.twig
Normal file
1
views/manage/roles.twig
Normal file
|
@ -0,0 +1 @@
|
|||
{% extends '@manage/master.twig' %}
|
19
views/manage/users.twig
Normal file
19
views/manage/users.twig
Normal file
|
@ -0,0 +1,19 @@
|
|||
{% extends '@manage/master.twig' %}
|
||||
{% from '@manage/macros.twig' import pagination %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container listing user-listing">
|
||||
{% for user in manage_users %}
|
||||
<label class="listing__entry user-listing__entry">
|
||||
<div class="listing__entry__content user-listing__entry__content">
|
||||
<input type="checkbox">
|
||||
<div class="listing__entry__column user-listing__entry__column user-listing__entry__column--username">
|
||||
{{ user.username }}
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{{ pagination('?m=users', manage_users, users_page, null, 'p') }}
|
||||
{% endblock %}
|
|
@ -13,26 +13,28 @@
|
|||
{% include '@mio/_layout/meta.twig' %}
|
||||
<link href="https://static.flash.moe/fonts/visitor/visitor1.css" rel="stylesheet">
|
||||
<link href="https://use.fontawesome.com/releases/v5.0.8/css/all.css" rel="stylesheet">
|
||||
<link href="/css/mio.css" rel="stylesheet" type="text/css">
|
||||
<link href="/css/mio.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="mio">
|
||||
<div class="mio__wrapper">
|
||||
<div class="mio__header">
|
||||
<nav class="mio__header">
|
||||
<div class="mio__header__logo">
|
||||
<a href="/" class="mio__header__logo__link">
|
||||
<img class="mio__header__logo__image" src="https://static.flash.moe/logos/logo-exo.png" alt="Flashii">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="mio__header__menu">
|
||||
{% if app.session is not null %}
|
||||
<div class="mio__container mio__header__user">
|
||||
<div class="mio__container__title">Hey, {{ app.session.user.username }}!</div>
|
||||
<div class="mio__container__content mio__header__user__content">
|
||||
<div class="mio__avatar mio__header__user__avatar" style="background-image:url('/profile.php?u={{ app.session.user.user_id }}&m=avatar');"></div>
|
||||
<a href="/settings.php?m=avatar" class="mio__avatar mio__header__user__avatar" style="background-image:url('/profile.php?u={{ app.session.user.user_id }}&m=avatar');"></a>
|
||||
<div class="mio__header__user__links__container">
|
||||
<ul class="mio__header__user__links">
|
||||
<li class="mio__header__user__option"><a class="mio__header__user__link" href="/profile.php?u={{ app.session.user.user_id }}">Profile</a></li>
|
||||
<li class="mio__header__user__option"><a class="mio__header__user__link" href="/settings.php">Settings</a></li>
|
||||
<li class="mio__header__user__option"><a class="mio__header__user__link" href="{{ manage_link|default('/manage.php') }}">Manage</a></li>
|
||||
<li class="mio__header__user__option"><a class="mio__header__user__link" href="/auth.php?m=logout&s={{ csrf_token() }}">Logout</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
@ -42,7 +44,7 @@
|
|||
<a href="/auth.php" class="mio__input__button">Login/Register</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{% block content %}
|
||||
<div class="mio__container">
|
||||
|
@ -55,7 +57,7 @@
|
|||
{{ navigation(mio_navigation) }}
|
||||
{% endblock %}
|
||||
|
||||
<div class="mio__footer">
|
||||
<footer class="mio__footer">
|
||||
<div class="mio__footer__copyright">
|
||||
{{ link('https://flash.moe', 'flash.moe', 'mio__footer__copyright__link') }} 2013-{{
|
||||
''|date('Y') }} /
|
||||
|
@ -68,7 +70,7 @@
|
|||
{{ link('#', 'Status', 'mio__footer__links__link') }}
|
||||
{{ link('https://twitter.com/flashiinet', 'Twitter', 'mio__footer__links__link') }}
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Add table
Reference in a new issue