private/nexus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

console

Browse Source
This commit is contained in:
Lars Gebhardt-Kusche
2026-03-07 23:58:40 +01:00
parent 766eab12e7
commit 12c2ce4817
10 changed files with 652 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
modules/pi_control/assets/commands.js Normal file
View File

@@ -0,0 +1,97 @@
(() => {
const form = document.querySelector('[data-command-form]');
const list = document.querySelector('[data-command-list]');
if (!form) return;
const idInput = form.querySelector('input[name="id"]');
const labelInput = form.querySelector('input[name="label"]');
const commandInput = form.querySelector('textarea[name="command"]');
const timeoutInput = form.querySelector('input[name="timeout_sec"]');
const adminInput = form.querySelector('input[name="admin_only"]');
const submitBtn = form.querySelector('[data-command-submit]');
const cancelBtn = form.querySelector('[data-command-cancel]');
const resetForm = () => {
if (idInput) idInput.value = '';
if (labelInput) labelInput.value = '';
if (commandInput) commandInput.value = '';
if (timeoutInput) timeoutInput.value = '';
if (adminInput) adminInput.checked = false;
if (submitBtn) submitBtn.textContent = 'Speichern';
};
document.querySelectorAll('[data-command-edit]').forEach((btn) => {
btn.addEventListener('click', () => {
const item = btn.closest('.command-item');
if (!item) return;
if (idInput) idInput.value = item.dataset.commandId || '';
if (labelInput) labelInput.value = item.dataset.label || '';
if (commandInput) commandInput.value = item.dataset.command || '';
if (timeoutInput) timeoutInput.value = item.dataset.timeout || '';
if (adminInput) adminInput.checked = item.dataset.admin === '1';
if (submitBtn) submitBtn.textContent = 'Aktualisieren';
const details = btn.closest('details');
if (details) details.removeAttribute('open');
form.scrollIntoView({ behavior: 'smooth', block: 'start' });
});
});
if (cancelBtn) {
cancelBtn.addEventListener('click', (e) => {
e.preventDefault();
resetForm();
});
}
if (!list) return;
let dragging = null;
list.querySelectorAll('.command-item').forEach((item) => {
item.addEventListener('dragstart', () => {
dragging = item;
item.classList.add('is-dragging');
});
item.addEventListener('dragend', () => {
item.classList.remove('is-dragging');
dragging = null;
saveOrder();
});
});
list.addEventListener('dragover', (e) => {
e.preventDefault();
if (!dragging) return;
const after = getDragAfterElement(list, e.clientY);
if (after == null) {
list.appendChild(dragging);
} else if (after !== dragging) {
list.insertBefore(dragging, after);
}
});
const getDragAfterElement = (container, y) => {
const elements = [...container.querySelectorAll('.command-item:not(.is-dragging)')];
return elements.reduce(
(closest, child) => {
const box = child.getBoundingClientRect();
const offset = y - box.top - box.height / 2;
if (offset < 0 && offset > closest.offset) {
return { offset, element: child };
}
return closest;
},
{ offset: Number.NEGATIVE_INFINITY, element: null }
).element;
};
const saveOrder = () => {
const order = [...list.querySelectorAll('.command-item')].map((el) => el.dataset.commandId);
fetch(window.location.pathname + '?reorder_json=1', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ order }),
cache: 'no-store',
}).catch(() => {});
};
})();

56
modules/pi_control/assets/hosts.js Normal file
View File

