|
|
| Line 1: |
Line 1: |
| − | <!DOCTYPE html>
| + | = Test H5P Wrapper = |
| − | <html lang="en">
| |
| − | <head>
| |
| − | <meta charset="UTF-8">
| |
| − | <title>H5P Test Page</title>
| |
| − | <style>
| |
| − | /* Minimal styling for H5P wrapper */
| |
| − | .h5p-wrapper {
| |
| − | width: auto !important;
| |
| − | height: 300px !important; /* privremena visina */
| |
| − | font-size: 14px !important;
| |
| − | border: 1px solid #ccc;
| |
| − | margin: 20px auto;
| |
| − | }
| |
| | | | |
| − | body {
| + | Test page for H5P content... |
| − | font-family: Arial, sans-serif;
| |
| − | padding: 20px;
| |
| − | }
| |
| − | </style>
| |
| − | </head>
| |
| − | <body>
| |
| − | <h1>H5P Test Container</h1>
| |
| | | | |
| − | <!-- H5P iframe -->
| + | {{Instruction Step Trainer |
| − | <iframe
| + | |Instruction Step Title=Test H5P Content |
| − | class="h5p-iframe"
| + | |Instruction Step Text=Hier ist nur der H5P-Inhalt zum Testen. |
| − | src="https://your-h5p-url/h5p-525"
| + | |Instruction Step Interactive Content=Resource:H5P-525 |
| − | width="100%"
| + | }} |
| − | height="300"
| |
| − | frameborder="0"
| |
| − | allowfullscreen
| |
| − | ></iframe>
| |
| − | | |
| − | <script>
| |
| − | // Privremena JS da popup visinu dok H5P ne load-uje
| |
| − | function fixH5PWrapper() {
| |
| − | document.querySelectorAll('iframe.h5p-iframe').forEach(iframe => {
| |
| − | try {
| |
| − | const doc = iframe.contentDocument || iframe.contentWindow.document;
| |
| − | if (!doc) return;
| |
| − | | |
| − | const wrapper = doc.querySelector('.h5p-wrapper');
| |
| − | if (!wrapper) return;
| |
| − | | |
| − | console.log('H5P wrapper found:', wrapper);
| |
| − | | |
| − | const height = parseFloat(wrapper.style.height);
| |
| − | const fontSize = parseFloat(wrapper.style.fontSize);
| |
| − | | |
| − | if (!height || height < 20 || !fontSize || fontSize < 5) {
| |
| − | wrapper.style.height = '300px';
| |
| − | wrapper.style.fontSize = '14px';
| |
| − | console.log('Wrapper style updated');
| |
| − | }
| |
| − | } catch(e) {
| |
| − | console.warn('Cannot access iframe (cross-origin?):', e);
| |
| − | }
| |
| − | });
| |
| − | }
| |
| − | | |
| − | // Check mehrfach, da iframe loading verzögert sein kann
| |
| − | setTimeout(fixH5PWrapper, 300);
| |
| − | setTimeout(fixH5PWrapper, 800);
| |
| − | setTimeout(fixH5PWrapper, 1500);
| |
| − | </script>
| |
| − | </body>
| |
| − | </html>
| |
