theme switcher

mysql support
used space indicator
This commit is contained in:
Sergio Brighenti 2018-11-12 18:56:12 +01:00
parent ba6ed78bd9
commit d6a9fcf600
18 changed files with 199 additions and 38 deletions

View file

@ -1,7 +1,10 @@
## v2.0 [WIP]
## v2.0
+ Migrated from Flight to Slim 3 framework.
+ Added install wizard (using the CLI is no longer required).
+ Allow discord bot to display the preview.
+ Theme switcher on the web UI.
+ Added used space indicator per user.
+ MySQL support.
+ Improvements under the hood.
## v1.3

View file

@ -4,6 +4,7 @@ namespace App\Controllers;
use League\Flysystem\Adapter\Local;
use League\Flysystem\FileNotFoundException;
use League\Flysystem\Filesystem;
use Slim\Container;
use Slim\Http\Request;
@ -59,7 +60,7 @@ abstract class Controller
/**
* @param $path
*/
public function removeDirectory($path)
protected function removeDirectory($path)
{
$files = glob($path . '/*');
foreach ($files as $file) {
@ -68,4 +69,25 @@ abstract class Controller
rmdir($path);
return;
}
/**
* @param $id
* @return int
*/
protected function getUsedSpaceByUser($id): int
{
$medias = $this->database->query('SELECT `uploads`.`storage_path` FROM `uploads` WHERE `user_id` = ?', $id)->fetchAll();
$totalSize = 0;
$filesystem = $this->getStorage();
foreach ($medias as $media) {
try {
$totalSize += $filesystem->getSize($media->storage_path);
} catch (FileNotFoundException $e) {
}
}
return $totalSize;
}
}

View file

@ -23,6 +23,7 @@ class DashboardController extends Controller
{
if ($request->getParam('afterInstall') !== null && is_dir('install')) {
Session::alert('Installation completed successfully!', 'success');
$this->removeDirectory('install');
}
@ -101,7 +102,33 @@ class DashboardController extends Controller
'mediasCount' => $mediasCount,
'orphanFilesCount' => $orphanFilesCount,
'totalSize' => $this->humanFilesize($totalSize),
'max_filesize' => ini_get('post_max_size') . '/' . ini_get('upload_max_filesize'),
'post_max_size' => ini_get('post_max_size'),
'upload_max_filesize' => ini_get('upload_max_filesize'),
]);
}
/**
* @param Request $request
* @param Response $response
* @return Response
*/
public function getThemes(Request $request, Response $response): Response
{
$apiJson = json_decode(file_get_contents('https://bootswatch.com/api/4.json'));
$out = [];
foreach ($apiJson->themes as $theme) {
$out["{$theme->name} - {$theme->description}"] = $theme->cssMin;
}
return $response->withJson($out);
}
public function applyTheme(Request $request, Response $response): Response
{
file_put_contents('static/bootstrap/css/bootstrap.min.css', file_get_contents($request->getParam('css')));
return $response->withRedirect('/system')->withAddedHeader('Cache-Control', 'no-cache, must-revalidate');
}
}

View file

@ -48,6 +48,7 @@ class LoginController extends Controller
Session::set('user_id', $result->id);
Session::set('username', $result->username);
Session::set('admin', $result->is_admin);
Session::set('used_space', $this->humanFilesize($this->getUsedSpaceByUser($result->id)));
Session::alert("Welcome, $result->username!", 'info');
$this->logger->info("User $result->username logged in.");

View file