@@ -0,0 +1,56 @@
(() => {
const form = document.querySelector('[data-host-form]');
if (!form) return;
const idInput = form.querySelector('input[name="id"]');
const nameInput = form.querySelector('input[name="name"]');
const hostInput = form.querySelector('input[name="host"]');
const portInput = form.querySelector('input[name="port"]');
const userInput = form.querySelector('input[name="username"]');
const authSelect = form.querySelector('select[name="auth_type"]');
const keyInput = form.querySelector('input[name="key_path"]');
const passInput = form.querySelector('input[name="password"]');
const imageInput = form.querySelector('input[name="image_url"]');
const submitBtn = form.querySelector('[data-host-submit]');
const cancelBtn = form.querySelector('[data-host-cancel]');
const resetForm = () => {
if (idInput) idInput.value = '';
if (nameInput) nameInput.value = '';
if (hostInput) hostInput.value = '';
if (portInput) portInput.value = '22';
if (userInput) userInput.value = '';
if (authSelect) authSelect.value = 'key';
if (keyInput) keyInput.value = '';
if (passInput) passInput.value = '';
if (imageInput) imageInput.value = '';
if (submitBtn) submitBtn.textContent = 'Speichern';
};
document.querySelectorAll('[data-host-edit]').forEach((btn) => {
btn.addEventListener('click', () => {
const card = btn.closest('.host-card');
if (!card) return;
if (idInput) idInput.value = card.dataset.hostId || '';
if (nameInput) nameInput.value = card.dataset.name || '';
if (hostInput) hostInput.value = card.dataset.host || '';
if (portInput) portInput.value = card.dataset.port || '22';
if (userInput) userInput.value = card.dataset.username || '';
if (authSelect) authSelect.value = card.dataset.auth || 'key';
if (keyInput) keyInput.value = card.dataset.keyPath || '';
if (passInput) passInput.value = '';
if (imageInput) imageInput.value = card.dataset.imageUrl || '';
if (submitBtn) submitBtn.textContent = 'Aktualisieren';
const details = btn.closest('details');
if (details) details.removeAttribute('open');
form.scrollIntoView({ behavior: 'smooth', block: 'start' });
});
});
if (cancelBtn) {
cancelBtn.addEventListener('click', (e) => {
e.preventDefault();
resetForm();
});
}
})();

113
modules/pi_control/assets/pi_control.css
View File

