Add text file preview window
This commit is contained in:
Mikei386
+1
-1
@@ -2,7 +2,7 @@
|
||||
set -eu
|
||||
|
||||
PLUGIN="u-navigator"
|
||||
VERSION="2026.06.23.r028"
|
||||
VERSION="2026.06.23.r029"
|
||||
PKG_DIR="packages"
|
||||
WORK_DIR=".plugin-build"
|
||||
PKG_NAME="${PLUGIN}-${VERSION}.tgz"
|
||||
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,39 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/common.php';
|
||||
|
||||
const UNAV_PREVIEW_MAX_BYTES = 1048576;
|
||||
|
||||
$resolved = unav_existing_path($_GET['path'] ?? null);
|
||||
if (!is_file($resolved['path'])) {
|
||||
unav_error(400, 'Preview target must be a file');
|
||||
}
|
||||
|
||||
$extension = strtolower(pathinfo($resolved['path'], PATHINFO_EXTENSION));
|
||||
$allowed = ['txt', 'log', 'md', 'rd', 'rst', 'yaml', 'yml', 'json', 'xml', 'csv', 'ini', 'cfg', 'conf', 'sh', 'php', 'js', 'css', 'html'];
|
||||
if (!in_array($extension, $allowed, true)) {
|
||||
unav_error(415, 'Preview is not available for this file type');
|
||||
}
|
||||
|
||||
$size = filesize($resolved['path']);
|
||||
if ($size === false) {
|
||||
unav_error(500, 'Could not read file size');
|
||||
}
|
||||
if ($size > UNAV_PREVIEW_MAX_BYTES) {
|
||||
unav_error(413, 'Preview file is larger than 1 MB');
|
||||
}
|
||||
|
||||
$content = file_get_contents($resolved['path']);
|
||||
if ($content === false) {
|
||||
unav_error(500, 'Could not read file');
|
||||
}
|
||||
if (strpos($content, "\0") !== false) {
|
||||
unav_error(415, 'Preview is not available for binary files');
|
||||
}
|
||||
|
||||
unav_json([
|
||||
'path' => $resolved['path'],
|
||||
'name' => basename($resolved['path']),
|
||||
'size' => $size,
|
||||
'extension' => $extension,
|
||||
'content' => $content,
|
||||
]);
|
||||
@@ -35,6 +35,7 @@ const icons = {
|
||||
symlink: 'Link',
|
||||
other: 'Item'
|
||||
};
|
||||
const previewExtensions = new Set(['txt', 'log', 'md', 'rd', 'rst', 'yaml', 'yml', 'json', 'xml', 'csv', 'ini', 'cfg', 'conf', 'sh', 'php', 'js', 'css', 'html']);
|
||||
|
||||
document.querySelector('#newExplorerButton').addEventListener('click', () => openExplorer());
|
||||
document.querySelector('#newPropertiesButton').addEventListener('click', () => openProperties());
|
||||
@@ -112,6 +113,40 @@ function openProperties(entry = state.selectedEntry) {
|
||||
});
|
||||
}
|
||||
|
||||
function openPreview(entry) {
|
||||
if (!entry || !isPreviewable(entry)) {
|
||||
showError(new Error('Für diesen Dateityp ist keine Vorschau verfügbar.'));
|
||||
return null;
|
||||
}
|
||||
|
||||
const existing = state.windows.find((item) => item.kind === 'preview');
|
||||
if (existing) {
|
||||
existing.data.entry = entry;
|
||||
existing.data.content = '';
|
||||
existing.data.loading = true;
|
||||
existing.data.error = null;
|
||||
focusWindow(existing);
|
||||
render();
|
||||
loadPreview(existing, entry);
|
||||
return existing;
|
||||
}
|
||||
|
||||
const win = createWindow('Vorschau', 'preview', {
|
||||
width: 620,
|
||||
height: 460,
|
||||
x: 190,
|
||||
y: 110,
|
||||
data: {
|
||||
entry,
|
||||
content: '',
|
||||
loading: true,
|
||||
error: null
|
||||
}
|
||||
});
|
||||
loadPreview(win, entry);
|
||||
return win;
|
||||
}
|
||||
|
||||
function openQueue() {
|
||||
showTransferPanel();
|
||||
return null;
|
||||
@@ -187,6 +222,7 @@ function renderWindow(win) {
|
||||
body.className = 'window-body';
|
||||
if (win.kind === 'explorer') renderExplorer(body, win);
|
||||
if (win.kind === 'properties') renderProperties(body);
|
||||
if (win.kind === 'preview') renderPreview(body, win);
|
||||
body.addEventListener('scroll', () => {
|
||||
if (win.data.lockScroll) {
|
||||
body.scrollTop = win.data.lockScrollTop || 0;
|
||||
@@ -289,6 +325,8 @@ function renderExplorer(body, win) {
|
||||
if (shouldSuppressItemActivation()) return;
|
||||
if (entry.type === 'directory') {
|
||||
loadExplorer(win, entry.path);
|
||||
} else if (isPreviewable(entry)) {
|
||||
openPreview(entry);
|
||||
}
|
||||
});
|
||||
row.addEventListener('contextmenu', (event) => {
|
||||
@@ -368,6 +406,45 @@ function renderProperties(body) {
|
||||
}
|
||||
}
|
||||
|
||||
function renderPreview(body, win) {
|
||||
const data = win.data;
|
||||
body.classList.add('preview-body');
|
||||
if (data.loading) {
|
||||
body.innerHTML = '<p class="muted">Lade Vorschau...</p>';
|
||||
return;
|
||||
}
|
||||
if (data.error) {
|
||||
body.innerHTML = `<p class="muted">${escapeHtml(data.error)}</p>`;
|
||||
return;
|
||||
}
|
||||
const entry = data.entry;
|
||||
body.innerHTML = `
|
||||
<div class="preview-meta">
|
||||
<strong>${escapeHtml(entry?.name || data.name || 'Vorschau')}</strong>
|
||||
<span>${escapeHtml(formatBytes(data.size || entry?.size || 0))}</span>
|
||||
</div>
|
||||
<pre class="preview-text">${escapeHtml(data.content || '')}</pre>
|
||||
`;
|
||||
}
|
||||
|
||||
async function loadPreview(win, entry) {
|
||||
win.data.loading = true;
|
||||
win.data.error = null;
|
||||
render();
|
||||
try {
|
||||
const result = await api(apiUrl(`preview.php?path=${encodeURIComponent(entry.path)}`));
|
||||
win.data.entry = entry;
|
||||
win.data.name = result.name;
|
||||
win.data.size = result.size;
|
||||
win.data.content = result.content;
|
||||
} catch (error) {
|
||||
win.data.error = error.message;
|
||||
} finally {
|
||||
win.data.loading = false;
|
||||
render();
|
||||
}
|
||||
}
|
||||
|
||||
function renderQueue(body) {
|
||||
body.innerHTML = queueMarkup();
|
||||
bindQueueActions(body);
|
||||
@@ -797,6 +874,8 @@ function renderContextMenu() {
|
||||
if (entry) {
|
||||
if (entry.type === 'directory') {
|
||||
actions.push(['Öffnen', () => loadExplorer(win, entry.path)]);
|
||||
} else if (isPreviewable(entry)) {
|
||||
actions.push(['Vorschau', () => openPreview(entry)]);
|
||||
}
|
||||
actions.push(['Eigenschaften', () => showPropertiesForEntry(win, entry)]);
|
||||
if (!isReadOnly()) {
|
||||
@@ -1258,6 +1337,9 @@ function windowTitle(win) {
|
||||
if (win.kind === 'explorer') {
|
||||
return `Explorer · ${win.data.path || ''}`;
|
||||
}
|
||||
if (win.kind === 'preview') {
|
||||
return `Vorschau · ${win.data.entry?.name || ''}`;
|
||||
}
|
||||
return win.title;
|
||||
}
|
||||
|
||||
@@ -1273,6 +1355,16 @@ function dirname(value) {
|
||||
return `/${parts.slice(0, -1).join('/')}`;
|
||||
}
|
||||
|
||||
function extensionOf(name) {
|
||||
const value = String(name || '');
|
||||
const index = value.lastIndexOf('.');
|
||||
return index >= 0 ? value.slice(index + 1).toLowerCase() : '';
|
||||
}
|
||||
|
||||
function isPreviewable(entry) {
|
||||
return entry?.type === 'file' && previewExtensions.has(extensionOf(entry.name || entry.path));
|
||||
}
|
||||
|
||||
function joinPath(parent, name) {
|
||||
return `${String(parent || '').replace(/\/+$/, '')}/${String(name || '').replace(/^\/+/, '')}`;
|
||||
}
|
||||
|
||||
@@ -694,6 +694,43 @@
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.u-nav .preview-body {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
}
|
||||
|
||||
.u-nav .preview-meta {
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--line);
|
||||
color: var(--muted);
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.u-nav .preview-meta strong {
|
||||
color: var(--text);
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.u-nav .preview-text {
|
||||
background: var(--surface-2);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
color: var(--text);
|
||||
font: 13px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||
margin: 0;
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
padding: 10px;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.u-nav .topbar {
|
||||
align-items: flex-start;
|
||||
|
||||
+2
-2
@@ -1,7 +1,7 @@
|
||||
<!DOCTYPE PLUGIN [
|
||||
<!ENTITY name "u-navigator">
|
||||
<!ENTITY author "Michael Roll">
|
||||
<!ENTITY version "2026.06.23.r028">
|
||||
<!ENTITY version "2026.06.23.r029">
|
||||
<!ENTITY package "&name;-&version;.tgz">
|
||||
<!ENTITY pluginURL "https://git.casaderoll.de/michael/Unraid-Navigator/raw/branch/main/u-navigator.plg">
|
||||
<!ENTITY support "https://git.casaderoll.de/michael/Unraid-Navigator">
|
||||
@@ -24,7 +24,7 @@
|
||||
|
||||
<FILE Name="/boot/config/plugins/&name;/&package;">
|
||||
<URL>https://git.casaderoll.de/michael/Unraid-Navigator/raw/branch/main/packages/&package;</URL>
|
||||
<MD5>b74c325d1c332768da07a6ab11de7a03</MD5>
|
||||
<MD5>2c27aa33b2a3be760a518625a0762cac</MD5>
|
||||
</FILE>
|
||||
|
||||
<FILE Run="/bin/bash">
|
||||
|
||||
Reference in New Issue
Block a user