# Facebook Post Tracker

Eine Chrome/Firefox-Extension mit Docker-Backend zum Verwalten und Abhaken von Facebook-Beiträgen über mehrere Browser-Profile hinweg.

## Features

- ✅ **Browser-Extension**: Fügt jedem Facebook-Beitrag Tracking-Funktionalität hinzu
- 📊 **Multi-Profile-Support**: Verwalte 5 verschiedene Browser-Profile
- 🌐 **Web-Interface**: Übersicht über alle zu bearbeitenden Beiträge
- 🔄 **Auto-Check**: Beiträge werden automatisch beim Öffnen abgehakt
- 🐳 **Docker-Setup**: Einfaches Backend-Deployment

## Systemarchitektur

```
┌─────────────────┐
│  Browser        │
│  Extension      │◄─────┐
└────────┬────────┘      │
         │               │
         ▼               │
┌─────────────────┐      │
│  Docker Backend │      │
│  (Node.js API)  │      │
│  + SQLite DB    │      │
└────────┬────────┘      │
         │               │
         ▼               │
┌─────────────────┐      │
│  Web Interface  │──────┘
└─────────────────┘
```

## Installation

### 1. Backend starten (Docker)

```bash
# In das Projektverzeichnis wechseln
cd /mnt/c/fb

# Docker Container bauen und starten
docker-compose up -d

# Logs ansehen (optional)
docker-compose logs -f
```

Das Backend läuft nun auf `http://localhost:3000`
Das Web-Interface ist erreichbar unter `http://localhost:8080`

### 2. Browser-Extension installieren

#### Chrome:
1. Öffne `chrome://extensions/`
2. Aktiviere "Entwicklermodus" (oben rechts)
3. Klicke auf "Entpackte Erweiterung laden"
4. Wähle den Ordner `/mnt/c/fb/extension`

#### Firefox:
1. Öffne `about:debugging#/runtime/this-firefox`
2. Klicke auf "Temporäres Add-on laden"
3. Wähle die Datei `/mnt/c/fb/extension/manifest.json`

### 3. Extension konfigurieren

1. Klicke auf das Extension-Icon 📋 in der Browser-Toolbar
2. Wähle dein aktuelles Profil (1-5) aus
3. Klicke auf "Speichern"

## Nutzung

### In der Browser-Extension (auf Facebook):

1. **Beitrag hinzufügen**: Bei jedem Facebook-Beitrag erscheint automatisch ein Tracking-UI
   - Gib die Anzahl ein (1-5), wie viele Profile den Beitrag abhaken sollen
   - Klicke auf "Hinzufügen"
   - Der Beitrag wird automatisch für das aktuelle Profil abgehakt

2. **Beitrag abhaken**: Bei bereits getrackten Beiträgen
   - Siehst du den Status: `X/Y Profile ✓/✗`
   - Klicke auf "Abhaken", wenn noch nicht für dein Profil erledigt

### Im Web-Interface:

1. Öffne `http://localhost:8080`
2. Wähle dein aktuelles Profil aus
3. **Offene Beiträge**: Zeigt alle Beiträge, die noch nicht von allen Profilen abgehakt wurden
4. **Alle Beiträge**: Zeigt alle erfassten Beiträge
5. Klicke auf "Beitrag öffnen & abhaken", um:
   - Den Beitrag in neuem Tab zu öffnen
   - Automatisch für dein Profil abzuhaken

## API-Endpunkte

Das Backend stellt folgende REST-API bereit:

- `GET /api/posts` - Alle Beiträge abrufen
- `GET /api/posts/by-url?url=...` - Beitrag über URL abrufen
- `POST /api/posts` - Neuen Beitrag erstellen
- `POST /api/posts/:id/check` - Beitrag für Profil abhaken
- `POST /api/check-by-url` - Beitrag über URL abhaken
- `DELETE /api/posts/:id` - Beitrag löschen

## Datenbankstruktur

```sql
posts:
  - id (TEXT, PRIMARY KEY)
  - url (TEXT, UNIQUE)
  - title (TEXT)
  - target_count (INTEGER)
  - created_at (DATETIME)

checks:
  - id (INTEGER, PRIMARY KEY)
  - post_id (TEXT, FOREIGN KEY)
  - profile_number (INTEGER)
  - checked_at (DATETIME)
  - UNIQUE(post_id, profile_number)
```

## Docker-Befehle

```bash
# Container starten
docker-compose up -d

# Container stoppen
docker-compose down

# Logs ansehen
docker-compose logs -f

# Container neu bauen
docker-compose build

# Datenbank zurücksetzen (ACHTUNG: Löscht alle Daten!)
docker-compose down -v
```

## Entwicklung

### Backend lokal entwickeln (ohne Docker):

```bash
cd backend
npm install
npm run dev
```

### Extension während Entwicklung neu laden:

- **Chrome**: Gehe zu `chrome://extensions/` und klicke auf das Reload-Symbol
- **Firefox**: Gehe zu `about:debugging` und klicke auf "Neu laden"

## Troubleshooting

### Backend nicht erreichbar

- Prüfe, ob Docker läuft: `docker ps`
- Prüfe die Logs: `docker-compose logs backend`
- Stelle sicher, dass Port 3000 nicht bereits belegt ist

### Extension funktioniert nicht

- Öffne die Browser-Konsole (F12) und prüfe auf Fehler
- Stelle sicher, dass das Backend läuft
- Lade die Extension neu
- Prüfe, ob du auf Facebook.com bist

### CORS-Fehler

- Das Backend hat CORS aktiviert
- Stelle sicher, dass du `http://localhost:3000` verwendest (nicht `127.0.0.1`)

### Icons fehlen in Extension

- Die Extension verwendet Emoji-Icons als Fallback
- Für richtige Icons kannst du PNG-Dateien in den Größen 16x16, 48x48, 128x128 erstellen und in `extension/icons/` ablegen

## Technologie-Stack

- **Backend**: Node.js, Express, SQLite (better-sqlite3)
- **Web-Interface**: Vanilla JavaScript, HTML, CSS
- **Extension**: Manifest V3 (Chrome & Firefox kompatibel)
- **Deployment**: Docker, docker-compose

## Lizenz

MIT