From 930180bcf16867eaa278ab893a92c55d9427e3a0 Mon Sep 17 00:00:00 2001
From: simonpipe <simonpipe@noreply.codeberg.org>
Date: Thu, 18 Dec 2025 10:33:35 +0100
Subject: [PATCH] Update index.html

Neue Import- und Export-Funktion, Bereinigung Code
---
 index.html | 76 ++++++++++++++++++++++++++++++++++++++----------------
 1 file changed, 54 insertions(+), 22 deletions(-)
diff --git a/index.html b/index.html
index ac0dcea..d0d76e7 100644
--- a/index.html
+++ b/index.html
@@ -1,4 +1,3 @@
-<!-- Public Domain -->
 <!DOCTYPE html>
 <html lang="de">
 <head>
@@ -17,34 +16,36 @@
 <body>
     <div class="header" role="banner">
         <div class="titel">
-            <img src="/img/icon.png" alt="Logo des Radioplayers, das einem alten Kofferradio nachempfunden ist" height="35" width="35">
+            <img src="/img/icon.png" alt="Logo des Radioplayers" height="35" width="35">
             <h1>Radioplayer <button class="stop-button hidden" aria-label="Wiedergabe stoppen"><i class="fas fa-stop"></i></button></h1>
         </div>
         <div class="current-station" aria-live="polite">
             <span id="aktueller-sender"><span id="current-station-name">Wähle einen Sender aus</span></span>
         </div>
     </div>
+
     <div class="preset-container" id="preset-container" role="list"></div>
+
     <div class="button-container">
         <button id="open-sleep-timer-modal">Sleeptimer</button>
-        <button id="edit-presets-button" class="edit-presets-button" aria-label="Sender bearbeiten" aria-pressed="false">Presets bearbeiten</button>
+        <button id="edit-presets-button" class="edit-presets-button">Presets bearbeiten</button>
     </div>
+
     <footer>
         <div class="footer" role="contentinfo">
-            &copy; 2024-<span id="current-year"></span>&nbsp;<img src="/img/favicon-16x16.png" alt="Radioplayer" height="14" width="14">&nbsp;<span id="server-name"></span>&nbsp;//&nbsp;View on&nbsp;<a target="_blank" href="https://codeberg.org/simonpipe/Radioplayer-with-Presets" aria-label="Codeberg-Seite öffnen">&nbsp;<img src="/img/codeberg_16px.ico" alt="Codeberg" height="12" width="12"> Codeberg</a>
+            &copy; 2024-<span id="current-year"></span>&nbsp;<img src="/img/favicon-16x16.png" alt="Radioplayer" height="14" width="14">&nbsp;<span id="server-name"></span>&nbsp;//&nbsp;View on&nbsp;<a target="_blank" href="https://codeberg.org/simonpipe/Radioplayer-with-Presets"><img src="/img/codeberg_16px.ico" alt="Codeberg" height="12" width="12"> Codeberg</a>
         </div>
     </footer>
     
-    <!-- Modal für Sleep Timer -->
     <div id="sleep-timer-modal" class="modal hidden">
         <div class="modal-content">
             <h2>Sleeptimer einstellen</h2>
             <div class="button-container">
-                <button class="time-option" data-time="600000">10 Minuten</button>
-                <button class="time-option" data-time="900000">15 Minuten</button>
-                <button class="time-option" data-time="1200000">20 Minuten</button>
-                <button class="time-option" data-time="1800000">30 Minuten</button>
-                <button class="time-option" data-time="3600000">60 Minuten</button>
+                <button class="time-option" data-time="360000">6 Min</button>
+                <button class="time-option" data-time="720000">12 Min</button>
+                <button class="time-option" data-time="1080000">18 Min</button>
+                <button class="time-option" data-time="2160000">36 Min</button>
+                <button class="time-option" data-time="4320000">72 Min</button>
             </div>
             <div class="button-container">
                 <button id="off-sleep-timer-modal">Timer aus</button>
@@ -53,33 +54,64 @@
         </div>
     </div>
     
-    <!-- Modal für die Bearbeitung der Presets -->
     <div id="preset-modal" class="modal hidden">
         <div class="modal-content">
             <h2>Sender bearbeiten</h2>
             <table id="preset-table">
                 <thead>
                     <tr>
-                        <th>Sortieren</th>
+                        <th></th>
                         <th>Name</th>
                         <th>URL</th>
-                        <th>Löschen</th>
+                        <th></th>
                     </tr>
                 </thead>
-                <tbody id="sortable-tbody">
-                    <!-- Presets werden hier dynamisch eingefügt -->
-                </tbody>
+                <tbody id="sortable-tbody"></tbody>
             </table>
+        
             <div class="button-container">
-            <button onclick="addPreset()">Neuer Sender hinzufügen</button>
-            <button onclick="exportPreset()">Presets exportieren</button>
-            <button onclick="importPreset()">Presets importieren</button>
+                <button onclick="addPreset()">Neuer Sender hinzufügen</button>
+                <a href="https://fmstream.org" target="_blank" class="find-sender-link"><i class="fas fa-search"></i> Sender auf fmstream.org suchen</a>
             </div>
+
+            <div class="share-details">
+                <h3>Sender importieren / exportieren</h3>
+                <div class="share-content">
+                    <div class="share-section">
+                        <h4>Importieren (Base64-Code oder JSON-Datei)</h4>
+                        <div class="input-group">
+                            <input type="text" id="import-string-field" placeholder="Base64-Code einfügen...">
+                            <button onclick="importFromString()"><i class="fas fa-paste"></i></button>
+                            <button onclick="importPreset()" title="JSON Upload"><i class="fas fa-file-upload"></i> JSON</button>
+                        </div>
+                    </div>
+                    <div class="share-section">
+                        <h4>Exportieren (Base64-Code oder JSON-Datei)</h4>
+                        <div class="input-group">
+                            <input type="text" id="export-string-field" readonly placeholder="Code wird generiert...">
+                            <button onclick="copyExportCode()" title="Kopieren"><i class="fas fa-copy"></i></button>
+                            <button onclick="exportPreset()" title="JSON Download"><i class="fas fa-download"></i> JSON</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
             <div class="button-container">
-                <button onclick="closeModal()">Abbrechen</button>
-                <button onclick="saveAndClose()">Speichern</button>
+                <button onclick="closeModal()" class="btn-cancel">Abbrechen</button>
+                <button onclick="saveAndClose()" class="btn-ok">Speichern & Schließen</button>
+            </div>
+        </div>
+    </div>
+    
+    <div id="custom-modal" class="custom-modal hidden">
+        <div class="custom-modal-content">
+            <h3 id="custom-modal-title">Titel</h3>
+            <p id="custom-modal-message">Nachricht</p>
+            <div class="custom-modal-buttons">
+                <button id="custom-modal-cancel" class="btn-cancel hidden">Abbrechen</button>
+                <button id="custom-modal-ok" class="btn-ok">OK</button>
             </div>
         </div>
     </div>
 </body>
-</html>
+</html>
\ No newline at end of file
