first changes for v0.2

This commit is contained in:
Rainer 2025-06-07 14:58:38 +02:00
parent 50208b0ee8
commit 0140e114cd
8 changed files with 692 additions and 203 deletions

View file

@ -1,3 +1,70 @@
<div class="archive-controls"><label for="archive-date-select-${current_world_key}">Archivdatum:</label><select id="archive-date-select-${current_world_key}"><option value="">-- Bitte wählen --</option></select><span id="archive-loading-error-${current_world_key}" style="color:red;margin-left:10px;"></span></div>
<div class="archive-image-container"><img id="archive-image-${current_world_key}" src="#" alt="Archivkarte" style="max-width:100%;border:1px solid #666;display:none;"><p id="archive-no-image-${current_world_key}" style="display:none;">Kein Bild für Auswahl.</p></div>
<script>(function(){const e=document.getElementById('archive-date-select-${current_world_key}'),t=document.getElementById('archive-image-${current_world_key}'),n=document.getElementById('archive-no-image-${current_world_key}'),o=document.getElementById('archive-loading-error-${current_world_key}'),a=${available_archive_dates_js_array},i='${archive_world_rel_to_webroot}';if(!e||!a||a.length===0)return void(e&&(e.disabled=!0,e.innerHTML='<option value="">Keine Archivdaten</option>'));a.forEach(a_date=>{const r=document.createElement('option');r.value=a_date,r.textContent=a_date,e.appendChild(r)}),e.addEventListener('change',function(){t.style.display='none',n.style.display='none',o.textContent='',this.value&&(t.onload=function(){t.style.display='block'},t.onerror=function(){n.style.display='block',o.textContent='Bild nicht geladen.'},t.src=i+'/'+this.value.replace(/-/g,'/')+'.png?v=${CACHE_BUSTER}&t='+new Date().getTime())})})();</script>
<div class="archive-controls">
<label for="archive-date-selector-%%current_world_key%%">Archivdatum:</label>
<select id="archive-date-selector-%%current_world_key%%">
<option value="">-- Bitte wählen --</option>
</select>
<span id="archive-error-msg-%%current_world_key%%" class="archive-error"></span>
</div>
<div class="archive-image-container">
<img id="archive-image-%%current_world_key%%" alt="Archivierte Karte" style="display:none; max-width:100%;">
<p id="archive-placeholder-%%current_world_key%%">Bitte ein Datum auswählen, um die Karte anzuzeigen.</p>
</div>
<script>
// Um zu verhindern, dass das Skript mehrfach ausgeführt wird
if (!window.archiveScriptLoaded_%%current_world_key%%) {
window.archiveScriptLoaded_%%current_world_key%% = true;
const selector = document.getElementById('archive-date-selector-%%current_world_key%%');
const imageElement = document.getElementById('archive-image-%%current_world_key%%');
const placeholder = document.getElementById('archive-placeholder-%%current_world_key%%');
const errorMessage = document.getElementById('archive-error-msg-%%current_world_key%%');
const availableDates = %%available_archive_dates_js_array%%;
const imageBaseUrl = '%%archive_world_rel_to_webroot%%';
if (selector && availableDates && availableDates.length > 0) {
availableDates.forEach(dateStr => {
const option = document.createElement('option');
const parts = dateStr.split('-');
option.value = dateStr;
option.textContent = `${parts[2]}.${parts[1]}.${parts[0]}`;
selector.appendChild(option);
});
selector.addEventListener('change', function() {
imageElement.style.display = 'none';
errorMessage.textContent = '';
const selectedDate = this.value;
if (selectedDate) {
// WICHTIGE ÄNDERUNG: Platzhalter wird jetzt hier versteckt
placeholder.style.display = 'none';
const dateParts = selectedDate.split('-');
const imageUrl = `${imageBaseUrl}/${dateParts[0]}/${dateParts[1]}/${dateParts[2]}.png?v=%%CACHE_BUSTER%%`;
imageElement.src = imageUrl;
} else {
// Wenn "-- Bitte wählen --" ausgewählt wird, Platzhalter wieder anzeigen
placeholder.style.display = 'block';
}
});
imageElement.onload = function() {
this.style.display = 'block';
errorMessage.textContent = ''; // Sicherstellen, dass keine alte Fehlermeldung mehr da ist
};
imageElement.onerror = function() {
this.style.display = 'none';
// WICHTIGE ÄNDERUNG: Fehlermeldung ersetzt jetzt den Platzhalter
placeholder.style.display = 'none';
errorMessage.textContent = 'Fehler: Bild für dieses Datum konnte nicht geladen werden.';
};
} else if (selector) {
selector.disabled = true;
selector.querySelector('option').textContent = 'Keine Archive verfügbar';
}
}
</script>