File size: 5,048 Bytes
1e7308f
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
class Logger {
    static isDebugMode = false;

    static debug(message, data = null) {
        if (this.isDebugMode) {
            console.log(`[Debug] ${message}`, data || '');
        }
    }

    static error(message, error = null) {
        console.error(`[Error] ${message}`, error || '');
    }

    static initializeDebugMode() {
        try {
            const urlParams = new URLSearchParams(window.location.search);
            this.isDebugMode = urlParams.has('debug');
        } catch (error) {
            console.error('Fehler beim Initialisieren des Debug-Modus:', error);
            this.isDebugMode = false;
        }
    }
}

const utils = {
    showLoading() {
        if (document.body) {
            document.body.classList.add('loading');
            Logger.debug('Loading-Status aktiviert');
        } else {
            Logger.error('document.body nicht verfügbar');
        }
    },

    hideLoading() {
        if (document.body) {
            document.body.classList.remove('loading');
            Logger.debug('Loading-Status deaktiviert');
        } else {
            Logger.error('document.body nicht verfügbar');
        }
    },

    safeGetElement(id) {
        const element = document.getElementById(id);
        if (!element) {
            Logger.error(`Element mit ID '${id}' nicht gefunden`);
            return null;
        }
        return element;
    },

    async withLoading(asyncFn) {
        try {
            this.showLoading();
            await asyncFn();
        } finally {
            this.hideLoading();
        }
    }
};

class BackendManager {
    constructor() {
        this.selectedItems = new Set();
        this.initializeEventListeners();
    }

    initializeEventListeners() {
        // Event-Listener für Dark Mode Toggle
        const darkModeToggle = document.getElementById('darkModeToggle');
        if (darkModeToggle) {
            darkModeToggle.addEventListener('click', () => this.toggleDarkMode());
        }

        // Event-Listener für Aktualisieren-Button
        const refreshButton = document.querySelector(".btn-primary[onclick='refreshData()']");
        if (refreshButton) {
          refreshButton.addEventListener("click", () => {
            this.refreshData();
          });
        }
    }

    toggleDarkMode() {
        document.body.classList.toggle('dark-mode');
        const isDarkMode = document.body.classList.contains('dark-mode');
        localStorage.setItem('darkMode', isDarkMode);

        // Aktualisiere das Icon
        const icon = document.querySelector('#darkModeToggle i');
        if (isDarkMode) {
            icon.classList.remove('bi-moon');
            icon.classList.add('bi-sun');
        } else {
            icon.classList.remove('bi-sun');
            icon.classList.add('bi-moon');
        }
    }

    async updateStats() {
        try {
            const response = await fetch('/backend/stats');
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            const stats = await response.json();
            console.log("Stats from backend:", stats);

            // Aktualisiere die Statistik-Anzeige
            document.getElementById('totalImages').textContent = stats.total_images;
            document.getElementById('totalAlbums').textContent = stats.albums.total;
            document.getElementById('totalCategories').textContent = stats.categories.total;
            document.getElementById('storageUsage').textContent = `${(stats.storage_usage_mb).toFixed(2)} MB`;

        } catch (error) {
            console.error('Fehler beim Laden der Statistiken:', error);
        }
    }

    async refreshData() {
        try {
            await this.updateStats();
            this.showToast('Erfolg', 'Daten erfolgreich aktualisiert', 'success');
        } catch (error) {
            this.showToast('Fehler', 'Fehler beim Aktualisieren der Daten', 'danger');
        }
    }

    showToast(title, message, type = 'info') {
        const toast = document.getElementById('toast');
        const toastTitle = document.getElementById('toastTitle');
        const toastMessage = document.getElementById('toastMessage');

        toast.classList.remove('bg-success', 'bg-danger', 'bg-info', 'bg-warning');
        toast.classList.add(`bg-${type}`);
        toastTitle.textContent = title;
        toastMessage.textContent = message;

        const bsToast = new bootstrap.Toast(toast);
        bsToast.show();
    }
}

// Initialisierung
document.addEventListener('DOMContentLoaded', () => {
    new BackendManager();
    updateStatistics(); // Statistiken beim Laden der Seite abrufen

    // Dark Mode aus localStorage wiederherstellen, falls vorhanden
    if (localStorage.getItem('darkMode') === 'true') {
        document.body.classList.add('dark-mode');
        const icon = document.querySelector('#darkModeToggle i');
        if (icon) {
            icon.classList.remove('bi-moon');
            icon.classList.add('bi-sun');
        }
    }
});