DE-Sprache

mod_pdf_tree/tmpl/default.php

@@ -1,14 +1,16 @@
-<?php defined('_JEXEC') or die;
+<?php
+defined('_JEXEC') or die;
 
 use Joomla\CMS\Uri\Uri;
+
+// Pfad zum PDF.js Viewer:
 $pdfjsViewer = Uri::root() . 'media/com_eis/pdfjs/web/viewer.html';
 ?>
-
 <style>
-/* Layout */
+/* --- Layout --- */
 .pdf-tree-wrapper{
-  display:flex; align-items:stretch; gap:1em;
-  background:#f9f9f9; padding:1em; border:1px solid #ddd; border-radius:6px;
+  display:flex; align-items:stretch; gap:1rem;
+  background:#f9f9f9; padding:1rem; border:1px solid #ddd; border-radius:6px;
   box-shadow:0 4px 10px rgba(0,0,0,.05); min-height:0;
 }
 .pdf-tree-container{
@@ -22,44 +24,46 @@ $pdfjsViewer = Uri::root() . 'media/com_eis/pdfjs/web/viewer.html';
   border:1px solid #ccc; background:#fff; display:none; min-height:0;
   position:relative; overflow:hidden;
 }
-/* Toolbar */
 .preview-actions{
   display:none; align-items:center; justify-content:space-between; gap:.5rem;
   padding:.5rem .75rem; border-bottom:1px solid #eee; background:#fafafa; height:42px;
 }
-/* Innerer Viewport (verhindert WebKit-Flex-Hickups) */
 .pdf-viewport{
   position:absolute; top:42px; left:0; right:0; bottom:0;
   overflow:auto; -webkit-overflow-scrolling:touch; min-height:0;
 }
-.pdf-viewport iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
+.pdf-viewport iframe{
+  position:absolute; inset:0; width:100%; height:100%; border:0; display:block;
+}
 
-/* Baum */
+/* --- Baum --- */
 .pdf-tree{ list-style:none; margin:0; padding:0; }
 .pdf-tree ul{ list-style:none; margin-left:1.25em; padding:0; display:none; }
 .pdf-tree li{ margin:.35em 0; }
-.folder>.toggle{ cursor:pointer; width:1.5em; display:inline-flex; align-items:center; justify-content:center; user-select:none; margin-right:.1em; }
+.folder>.toggle{
+  cursor:pointer; width:1.5em; display:inline-flex; align-items:center; justify-content:center; user-select:none; margin-right:.1em;
+}
 .folder>.folder-label{ cursor:pointer; user-select:none; padding:.15rem .1rem; border-radius:3px; }
-.folder>.folder-label:active{ background:rgba(0,0,0,.05); }
+.folder>.folder-label:active{ background:rgba(0,0,0,0.05); }
 .file-link{ text-decoration:none; color:#0366d6; }
 .file-link:hover{ text-decoration:underline; }
-.file-link:active{ opacity:.7; }
 
-/* Buttons */
-.expand-collapse{ margin-bottom:.5em; display:flex; gap:.5rem; flex-wrap:wrap; }
+/* --- Buttons --- */
+.expand-collapse{ margin-bottom:.5rem; display:flex; gap:.5rem; flex-wrap:wrap; }
 .expand-collapse button{ font:inherit; border:1px solid #ccc; background:#fff; border-radius:4px; padding:.4rem .6rem; }
 
-/* Scrollbar-Optik (optional) */
+/* --- Scrollbar-Optik (optional) --- */
 .pdf-tree-container::-webkit-scrollbar{ width:10px; }
 .pdf-tree-container::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.2); border-radius:6px; }
 
-/* Responsive */
+/* --- Responsive --- */
 @media (max-width:1024px){
   .pdf-tree-wrapper{ flex-direction:column; }
   .pdf-tree-container, #pdf-preview{ max-height:calc(var(--vh, 100vh) - 220px); height:auto; }
 }
 </style>
 
+<!-- Aus-/Einklappen -->
 <div class="expand-collapse">
   <button id="expand-all" type="button">ausklappen</button>
   <button id="collapse-all" type="button">einklappen</button>
@@ -73,14 +77,14 @@ $pdfjsViewer = Uri::root() . 'media/com_eis/pdfjs/web/viewer.html';
   <div id="pdf-preview">
     <div class="preview-actions">
       <span id="preview-filename" aria-live="polite"></span>
-      <a id="open-newtab" href="#" target="_blank" rel="noopener">in neuem Tab öffnen</a>
+      <a id="open-newtab" href="#" target="_blank" rel="noopener">im neuen Tab öffnen</a>
     </div>
     <div class="pdf-viewport" id="pdf-viewport"></div>
   </div>
 </div>
 
 <script>
-// echtes Viewport-Height-Polyfill
+// Viewport-Height-Polyfill (iOS/macOS)
 function setRealVh(){ const vh = window.innerHeight * 0.01; document.documentElement.style.setProperty('--vh', `${vh*100}px`); }
 setRealVh(); window.addEventListener('resize', setRealVh, {passive:true});
 
@@ -92,7 +96,7 @@ document.addEventListener('DOMContentLoaded', function(){
   const openNewTab = document.getElementById('open-newtab');
   const viewport = document.getElementById('pdf-viewport');
 
-  // Ordner togglen
+  // Ordner toggeln
   tree.addEventListener('click', (ev) => {
     const t = ev.target;
     if (t.classList.contains('toggle')) {
@@ -107,6 +111,8 @@ document.addEventListener('DOMContentLoaded', function(){
       t.closest('li.folder')?.querySelector(':scope > .toggle')?.click();
     }
   });
+
+  // Alle aus/einklappen
   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='▼');
@@ -117,23 +123,28 @@ document.addEventListener('DOMContentLoaded', function(){
     document.querySelectorAll('.pdf-tree .toggle').forEach(t => t.textContent='▶');
   });
 
-  // PDF.js-Viewer einbetten
-  const viewerBase = '<?= addslashes($pdfjsViewer) ?>';
+  // PDF.js-Viewer laden (mit deutscher UI)
+  const viewerBase = <?= json_encode($pdfjsViewer, JSON_UNESCAPED_SLASHES) ?>;
 
   tree.addEventListener('click', (ev) => {
     const a = ev.target.closest('.file-link');
     if (!a) return;
     ev.preventDefault();
 
-    const fileUrl = a.href; // dein Download-Controller (gleiches Origin)
-    const viewerUrl = viewerBase + '?file=' + encodeURIComponent(fileUrl) + '#zoom=page-fit';
+    const fileUrl = a.href;
+
+    // Deutsch aktivieren + angenehme Defaults
+    const viewerUrl = viewerBase
+      + '?file=' + encodeURIComponent(fileUrl)
+      + '&locale=de'
+      + '#sidebar=0&zoom=page-fit';
 
     preview.style.display = 'block';
     previewBar.style.display = 'flex';
     previewName.textContent = a.getAttribute('data-filename') || a.textContent.trim();
-    openNewTab.href = viewerUrl; // optional externer Viewer-Tab
+    openNewTab.href = viewerUrl;
 
-    // alten Viewer entfernen & neuen iframe setzen
+    // iFrame neu setzen
     viewport.innerHTML = '';
     const iframe = document.createElement('iframe');
     iframe.setAttribute('title', 'PDF-Vorschau (PDF.js)');