Skip to content

Commit 05b3805

Browse files
andre-dietrichandre-dietrich
committed
updated description ... for export formats
1 parent 339d0e5 commit 05b3805

3 files changed

Lines changed: 115 additions & 9 deletions

File tree

‎src/server/public/app.js‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ document.addEventListener('DOMContentLoaded', () => {
1111
initializeAdvancedSettings()
1212
initializeForm()
1313
initializeExportSelection()
14+
initializeFormatDescription()
1415
})
1516

1617
// Tab switching
@@ -392,3 +393,22 @@ function showConfirmation(result) {
392393
}
393394
})
394395
}
396+
397+
// Format description display
398+
function initializeFormatDescription() {
399+
const formatRadios = document.querySelectorAll('input[name="format"]')
400+
const descriptionBox = document.getElementById('format-description')
401+
const descriptionText = descriptionBox.querySelector('p')
402+
403+
formatRadios.forEach((radio) => {
404+
radio.addEventListener('change', () => {
405+
const description = radio.dataset.description
406+
if (description) {
407+
descriptionText.innerHTML = description
408+
descriptionBox.style.display = 'block'
409+
} else {
410+
descriptionBox.style.display = 'none'
411+
}
412+
})
413+
})
414+
}

‎src/server/public/index.html‎

Lines changed: 74 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -174,77 +174,142 @@ <h3>Open edX</h3>
174174
<div class="export-tab-panel" id="formats-panel">
175175
<div class="preset-grid">
176176
<label class="preset-tile">
177-
<input type="radio" name="format" value="scorm12" />
177+
<input
178+
type="radio"
179+
name="format"
180+
value="scorm12"
181+
data-description="E-Learning-Standard für Lernmanagementsysteme. Weit verbreitet, aber älter. Geeignet für ältere LMS-Plattformen. <a href='https://de.wikipedia.org/wiki/Sharable_Content_Object_Reference_Model' target='_blank'>Mehr erfahren</a>"
182+
/>
178183
<div class="preset-content">
179184
<h3>SCORM 1.2</h3>
180185
<p>Legacy Standard</p>
181186
</div>
182187
</label>
183188

184189
<label class="preset-tile">
185-
<input type="radio" name="format" value="scorm2004" />
190+
<input
191+
type="radio"
192+
name="format"
193+
value="scorm2004"
194+
data-description="Moderne Version des SCORM-Standards mit erweiterten Funktionen für Lernpfade und Bewertungen. Empfohlen für aktuelle LMS-Systeme. <a href='https://de.wikipedia.org/wiki/Sharable_Content_Object_Reference_Model' target='_blank'>Mehr erfahren</a>"
195+
/>
186196
<div class="preset-content">
187197
<h3>SCORM 2004</h3>
188198
<p>Modern Standard</p>
189199
</div>
190200
</label>
191201

192202
<label class="preset-tile">
193-
<input type="radio" name="format" value="ims" />
203+
<input
204+
type="radio"
205+
name="format"
206+
value="ims"
207+
data-description="IMS Content Packaging für Austausch von Lerninhalten zwischen verschiedenen Plattformen. Standard für plattformübergreifende Kompatibilität. <a href='https://en.wikipedia.org/wiki/IMS_Content_Packaging' target='_blank'>Mehr erfahren</a>"
208+
/>
194209
<div class="preset-content">
195210
<h3>IMS</h3>
196211
<p>Content Package</p>
197212
</div>
198213
</label>
199214

200215
<label class="preset-tile">
201-
<input type="radio" name="format" value="web" />
216+
<input
217+
type="radio"
218+
name="format"
219+
value="web"
220+
data-description="Eigenständige HTML-Website zum Hosten auf beliebigen Webservern. Funktioniert offline und online. Perfekt für eigenes Hosting."
221+
/>
202222
<div class="preset-content">
203223
<h3>Web</h3>
204224
<p>Standalone</p>
205225
</div>
206226
</label>
207227

