script.js aktualisiert

Weitere Verbesserungen wie auch URL Validieren und Form Eingabe

script.js

@@ -1,7 +1,7 @@
 document.addEventListener('DOMContentLoaded', function () {
     // === Abschnitt: Globale Variablen ===
     const presetContainer = document.getElementById('preset-container');
-    const addNewPresetButton = document.getElementById('add-new-preset');
+    const newPresetForm = document.getElementById('new-preset-form');
     const newPresetNameInput = document.getElementById('new-preset-name');
     const newPresetUrlInput = document.getElementById('new-preset-url');
     const exportButton = document.getElementById('export-button');
@@ -32,26 +32,55 @@ document.addEventListener('DOMContentLoaded', function () {
         }
     }
 
+    // === Funktion: Titel dynamisch ändern ===
+    function updateTitle(stationName) {
+        if (stationName) {
+            document.title = `${stationName} - Radioplayer mit Presets`;
+        } else {
+            document.title = "Radioplayer mit Presets";
+        }
+    }
+
     // === Abschnitt: Event-Listener ===
     function initializeEventListeners() {
-        exportButton.addEventListener('click', exportPresets);
-        importButton.addEventListener('click', importPresets);
-        loadPresetsLink.addEventListener('click', loadPresetsFromFile);
+        newPresetForm.addEventListener('submit', (event) => {
+            event.preventDefault(); // Verhindert die Standardaktion (Seiten-Reload)
 
-        addNewPresetButton.addEventListener('click', () => {
             const presetName = newPresetNameInput.value.trim();
             const presetUrl = newPresetUrlInput.value.trim();
 
-            if (presetName && presetUrl) {
-                addNewPreset(presetName, presetUrl);
-                savePresetToLocalStorage(presetName, presetUrl);
-                newPresetNameInput.value = '';
-                newPresetUrlInput.value = '';
-            } else {
+            if (!presetName || !presetUrl) {
                 alert("Bitte geben Sie einen Namen und eine URL ein.");
+                return;
             }
+
+            // URL-Validierung: Prüfen, ob die URL mit http:// oder https:// beginnt
+            if (!isValidHttpUrl(presetUrl)) {
+                alert("Bitte geben Sie eine gültige HTTP- oder HTTPS-URL ein.");
+                return;
+            }
+
+            addNewPreset(presetName, presetUrl);
+            savePresetToLocalStorage(presetName, presetUrl);
+
+            // Felder zurücksetzen
+            newPresetNameInput.value = '';
+            newPresetUrlInput.value = '';
         });
 
+    // Hilfsfunktion zur Überprüfung von URLs
+        function isValidHttpUrl(url) {
+            try {
+                const parsedUrl = new URL(url);
+                return parsedUrl.protocol === "http:" || parsedUrl.protocol === "https:";
+            } catch (e) {
+                return false;
+            }
+        }
+
+        exportButton.addEventListener('click', exportPresets);
+        importButton.addEventListener('click', importPresets);
+        loadPresetsLink.addEventListener('click', loadPresetsFromFile);
         stopButton.addEventListener('click', stopPlayback);
     }
 
@@ -144,6 +173,8 @@ document.addEventListener('DOMContentLoaded', function () {
         item.classList.add('playing');
         currentPlayingItem = item;
         currentStationName.textContent = item.querySelector('h3').textContent;
+
+        updateTitle(item.querySelector('h3').textContent); // Sendername in den Titel einfügen
     }
 
     function stopPlayback() {
@@ -157,6 +188,8 @@ document.addEventListener('DOMContentLoaded', function () {
                 currentStationName.textContent = 'Kein Sender ausgewählt.';
             }
         }
+
+        updateTitle('');
     }
 
     // === Funktion: Preset-Import und -Export ===