115 lines
3.2 KiB
PHP
115 lines
3.2 KiB
PHP
|
|
<?php defined('_JEXEC') or die; ?>
|
|
|
|
<!-- Styles für Struktur, Vorschau und Icons -->
|
|
<style>
|
|
/* Baum und Vorschau nebeneinander */
|
|
.pdf-tree-wrapper { display: flex; }
|
|
.pdf-tree-container { flex: 1; }
|
|
|
|
/* Verzeichnisliste zurücksetzen */
|
|
.pdf-tree, .pdf-tree ul {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.pdf-tree li { margin: 0.3em 0; }
|
|
|
|
/* Ordner-Icons & Pfeile */
|
|
.folder > .toggle { cursor: pointer; display: inline-block; width: 1em; }
|
|
.folder-icon::before { content: "📁"; margin-right: 4px; }
|
|
|
|
/* Datei-Icon */
|
|
.file-icon::before { content: "📄"; margin-right: 4px; }
|
|
|
|
/* Standard: Unterverzeichnisse einklappen */
|
|
.pdf-tree ul {
|
|
display: none;
|
|
margin-left: 1.5em;
|
|
}
|
|
|
|
/* Vorschaufenster rechts */
|
|
#pdf-preview {
|
|
flex: 1;
|
|
margin-left: 1em;
|
|
border: 1px solid #ccc;
|
|
background: #fff;
|
|
display: none;
|
|
}
|
|
#pdf-preview iframe {
|
|
width: 100%;
|
|
height: 100%;
|
|
border: none;
|
|
}
|
|
|
|
/* Buttons oben */
|
|
.expand-collapse { margin-bottom: 0.5em; }
|
|
.expand-collapse button { margin-right: 0.5em; }
|
|
</style>
|
|
|
|
<!-- Steuerbuttons oben -->
|
|
<div class="expand-collapse">
|
|
<button id="expand-all">Expand All</button>
|
|
<button id="collapse-all">Collapse All</button>
|
|
</div>
|
|
|
|
<div class="pdf-tree-wrapper">
|
|
<!-- Links: Verzeichnisbaum -->
|
|
<div class="pdf-tree-container">
|
|
<?php echo ModEisAnzeigeHelper::renderTree($items); ?>
|
|
</div>
|
|
|
|
<!-- Rechts: Vorschau-Bereich -->
|
|
<div id="pdf-preview"></div>
|
|
</div>
|
|
|
|
<!-- Interaktivität: Vorschau, Toggle, Buttons -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
// (1) Verzeichnisse auf-/zuklappen per Klick
|
|
document.querySelectorAll('.pdf-tree .toggle').forEach(function(toggle) {
|
|
toggle.addEventListener('click', function() {
|
|
var li = this.parentNode;
|
|
var ul = li.querySelector('ul');
|
|
if (!ul) return;
|
|
if (ul.style.display === 'block') {
|
|
ul.style.display = 'none'; this.textContent = '▶';
|
|
} else {
|
|
ul.style.display = 'block'; this.textContent = '▼';
|
|
}
|
|
});
|
|
});
|
|
|
|
// (2) Alle ausklappen
|
|
document.getElementById('expand-all').addEventListener('click', function() {
|
|
document.querySelectorAll('.pdf-tree ul').forEach(function(ul) {
|
|
ul.style.display = 'block';
|
|
});
|
|
document.querySelectorAll('.pdf-tree .toggle').forEach(function(toggle) {
|
|
toggle.textContent = '▼';
|
|
});
|
|
});
|
|
|
|
// (3) Alle einklappen
|
|
document.getElementById('collapse-all').addEventListener('click', function() {
|
|
document.querySelectorAll('.pdf-tree ul').forEach(function(ul) {
|
|
ul.style.display = 'none';
|
|
});
|
|
document.querySelectorAll('.pdf-tree .toggle').forEach(function(toggle) {
|
|
toggle.textContent = '▶';
|
|
});
|
|
});
|
|
|
|
// (4) Vorschau anzeigen beim Klick
|
|
var preview = document.getElementById('pdf-preview');
|
|
document.querySelectorAll('.pdf-tree .file-link').forEach(function(link) {
|
|
link.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
preview.style.display = 'block';
|
|
preview.innerHTML = '<iframe src="' + this.href + '"></iframe>';
|
|
});
|
|
});
|
|
});
|
|
</script>
|