208228
<label class="preset-tile">
209-
<input type="radio" name="format" value="pdf" />
229+
<input
230+
type="radio"
231+
name="format"
232+
value="pdf"
233+
data-description="Portables Dokumentenformat zum Drucken und Archivieren. Ideal für statische Inhalte und Offline-Lektüre. <a href='https://de.wikipedia.org/wiki/Portable_Document_Format' target='_blank'>Mehr erfahren</a>"
234+
/>
210235
<div class="preset-content">
211236
<h3>PDF</h3>
212237
<p>Dokument</p>
213238
</div>
214239
</label>
215240

216241
<label class="preset-tile">
217-
<input type="radio" name="format" value="android" />
242+
<input
243+
type="radio"
244+
name="format"
245+
value="android"
246+
data-description="Android-App-Paket (APK) für Installation auf Android-Geräten. Ermöglicht Offline-Zugriff und native App-Erfahrung."
247+
/>
218248
<div class="preset-content">
219249
<h3>Android</h3>
220250
<p>App Package</p>
221251
</div>
222252
</label>
223253

224254
<label class="preset-tile">
225-
<input type="radio" name="format" value="json" />
255+
<input
256+
type="radio"
257+
name="format"
258+
value="json"
259+
data-description="Strukturiertes Datenformat für programmatische Weiterverarbeitung und API-Integration. Perfekt für Entwickler und automatisierte Workflows. <a href='https://de.wikipedia.org/wiki/JavaScript_Object_Notation' target='_blank'>Mehr erfahren</a>"
260+
/>
226261
<div class="preset-content">
227262
<h3>JSON</h3>
228263
<p>Data Export</p>
229264
</div>
230265
</label>
231266

232267
<label class="preset-tile">
233-
<input type="radio" name="format" value="epub" />
268+
<input
269+
type="radio"
270+
name="format"
271+
value="epub"
272+
data-description="Offenes E-Book-Format für E-Reader und mobile Geräte. Unterstützt reflowable Layouts und ist kompatibel mit den meisten E-Readern. <a href='https://de.wikipedia.org/wiki/EPUB' target='_blank'>Mehr erfahren</a>"
273+
/>
234274
<div class="preset-content">
235275
<h3>EPUB</h3>
236276
<p>E-Book</p>
237277
</div>
238278
</label>
239279

240280
<label class="preset-tile">
241-
<input type="radio" name="format" value="rdf" />
281+
<input
282+
type="radio"
283+
name="format"
284+
value="rdf"
285+
data-description="Resource Description Framework für strukturierte Metadaten und Linked Data. Für semantische Web-Anwendungen und Metadaten-Export. <a href='https://de.wikipedia.org/wiki/Resource_Description_Framework' target='_blank'>Mehr erfahren</a>"
286+
/>
242287
<div class="preset-content">
243288
<h3>RDF</h3>
244289
<p>Metadaten</p>
245290
</div>
246291
</label>
247292
</div>
293+
294+
<hr
295+
style="
296+
margin: 2rem 0 1rem 0;
297+
border: none;
298+
border-top: 1px solid #e0e0e0;
299+
"
300+
/>
301+
302+
<div
303+
id="format-description"
304+
style="
305+
padding: 1rem;
306+
background-color: #f8f9fa;
307+
border-radius: 8px;
308+
display: none;
309+
"
310+
>
311+
<p style="margin: 0; color: #555; line-height: 1.6"></p>
312+
</div>
248313
</div>
249314
</section>
250315

‎src/server/public/styles.css‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -326,6 +326,27 @@ header h1 {
326326
.preset-content p {
327327
font-size: 0.875rem;
328328
color: var(--text-muted);
329+
margin-bottom: 0.5rem;
330+
}
331+
332+
.format-description {
333+
display: block;
334+
font-size: 0.8rem;
335+
line-height: 1.4;
336+
color: var(--text-muted);
337+
margin-top: 0.5rem;
338+
padding-top: 0.5rem;
339+
border-top: 1px solid var(--border);
340+
}
341+
342+
.format-description a {
343+
color: var(--primary);
344+
text-decoration: none;
345+
font-weight: 500;
346+
}
347+
348+
.format-description a:hover {
349+
text-decoration: underline;
329350
}
330351

331352
/* Collapsible */

0 commit comments

Comments
 (0)