@@ -73,6 +73,119 @@
background: #0b0f17;
}
.host-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 16px;
}
.host-card {
background: var(--panel);
border: 1px solid var(--line);
border-radius: 16px;
overflow: hidden;
display: grid;
grid-template-rows: 120px 1fr;
box-shadow: var(--shadow);
}
.host-card-image {
background: linear-gradient(135deg, #2b3a67 0%, #3b2f5c 45%, #1c2b3f 100%);
background-size: cover;
background-position: center;
position: relative;
}
.host-card-overlay {
position: absolute;
inset: 0;
background: rgba(10, 16, 28, 0.35);
}
.host-card-body {
padding: 12px 14px 14px;
display: grid;
gap: 6px;
}
.host-card-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.host-card-title {
display: inline-flex;
align-items: center;
gap: 8px;
}
.status-dot {
width: 10px;
height: 10px;
border-radius: 999px;
display: inline-block;
}
.status-ok { background: #31c48d; }
.status-auth { background: #fbbf24; }
.status-down { background: #ef4444; }
.action-menu {
position: relative;
}
.action-menu summary {
list-style: none;
cursor: pointer;
border-radius: 10px;
padding: 2px 6px;
border: 1px solid var(--line);
background: var(--panel-2);
}
.action-menu summary::-webkit-details-marker { display: none; }
.action-menu[open] summary {
background: var(--panel);
}
.action-menu-panel {
position: absolute;
right: 0;
top: calc(100% + 6px);
background: var(--panel);
border: 1px solid var(--line);
border-radius: 12px;
padding: 6px;
min-width: 160px;
display: grid;
gap: 4px;
z-index: 5;
box-shadow: var(--shadow);
}
.action-menu-panel form { margin: 0; }
.command-list {
list-style: none;
padding: 0;
margin: 0;
display: grid;
gap: 10px;
}
.command-item {
display: grid;
grid-template-columns: 28px 1fr auto;
gap: 10px;
align-items: start;
padding: 10px 12px;
border: 1px solid var(--line);
border-radius: 12px;
background: var(--panel);
}
.command-item.is-dragging {
opacity: 0.6;
}
.command-drag {
cursor: grab;
color: var(--muted);
font-size: 1.1rem;
padding-top: 4px;
}
.command-body code {
display: inline-block;
word-break: break-word;
}
.queue-button {
display: inline-flex;
align-items: center;

18
modules/pi_control/bootstrap.php
View File

@@ -64,6 +64,7 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
auth_type VARCHAR(20) NOT NULL DEFAULT 'key',
key_path TEXT NULL,
password TEXT NULL,
image_url TEXT NULL,
created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP
)");
$pdo->exec("CREATE TABLE IF NOT EXISTS {$cmdTable} (
@@ -72,6 +73,7 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
command TEXT NOT NULL,
admin_only BOOLEAN NOT NULL DEFAULT false,
timeout_sec INTEGER NULL,
sort_order INTEGER NULL,
created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP
)");
$pdo->exec("CREATE TABLE IF NOT EXISTS {$runTable} (
@@ -110,6 +112,7 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
auth_type VARCHAR(20) NOT NULL DEFAULT 'key',
key_path TEXT NULL,
password TEXT NULL,
image_url TEXT NULL,
created_at DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP
)");
$pdo->exec("CREATE TABLE IF NOT EXISTS {$cmdTable} (
@@ -118,6 +121,7 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
command TEXT NOT NULL,
admin_only INTEGER NOT NULL DEFAULT 0,
timeout_sec INTEGER NULL,
sort_order INTEGER NULL,
created_at DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP
)");
$pdo->exec("CREATE TABLE IF NOT EXISTS {$runTable} (
@@ -150,7 +154,9 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
// Schema migrations for existing tables
if ($driver === 'pgsql') {
$pdo->exec("ALTER TABLE {$hostTable} ADD COLUMN IF NOT EXISTS image_url TEXT NULL");
$pdo->exec("ALTER TABLE {$cmdTable} ADD COLUMN IF NOT EXISTS timeout_sec INTEGER NULL");
$pdo->exec("ALTER TABLE {$cmdTable} ADD COLUMN IF NOT EXISTS sort_order INTEGER NULL");
$pdo->exec("ALTER TABLE {$runTable} ADD COLUMN IF NOT EXISTS error TEXT NULL");
$pdo->exec("ALTER TABLE {$runTable} ADD COLUMN IF NOT EXISTS exit_code INTEGER NULL");
$pdo->exec("ALTER TABLE {$runTable} ADD COLUMN IF NOT EXISTS timeout_sec INTEGER NULL");
@@ -158,6 +164,15 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
$pdo->exec("ALTER TABLE {$runTable} ADD COLUMN IF NOT EXISTS finished_at TIMESTAMP NULL");
$pdo->exec("ALTER TABLE {$sessionTable} ADD COLUMN IF NOT EXISTS command_text TEXT NULL");
} else {
$columns = [];
$stmt = $pdo->query('PRAGMA table_info(' . $hostTable . ')');
foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $col) {
$columns[$col['name']] = true;
}
if (empty($columns['image_url'])) {
$pdo->exec("ALTER TABLE {$hostTable} ADD COLUMN image_url TEXT NULL");
}
$columns = [];
$stmt = $pdo->query('PRAGMA table_info(' . $cmdTable . ')');
foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $col) {
@@ -166,6 +181,9 @@ $mm->registerFunction($moduleName, 'ensure_schema', function () use ($moduleName
if (empty($columns['timeout_sec'])) {
$pdo->exec("ALTER TABLE {$cmdTable} ADD COLUMN timeout_sec INTEGER NULL");
}
if (empty($columns['sort_order'])) {
$pdo->exec("ALTER TABLE {$cmdTable} ADD COLUMN sort_order INTEGER NULL");
}
$columns = [];
$stmt = $pdo->query('PRAGMA table_info(' . $runTable . ')');

15
modules/pi_control/module.json
View File

@@ -4,10 +4,14 @@
"description": "Verwaltung und Steuerung von Raspberry Pis (SSH/Commands/Presets).",
"menu": [
{ "label": "Übersicht", "href": "/module/pi_control" },
{ "label": "Hosts", "href": "/module/pi_control/hosts" },
{ "label": "Befehle", "href": "/module/pi_control/commands" },
{ "label": "Konsole", "href": "/module/pi_control/console" },
{ "label": "Setup", "href": "/modules/setup/pi_control" }
{
"label": "Settings",
"children": [
{ "label": "Hosts", "href": "/module/pi_control/hosts" },
{ "label": "Befehle", "href": "/module/pi_control/commands" }
]
}
],
"sidebar": {
"enabled": true,
@@ -15,10 +19,9 @@
"default": "collapsed",
"items": [
{ "label": "Übersicht", "href": "/module/pi_control" },
{ "label": "Hosts", "href": "/module/pi_control/hosts" },
{ "label": "Befehle", "href": "/module/pi_control/commands" },
{ "label": "Konsole", "href": "/module/pi_control/console" },
{ "label": "Setup", "href": "/modules/setup/pi_control" }
{ "label": "Hosts", "href": "/module/pi_control/hosts" },
{ "label": "Befehle", "href": "/module/pi_control/commands" }
]
},
"setup": {

2
modules/pi_control/pages/asset.php
View File

@@ -4,6 +4,8 @@ $base = realpath(__DIR__ . '/../assets');
$map = [
'pi_control.css' => $base . '/pi_control.css',
'console.js' => $base . '/console.js',
'hosts.js' => $base . '/hosts.js',
'commands.js' => $base . '/commands.js',
];
if (!isset($map[$file])) {

116
modules/pi_control/pages/commands.php
View File

@@ -5,35 +5,79 @@ $table = fn(string $name) => module_fn('pi_control', 'table', $name);
$assets = app()->assets();
if ($assets) {
$assets->addStyle('/module/pi_control/asset?file=pi_control.css');
$assets->addScript('/module/pi_control/asset?file=commands.js', 'footer', true);
}
$notice = null;
$error = null;
if (isset($_GET['reorder_json'])) {
require_admin();
$payload = json_decode(file_get_contents('php://input'), true);
$order = is_array($payload['order'] ?? null) ? $payload['order'] : [];
if ($order) {
$stmt = $pdo->prepare('UPDATE ' . $table('commands') . ' SET sort_order = :sort_order WHERE id = :id');
$pos = 1;
foreach ($order as $id) {
$stmt->execute([
'sort_order' => $pos++,
'id' => (int)$id,
]);
}
}
header('Content-Type: application/json; charset=utf-8');
echo json_encode(['ok' => true]);
exit;
}
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
require_admin();
$deleteId = (int)($_POST['delete_id'] ?? 0);
$editId = (int)($_POST['id'] ?? 0);
$label = trim((string)($_POST['label'] ?? ''));
$command = trim((string)($_POST['command'] ?? ''));
$adminOnly = !empty($_POST['admin_only']) ? 1 : 0;
$timeoutSec = (int)($_POST['timeout_sec'] ?? 0);
if ($deleteId > 0) {
$stmt = $pdo->prepare('DELETE FROM ' . $table('commands') . ' WHERE id = :id');
$stmt->execute(['id' => $deleteId]);
$notice = 'Befehl gelöscht.';
} else {
if ($label === '' || $command === '') {
$error = 'Bitte Label und Command angeben.';
} else {
if ($editId > 0) {
$stmt = $pdo->prepare(
'INSERT INTO ' . $table('commands') . ' (label, command, admin_only, timeout_sec) VALUES (:label, :command, :admin_only, :timeout_sec)'
'UPDATE ' . $table('commands') . ' SET label = :label, command = :command, admin_only = :admin_only, timeout_sec = :timeout_sec WHERE id = :id'
);
$stmt->execute([
'id' => $editId,
'label' => $label,
'command' => $command,
'admin_only' => $adminOnly,
'timeout_sec' => $timeoutSec > 0 ? $timeoutSec : null,
]);
$notice = 'Befehl aktualisiert.';
} else {
$nextSort = (int)$pdo->query('SELECT COALESCE(MAX(sort_order), 0) + 1 FROM ' . $table('commands'))->fetchColumn();
$stmt = $pdo->prepare(
'INSERT INTO ' . $table('commands') . ' (label, command, admin_only, timeout_sec, sort_order) VALUES (:label, :command, :admin_only, :timeout_sec, :sort_order)'
);
$stmt->execute([
'label' => $label,
'command' => $command,
'admin_only' => $adminOnly,
'timeout_sec' => $timeoutSec > 0 ? $timeoutSec : null,
'sort_order' => $nextSort,
]);
$notice = 'Befehl gespeichert.';
}
}
}
}
$commands = $pdo->query('SELECT * FROM ' . $table('commands') . ' ORDER BY id DESC')->fetchAll(PDO::FETCH_ASSOC);
$commands = $pdo->query('SELECT * FROM ' . $table('commands') . ' ORDER BY COALESCE(sort_order, id) ASC, id ASC')->fetchAll(PDO::FETCH_ASSOC);
?>
<div class="card">
<div class="pill">Pi Control</div>
@@ -53,7 +97,8 @@ $commands = $pdo->query('SELECT * FROM ' . $table('commands') . ' ORDER BY id DE
<div class="grid" style="margin-top:1rem;">
<div class="card" style="background:var(--panel-2);">
<strong>Neuer Befehl</strong>
<form method="post" class="form-grid" style="margin-top:.75rem;">
<form method="post" class="form-grid" style="margin-top:.75rem;" data-command-form>
<input type="hidden" name="id" value="">
<input type="text" name="label" placeholder="Label" required>
<textarea name="command" rows="4" placeholder="Command" required></textarea>
<input type="number" name="timeout_sec" placeholder="Timeout (Sek., optional)">
@@ -61,39 +106,56 @@ $commands = $pdo->query('SELECT * FROM ' . $table('commands') . ' ORDER BY id DE
<input type="checkbox" name="admin_only" value="1">
Nur Admin
</label>
<button class="cta-button" type="submit">Speichern</button>
<div style="display:flex; gap:10px; flex-wrap:wrap;">
<button class="cta-button" type="submit" data-command-submit>Speichern</button>
<button class="nav-link" type="button" data-command-cancel>Zurücksetzen</button>
</div>
</form>
</div>
<div class="card" style="background:var(--panel-2);">
<strong>Vorhandene Befehle</strong>
<div style="margin-top:.75rem; overflow:auto;">
<table class="table" style="min-width:560px;">
<thead>
<tr>
<th>Label</th>
<th>Command</th>
<th>Timeout</th>
<th>Admin</th>
</tr>
</thead>
<tbody>
<?php if (!$commands): ?>
<tr><td colspan="4" class="muted">Keine Befehle vorhanden.</td></tr>
<?php endif; ?>
<div class="muted" style="margin-top:.75rem;">Keine Befehle vorhanden.</div>
<?php else: ?>
<ul class="command-list" data-command-list style="margin-top:.75rem;">
<?php foreach ($commands as $c): ?>
<tr>
<td><?= e($c['label'] ?? '') ?></td>
<td class="muted" style="max-width:360px;">
<li class="command-item" draggable="true"
data-command-id="<?= e((string)$c['id']) ?>"
data-label="<?= e((string)($c['label'] ?? '')) ?>"
data-command="<?= e((string)($c['command'] ?? '')) ?>"
data-timeout="<?= e((string)($c['timeout_sec'] ?? '')) ?>"
data-admin="<?= !empty($c['admin_only']) ? '1' : '0' ?>">
<div class="command-drag">⋮⋮</div>
<div class="command-body">
<div class="command-title">
<strong><?= e($c['label'] ?? '') ?></strong>
<?php if (!empty($c['admin_only'])): ?>
<span class="pill">Admin</span>
<?php endif; ?>
</div>
<div class="muted" style="margin-top:4px;">
<code><?= e($c['command'] ?? '') ?></code>
</td>
<td><?= !empty($c['timeout_sec']) ? e((string)$c['timeout_sec']) . 's' : 'default' ?></td>
<td><?= !empty($c['admin_only']) ? 'ja' : 'nein' ?></td>
</tr>
</div>
<div class="muted" style="margin-top:4px;">
Timeout: <?= !empty($c['timeout_sec']) ? e((string)$c['timeout_sec']) . 's' : 'default' ?>
</div>
</div>
<details class="action-menu">
<summary>☰</summary>
<div class="action-menu-panel">
<button class="nav-link" type="button" data-command-edit>Bearbeiten</button>
<form method="post" onsubmit="return confirm('Befehl wirklich löschen?')">
<input type="hidden" name="delete_id" value="<?= e((string)$c['id']) ?>">
<button class="nav-link" type="submit">Löschen</button>
</form>
</div>
</details>
</li>
<?php endforeach; ?>
</tbody>
</table>
</div>
</ul>
<p class="muted" style="margin-top:.5rem;">Reihenfolge per Drag & Drop ändern.</p>
<?php endif; ?>
</div>
</div>
</div>

195
modules/pi_control/pages/hosts.php
View File

@@ -5,6 +5,7 @@ $table = fn(string $name) => module_fn('pi_control', 'table', $name);
$assets = app()->assets();
if ($assets) {
$assets->addStyle('/module/pi_control/asset?file=pi_control.css');
$assets->addScript('/module/pi_control/asset?file=hosts.js', 'footer', true);
}
$notice = null;
@@ -12,6 +13,8 @@ $error = null;
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
require_admin();
$deleteId = (int)($_POST['delete_id'] ?? 0);
$editId = (int)($_POST['id'] ?? 0);
$name = trim((string)($_POST['name'] ?? ''));
$host = trim((string)($_POST['host'] ?? ''));
$port = (int)($_POST['port'] ?? 22);
@@ -19,12 +22,39 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$authType = trim((string)($_POST['auth_type'] ?? 'key'));
$keyPath = trim((string)($_POST['key_path'] ?? ''));
$password = trim((string)($_POST['password'] ?? ''));
$imageUrl = trim((string)($_POST['image_url'] ?? ''));
if ($deleteId > 0) {
$stmt = $pdo->prepare('DELETE FROM ' . $table('hosts') . ' WHERE id = :id');
$stmt->execute(['id' => $deleteId]);
$notice = 'Host gelöscht.';
} else {
if ($name === '' || $host === '' || $username === '') {
$error = 'Bitte Name, Host und Benutzer angeben.';
} else {
if ($editId > 0) {
$stmt = $pdo->prepare('SELECT * FROM ' . $table('hosts') . ' WHERE id = :id LIMIT 1');
$stmt->execute(['id' => $editId]);
$existing = $stmt->fetch(PDO::FETCH_ASSOC) ?: [];
$passwordToStore = $password !== '' ? $password : ($existing['password'] ?? null);
$stmt = $pdo->prepare(
'INSERT INTO ' . $table('hosts') . ' (name, host, port, username, auth_type, key_path, password) VALUES (:name, :host, :port, :username, :auth_type, :key_path, :password)'
'UPDATE ' . $table('hosts') . ' SET name = :name, host = :host, port = :port, username = :username, auth_type = :auth_type, key_path = :key_path, password = :password, image_url = :image_url WHERE id = :id'
);
$stmt->execute([
'id' => $editId,
'name' => $name,
'host' => $host,
'port' => $port > 0 ? $port : 22,
'username' => $username,
'auth_type' => $authType !== '' ? $authType : 'key',
'key_path' => $keyPath !== '' ? $keyPath : null,
'password' => $passwordToStore,
'image_url' => $imageUrl !== '' ? $imageUrl : null,
]);
$notice = 'Host aktualisiert.';
} else {
$stmt = $pdo->prepare(
'INSERT INTO ' . $table('hosts') . ' (name, host, port, username, auth_type, key_path, password, image_url) VALUES (:name, :host, :port, :username, :auth_type, :key_path, :password, :image_url)'
);
$stmt->execute([
'name' => $name,
@@ -34,12 +64,95 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
'auth_type' => $authType !== '' ? $authType : 'key',
'key_path' => $keyPath !== '' ? $keyPath : null,
'password' => $password !== '' ? $password : null,
'image_url' => $imageUrl !== '' ? $imageUrl : null,
]);
$notice = 'Host gespeichert.';
}
}
}
}
$hosts = $pdo->query('SELECT * FROM ' . $table('hosts') . ' ORDER BY id DESC')->fetchAll(PDO::FETCH_ASSOC);
$settings = modules()->settings('pi_control');
$strictHostKey = !empty($settings['terminal_strict_hostkey']);
function hostReachable(string $host, int $port): bool
{
$errno = 0;
$errstr = '';
$fp = @fsockopen($host, $port, $errno, $errstr, 1.2);
if ($fp) {
fclose($fp);
return true;
}
return false;
}
function runSshCommand(string $cmd, int $timeoutSec): int
{
$descriptors = [
1 => ['pipe', 'w'],
2 => ['pipe', 'w'],
];
$process = proc_open($cmd, $descriptors, $pipes);
if (!is_resource($process)) {
return 255;
}
stream_set_blocking($pipes[1], false);
stream_set_blocking($pipes[2], false);
$start = time();
while (true) {
$status = proc_get_status($process);
if (!$status['running']) {
$code = (int)$status['exitcode'];
proc_close($process);
return $code;
}
if (time() - $start > $timeoutSec) {
proc_terminate($process, 9);
proc_close($process);
return 124;
}
usleep(100000);
}
}
function hostAuthOk(array $host, bool $strictHostKey): bool
{
$hostAddr = (string)($host['host'] ?? '');
$user = (string)($host['username'] ?? '');
$port = (int)($host['port'] ?? 22);
$authType = (string)($host['auth_type'] ?? 'key');
$keyPath = (string)($host['key_path'] ?? '');
$password = (string)($host['password'] ?? '');
if ($hostAddr === '' || $user === '') {
return false;
}
$opts = $strictHostKey
? '-o StrictHostKeyChecking=accept-new -o UserKnownHostsFile=/root/.ssh/known_hosts'
: '-o StrictHostKeyChecking=no -o UserKnownHostsFile=/dev/null';
$opts .= ' -o ConnectTimeout=2 -o NumberOfPasswordPrompts=1';
$target = escapeshellarg($user . '@' . $hostAddr);
$cmd = 'ssh ' . $opts . ' -p ' . (int)$port . ' ';
if ($authType === 'key' && $keyPath !== '') {
$cmd .= '-i ' . escapeshellarg($keyPath) . ' -o BatchMode=yes ';
} elseif ($authType === 'key') {
$cmd .= '-o BatchMode=yes ';
}
$cmd .= $target . ' -- true';
if ($authType === 'pass') {
if ($password === '') {
return false;
}
$cmd = 'sshpass -p ' . escapeshellarg($password) . ' ' . $cmd;
}
$exitCode = runSshCommand($cmd, 3);
return $exitCode === 0;
}
?>
<div class="card">
<div class="pill">Pi Control</div>
@@ -59,7 +172,8 @@ $hosts = $pdo->query('SELECT * FROM ' . $table('hosts') . ' ORDER BY id DESC')->
<div class="grid" style="margin-top:1rem;">
<div class="card form-card" style="background:var(--panel-2);">
<strong>Neuer Host</strong>
<form method="post" class="form-grid" style="margin-top:.75rem;">
<form method="post" class="form-grid" style="margin-top:.75rem;" data-host-form>
<input type="hidden" name="id" value="">
<label class="form-field">
<span class="muted">Name</span>
<input type="text" name="name" placeholder="z.B. Wohnzimmer-Pi" required title="Eindeutiger Anzeigename für diesen Pi.">
@@ -91,39 +205,66 @@ $hosts = $pdo->query('SELECT * FROM ' . $table('hosts') . ' ORDER BY id DESC')->
<span class="muted">Passwort (optional)</span>
<input type="password" name="password" placeholder="SSH-Passwort" title="Nur nutzen, wenn Auth-Typ = pass.">
</label>
<button class="cta-button" type="submit">Speichern</button>
<label class="form-field">
<span class="muted">Bild-URL (optional)</span>
<input type="text" name="image_url" placeholder="https://..." title="Optionales Bild für die Host-Karte.">
</label>
<div style="display:flex; gap:10px; flex-wrap:wrap;">
<button class="cta-button" type="submit" data-host-submit>Speichern</button>
<button class="nav-link" type="button" data-host-cancel>Zurücksetzen</button>
</div>
</form>
</div>
<div class="card form-card" style="background:var(--panel-2);">
<strong>Registrierte Hosts</strong>
<div style="margin-top:.75rem; overflow:auto;">
<table class="table" style="min-width:560px;">
<thead>
<tr>
<th>Name</th>
<th>Host</th>
<th>User</th>
<th>Port</th>
<th>Auth</th>
</tr>
</thead>
<tbody>
<?php if (!$hosts): ?>
<tr><td colspan="5" class="muted">Keine Hosts vorhanden.</td></tr>
<?php endif; ?>
<div class="muted" style="margin-top:.75rem;">Keine Hosts vorhanden.</div>
<?php else: ?>
<div class="host-grid" style="margin-top:.75rem;">
<?php foreach ($hosts as $h): ?>
<tr>
<td><?= e($h['name'] ?? '') ?></td>
<td><?= e($h['host'] ?? '') ?></td>
<td><?= e($h['username'] ?? '') ?></td>
<td><?= e((string)($h['port'] ?? 22)) ?></td>
<td><?= e($h['auth_type'] ?? '') ?></td>
</tr>
<?php
$portVal = (int)($h['port'] ?? 22);
$reachable = hostReachable((string)($h['host'] ?? ''), $portVal);
$authOk = $reachable ? hostAuthOk($h, $strictHostKey) : false;
$statusClass = !$reachable ? 'status-down' : ($authOk ? 'status-ok' : 'status-auth');
?>
<div class="host-card"
data-host-id="<?= e((string)$h['id']) ?>"
data-name="<?= e((string)($h['name'] ?? '')) ?>"
data-host="<?= e((string)($h['host'] ?? '')) ?>"
data-port="<?= e((string)($h['port'] ?? 22)) ?>"
data-username="<?= e((string)($h['username'] ?? '')) ?>"
data-auth="<?= e((string)($h['auth_type'] ?? 'key')) ?>"
data-key-path="<?= e((string)($h['key_path'] ?? '')) ?>"
data-image-url="<?= e((string)($h['image_url'] ?? '')) ?>">
<div class="host-card-image"<?= !empty($h['image_url']) ? ' style="background-image:url(' . e((string)$h['image_url']) . ')"' : '' ?>>
<div class="host-card-overlay"></div>
</div>
<div class="host-card-body">
<div class="host-card-header">
<div class="host-card-title">
<span class="status-dot <?= $statusClass ?>"></span>
<strong><?= e((string)($h['name'] ?? '')) ?></strong>
</div>
<details class="action-menu">
<summary>☰</summary>
<div class="action-menu-panel">
<button class="nav-link" type="button" data-host-edit>Bearbeiten</button>
<form method="post" onsubmit="return confirm('Host wirklich löschen?')">
<input type="hidden" name="delete_id" value="<?= e((string)$h['id']) ?>">
<button class="nav-link" type="submit">Löschen</button>
</form>
</div>
</details>
</div>
<div class="muted"><?= e((string)($h['host'] ?? '')) ?>:<?= e((string)($portVal ?: 22)) ?></div>
<div class="muted"><?= e((string)($h['username'] ?? '')) ?> · <?= e((string)($h['auth_type'] ?? '')) ?></div>
</div>
</div>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
<?php endif; ?>
</div>
</div>
</div>

40
partials/structure/layout_start.php
View File

@@ -71,11 +71,39 @@ $sidebarItems = $moduleSidebar['items'] ?? [];
<?php if ($moduleMenu): ?>
<div class="module-subnav card">
<?php foreach ($moduleMenu as $entry): ?>
<a class="nav-link" href="<?= e($entry['href'] ?? '#') ?>">
<?= e($entry['label'] ?? 'Link') ?>
<?php
$href = (string)($entry['href'] ?? '');
$label = (string)($entry['label'] ?? 'Link');
$children = is_array($entry['children'] ?? null) ? $entry['children'] : [];
$isSetup = $href !== '' && str_starts_with($href, '/modules/setup/');
if ($isSetup) {
continue;
}
?>
<?php if ($children): ?>
<div class="nav-dropdown">
<button class="nav-link nav-link-button" type="button"><?= e($label) ?> ▾</button>
<div class="nav-dropdown-menu">
<?php foreach ($children as $child): ?>
<?php
$childHref = (string)($child['href'] ?? '');
if ($childHref !== '' && str_starts_with($childHref, '/modules/setup/')) {
continue;
}
?>
<a class="nav-link" href="<?= e($childHref ?: '#') ?>">
<?= e((string)($child['label'] ?? 'Link')) ?>
</a>
<?php endforeach; ?>
</div>
</div>
<?php else: ?>
<a class="nav-link" href="<?= e($href ?: '#') ?>">
<?= e($label) ?>
</a>
<?php endif; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
<div class="layout-body <?= $sidebarEnabled ? 'has-sidebar' : 'no-sidebar' ?> <?= $sidebarDefault === 'open' ? 'sidebar-open' : 'sidebar-collapsed' ?>"
@@ -90,7 +118,13 @@ $sidebarItems = $moduleSidebar['items'] ?? [];
<?php endif; ?>
<div class="sidebar-items">
<?php foreach ($sidebarItems as $item): ?>
<a class="nav-link" href="<?= e($item['href'] ?? '#') ?>"><?= e($item['label'] ?? 'Item') ?></a>
<?php
$itemHref = (string)($item['href'] ?? '');
if ($itemHref !== '' && str_starts_with($itemHref, '/modules/setup/')) {
continue;
}
?>
<a class="nav-link" href="<?= e($itemHref ?: '#') ?>"><?= e($item['label'] ?? 'Item') ?></a>
<?php endforeach; ?>
</div>
</aside>

32
public/assets/css/app.css
View File

@@ -136,7 +136,8 @@ body {
display: flex;
gap: 10px;
flex-wrap: wrap;
background-color: #ffffff !important;
background-color: var(--panel) !important;
background: var(--panel) !important;
background-image: none !important;
opacity: 1 !important;
backdrop-filter: none !important;
@@ -147,6 +148,35 @@ body {
}
.module-subnav.card { background-color: var(--panel); background-image: none; }
.nav-dropdown {
position: relative;
display: inline-flex;
}
.nav-link-button {
border: 1px solid transparent;
background: transparent;
cursor: pointer;
}
.nav-dropdown-menu {
position: absolute;
top: calc(100% + 6px);
left: 0;
min-width: 180px;
background: var(--panel);
border: 1px solid var(--line);
border-radius: 12px;
box-shadow: var(--shadow);
padding: 6px;
display: none;
z-index: 10;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
display: flex;
flex-direction: column;
gap: 4px;
}
.layout-body {
display: grid;
grid-template-columns: 1fr;