134 lines
3.1 KiB
PHP
134 lines
3.1 KiB
PHP
<?php defined('_JEXEC') or die; ?>
|
|
|
|
<style>
|
|
.pdf-tree-wrapper {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 1em;
|
|
background: #f9f9f9;
|
|
padding: 1em;
|
|
border: 1px solid #ddd;
|
|
border-radius: 6px;
|
|
box-shadow: 0 4px 10px rgba(0,0,0,0.05);
|
|
}
|
|
|
|
.pdf-tree-container {
|
|
flex: 0 0 30%;
|
|
max-height: 95vh;
|
|
overflow: auto;
|
|
}
|
|
|
|
#pdf-preview {
|
|
flex: 1;
|
|
min-width: 800px;
|
|
height: 95vh;
|
|
border: 1px solid #ccc;
|
|
background: #fff;
|
|
display: none;
|
|
}
|
|
|
|
#pdf-preview iframe {
|
|
width: 100%;
|
|
height: 100%;
|
|
border: none;
|
|
display: block;
|
|
}
|
|
.pdf-tree {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.pdf-tree ul {
|
|
list-style: none;
|
|
margin-left: 1.5em;
|
|
padding: 0;
|
|
display: none;
|
|
}
|
|
|
|
.pdf-tree li {
|
|
margin: 0.3em 0;
|
|
}
|
|
|
|
.folder > .toggle {
|
|
cursor: pointer;
|
|
width: 1em;
|
|
display: inline-block;
|
|
user-select: none;
|
|
}
|
|
.pdf-tree .meta { color: #666; }
|
|
|
|
/* Optionale visuelle Trennung bei Dateien */
|
|
.file-link {
|
|
text-decoration: none;
|
|
color: #0366d6;
|
|
}
|
|
.file-link:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.expand-collapse {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
.expand-collapse button {
|
|
margin-right: 0.5em;
|
|
}
|
|
</style>
|
|
|
|
<!-- Buttons: Aus-/Einklappen -->
|
|
<div class="expand-collapse">
|
|
<button id="expand-all">ausklappen</button>
|
|
<button id="collapse-all">einklappen</button>
|
|
</div>
|
|
|
|
<!-- PDF-Baum und Vorschau -->
|
|
<div class="pdf-tree-wrapper">
|
|
<div class="pdf-tree-container">
|
|
<?= ModEisAnzeigeHelper::renderTree($items); ?>
|
|
</div>
|
|
<div id="pdf-preview"></div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const preview = document.getElementById('pdf-preview');
|
|
if (!preview) return;
|
|
|
|
// (1) Verzeichnisse toggeln
|
|
document.querySelectorAll('.pdf-tree .toggle').forEach(toggle => {
|
|
toggle.addEventListener('click', () => {
|
|
const ul = toggle.closest('li').querySelector('ul');
|
|
if (ul) {
|
|
const visible = ul.style.display === 'block';
|
|
ul.style.display = visible ? 'none' : 'block';
|
|
toggle.textContent = visible ? '▶' : '▼';
|
|
}
|
|
});
|
|
});
|
|
|
|
// (2) Alle ausklappen
|
|
document.getElementById('expand-all')?.addEventListener('click', () => {
|
|
document.querySelectorAll('.pdf-tree ul').forEach(ul => ul.style.display = 'block');
|
|
document.querySelectorAll('.pdf-tree .toggle').forEach(t => t.textContent = '▼');
|
|
});
|
|
|
|
// (3) Alle einklappen
|
|
document.getElementById('collapse-all')?.addEventListener('click', () => {
|
|
document.querySelectorAll('.pdf-tree ul').forEach(ul => ul.style.display = 'none');
|
|
document.querySelectorAll('.pdf-tree .toggle').forEach(t => t.textContent = '▶');
|
|
});
|
|
|
|
// (4) PDF-Vorschau
|
|
document.querySelectorAll('.pdf-tree .file-link').forEach(link => {
|
|
link.addEventListener('click', e => {
|
|
e.preventDefault();
|
|
preview.style.display = 'block';
|
|
preview.innerHTML = ''; // Vorherige Vorschau entfernen
|
|
const iframe = document.createElement('iframe');
|
|
iframe.src = link.href;
|
|
iframe.loading = 'lazy';
|
|
preview.appendChild(iframe);
|
|
});
|
|
});
|
|
});
|
|
</script>
|