<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=yes"/>
    <link rel="icon" type="image/x-icon" href="/src/img/ico/ico.png">
    <title>Upload</title>
    <style>
        a:link {color: #5e9ca0;background-color: transparent;text-decoration: underline;}
        a:visited {color: #5e9ca0;background-color: transparent;text-decoration: underline;}
        a:hover {color: #5e9ca0;background-color: transparent;text-decoration: underline;}
        a:active {color: #5e9ca0;background-color: transparent;text-decoration: underline;}	
		/* Stil für Dateinamen mit Beschränkung */
		.filename {
		display: inline-block;
		white-space: nowrap; /* Kein Zeilenumbruch */
		overflow: hidden; /* Alles, was nicht reinpasst, wird versteckt */
		text-overflow: ellipsis; /* ... wird angezeigt */
		vertical-align: middle; /* Ausrichtung */}		
    </style>
</head>
<body style="background-color:#161618; color: #f2f5f4;">
<h1 style="color: #5e9ca0; margin-left:5px;"><a title="Startseite" href="https://gaer.cybranceehost.com/">Startseite</a> | <a title="Music" href="https://gaer.cybranceehost.com/music.html">Music</a> | <a title="Upload" href="https://gaer.cybranceehost.com/uploader.php">Upload</a></h1>
<form action="upload.php" method="post" enctype="multipart/form-data" >
	<input type="file" name="file" />
	<input type="submit" value="Upload" />
</form>
<p><b>Uploadlimit 10 MB!</b>
<p>&nbsp;</p>
<p><b>Vorhandene Dateien:</b></p>

<?php
	date_default_timezone_set('Europe/Berlin'); // Setze die Zeitzone auf Berlin (Mitteleuropa)

$fileList = glob('upload/*'); // Liste aller Dateien im Ordner
foreach ($fileList as $filename) {
    $path_parts = pathinfo($filename);
    $filesize = filesize($filename); // Größe der Datei in Bytes
    $filesize = round($filesize / 1024 / 1024, 3); // Größe in MB (auf 3 Dezimalstellen gerundet)

    echo '
    <table border="0">
        <tbody>
            <tr>
                <!-- Name der Datei mit Begrenzung und Tooltip -->
                <td style="width: 200px;" title="', htmlspecialchars(basename($filename)), '">', 
                    (strlen(basename($filename)) > 23 ? htmlspecialchars(substr(basename($filename), 0, 20) . '...') : htmlspecialchars(basename($filename))), 
                '</td>
                <!-- Spalte für Dateigröße -->
                <td style="width: 65px;">', $filesize, ' MB', '</td>
                <!-- Spalte für Datum -->
                <td style="width: 140px; text-align: right;"">', date("d.m.Y H:i:s", filectime($filename)), '</td>
                <!-- Spalte für Buttons -->
                <td class="button-column">
                    <!-- Download-Button -->
                    <input type="button" onclick="window.location.href = \'https://gaer.cybranceehost.com/', $filename, '\';" value="Download" />
    ';  

    // Delete-Button
    echo '
        <!-- Delete-Button -->
        <form action="delete.php" method="post" style="display:inline;" onsubmit="return confirmDelete()">
            <input type="hidden" name="file_id" value="', htmlspecialchars(basename($filename)), '" />
            <input type="submit" value="Delete" />
        </form>
    ';

	// Wenn die Datei eine `.stl` ist, füge den View-Button hinzu
    if ($path_parts['extension'] === "stl") {
        echo '
            <!-- View-Button für STL-Dateien -->
            <form action="stlviewer.php" method="post" style="display:inline;">
                <input type="hidden" name="file_stl" value="', htmlspecialchars($filename), '" />
                <input type="submit" value="View" />
            </form>
        ';
    }
    echo '
                </td>
            </tr>
        </tbody>
    </table>
    ';
}
?>

 <h1>Notizen</h1>

  <!-- Textfeld -->
  <p id="charCounter">0 / 1000000</p>
<textarea id="sharedText" rows="10" cols="50" placeholder="Text wird geladen..." maxlength="1000000"></textarea>
<br>
<label for="password">Passwort zum Speichern:</label>
<input type="password" id="password" placeholder="Passwort">
<br>
<button onclick="saveText()">Speichern</button>

<p id="status"></p>

<script>
  const sharedText = document.getElementById("sharedText");
  const charCounter = document.getElementById("charCounter");
  const maxSize = 1000000; // Maximale Zeichenanzahl (1 MB)

  // Funktion, um den Zähler zu aktualisieren
  function updateCharCounter() {
    charCounter.textContent = `${sharedText.value.length} / ${maxSize}`;
  }

  // Funktion, um den Text vom Server zu laden
  async function loadText() {
    try {
      const response = await fetch("save_text.php"); // Lade den aktuellen Text
      const text = await response.text();
      sharedText.value = text; // Fülle das Textfeld mit dem geladenen Text
      updateCharCounter(); // Aktualisiere den Zähler nach dem Laden
    } catch (error) {
      document.getElementById("status").textContent = "Fehler beim Laden des Texts.";
    }
  }
  
  // Event-Listener: Zähler aktualisieren, wenn Text eingegeben wird
  sharedText.addEventListener("input", updateCharCounter);

  // Funktion, um den Text zu speichern
  async function saveText() {
    const password = document.getElementById("password").value; // Hole das eingegebene Passwort
    const text = sharedText.value; // Hole den Text aus dem Textfeld

    try {
      const response = await fetch("save_text.php", {
        method: "POST",
        headers: { "Content-Type": "application/x-www-form-urlencoded" },
        body: new URLSearchParams({ password: password, text: text }), // Sende Text und Passwort
      });

      const result = await response.text();
      document.getElementById("status").textContent = result; // Zeige die Antwort des Servers
      if (result.includes("erfolgreich")) {
        loadText(); // Lade den Text neu, um die Änderungen zu bestätigen
      }
    } catch (error) {
      document.getElementById("status").textContent = "Fehler beim Speichern des Texts.";
    }
  }
	
  // Funktion, mit ENTER das Speichern auszulösen
  document.getElementById("password").addEventListener("keydown", function(event) {
    if (event.key === "Enter") {
        event.preventDefault(); // Verhindert das Standardverhalten (z. B. Formular-Submit)
        saveText(); // Ruft die Speicherfunktion auf
    }
  });

  // Lade den Text und aktualisiere den Zähler beim Start
  loadText();

  // Bestätigungsabfrage vor dem Löschen
  function confirmDelete() {
    return confirm("Bist du sicher, dass du diese Datei löschen möchtest?");
  }
</script>
	
<p><b>.stl Viewer:</b></p>
        <input type="file" onchange='stl_viewer.add_model({local_file:this.files[0]});' accept="*.stl"> 
        <div id="stl_cont" style="width:800px;height:800px;margin:0 auto;"></div>
        
        <script src="js/stl_viewer/stl_viewer.min.js"></script>
            
        <script>
            var stl_viewer=new StlViewer ( document.getElementById("stl_cont") );
        </script>
</body>
</html>