@ -60,7 +60,7 @@ class UploadController extends Controller
$user->id,
$code,
$file->getClientFilename(),
$storagePath
$storagePath,
]);
$base_url = $this->settings['base_url'];
@ -115,7 +115,7 @@ class UploadController extends Controller
return $this->view->render($response, 'upload/public.twig', [
'media' => $media,
'type' => $mime,
'extension' => pathinfo($media->filename, PATHINFO_EXTENSION)
'extension' => pathinfo($media->filename, PATHINFO_EXTENSION),
]);
}
}
@ -196,7 +196,7 @@ class UploadController extends Controller
throw new NotFoundException($request, $response);
}
$this->database->query('UPDATE `uploads` SET `published`=? WHERE `id`=?', [!$media->published, $media->id]);
$this->database->query('UPDATE `uploads` SET `published`=? WHERE `id`=?', [$media->published ? 0 : 1, $media->id]);
return $response->withStatus(200);
}
@ -223,6 +223,7 @@ class UploadController extends Controller
} finally {
$this->database->query('DELETE FROM `uploads` WHERE `id` = ?', $args['id']);
$this->logger->info('User ' . Session::get('username') . ' deleted a media.', [$args['id']]);
Session::set('used_space', $this->humanFilesize($this->getUsedSpaceByUser(Session::get('user_id'))));
}
} else {
throw new UnauthorizedException();
@ -242,7 +243,7 @@ class UploadController extends Controller
$media = $this->database->query('SELECT * FROM `uploads` INNER JOIN `users` ON `uploads`.`user_id` = `users`.`id` WHERE `user_code` = ? AND `uploads`.`code` = ? LIMIT 1', [
$userCode,
$mediaCode
$mediaCode,
])->fetch();
return $media;

View file

@ -45,7 +45,12 @@ class DB
$parameters = [$parameters];
}
$query = $this->pdo->prepare($query);
$query->execute($parameters);
foreach ($parameters as $index => $parameter) {
$query->bindValue($index + 1, $parameter, is_int($parameter) ? PDO::PARAM_INT : PDO::PARAM_STR);
}
$query->execute();
return $query;
}

View file

