Update app.js

Co-authored-by: trevor1969 <trevor1969@users.noreply.github.com>

.htaccess

@@ -0,0 +1,38 @@
+# TeeTracker .htaccess Configuration
+# Enable PUT and DELETE methods for the data directory
+# Required for file-based storage to work on Apache servers
+
+<IfModule mod_rewrite.c>
+    RewriteEngine On
+    
+    # Allow PUT and DELETE for data directory
+    RewriteCond %{REQUEST_METHOD} ^(PUT|DELETE)$
+    RewriteCond %{REQUEST_URI} ^/data/ [NC]
+    RewriteRule ^ - [L]
+</IfModule>
+
+# Enable all HTTP methods for the data directory
+<Limit GET POST PUT DELETE OPTIONS>
+    Require all granted
+</Limit>
+
+<LimitExcept GET POST PUT DELETE OPTIONS>
+    Require all denied
+</LimitExcept>
+
+# Set proper MIME types for JSON files
+<IfModule mod_mime.c>
+    AddType application/json .json
+</IfModule>
+
+# Disable caching for data files
+<FilesMatch "\.(json|txt)$">
+    <IfModule mod_expires.c>
+        ExpiresActive Off
+    </IfModule>
+    <IfModule mod_headers.c>
+        Header set Cache-Control "no-cache, no-store, must-revalidate"
+        Header set Pragma "no-cache"
+        Header set Expires 0
+    </IfModule>
+</FilesMatch>

SERVER_SETUP.md

