Adds German and French translations for form submission pages with
dynamic message handling and language selector integration.
**Pages Updated:**
- case-submission.html: Added data-i18n attributes and language selector
- media-inquiry.html: Added data-i18n attributes and language selector
**Translation Files Created:**
- EN/DE/FR for case-submission (form labels, help text, dynamic messages)
- EN/DE/FR for media-inquiry (form labels, help text, dynamic messages)
**JavaScript Updates:**
- case-submission.js: Added i18n translation helper for dynamic content
- media-inquiry.js: Added i18n translation helper for dynamic content
- Submit buttons and error messages now translate based on selected language
**Features:**
- Language flags visible in navbar for easy switching
- Form labels and help text translate on language change
- Submit button text updates during submission ("Submitting..." → "Einreichen..." in DE)
- Success/error messages display in user's selected language
- All translations via DeepL API for professional quality
**Technical Details:**
- Uses cache-busting timestamps for translation fetches (prevents stale cache)
- Submit buttons use <span data-i18n> for translatable content
- Form JavaScript uses window.i18nTranslations for dynamic text
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
/**
|
|
* Case Submission Form Handler
|
|
*/
|
|
|
|
const form = document.getElementById('case-submission-form');
|
|
const submitButton = document.getElementById('submit-button');
|
|
const successMessage = document.getElementById('success-message');
|
|
const errorMessage = document.getElementById('error-message');
|
|
|
|
// Helper to get translated text
|
|
function t(key) {
|
|
if (window.i18nTranslations) {
|
|
const keys = key.split('.');
|
|
let value = window.i18nTranslations;
|
|
for (const k of keys) {
|
|
value = value?.[k];
|
|
}
|
|
return value || key;
|
|
}
|
|
return key;
|
|
}
|
|
|
|
form.addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
|
|
// Hide previous messages
|
|
successMessage.style.display = 'none';
|
|
errorMessage.style.display = 'none';
|
|
|
|
// Disable submit button
|
|
submitButton.disabled = true;
|
|
submitButton.querySelector('span').textContent = t('messages.submitting');
|
|
|
|
// Collect form data
|
|
const evidenceText = document.getElementById('case-evidence').value;
|
|
const evidence = evidenceText
|
|
? evidenceText.split('\n').filter(line => line.trim())
|
|
: [];
|
|
|
|
const formData = {
|
|
submitter: {
|
|
name: document.getElementById('submitter-name').value,
|
|
email: document.getElementById('submitter-email').value,
|
|
organization: document.getElementById('submitter-organization').value || null,
|
|
public: document.getElementById('submitter-public').checked
|
|
},
|
|
case_study: {
|
|
title: document.getElementById('case-title').value,
|
|
description: document.getElementById('case-description').value,
|
|
failure_mode: document.getElementById('case-failure-mode').value,
|
|
tractatus_applicability: document.getElementById('case-tractatus').value,
|
|
evidence: evidence,
|
|
attachments: []
|
|
}
|
|
};
|
|
|
|
try {
|
|
const response = await fetch('/api/cases/submit', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(formData)
|
|
});
|
|
|
|
const data = await response.json();
|
|
|
|
if (response.ok) {
|
|
// Success
|
|
successMessage.textContent = data.message || t('messages.success');
|
|
successMessage.style.display = 'block';
|
|
form.reset();
|
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
|
} else {
|
|
// Error
|
|
errorMessage.textContent = data.message || t('messages.error');
|
|
errorMessage.style.display = 'block';
|
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
|
}
|
|
|
|
} catch (error) {
|
|
console.error('Submit error:', error);
|
|
errorMessage.textContent = t('messages.network_error');
|
|
errorMessage.style.display = 'block';
|
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
|
} finally {
|
|
// Re-enable submit button
|
|
submitButton.disabled = false;
|
|
submitButton.querySelector('span').textContent = t('form.submit_button');
|
|
}
|
|
});
|