diff --git a/src/static/index.html b/src/static/index.html index 60dc74f..eea2860 100644 --- a/src/static/index.html +++ b/src/static/index.html @@ -13,6 +13,7 @@ +

diff --git a/src/static/index.js b/src/static/index.js index e50f321..acc5896 100644 --- a/src/static/index.js +++ b/src/static/index.js @@ -10,6 +10,8 @@ const exportButton = document.getElementById('export-button'); const calendarDiv = document.getElementById('calendar-div'); const untisDiv = document.getElementById('untis-div'); +const exportStatus = document.getElementById('export-status'); + fetch('/show') .then(response => { if (response.ok) { @@ -72,13 +74,14 @@ function copyToClipboard(button, textarea) { function loading() { exportButton.disabled = true; - calendarTextarea.value = 'Wird geladen'; + exportStatus.innerHTML = 'Wird geladen'; + calendarTextarea.value = ''; untisTextarea.value = ''; loadingInterval = setInterval(() => { - if (calendarTextarea.value != 'Wird geladen...') { - calendarTextarea.value += '.'; + if (exportStatus.innerHTML != 'Wird geladen...') { + exportStatus.innerHTML += '.'; } else { - calendarTextarea.value = 'Wird geladen'; + exportStatus.innerHTML = 'Wird geladen'; } }, 500); } @@ -86,7 +89,7 @@ function loading() { function loaded() { exportButton.disabled = false; clearInterval(loadingInterval); - calendarTextarea.value = ''; + exportStatus.innerHTML = ''; } function exportReport() { @@ -99,7 +102,7 @@ function exportReport() { if (response.ok) { return response.text(); } else { - calendarTextarea.value = 'Error während des Abrufs'; + exportStatus.innerHTML = 'Error während des Abrufs'; throw new Error('Error während des Abrufs'); } }).then(text => { diff --git a/src/static/style.css b/src/static/style.css index 2b2e3e5..ac4acf8 100644 --- a/src/static/style.css +++ b/src/static/style.css @@ -18,6 +18,8 @@ h4 { .selector { margin-bottom: 10px; + display: flex; + align-items: center; } select::-webkit-scrollbar { @@ -34,6 +36,11 @@ select::-webkit-scrollbar { overflow-y: scroll; } +.selector p { + margin: 0; + margin-left: 10px; +} + button { font-size: 16px; height: 30px;