GameTrack

GameTrack er en webapp til at holde styr på din personlige spilsamling og spillehistorik. Applikationen giver dig mulighed for at kategorisere spil efter status, organisere dem efter platform, og holde styr på dine fremskridt.

Bemærk: Dette er den originale version af GameTrack. En nyere Vue.js-baseret version er nu tilgængelig på https://github.com/Mikkelka/gametracker-v2-vueJS.

✨ Funktioner

• Kategorisering: Organiser dine spil i seks forskellige kategorier (Vil spille, Spiller nu, Gennemført, På pause, Droppet, Ser frem til)
• Platformhåndtering: Tilføj og tilpas platforme med brugerdefinerede farver
• Drag and drop: Nem reorganisering af spil via drag and drop
• Realtidssynkronisering: Automatisk synkronisering med Firebase
• Progressive Web App (PWA): Installérbar app med offline funktionalitet
• Responsivt design: Optimeret til alle enheder
• Brugervenligt interface: Intuitivt design for nem navigation og brug
• Mørkt tema: Behageligt design optimeret til langvarig brug
• Import/Eksport: Sikkerhedskopier og gendan dine data

🛠️ Teknologistack

• Frontend: Vanilla JavaScript (ES6+) med modulariseret kodebase
• Backend/Database: Firebase v10.12.4 (Authentication & Firestore)
• PWA: Service Worker + Web App Manifest
• Styling: Modulær CSS med CSS-variabler og responsive design
• Deployment: Firebase Hosting

🚀 Projektstatus

Dette projekt er nu erstattet af en nyere Vue.js-baseret version, som du kan finde på https://github.com/Mikkelka/gametracker-v2-vueJS. Dette repository bevares til reference og arkiv-formål.

🚀 Installation og Opsætning

Forudsætninger

• Node.js (version 14 eller nyere)
• En Firebase-konto og projekt
• Firebase CLI (valgfrit, til deployment)

Trin-for-trin opsætning

1. Klon repositoriet

   git clone https://github.com/Mikkelka/gametracker-v1.4.git
   cd gametracker-v1.4

2. Installér afhængigheder

   npm install

3. Firebase konfiguration

   • Opret et Firebase-projekt på Firebase Console
   • Aktiver Authentication (Google provider) og Firestore
   • Kopiér din Firebase-konfiguration til public/js/app.js

4. Lokal udvikling

   firebase serve
   # eller brug enhver anden lokal web server
   python -m http.server 8000  # Python
   npx live-server public      # Node.js

5. Deployment til Firebase Hosting

   firebase deploy

💻 Anvendelse

Grundlæggende brug

1. Login: Gå til login-siden og log ind med din Google-konto
2. Tilføj spil: Klik på "+" knappen for at tilføje et nyt spil til din samling
3. Organiser spil: Træk og slip spil mellem forskellige kategorier
4. Platforme: Opret og tilpas platforme med brugerdefinerede farver
5. Søg: Brug søgefunktionen til hurtigt at finde specifikke spil

PWA Installation

Applikationen kan installeres som en native app på din enhed:

• Desktop: Klik på install-ikonet i adresselinjen
• Mobil: Vælg "Tilføj til startskærm" fra browser-menuen

Import/Export funktionalitet

• Export: Download dine data som JSON-backup
• Import: Gendan data fra en tidligere backup

📁 Projektstruktur

public/
├── css/                  # CSS-filer
│   ├── components/       # Komponent-specifik styling
│   ├── layout/           # Layout styling
│   ├── pages/            # Side-specifik styling
│   └── utilities/        # Hjælpe-styling
├── js/                   # JavaScript filer
│   ├── components/       # UI komponenter
│   ├── services/         # Firebase services
│   └── utils/            # Hjælpefunktioner
├── index.html            # Hovedapp
└── login.html            # Login-side

🌟 Hovedfunktionalitet

• Google Authentication: Sikker login med Google-konto
• Drag and Drop Interface: Intuitiv organisering af spil
• Realtidsopdateringer: Ændringer synkroniseres automatisk
• Brugervenligt interface: Intuitiv navigation og interaktion
• Mobile-First Design: Fuldt responsivt brugerinterface

👨‍💻 Udviklernoter

Dette projekt bruger en modulær tilgang til JavaScript og CSS, hvor hver funktionalitet er isoleret i sin egen fil. Denne tilgang gør koden mere vedligeholdbar og lettere at forstå.

Nøglekomponenter:

• Storage Service: Håndterer synkronisering med Firestore
• UI Components: Modulære UI-komponenter som cards, modals og knapper
• Drag and Drop: Håndterer træk-og-slip funktionalitet mellem lister

📄 Licens

Dette projekt kræver en licens. Overvej at tilføje en MIT License eller tilsvarende open source licens.

🤝 Bidrag

Selvom dette projekt er erstattet af en nyere version, er du velkommen til at:

• Rapportere bugs via GitHub Issues
• Foreslå forbedringer
• Bidrage med dokumentation

📞 Kontakt

For spørgsmål eller support, opret venligst et issue på GitHub eller kontakt projektvedligeholderen via GitHub-profilen.