@ -3,6 +3,8 @@
$app->group('', function () {
$this->get('/home[/page/{page}]', \App\Controllers\DashboardController::class . ':home');
$this->get('/system', \App\Controllers\DashboardController::class . ':system')->add(\App\Middleware\AdminMiddleware::class);
$this->get('/system/themes', \App\Controllers\DashboardController::class . ':getThemes')->add(\App\Middleware\AdminMiddleware::class);
$this->post('/system/theme/apply', \App\Controllers\DashboardController::class . ':applyTheme')->add(\App\Middleware\AdminMiddleware::class);
$this->group('', function () {
$this->get('/users[/page/{page}]', \App\Controllers\UserController::class . ':index');

View file

@ -1,7 +1,7 @@
#!/usr/bin/env php
<?php
require 'vendor/autoload.php';
require __DIR__ . '/../vendor/autoload.php';
if (php_sapi_name() !== 'cli') {
die();
@ -22,14 +22,14 @@ $action = isset($argv[1]) ? $argv[1] : 'all';
switch ($action) {
case 'cache':
cleanDir('resources/cache');
cleanDir(__DIR__ . '/../resources/cache');
break;
case 'sessions':
cleanDir('resources/sessions');
cleanDir(__DIR__ . '/../resources/sessions');
break;
case 'all':
cleanDir('resources/cache');
cleanDir('resources/sessions');
cleanDir(__DIR__ . '/../resources/cache');
cleanDir(__DIR__ . '/../resources/sessions');
break;
case 'help':
default:

View file

@ -3,7 +3,7 @@
use App\Database\DB;
require 'vendor/autoload.php';
require __DIR__ . '/../vendor/autoload.php';
if (php_sapi_name() !== 'cli') {
die();

View file

@ -1,7 +1,7 @@
#!/usr/bin/env php
<?php
require 'vendor/autoload.php';
require __DIR__ . '/../vendor/autoload.php';
if (php_sapi_name() !== 'cli') {
die();

View file

@ -8,6 +8,13 @@ use Monolog\Logger;
use Slim\App;
use Slim\Container;
if (!file_exists('config.php') && is_dir('install/')) {
header('Location: /install/');
exit();
} else if (!file_exists('config.php') && !is_dir('install/')) {
die('Cannot find the config file.');
}
// Load the config
$config = array_replace_recursive([
'app_name' => 'XBackBone',

View file

@ -60,8 +60,8 @@ $app->post('/', function (Request $request, Response $response) use (&$config) {
$config['displayErrorDetails'] = false;
$config['db']['connection'] = $request->getParam('connection');
$config['db']['dsn'] = $request->getParam('dsn');
$config['db']['username'] = null;
$config['db']['password'] = null;
$config['db']['username'] = $request->getParam('db_user');
$config['db']['password'] = $request->getParam('db_password');
file_put_contents(__DIR__ . '/../config.php', '<?php' . PHP_EOL . 'return ' . var_export($config, true) . ';');
@ -130,7 +130,6 @@ $app->post('/', function (Request $request, Response $response) use (&$config) {
DB::query("INSERT INTO `users` (`email`, `username`, `password`, `is_admin`, `user_code`) VALUES (?, 'admin', ?, 1, ?)", [$request->getParam('email'), password_hash($request->getParam('password'), PASSWORD_DEFAULT), substr(md5(microtime()), rand(0, 26), 5)]);
Session::alert('Installation completed successfully!', 'success');
return $response->withRedirect('../?afterInstall=true');
});

View file

@ -51,7 +51,8 @@
<div class="form-group row">
<label for="base_url" class="col-sm-3 col-form-label">Base URL</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="base_url" name="base_url" value="{{ config.base_url }}" autocomplete="off" required>
<input type="text" class="form-control" id="base_url" name="base_url"
value="{{ config.base_url }}" autocomplete="off" required>
</div>
</div>
<hr>
@ -60,6 +61,7 @@
<div class="col-sm-9">
<select name="connection" id="connection" required class="form-control">
<option value="sqlite" selected>SQLite</option>
<option value="mysql">MySQL</option>
</select>
</div>
</div>
@ -67,7 +69,8 @@
<div class="form-group row">
<label for="dsn" class="col-sm-3 col-form-label">Database Source Name (DSN)</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="dsn" name="dsn" value="{{ config.db.dsn }}" autocomplete="off" required>
<input type="text" class="form-control" id="dsn" name="dsn" value="{{ config.db.dsn }}"
autocomplete="off" required>
</div>
</div>
@ -81,28 +84,33 @@
<div class="form-group row">
<label for="db_password" class="col-sm-3 col-form-label">Database Password</label>
<div class="col-sm-9">
<input type="password" class="form-control" id="db_password" name="db_password" autocomplete="off" disabled>
<input type="password" class="form-control" id="db_password" name="db_password"
autocomplete="off" disabled>
</div>
</div>
<hr>
<div class="form-group row">
<label for="storage_dir" class="col-sm-3 col-form-label">Storage Directory</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="storage_dir" name="storage_dir" value="{{ config.storage_dir }}" autocomplete="off" required>
<input type="text" class="form-control" id="storage_dir" name="storage_dir"
value="{{ config.storage_dir }}" autocomplete="off" required>
<small>Must be a writable directory</small>
</div>
</div>
<hr>
<div class="form-group row">
<label for="email" class="col-sm-3 col-form-label">Admin email</label>
<div class="col-sm-9">
<input type="email" class="form-control" id="email" placeholder="email@example.com" name="email" autocomplete="off" required>
<input type="email" class="form-control" id="email" placeholder="email@example.com"
name="email" autocomplete="off" required>
</div>
</div>
<div class="form-group row">
<label for="password" class="col-sm-3 col-form-label">Admin password</label>
<div class="col-sm-9">
<input type="password" class="form-control" id="password" placeholder="Password" name="password" autocomplete="off" required>
<input type="password" class="form-control" id="password" placeholder="Password"
name="password" autocomplete="off" required>
</div>
</div>
@ -119,6 +127,24 @@
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('#connection').change(function () {
switch ($(this).val()) {
case 'sqlite':
$('#dsn').val('resources/database/xbackbone.db');
$('#db_user').val('').prop('disabled', 'disabled');
$('#db_password').val('').prop('disabled', 'disabled');
break;
case 'mysql':
$('#dsn').val('host=localhost;port=3306;dbname=xbackbone');
$('#db_user').val('db_user').prop('disabled', '');
$('#db_password').val('').prop('disabled', '');
break;
}
});
})
</script>
{% include 'footer.twig' %}
</body>
</html>

View file

@ -0,0 +1,26 @@
CREATE TABLE IF NOT EXISTS `users` (
`id` INTEGER PRIMARY KEY AUTO_INCREMENT,
`email` VARCHAR(30) NOT NULL,
`username` VARCHAR(30) NOT NULL,
`password` VARCHAR(256) NOT NULL,
`user_code` VARCHAR(5),
`token` VARCHAR(256),
`active` BOOLEAN NOT NULL DEFAULT 1,
`is_admin` BOOLEAN NOT NULL DEFAULT 0,
`registration_date` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
INDEX (`username`, `user_code`, `token`)
);
CREATE TABLE IF NOT EXISTS `uploads` (
`id` INTEGER PRIMARY KEY AUTO_INCREMENT,
`user_id` INTEGER(20),
`code` VARCHAR(64) NOT NULL,
`filename` VARCHAR(128) NOT NULL,
`storage_path` VARCHAR(256) NOT NULL,
`published` BOOLEAN NOT NULL DEFAULT 1,
`timestamp` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
INDEX (`code`),
FOREIGN KEY (`user_id`) REFERENCES `users` (`id`)
ON UPDATE CASCADE
ON DELETE SET NULL
);

View file

@ -7,7 +7,7 @@ CREATE TABLE IF NOT EXISTS `users` (
`token` VARCHAR(256),
`active` BOOLEAN NOT NULL DEFAULT 1,
`is_admin` BOOLEAN NOT NULL DEFAULT 0,
`registration_date` NOT NULL DEFAULT CURRENT_TIMESTAMP
`registration_date` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP
);
CREATE TABLE IF NOT EXISTS `uploads` (
@ -17,7 +17,7 @@ CREATE TABLE IF NOT EXISTS `uploads` (
`filename` VARCHAR(128) NOT NULL,
`storage_path` VARCHAR(256) NOT NULL,
`published` BOOLEAN NOT NULL DEFAULT 1,
`timestamp` NOT NULL DEFAULT CURRENT_TIMESTAMP,
`timestamp` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (`user_id`) REFERENCES `users` (`id`)
ON UPDATE CASCADE
ON DELETE SET NULL

View file

@ -30,6 +30,8 @@
<i class="fas fa-fw fa-user"></i> {{ session.username }}
</a>
<div class="dropdown-menu" aria-labelledby="userDropdown">
<a class="dropdown-item disabled" href="javascript:void(0)">Used: {{ session.used_space }}</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="{{ config.base_url }}/profile"><i class="fas fa-fw fa-user"></i> Profile</a>
<a class="dropdown-item" href="{{ config.base_url }}/logout"><i class="fas fa-fw fa-sign-out-alt"></i> Logout</a>
</div>

View file

@ -54,14 +54,38 @@
</div>
</div>
<div class="row">
<div class="col-md-6 offset-md-3">
<div class="col-md-8">
<div class="card">
<div class="card-header"><i class="fas fa-paint-brush fa-fw"></i> Theme</div>
<div class="card-body">
<form method="post" action="{{ config.base_url }}/system/theme/apply">
<div class="form-group row">
<div class="col-sm-12">
<select class="form-control" id="themes" name="css">
<option id="theme-load" selected disabled hidden>Click to load...</option>
</select>
</div>
</div>
<div class="form-group row">
<div class="col-sm-12">
<button type="submit" class="btn btn-outline-success" id="themes-apply" disabled>
<i class="fas fa-save fa-fw"></i> Apply
</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-header"><i class="fas fa-cog fa-fw"></i> System Information</div>
<div class="card-body">
<p>
<strong>Max upload size (<code>max_post_size/upload_max_filesize</code>):</strong>
{{ max_filesize }}
</p>
<strong>Max upload size:</strong>
<ul>
<li><code>post_max_size</code>: {{ post_max_size }}</li>
<li><code>upload_max_filesize</code>: {{ upload_max_filesize }}</li>
</ul>
</div>
</div>
</div>

View file

@ -7,6 +7,7 @@ var app = {
$('.media-delete').click(app.mediaDelete);
$('.publish-toggle').click(app.publishToggle);
$('.refresh-token').click(app.refreshToken);
$('#themes').mousedown(app.loadThemes);
$('.alert').fadeTo(2000, 500).slideUp(500, function () {
$('.alert').slideUp(500);
@ -64,6 +65,21 @@ var app = {
$.post(window.AppConfig.base_url + '/user/' + id + '/refreshToken', function (data) {
$('#token').val(data);
});
},
loadThemes: function (e) {
e.preventDefault();
var $themes = $('#themes');
$.get(window.AppConfig.base_url + '/system/themes', function (data) {
$themes.empty();
Object.keys(data).forEach(function (key) {
var opt = document.createElement('option');
opt.value = data[key];
opt.innerHTML = key;
$themes.append(opt);
});
$('#themes-apply').prop('disabled', false);
});
$themes.unbind('mousedown');
}
};