@@ -0,0 +1,193 @@
+# TeeTracker Server Setup
+
+## Problem: Dateispeicherung funktioniert nicht
+
+Die TeeTracker-App versucht, Daten im `data/`-Verzeichnis zu speichern, aber auf den meisten Webservern funktioniert das nicht standardmäßig. Hier sind die Lösungen:
+
+---
+
+## Lösung 1: LocalStorage (Empfohlen für Shared Hosting)
+
+**Funktioniert immer, ohne Server-Konfiguration!**
+
+Die App fällt automatisch auf localStorage zurück, wenn die Dateispeicherung nicht verfügbar ist. 
+- Alle Daten werden im Browser gespeichert
+- Funktioniert auf jedem Webserver
+- Daten sind nur auf dem aktuellen Gerät/Browser verfügbar
+
+**Status prüfen:**
+- Gehe zu "Einstellungen" → "Datenverwaltung"
+- Wenn "Lokaler Modus (localStorage)" angezeigt wird, funktioniert die Dateispeicherung nicht
+- Wenn "Dateispeicherung aktiv" angezeigt wird, funktioniert die Dateispeicherung
+
+---
+
+## Lösung 2: Apache Server (.htaccess)
+
+Falls dein Server Apache verwendet (häufig bei Shared Hosting):
+
+1. **Stelle sicher, dass die `.htaccess`-Datei aktiv ist:**
+   - Die Datei liegt bereits im Hauptverzeichnis
+   - Prüfe, ob `mod_rewrite` aktiviert ist
+   - Kontaktiere deinen Hosting-Anbieter, falls `.htaccess` ignoriert wird
+
+2. **Erlaube PUT und DELETE Methoden:**
+   Die `.htaccess`-Datei enthält bereits die notwendigen Regeln:
+   ```apache
+   <Limit GET POST PUT DELETE OPTIONS>
+       Require all granted
+   </Limit>
+   ```
+
+3. **Setze die richtigen Berechtigungen:**
+   ```bash
+   chmod 755 data/
+   chmod 644 data/.gitkeep
+   ```
+
+4. **Aktiviere die notwendigen Apache-Module:**
+   ```bash
+   a2enmod rewrite
+   a2enmod headers
+   a2enmod expires
+   service apache2 restart
+   ```
+
+---
+
+## Lösung 3: PHP-Backend (Alternative)
+
+Falls dein Server PHP unterstützt, kannst du ein einfaches Backend erstellen:
+
+### 1. Erstelle `save_data.php`:
+```php
+<?php
+header('Content-Type: application/json');
+
+$filename = 'data/' . ($_GET['file'] ?? '');
+$allowed_files = ['teas.json', 'entries.json'];
+
+if (!in_array(basename($filename), $allowed_files)) {
+    http_response_code(403);
+    die(json_encode(['error' => 'Not allowed']));
+}
+
+if ($_SERVER['REQUEST_METHOD'] === 'GET') {
+    if (file_exists($filename)) {
+        readfile($filename);
+    } else {
+        echo '[]';
+    }
+} elseif ($_SERVER['REQUEST_METHOD'] === 'PUT' || $_SERVER['REQUEST_METHOD'] === 'POST') {
+    $data = file_get_contents('php://input');
+    file_put_contents($filename, $data);
+    echo json_encode(['success' => true]);
+} elseif ($_SERVER['REQUEST_METHOD'] === 'DELETE') {
+    if (file_exists($filename)) {
+        unlink($filename);
+    }
+    echo json_encode(['success' => true]);
+}
+```
+
+### 2. Ändere die `LocalFileStorage`-Klasse:
+Ersetze die `fetch()`-Aufrufe durch Aufrufe an dein PHP-Skript.
+
+---
+
+## Lösung 4: Node.js/Express Server
+
+Falls du Node.js verwenden kannst:
+
+```javascript
+const express = require('express');
+const fs = require('fs');
+const path = require('path');
+const app = express();
+
+app.use(express.json());
+app.use(express.static('public'));
+
+// Enable PUT and DELETE for data directory
+app.use('/data', express.raw({ type: '*/*' }));
+
+app.put('/data/:file', (req, res) => {
+    const filePath = path.join(__dirname, 'data', req.params.file);
+    fs.writeFile(filePath, req.body, (err) => {
+        if (err) return res.status(500).send(err.message);
+        res.sendStatus(200);
+    });
+});
+
+app.get('/data/:file', (req, res) => {
+    const filePath = path.join(__dirname, 'data', req.params.file);
+    if (fs.existsSync(filePath)) {
+        res.sendFile(filePath);
+    } else {
+        res.status(404).send('[]');
+    }
+});
+
+app.delete('/data/:file', (req, res) => {
+    const filePath = path.join(__dirname, 'data', req.params.file);
+    if (fs.existsSync(filePath)) {
+        fs.unlink(filePath, (err) => {
+            if (err) return res.status(500).send(err.message);
+            res.sendStatus(200);
+        });
+    } else {
+        res.sendStatus(200);
+    }
+});
+
+app.listen(3000, () => console.log('Server running on port 3000'));
+```
+
+---
+
+## Häufige Probleme und Lösungen
+
+### Problem: "405 Method Not Allowed"
+**Lösung:** Der Server unterstützt PUT/DELETE nicht. Verwende Lösung 2, 3 oder 4.
+
+### Problem: "403 Forbidden"
+**Lösung:** Die Berechtigungen sind falsch. Führe aus:
+```bash
+chmod 755 data/
+chmod 644 data/*
+```
+
+### Problem: "404 Not Found" für data/-Dateien
+**Lösung:** Das `data/`-Verzeichnis existiert nicht oder die Dateien sind nicht hochgeladen.
+
+### Problem: CORS-Fehler
+**Lösung:** Falls du die App von einer anderen Domain lädst, musst du CORS-Header setzen:
+```apache
+Header set Access-Control-Allow-Origin "*"
+Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
+Header set Access-Control-Allow-Headers "Content-Type"
+```
+
+---
+
+## Testen der Dateispeicherung
+
+1. Öffne die Browser-Konsole (F12 → Console)
+2. Gib ein:
+```javascript
+fetch('data/test.txt', { method: 'PUT', body: 'test' })
+  .then(r => r.text())
+  .then(console.log)
+  .catch(console.error);
+```
+3. Wenn du eine erfolgreiche Antwort erhältst, funktioniert die Dateispeicherung
+
+---
+
+## Empfehlung
+
+**Für Shared Hosting:** Verwende einfach localStorage (Lösung 1). Die Daten werden im Browser gespeichert und funktionieren ohne Server-Konfiguration.
+
+**Für eigene Server:** Konfiguriere Apache mit der `.htaccess`-Datei (Lösung 2) oder verwende das PHP-Backend (Lösung 3).
+
+**Für Entwickler:** Verwende den Node.js-Server (Lösung 4) oder einen lokalen Entwicklungsserver wie `python -m http.server`.

data/.gitkeep

@@ -0,0 +1,2 @@
+# This file ensures the data directory exists and is tracked by git
+# TeeTracker stores teas.json and entries.json in this directory