Security: verwijder hardcoded wachtwoord, voeg random-wachtwoord-generator toe bij eerste installatie
This commit is contained in:
@@ -27,6 +27,14 @@
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if generated_password %}
|
||||
<div class="alert alert-warning" role="alert">
|
||||
<h6 class="alert-heading"><i class="bi bi-exclamation-triangle-fill"></i> Eerste installatie</h6>
|
||||
<p class="mb-2">Er is nog geen <code>admin.json</code> aanwezig. Een nieuw wachtwoord is gegenereerd voor de gebruiker <strong>admin</strong>:</p>
|
||||
<p class="mb-2"><code class="fs-5">{{ generated_password }}</code></p>
|
||||
<p class="mb-0 small">Log in met dit wachtwoord en wijzig het direct na login. Sla het veilig op; het wordt niet opnieuw getoond.</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
<form method="POST" action="/admin/login">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<div class="mb-3">
|
||||
|
||||
@@ -13,24 +13,37 @@
|
||||
.editor-tree .tree-toggle.is-selected { background-color: rgba(13,110,253,.12); font-weight: 600; }
|
||||
.editor-tree .tree-toggle { cursor: pointer; user-select: none; width: 100%; text-align: left; background: transparent; border: 0; color: inherit; }
|
||||
.editor-tree .tree-chevron { flex: 0 0 auto; }
|
||||
.editor-tree .tree-chevron-btn { background: transparent; border: 0; color: inherit; padding: .2rem .4rem; line-height: 1.4; flex: 0 0 auto; cursor: pointer; }
|
||||
.editor-tree .tree-chevron-btn:hover { color: var(--bs-primary, #0d6efd); }
|
||||
.editor-tree .tree-name { flex: 1 1 auto; min-width: 0; }
|
||||
.editor-tree .tree-name.is-selected { background-color: var(--bs-primary-bg-subtle, #cfe2ff); font-weight: 600; }
|
||||
.editor-tree .tree-root-link { display: flex; align-items: center; gap: .3rem; padding: .25rem .4rem; border-radius: .25rem; text-decoration: none; color: inherit; font-size: .9rem; font-weight: 600; }
|
||||
.editor-tree .tree-root-link:hover { background-color: rgba(13,110,253,.08); }
|
||||
.editor-tree .tree-root-link.is-selected { background-color: var(--bs-primary-bg-subtle, #cfe2ff); }
|
||||
.editor-tree .tree-chevron-spacer { display: inline-block; width: .9rem; flex: 0 0 auto; }
|
||||
.editor-tree .badge-ext { font-size: .6rem; margin-left: auto; }
|
||||
.editor-tree .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.editor-tree .tree-delete-form { position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); margin: 0; }
|
||||
.editor-tree .tree-delete-btn { font-size: .9rem; line-height: 1; padding: .15rem; color: #dc3545; background: transparent; border: 0; }
|
||||
.editor-tree .tree-delete-btn:hover { color: #b02a37; }
|
||||
.editor-tree .tree-move-btn { position: absolute; right: 1.75rem; top: 50%; transform: translateY(-50%); font-size: .9rem; line-height: 1; padding: .15rem; color: #6c757d; text-decoration: none; }
|
||||
.editor-tree .tree-move-btn:hover { color: #0d6efd; }
|
||||
.editor-tree li > .tree-link { padding-right: 3.5rem; }
|
||||
.editor-tree .tree-move-btn,
|
||||
.editor-tree .tree-delete-btn { font-size: .9rem; line-height: 1; padding: .15rem; color: #6c757d; text-decoration: none; background: transparent; border: 0; }
|
||||
.editor-tree .tree-move-btn:hover,
|
||||
.editor-tree .tree-delete-btn:hover { color: #0d6efd; }
|
||||
.editor-tree .tree-delete-btn:hover { color: #dc3545; }
|
||||
.editor-tree .tree-file-actions { position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); display: flex; gap: .15rem; align-items: center; opacity: 0; transition: opacity .15s; }
|
||||
.editor-tree li:hover > .tree-file-actions { opacity: 1; }
|
||||
.editor-tree li > .tree-link { padding-right: 4rem; }
|
||||
/* Drag-and-drop states */
|
||||
.editor-tree li.tree-dragging { opacity: .5; }
|
||||
.editor-tree .tree-drag-over { background-color: rgba(13,110,253,.18) !important; outline: 2px dashed var(--bs-primary, #0d6efd); outline-offset: -2px; border-radius: .25rem; }
|
||||
/* Toast */
|
||||
.tree-toast { border-radius: .375rem; }
|
||||
.plugin-file-tree .card-body { max-height: 70vh; overflow-y: auto; }
|
||||
/* Directory action buttons (new file/dir, rename, delete) — content editor only */
|
||||
.tree-dir-row { position: relative; }
|
||||
.tree-dir-row .tree-toggle { padding-right: 7rem; }
|
||||
/* Directory action buttons (new file/dir, rename) — content editor only */
|
||||
.tree-dir-row { position: relative; display: flex; align-items: center; }
|
||||
.tree-dir-row > .tree-name { padding-right: 3rem; }
|
||||
.tree-dir-row > .tree-toggle { padding-right: 5rem; }
|
||||
.tree-dir-actions { position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); display: flex; gap: .15rem; align-items: center; }
|
||||
.tree-dir-actions .btn-link { color: #6c757d; }
|
||||
.tree-dir-actions .btn-link:hover { color: #0d6efd; }
|
||||
.tree-dir-actions .tree-delete-btn { color: #dc3545; }
|
||||
.tree-dir-actions .tree-delete-btn:hover { color: #b02a37; }
|
||||
@media (max-width: 768px) {
|
||||
.editor-layout { flex-direction: column; }
|
||||
.plugin-file-tree { width: 100%; flex-basis: auto; max-height: 320px; }
|
||||
|
||||
@@ -6,25 +6,33 @@
|
||||
- files: array of nodes [{name, path, is_dir, extension, size, modified, children}]
|
||||
- relFile: currently selected relative file path (for active highlight + auto-expand)
|
||||
- editableExts: array of editable extensions (shown as .EXT badge)
|
||||
- csrf_token: CSRF token for delete forms
|
||||
- treeIdPrefix: prefix for collapse element ids (e.g. 'content-tree', 'plugin-tree', 'theme-tree')
|
||||
- treeRouteBase: admin route base used to build file links, e.g. '/admin/content'
|
||||
- treeRouteParams: extra query string for file links, e.g. 'plugin=MyPlugin&' or 'theme=default&' or '' (content)
|
||||
- treeDeleteRoute: admin route for file delete, e.g. '/admin/content-file-delete'
|
||||
- treeDeleteName: optional hidden field name for delete form (e.g. 'plugin' or 'theme'); emits no field when empty
|
||||
- treeDeleteValue: optional hidden field value for treeDeleteName (e.g. the plugin/theme name)
|
||||
- treeMoveRoute: admin route for file move, e.g. '/admin/plugins-file-move'
|
||||
- treeMoveParams: extra query string for move link, e.g. 'plugin=X&' or ''
|
||||
- treeDirActions: boolean; show per-folder new-file/new-dir/rename/delete buttons (content editor only)
|
||||
- treeDirActions: boolean; show per-folder new-file/new-dir/rename buttons (default true)
|
||||
- treeFileMove: boolean; show per-file move/rename pencil button (default true)
|
||||
- treeHideActionsFor: array of relative paths where move/delete actions are hidden (e.g. ['theme.json'])
|
||||
- treeDirSelectRoute: if set, folder names are links to ?dir=<path> (map-detail pane)
|
||||
- treeDirRenameRoute: if set, show a rename pencil per folder
|
||||
- treeDeleteBase: POST URL for file deletion (scope-specific)
|
||||
- treeScope: 'content' | 'theme' | 'plugin' (for tree-interactions.js)
|
||||
- treeMoveUrl: AJAX endpoint for drag-drop move (e.g. '/admin/tree-move')
|
||||
- treeScopeParam: extra query param string (e.g. 'plugin=MyPlugin&' or 'theme=default&' or '')
|
||||
|
||||
Icon maps are chosen automatically from the node extension. #}
|
||||
{% macro tree(nodes, opts) %}
|
||||
{% import _self as macros %}
|
||||
<ul class="editor-tree">
|
||||
{% for n in nodes %}
|
||||
{% set isActive = n.path == opts.relFile %}
|
||||
{% set containsActive = n.is_dir and opts.relFile starts with (n.path ~ '/') %}
|
||||
{# Een bestand is alleen actief wanneer er geen map geselecteerd is
|
||||
(een map-selectie opent het map-detail paneel, geen bestand). #}
|
||||
{% set isActive = n.path == opts.relFile and opts.selectedDir|default('') == '' %}
|
||||
{# Markeer de oudermap "bevat actieve selectie" voor auto-uitklappen:
|
||||
bij een geselecteerd bestand OF een geselecteerde (sub)map. #}
|
||||
{% set activePath = opts.selectedDir|default('') != '' ? opts.selectedDir : opts.relFile %}
|
||||
{% set containsActive = n.is_dir and activePath != '' and activePath starts with (n.path ~ '/') %}
|
||||
{% if n.is_dir %}
|
||||
{% set icon = 'bi-folder-fill text-warning' %}
|
||||
{% elseif n.extension == 'md' %}
|
||||
@@ -48,37 +56,42 @@
|
||||
{% else %}
|
||||
{% set icon = 'bi-file text-muted' %}
|
||||
{% endif %}
|
||||
<li>
|
||||
<li data-path="{{ n.path }}" data-isdir="{{ n.is_dir ? '1' : '0' }}">
|
||||
{% if n.is_dir %}
|
||||
{% set collapseId = opts.treeIdPrefix ~ '-' ~ n.path|replace({'/':'-','.':'-'}) %}
|
||||
<div class="tree-dir-row">
|
||||
<button type="button" class="tree-link tree-toggle btn-toggle {{ containsActive ? '' : 'collapsed' }}"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#{{ collapseId }}"
|
||||
aria-expanded="{{ containsActive ? 'true' : 'false' }}"
|
||||
title="{{ n.path }}">
|
||||
<div class="tree-dir-row" data-dir="{{ n.path }}">
|
||||
{# Chevron: expand/collapse only (zonder navigatie) #}
|
||||
<button type="button" class="tree-chevron-btn" data-bs-toggle="collapse" data-bs-target="#{{ collapseId }}" aria-expanded="{{ containsActive ? 'true' : 'false' }}" title="{{ ta.expand_collapse|default('Uitklappen/inklappen') }}" aria-label="{{ ta.expand_collapse|default('Uitklappen/inklappen') }}">
|
||||
<i class="bi {{ containsActive ? 'bi-chevron-down' : 'bi-chevron-right' }} tree-chevron"></i>
|
||||
</button>
|
||||
{# Mapnaam: selecteer de map. Voor content gaat dit naar ?dir= (map-detail paneel rechts);
|
||||
voor plugins/themes is het een niet-navigerende toggle (legacy gedrag). #}
|
||||
{% if opts.treeDirSelectRoute %}
|
||||
<a href="{{ opts.treeDirSelectRoute }}{% if '?' in opts.treeDirSelectRoute %}&{% else %}?{% endif %}dir={{ n.path|url_encode }}" class="tree-link tree-name {{ containsActive ? 'is-active' : '' }} {{ opts.selectedDir == n.path ? 'is-selected' : '' }}" title="{{ n.path }}">
|
||||
<i class="bi {{ icon }}"></i>
|
||||
<span class="text-truncate">{{ n.name }}</span>
|
||||
</a>
|
||||
{% else %}
|
||||
<button type="button" class="tree-link tree-toggle btn-toggle {{ containsActive ? '' : 'collapsed' }}" data-bs-toggle="collapse" data-bs-target="#{{ collapseId }}" aria-expanded="{{ containsActive ? 'true' : 'false' }}" title="{{ n.path }}">
|
||||
<i class="bi {{ icon }}"></i>
|
||||
<span class="text-truncate">{{ n.name }}</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
{% if opts.treeDirActions %}
|
||||
<span class="tree-dir-actions">
|
||||
<button type="button" class="btn btn-link btn-sm p-0 tree-newfile-btn" title="{{ ta.new_file|default('Nieuw bestand hier') }}" aria-label="{{ ta.new_file|default('Nieuw bestand') }}" data-bs-toggle="modal" data-bs-target="#newFileModal" data-in-dir="{{ n.path }}">
|
||||
<button type="button" class="btn btn-link btn-sm p-0 tree-newfile-btn" title="{{ ta.new_file|default('Nieuw bestand hier') }}" aria-label="{{ ta.new_file|default('Nieuw bestand') }}" data-bs-toggle="modal" data-bs-target="{{ opts.newFileModalId|default('#newFileModal') }}" data-in-dir="{{ n.path }}">
|
||||
<i class="bi bi-file-earmark-plus"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-link btn-sm p-0 tree-newdir-btn" title="{{ ta.new_folder|default('Nieuwe map') }}" aria-label="{{ ta.new_folder|default('Nieuwe map') }}" data-bs-toggle="modal" data-bs-target="#newDirModal" data-in-dir="{{ n.path }}">
|
||||
{% if opts.newDirModalId is defined and opts.newDirModalId %}
|
||||
<button type="button" class="btn btn-link btn-sm p-0 tree-newdir-btn" title="{{ ta.new_folder|default('Nieuwe map') }}" aria-label="{{ ta.new_folder|default('Nieuwe map') }}" data-bs-toggle="modal" data-bs-target="{{ opts.newDirModalId }}" data-in-dir="{{ n.path }}">
|
||||
<i class="bi bi-folder-plus"></i>
|
||||
</button>
|
||||
<a href="/admin/content-dir-rename-in?dir={{ n.path|url_encode }}" class="tree-rename-btn" title="{{ ta.rename|default('Hernoemen') }}" aria-label="{{ ta.rename|default('Hernoemen') }}">
|
||||
{% endif %}
|
||||
{% if opts.treeDirRenameRoute %}
|
||||
<a href="{{ opts.treeDirRenameRoute }}{% if '?' in opts.treeDirRenameRoute %}&{% else %}?{% endif %}dir={{ n.path|url_encode }}" class="tree-rename-btn" title="{{ ta.rename|default('Hernoemen') }}" aria-label="{{ ta.rename|default('Hernoemen') }}">
|
||||
<i class="bi bi-pencil"></i>
|
||||
</a>
|
||||
<form method="POST" action="/admin/content-dir-delete-in" class="d-inline" onsubmit="return confirm('{{ ta.confirm_delete_folder|default('Weet je zeker dat je deze map wilt verwijderen? De map moet leeg zijn.') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ opts.csrfToken }}">
|
||||
<input type="hidden" name="dir" value="{{ n.path }}">
|
||||
<button type="submit" class="btn btn-link btn-sm p-0 text-danger tree-delete-btn" title="{{ ta.delete|default('Verwijderen') }}" aria-label="{{ ta.delete|default('Verwijderen') }}">
|
||||
<i class="bi bi-trash"></i>
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
@@ -99,22 +112,20 @@
|
||||
<span class="badge bg-secondary badge-ext">{{ n.extension|upper }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
{% if n.path not in (opts.treeHideActionsFor ?? []) %}
|
||||
<a href="{{ opts.treeMoveRoute }}?{{ opts.treeMoveParams }}file={{ n.path|url_encode }}"
|
||||
class="tree-move-btn" title="{{ ta.rename|default('Hernoemen') }}" aria-label="{{ ta.rename|default('Hernoemen') }}">
|
||||
<i class="bi bi-pencil"></i>
|
||||
</a>
|
||||
<form method="POST" action="{{ opts.treeDeleteRoute }}" class="tree-delete-form" onsubmit="return confirm('{{ ta.confirm_delete_file|default('Weet je zeker dat je dit bestand wilt verwijderen?') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ opts.csrfToken }}">
|
||||
{% if opts.treeDeleteName %}
|
||||
<input type="hidden" name="{{ opts.treeDeleteName }}" value="{{ opts.treeDeleteValue }}">
|
||||
<span class="tree-file-actions">
|
||||
{% if n.path not in (opts.treeHideActionsFor ?? []) %}
|
||||
{% set showFileMove = opts.treeFileMove is defined ? opts.treeFileMove : true %}
|
||||
{% if showFileMove %}
|
||||
<a href="{{ opts.treeMoveRoute }}?{{ opts.treeMoveParams }}file={{ n.path|url_encode }}"
|
||||
class="tree-move-btn" title="{{ ta.rename|default('Hernoemen/Verplaatsen') }}" aria-label="{{ ta.rename|default('Hernoemen/Verplaatsen') }}">
|
||||
<i class="bi bi-pencil"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
<input type="hidden" name="file" value="{{ n.path }}">
|
||||
<button type="submit" class="btn btn-link btn-sm p-0 text-danger tree-delete-btn" title="{{ ta.delete|default('Verwijderen') }}" aria-label="{{ ta.delete|default('Verwijderen') }}">
|
||||
<button type="button" class="btn btn-link btn-sm p-0 tree-delete-btn" title="{{ ta.delete|default('Verwijderen') }}" aria-label="{{ ta.delete|default('Verwijderen') }}" data-path="{{ n.path }}">
|
||||
<i class="bi bi-trash"></i>
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
@@ -129,29 +140,48 @@
|
||||
<div class="card-header bg-white py-2 d-flex justify-content-between align-items-center">
|
||||
<span class="small text-muted fw-semibold"><i class="bi bi-folder2-open"></i> {{ treeHeader|default('Bestanden') }}</span>
|
||||
</div>
|
||||
<div class="card-body p-2" id="editorFileTree">
|
||||
<div class="card-body p-2" id="editorFileTree"
|
||||
data-csrf="{{ csrf_token|default('') }}"
|
||||
data-scope="{{ treeScope|default('content') }}"
|
||||
data-move-url="{{ treeMoveUrl|default('') }}"
|
||||
data-delete-base="{{ treeDeleteBase|default('') }}"
|
||||
data-new-file-modal="{{ newFileModalId|default('#newFileModal') }}"
|
||||
data-new-dir-modal="{{ newDirModalId|default('#newDirModal') }}"
|
||||
data-scope-param="{{ treeScopeParam|default('') }}"
|
||||
data-edit-base="{{ treeRouteBase|default('') }}">
|
||||
{% if treeDirSelectRoute is defined and treeDirSelectRoute is not empty %}
|
||||
{# Klikbare content-root: selecteert de root map (?dir= leeg).
|
||||
data-dir="" maakt de root ook een drag-drop doel (lege string = base dir). #}
|
||||
<a href="{{ treeDirSelectRoute }}" class="tree-link tree-root-link {{ selectedDir|default('') == '' ? 'is-selected' : '' }}" data-dir="" title="content">
|
||||
<i class="bi bi-folder2-open"></i>
|
||||
<span class="text-truncate">{{ treeRootLabel|default('content') }}</span>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if files is empty %}
|
||||
<div class="small text-muted p-2">{{ treeEmptyText|default('Geen bestanden gevonden.') }}</div>
|
||||
{% else %}
|
||||
{{ tree_macros.tree(files, {
|
||||
'relFile': relFile,
|
||||
'selectedDir': selectedDir|default(''),
|
||||
'editableExts': editableExts,
|
||||
'csrfToken': csrf_token,
|
||||
'treeIdPrefix': treeIdPrefix,
|
||||
'treeRouteBase': treeRouteBase,
|
||||
'treeRouteParams': treeRouteParams,
|
||||
'treeDeleteRoute': treeDeleteRoute,
|
||||
'treeDeleteName': treeDeleteName|default(''),
|
||||
'treeDeleteValue': treeDeleteValue|default(''),
|
||||
'treeMoveRoute': treeMoveRoute,
|
||||
'treeMoveParams': treeMoveParams,
|
||||
'treeDirActions': treeDirActions|default(false),
|
||||
'treeDirActions': treeDirActions is defined ? treeDirActions : true,
|
||||
'treeDirSelectRoute': treeDirSelectRoute|default(''),
|
||||
'treeDirRenameRoute': treeDirRenameRoute|default(''),
|
||||
'treeFileMove': treeFileMove is defined ? treeFileMove : true,
|
||||
'treeHideActionsFor': treeHideActionsFor|default([]),
|
||||
'newFileModalId': newFileModalId|default('#newFileModal'),
|
||||
'newDirModalId': newDirModalId|default(''),
|
||||
}) }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/admin/assets/js/tree-interactions.js"></script>
|
||||
<script>
|
||||
(function () {
|
||||
var tree = document.getElementById('editorFileTree');
|
||||
@@ -187,5 +217,10 @@
|
||||
var btn = findToggle(c);
|
||||
if (btn) expand(btn);
|
||||
});
|
||||
|
||||
// Make all tree <li> nodes draggable (for drag-and-drop move)
|
||||
Array.prototype.forEach.call(tree.querySelectorAll('li[data-path]'), function (li) {
|
||||
li.setAttribute('draggable', 'true');
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
@@ -60,8 +60,9 @@
|
||||
<textarea name="content" id="editor-textarea" data-ext="{{ fileExt }}">{{ fileContent }}</textarea>
|
||||
</div>
|
||||
{% endif %}
|
||||
</form>
|
||||
<div class="d-flex gap-2 mt-3">
|
||||
<button type="submit" class="btn btn-primary" title="{{ ta.save_ctrl_s|default('Opslaan (Ctrl+S)') }}">
|
||||
<button type="submit" form="editor-form" class="btn btn-primary" title="{{ ta.save_ctrl_s|default('Opslaan (Ctrl+S)') }}">
|
||||
<i class="bi bi-check-lg"></i> {{ ta.save|default('Opslaan') }}
|
||||
</button>
|
||||
{% if isEditable %}
|
||||
@@ -70,8 +71,14 @@
|
||||
</a>
|
||||
{% endif %}
|
||||
<a href="/admin/content" class="btn btn-outline-secondary" id="back-btn">{{ ta.back|default('Terug') }}</a>
|
||||
<form method="POST" action="/admin/content-delete" class="ms-auto" onsubmit="return confirm('{{ ta.confirm_delete_file|default('Weet je zeker dat je dit bestand wilt verwijderen?') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="file" value="{{ file }}">
|
||||
<button type="submit" class="btn btn-outline-danger" title="{{ ta.delete|default('Verwijderen') }}">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -60,23 +60,105 @@
|
||||
'files': files,
|
||||
'relFile': relFile,
|
||||
'editableExts': editableExts,
|
||||
'csrf_token': csrf_token,
|
||||
'treeIdPrefix': 'content-tree',
|
||||
'treeHeader': ta.content_files|default('Content bestanden'),
|
||||
'treeEmptyText': ta.content_no_files|default('Geen bestanden gevonden.'),
|
||||
'treeRouteBase': '/admin/content',
|
||||
'treeRouteParams': '',
|
||||
'treeDeleteRoute': '/admin/content-file-delete',
|
||||
'treeDeleteName': '',
|
||||
'treeDeleteValue': '',
|
||||
'treeMoveRoute': '/admin/content-file-move',
|
||||
'treeMoveParams': '',
|
||||
'treeDirActions': true,
|
||||
'treeDirSelectRoute': '/admin/content',
|
||||
'treeDirRenameRoute': '',
|
||||
'treeFileMove': false,
|
||||
'treeHideActionsFor': [],
|
||||
'selectedDir': selectedDir|default(''),
|
||||
'treeRootLabel': 'content',
|
||||
'treeScope': 'content',
|
||||
'treeMoveUrl': '/admin/tree-move',
|
||||
'treeDeleteBase': '/admin/content-file-delete',
|
||||
'treeScopeParam': '',
|
||||
'newFileModalId': '#newFileModal',
|
||||
'newDirModalId': '#newDirModal',
|
||||
} %}
|
||||
|
||||
{# Editor main panel #}
|
||||
{# Editor / map-detail main panel #}
|
||||
<div class="editor-main">
|
||||
{% if showMapPaneel %}
|
||||
{# ── Map detail paneel ( rechts) ── tonen wanneer een map is geselecteerd #}
|
||||
<nav aria-label="breadcrumb" class="mb-2">
|
||||
<ol class="breadcrumb mb-0">
|
||||
<li class="breadcrumb-item"><a href="/admin/content"><i class="bi bi-folder2-open"></i> content</a></li>
|
||||
{% if selectedDir %}
|
||||
{% set crumbPath = '' %}
|
||||
{% for part in selectedDir|split('/') %}
|
||||
{% set crumbPath = crumbPath ? crumbPath ~ '/' ~ part : part %}
|
||||
{% if loop.last %}
|
||||
<li class="breadcrumb-item active" aria-current="page">{{ part }}</li>
|
||||
{% else %}
|
||||
<li class="breadcrumb-item"><a href="/admin/content?dir={{ crumbPath|url_encode }}">{{ part }}</a></li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header d-flex align-items-center gap-2">
|
||||
<i class="bi bi-folder-fill text-warning"></i>
|
||||
<span class="fw-semibold">{{ selectedDirIsRoot ? 'content' : selectedDirName }}</span>
|
||||
{% if not selectedDirIsRoot %}
|
||||
<span class="badge bg-light text-dark ms-1">content/{{ selectedDir }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-body">
|
||||
{# Mapnaam bewerkbaar + Opslaan = hernoem (geen apart potlood-icoon in de boom meer) #}
|
||||
<form method="POST" action="/admin/content?{% if selectedDir %}dir={{ selectedDir|url_encode }}{% endif %}" id="dir-rename-form">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="action" value="rename_dir">
|
||||
<input type="hidden" name="dir" value="{{ selectedDir }}">
|
||||
<label for="dirname" class="form-label">{{ ta.folder_name|default('Mapnaam') }}</label>
|
||||
<div class="input-group mb-3">
|
||||
<input type="text" class="form-control" id="dirname" name="newname" value="{{ selectedDirIsRoot ? '' : selectedDirName }}" placeholder="{{ ta.folder_name_placeholder|default('mapnaam') }}" {{ selectedDirIsRoot ? 'disabled' : '' }}>
|
||||
<button type="submit" class="btn btn-primary" {{ selectedDirIsRoot ? 'disabled' : '' }}>
|
||||
<i class="bi bi-check-lg"></i> {{ ta.save|default('Opslaan') }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-text">{{ ta.folder_rename_help|default('Bewerk de mapnaam en klik opslaan om te hernoemen.') }}</div>
|
||||
</form>
|
||||
|
||||
{# Map acties: nieuw bestand / nieuwe map / upload — opereren op de geselecteerde map #}
|
||||
<div class="d-flex flex-wrap gap-2 mb-3">
|
||||
<button type="button" class="btn btn-outline-primary btn-sm" data-bs-toggle="modal" data-bs-target="#newFileModal" data-in-dir="{{ selectedDir }}" id="mapPaneelNewFileBtn">
|
||||
<i class="bi bi-file-earmark-plus"></i> {{ ta.new_file|default('Nieuw bestand') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-toggle="modal" data-bs-target="#newDirModal" data-in-dir="{{ selectedDir }}" id="mapPaneelNewDirBtn">
|
||||
<i class="bi bi-folder-plus"></i> {{ ta.new_folder|default('Nieuwe map') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-success btn-sm" data-bs-toggle="collapse" data-bs-target="#contentUploadForm" id="mapPaneelUploadBtn">
|
||||
<i class="bi bi-cloud-upload"></i> {{ ta.upload|default('Upload') }}
|
||||
</button>
|
||||
{% if not selectedDirIsRoot %}
|
||||
<form method="POST" action="/admin/content-dir-delete-in" class="d-inline" onsubmit="return confirm('{{ ta.confirm_delete_folder|default('Weet je zeker dat je deze map wilt verwijderen? De map moet leeg zijn.') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="dir" value="{{ selectedDir }}">
|
||||
<button type="submit" class="btn btn-outline-danger btn-sm">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{# Korte inhoud-samenvatting van de geselecteerde map #}
|
||||
<div class="text-muted small">
|
||||
<i class="bi bi-files"></i>
|
||||
{{ selectedDirCounts.files }} {{ ta.files|default('bestanden') }},
|
||||
{{ selectedDirCounts.dirs }} {{ ta.subfolders|default('submappen') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
{% if relFile %}
|
||||
<nav aria-label="breadcrumb" class="mb-2">
|
||||
<ol class="breadcrumb mb-0">
|
||||
@@ -149,15 +231,22 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="d-flex gap-2 mt-3">
|
||||
<button type="submit" class="btn btn-primary" title="{{ ta.save_ctrl_s|default('Opslaan (Ctrl+S)') }}">
|
||||
<button type="submit" form="editor-form" class="btn btn-primary" title="{{ ta.save_ctrl_s|default('Opslaan (Ctrl+S)') }}">
|
||||
<i class="bi bi-check-lg"></i> {{ ta.save|default('Opslaan') }}
|
||||
</button>
|
||||
<a href="/{{ currentLang }}{% if fileDir %}/{{ fileDir }}{% endif %}/{{ fileBaseName }}{% if fileExt != 'md' %}.{{ fileExt }}{% endif %}" target="_blank" class="btn btn-outline-info" title="{{ ta.open_new_tab|default('Open in nieuw tabblad') }}">
|
||||
<i class="bi bi-eye"></i> {{ ta.preview|default('Preview') }}
|
||||
</a>
|
||||
<form method="POST" action="/admin/content-file-delete" class="ms-auto" onsubmit="return confirm('{{ ta.confirm_delete_file|default('Weet je zeker dat je dit bestand wilt verwijderen?') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="file" value="{{ relFile }}">
|
||||
<button type="submit" class="btn btn-outline-danger" title="{{ ta.delete|default('Verwijderen') }}">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
{% else %}
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body text-center py-5 text-muted">
|
||||
@@ -165,11 +254,12 @@
|
||||
{% if relFile %}
|
||||
{{ ta.content_not_editable|default('Dit bestandstype kan niet in de editor bewerkt worden.') }}
|
||||
{% else %}
|
||||
{{ ta.content_select_file|default('Selecteer een bestand uit de zijbalk om te bewerken.') }}
|
||||
{{ ta.content_select_file|default('Selecteer een bestand of map uit de zijbalk.') }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}{# end showMapPaneel #}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -180,7 +270,7 @@
|
||||
<form method="POST" action="/admin/content">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="action" value="new_file">
|
||||
<input type="hidden" name="in_dir" id="newFileDir" value="">
|
||||
<input type="hidden" name="in_dir" id="newFileDir" value="" data-in-dir-field>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="newFileModalLabel"><i class="bi bi-file-earmark-plus"></i> {{ ta.new_file_title|default('Nieuw bestand aanmaken') }}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
@@ -217,7 +307,7 @@
|
||||
<div class="modal-content">
|
||||
<form method="POST" action="/admin/content-dir-create-in">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="in_dir" id="newDirInDir" value="">
|
||||
<input type="hidden" name="in_dir" id="newDirInDir" value="" data-in-dir-field>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="newDirModalLabel"><i class="bi bi-folder-plus"></i> {{ ta.new_folder_title|default('Nieuwe map aanmaken') }}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
@@ -239,36 +329,31 @@
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// Pass the in-dir value from the tree button to the modal hidden fields
|
||||
// Mapselectie + upload/new file/new dir binding aan de geselecteerde map.
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
var newFileModal = document.getElementById('newFileModal');
|
||||
var newDirModal = document.getElementById('newDirModal');
|
||||
var newFileBtnTop = document.getElementById('newFileBtnTop');
|
||||
var newDirBtnTop = document.getElementById('newDirBtnTop');
|
||||
var uploadDir = document.getElementById('contentUploadDir');
|
||||
|
||||
// Track the selected directory for the top toolbar buttons
|
||||
// Track the selected directory (server-side via ?dir=). This drives the
|
||||
// top toolbar buttons and the upload form target.
|
||||
var selectedDir = '{{ selectedDir|default('') }}';
|
||||
function updateTopButtons(dir) {
|
||||
selectedDir = dir || '';
|
||||
if (newFileBtnTop) newFileBtnTop.setAttribute('data-in-dir', selectedDir);
|
||||
if (newDirBtnTop) newDirBtnTop.setAttribute('data-in-dir', selectedDir);
|
||||
if (uploadDir) uploadDir.value = selectedDir;
|
||||
}
|
||||
updateTopButtons(selectedDir);
|
||||
|
||||
// Make folder rows selectable: clicking the folder name selects it
|
||||
var tree = document.getElementById('editorFileTree');
|
||||
if (tree) {
|
||||
// Chevron-kliks mogen niet doorbubbellen naar de mapnaam-link (die navigeert).
|
||||
tree.addEventListener('click', function (e) {
|
||||
var toggle = e.target.closest('.tree-toggle');
|
||||
if (!toggle) return;
|
||||
// Find the in-dir from the adjacent new-file button
|
||||
var row = toggle.closest('.tree-dir-row');
|
||||
if (!row) return;
|
||||
var newFileBtn = row.querySelector('.tree-newfile-btn');
|
||||
var dir = newFileBtn ? newFileBtn.getAttribute('data-in-dir') : '';
|
||||
updateTopButtons(dir);
|
||||
// Visually mark the selected folder
|
||||
tree.querySelectorAll('.tree-toggle.is-selected').forEach(function (el) { el.classList.remove('is-selected'); });
|
||||
toggle.classList.add('is-selected');
|
||||
var chevronBtn = e.target.closest('.tree-chevron-btn');
|
||||
if (chevronBtn) { e.stopPropagation(); }
|
||||
});
|
||||
}
|
||||
|
||||
@@ -278,7 +363,6 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
var inDir = trigger ? trigger.getAttribute('data-in-dir') : selectedDir;
|
||||
var hidden = document.getElementById('newFileDir');
|
||||
if (hidden) hidden.value = inDir || '';
|
||||
// Show the in-dir prefix as a hint in the placeholder
|
||||
var input = document.getElementById('newFilenameInput');
|
||||
if (input) {
|
||||
input.value = '';
|
||||
@@ -295,15 +379,6 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
});
|
||||
}
|
||||
|
||||
// Mark the initially selected folder (based on the opened file's directory)
|
||||
if (selectedDir && tree) {
|
||||
var initialBtn = tree.querySelector('.tree-newfile-btn[data-in-dir="' + selectedDir + '"]');
|
||||
if (initialBtn) {
|
||||
var initialToggle = initialBtn.closest('.tree-dir-row').querySelector('.tree-toggle');
|
||||
if (initialToggle) initialToggle.classList.add('is-selected');
|
||||
}
|
||||
}
|
||||
|
||||
// Layout select → update frontmatter (spiegel van content-edit.twig)
|
||||
var layoutSelect = document.getElementById('layout');
|
||||
if (layoutSelect) {
|
||||
|
||||
@@ -18,6 +18,9 @@
|
||||
<button type="button" class="btn btn-outline-primary btn-sm" data-bs-toggle="modal" data-bs-target="#newFileModal">
|
||||
<i class="bi bi-file-earmark-plus"></i> {{ ta.plugin_new_file|default('Nieuw bestand') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" id="newDirBtnTop" data-bs-toggle="modal" data-bs-target="#newDirModal" data-in-dir="{{ selectedDir|default('') }}">
|
||||
<i class="bi bi-folder-plus"></i> {{ ta.new_folder|default('Nieuwe map') }}
|
||||
</button>
|
||||
<a href="/admin/plugins" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="bi bi-arrow-left"></i> {{ ta.back|default('Terug') }}
|
||||
</a>
|
||||
@@ -51,23 +54,85 @@
|
||||
'files': files,
|
||||
'relFile': relFile,
|
||||
'editableExts': editableExts,
|
||||
'csrf_token': csrf_token,
|
||||
'treeIdPrefix': 'plugin-tree',
|
||||
'treeHeader': ta.plugin_files|default('Plugin bestanden'),
|
||||
'treeEmptyText': ta.plugin_no_files|default('Geen bestanden gevonden.'),
|
||||
'treeRouteBase': '/admin/plugins-edit',
|
||||
'treeRouteParams': 'plugin=' ~ pluginName|url_encode ~ '&',
|
||||
'treeDeleteRoute': '/admin/plugins-file-delete',
|
||||
'treeDeleteName': 'plugin',
|
||||
'treeDeleteValue': pluginName,
|
||||
'treeMoveRoute': '/admin/plugins-file-move',
|
||||
'treeMoveParams': 'plugin=' ~ pluginName|url_encode ~ '&',
|
||||
'treeDirActions': false,
|
||||
'treeDirActions': true,
|
||||
'treeHideActionsFor': [],
|
||||
'treeDirSelectRoute': '/admin/plugins-edit?plugin=' ~ pluginName|url_encode,
|
||||
'treeDirRenameRoute': '/admin/plugins-dir-rename-in?plugin=' ~ pluginName|url_encode,
|
||||
'treeRootLabel': pluginName,
|
||||
'treeScope': 'plugin',
|
||||
'treeMoveUrl': '/admin/tree-move',
|
||||
'treeDeleteBase': '/admin/plugins-file-delete',
|
||||
'treeScopeParam': 'plugin=' ~ pluginName|url_encode ~ '&',
|
||||
'selectedDir': selectedDir|default(''),
|
||||
'newFileModalId': '#newFileModal',
|
||||
'newDirModalId': '#newDirModal',
|
||||
} %}
|
||||
|
||||
{# Editor main panel #}
|
||||
<div class="editor-main">
|
||||
{% if showMapPaneel %}
|
||||
{# Map detail paneel — tonen wanneer een map is geselecteerd #}
|
||||
<nav aria-label="breadcrumb" class="mb-2">
|
||||
<ol class="breadcrumb mb-0">
|
||||
<li class="breadcrumb-item"><a href="/admin/plugins-edit?plugin={{ pluginName|url_encode }}"><i class="bi bi-folder2-open"></i> {{ pluginName }}</a></li>
|
||||
{% if selectedDir %}
|
||||
{% set crumbPath = '' %}
|
||||
{% for part in selectedDir|split('/') %}
|
||||
{% set crumbPath = crumbPath ? crumbPath ~ '/' ~ part : part %}
|
||||
{% if loop.last %}
|
||||
<li class="breadcrumb-item active" aria-current="page">{{ part }}</li>
|
||||
{% else %}
|
||||
<li class="breadcrumb-item"><a href="/admin/plugins-edit?plugin={{ pluginName|url_encode }}&dir={{ crumbPath|url_encode }}">{{ part }}</a></li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header d-flex align-items-center gap-2">
|
||||
<i class="bi bi-folder-fill text-warning"></i>
|
||||
<span class="fw-semibold">{{ selectedDirIsRoot ? pluginName : selectedDirName }}</span>
|
||||
{% if not selectedDirIsRoot %}
|
||||
<span class="badge bg-light text-dark ms-1">{{ pluginName }}/{{ selectedDir }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-body">
|
||||
{# Map acties: nieuw bestand / nieuwe map / upload / verwijder #}
|
||||
<div class="d-flex flex-wrap gap-2 mb-3">
|
||||
<button type="button" class="btn btn-outline-primary btn-sm" data-bs-toggle="modal" data-bs-target="#newFileModal" data-in-dir="{{ selectedDir }}">
|
||||
<i class="bi bi-file-earmark-plus"></i> {{ ta.new_file|default('Nieuw bestand') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-toggle="modal" data-bs-target="#newDirModal" data-in-dir="{{ selectedDir }}">
|
||||
<i class="bi bi-folder-plus"></i> {{ ta.new_folder|default('Nieuwe map') }}
|
||||
</button>
|
||||
{% if not selectedDirIsRoot %}
|
||||
<form method="POST" action="/admin/plugins-dir-delete-in" class="d-inline" onsubmit="return confirm('{{ ta.confirm_delete_folder|default('Weet je zeker dat je deze map wilt verwijderen? De map moet leeg zijn.') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="plugin" value="{{ pluginName }}">
|
||||
<input type="hidden" name="dir" value="{{ selectedDir }}">
|
||||
<button type="submit" class="btn btn-outline-danger btn-sm">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="text-muted small">
|
||||
<i class="bi bi-files"></i>
|
||||
{{ selectedDirCounts.files }} {{ ta.files|default('bestanden') }},
|
||||
{{ selectedDirCounts.dirs }} {{ ta.subfolders|default('submappen') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
{% if relFile %}
|
||||
<nav aria-label="breadcrumb" class="mb-2">
|
||||
<ol class="breadcrumb mb-0">
|
||||
@@ -97,13 +162,21 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="d-flex gap-2 mt-3">
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<button type="submit" form="editor-form" class="btn btn-primary">
|
||||
<i class="bi bi-check-lg"></i> {{ ta.save|default('Opslaan') }}
|
||||
</button>
|
||||
<a href="/admin/plugins" class="btn btn-outline-secondary">{{ ta.cancel|default('Annuleren') }}</a>
|
||||
<form method="POST" action="/admin/plugins-file-delete" class="ms-auto" onsubmit="return confirm('{{ ta.confirm_delete_file|default('Weet je zeker dat je dit bestand wilt verwijderen?') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="plugin" value="{{ pluginName }}">
|
||||
<input type="hidden" name="file" value="{{ relFile }}">
|
||||
<button type="submit" class="btn btn-outline-danger" title="{{ ta.delete|default('Verwijderen') }}">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
{% else %}
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body text-center py-5 text-muted">
|
||||
@@ -116,6 +189,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}{# end showMapPaneel #}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -126,6 +200,7 @@
|
||||
<form method="POST" action="/admin/plugins-edit?plugin={{ pluginName|url_encode }}">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="action" value="new_file">
|
||||
<input type="hidden" name="in_dir" value="" data-in-dir-field>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="newFileModalLabel"><i class="bi bi-file-earmark-plus"></i> {{ ta.plugin_new_file_title|default('Nieuw bestand aanmaken') }}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
@@ -145,6 +220,34 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# New directory modal #}
|
||||
<div class="modal fade" id="newDirModal" tabindex="-1" aria-labelledby="newDirModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<form method="POST" action="/admin/plugins-dir-create-in">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="plugin" value="{{ pluginName }}">
|
||||
<input type="hidden" name="in_dir" value="" data-in-dir-field>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="newDirModalLabel"><i class="bi bi-folder-plus"></i> {{ ta.new_folder_title|default('Nieuwe map aanmaken') }}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label for="dirnameInput" class="form-label">{{ ta.folder_name|default('Mapnaam') }}</label>
|
||||
<input type="text" class="form-control" id="dirnameInput" name="dirname" required autofocus>
|
||||
<div class="form-text">{{ ta.name_help|default('Alleen letters, cijfers, punten, underscores en streepjes.') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ ta.cancel|default('Annuleren') }}</button>
|
||||
<button type="submit" class="btn btn-primary"><i class="bi bi-check-lg"></i> {{ ta.create|default('Aanmaken') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_js %}
|
||||
|
||||
@@ -31,6 +31,9 @@
|
||||
<button type="button" class="btn btn-outline-primary btn-sm" data-bs-toggle="modal" data-bs-target="#newFileModal">
|
||||
<i class="bi bi-file-earmark-plus"></i> {{ ta.theme_new_file|default('Nieuw bestand') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" id="newDirBtnTop" data-bs-toggle="modal" data-bs-target="#newDirModal" data-in-dir="{{ selectedDir|default('') }}">
|
||||
<i class="bi bi-folder-plus"></i> {{ ta.new_folder|default('Nieuwe map') }}
|
||||
</button>
|
||||
<a href="/admin/theme" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="bi bi-arrow-left"></i> {{ ta.back|default('Terug') }}
|
||||
</a>
|
||||
@@ -64,23 +67,88 @@
|
||||
'files': files,
|
||||
'relFile': relFile,
|
||||
'editableExts': editableExts,
|
||||
'csrf_token': csrf_token,
|
||||
'treeIdPrefix': 'theme-tree',
|
||||
'treeHeader': ta.theme_files|default('Thema bestanden'),
|
||||
'treeEmptyText': ta.theme_no_files|default('Geen bestanden gevonden.'),
|
||||
'treeRouteBase': '/admin/theme-edit',
|
||||
'treeRouteParams': 'theme=' ~ themeName|url_encode ~ '&',
|
||||
'treeDeleteRoute': '/admin/theme-file-delete',
|
||||
'treeDeleteName': 'theme',
|
||||
'treeDeleteValue': themeName,
|
||||
'treeMoveRoute': '/admin/theme-file-move',
|
||||
'treeMoveParams': 'theme=' ~ themeName|url_encode ~ '&',
|
||||
'treeDirActions': false,
|
||||
'treeDirActions': true,
|
||||
'treeHideActionsFor': ['theme.json'],
|
||||
'treeDirSelectRoute': '/admin/theme-edit?theme=' ~ themeName|url_encode,
|
||||
'treeDirRenameRoute': '/admin/theme-dir-rename-in?theme=' ~ themeName|url_encode,
|
||||
'treeRootLabel': themeName,
|
||||
'treeScope': 'theme',
|
||||
'treeMoveUrl': '/admin/tree-move',
|
||||
'treeDeleteBase': '/admin/theme-file-delete',
|
||||
'treeScopeParam': 'theme=' ~ themeName|url_encode ~ '&',
|
||||
'selectedDir': selectedDir|default(''),
|
||||
'newFileModalId': '#newFileModal',
|
||||
'newDirModalId': '#newDirModal',
|
||||
} %}
|
||||
|
||||
{# Editor main panel #}
|
||||
<div class="editor-main">
|
||||
{% if showMapPaneel %}
|
||||
{# Map detail paneel — tonen wanneer een map is geselecteerd #}
|
||||
<nav aria-label="breadcrumb" class="mb-2">
|
||||
<ol class="breadcrumb mb-0">
|
||||
<li class="breadcrumb-item"><a href="/admin/theme-edit?theme={{ themeName|url_encode }}"><i class="bi bi-folder2-open"></i> {{ themeName }}</a></li>
|
||||
{% if selectedDir %}
|
||||
{% set crumbPath = '' %}
|
||||
{% for part in selectedDir|split('/') %}
|
||||
{% set crumbPath = crumbPath ? crumbPath ~ '/' ~ part : part %}
|
||||
{% if loop.last %}
|
||||
<li class="breadcrumb-item active" aria-current="page">{{ part }}</li>
|
||||
{% else %}
|
||||
<li class="breadcrumb-item"><a href="/admin/theme-edit?theme={{ themeName|url_encode }}&dir={{ crumbPath|url_encode }}">{{ part }}</a></li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header d-flex align-items-center gap-2">
|
||||
<i class="bi bi-folder-fill text-warning"></i>
|
||||
<span class="fw-semibold">{{ selectedDirIsRoot ? themeName : selectedDirName }}</span>
|
||||
{% if not selectedDirIsRoot %}
|
||||
<span class="badge bg-light text-dark ms-1">{{ themeName }}/{{ selectedDir }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-body">
|
||||
{# Map acties: nieuw bestand / nieuwe map / upload / verwijder #}
|
||||
<div class="d-flex flex-wrap gap-2 mb-3">
|
||||
<button type="button" class="btn btn-outline-primary btn-sm" data-bs-toggle="modal" data-bs-target="#newFileModal" data-in-dir="{{ selectedDir }}">
|
||||
<i class="bi bi-file-earmark-plus"></i> {{ ta.new_file|default('Nieuw bestand') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-toggle="modal" data-bs-target="#newDirModal" data-in-dir="{{ selectedDir }}">
|
||||
<i class="bi bi-folder-plus"></i> {{ ta.new_folder|default('Nieuwe map') }}
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-success btn-sm" data-bs-toggle="collapse" data-bs-target="#themeUploadForm">
|
||||
<i class="bi bi-cloud-upload"></i> {{ ta.upload|default('Upload') }}
|
||||
</button>
|
||||
{% if not selectedDirIsRoot %}
|
||||
<form method="POST" action="/admin/theme-dir-delete-in" class="d-inline" onsubmit="return confirm('{{ ta.confirm_delete_folder|default('Weet je zeker dat je deze map wilt verwijderen? De map moet leeg zijn.') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="theme" value="{{ themeName }}">
|
||||
<input type="hidden" name="dir" value="{{ selectedDir }}">
|
||||
<button type="submit" class="btn btn-outline-danger btn-sm">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="text-muted small">
|
||||
<i class="bi bi-files"></i>
|
||||
{{ selectedDirCounts.files }} {{ ta.files|default('bestanden') }},
|
||||
{{ selectedDirCounts.dirs }} {{ ta.subfolders|default('submappen') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
{% if relFile %}
|
||||
<nav aria-label="breadcrumb" class="mb-2">
|
||||
<ol class="breadcrumb mb-0">
|
||||
@@ -110,13 +178,23 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="d-flex gap-2 mt-3">
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<button type="submit" form="editor-form" class="btn btn-primary">
|
||||
<i class="bi bi-check-lg"></i> {{ ta.save|default('Opslaan') }}
|
||||
</button>
|
||||
<a href="/admin/theme" class="btn btn-outline-secondary">{{ ta.cancel|default('Annuleren') }}</a>
|
||||
{% if relFile != 'theme.json' %}
|
||||
<form method="POST" action="/admin/theme-file-delete" class="ms-auto" onsubmit="return confirm('{{ ta.confirm_delete_file|default('Weet je zeker dat je dit bestand wilt verwijderen?') }}')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="theme" value="{{ themeName }}">
|
||||
<input type="hidden" name="file" value="{{ relFile }}">
|
||||
<button type="submit" class="btn btn-outline-danger" title="{{ ta.delete|default('Verwijderen') }}">
|
||||
<i class="bi bi-trash"></i> {{ ta.delete|default('Verwijderen') }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</div>
|
||||
</form>
|
||||
{% else %}
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body text-center py-5 text-muted">
|
||||
@@ -129,6 +207,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}{# end showMapPaneel #}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -139,6 +218,7 @@
|
||||
<form method="POST" action="/admin/theme-edit?theme={{ themeName|url_encode }}">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="action" value="new_file">
|
||||
<input type="hidden" name="in_dir" value="" data-in-dir-field>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="newFileModalLabel"><i class="bi bi-file-earmark-plus"></i> {{ ta.theme_new_file_title|default('Nieuw bestand aanmaken') }}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
@@ -158,6 +238,34 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# New directory modal #}
|
||||
<div class="modal fade" id="newDirModal" tabindex="-1" aria-labelledby="newDirModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<form method="POST" action="/admin/theme-dir-create-in">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
||||
<input type="hidden" name="theme" value="{{ themeName }}">
|
||||
<input type="hidden" name="in_dir" value="" data-in-dir-field>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="newDirModalLabel"><i class="bi bi-folder-plus"></i> {{ ta.new_folder_title|default('Nieuwe map aanmaken') }}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label for="dirnameInput" class="form-label">{{ ta.folder_name|default('Mapnaam') }}</label>
|
||||
<input type="text" class="form-control" id="dirnameInput" name="dirname" required autofocus>
|
||||
<div class="form-text">{{ ta.name_help|default('Alleen letters, cijfers, punten, underscores en streepjes.') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ ta.cancel|default('Annuleren') }}</button>
|
||||
<button type="submit" class="btn btn-primary"><i class="bi bi-check-lg"></i> {{ ta.create|default('Aanmaken') }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_js %}
|
||||
|
||||
Reference in New Issue
Block a user