1
const IP = 'it-club-nhglwo0kg-ahmad-zarirs-projects.vercel.app';
2
document.addEventListener("DOMContentLoaded", () => {
3
    initializePage();
4
});
5

6
// Initialize the page elements and event listeners
7
function initializePage() {
8
    const showPasswordCheckbox = document.getElementById("show-password");
9
    const emailField = document.getElementById("email");  // Changed from "username" to "email"
10
    const passwordField = document.getElementById("password");
11

12
    // Ensure the password checkbox is unchecked by default
13
    showPasswordCheckbox.checked = false;
14

15
    // Toggle password visibility
16
    showPasswordCheckbox.addEventListener("change", () => {
17
        passwordField.type = showPasswordCheckbox.checked ? "text" : "password";
18
    });
19

20
    // Handle Enter key in the email field
21
    emailField.addEventListener("keypress", (e) => {
22
        if (e.key === "Enter") {
23
            passwordField.focus();
24
        }
25
    });
26

27
    // Handle Enter key in the password field
28
    passwordField.addEventListener("keypress", (e) => {
29
        if (e.key === "Enter") {
30
            login();
31
        }
32
    });
33

34
    // Check for an active session when the page loads
35
    checkSession();
36
}
37

38
// Display the loading screen
39
function showLoading() {
40
    const loadingScreen = document.getElementById("loading-screen");
41
    if (loadingScreen) {
42
        loadingScreen.style.display = "flex";
43
    }
44
}
45

46
// Hide the loading screen
47
function hideLoading() {
48
    const loadingScreen = document.getElementById("loading-screen");
49
    if (loadingScreen) {
50
        loadingScreen.style.display = "none";
51
    }
52
}
53

54
// Handle user login
55
async function login() {
56
    const email = document.getElementById("email").value;  // Changed from "username" to "email"
57
    const password = document.getElementById("password").value;
58
    const message = document.getElementById("message");
59

60
    if (!email || !password) {
61
        displayMessage("Please fill in all fields", "red");
62
        return;
63
    }
64

65
    showLoading();
66

67
    try {
68
        const response = await fetch(`http://${IP}/login`, {
69
            method: "POST",
70
            headers: { "Content-Type": "application/json" },
71
            body: JSON.stringify({ email, password }),  // Send email instead of username
72
            credentials: "include",
73
        });
74

75
        if (!response.ok) {
76
            throw new Error("Failed to authenticate");
77
        }
78

79
        const result = await response.json();
80

81
        if (result.success) {
82
            await loadUserPage(result.user);
83
            displayMessage("Login successful!", "green");
84
        } else {
85
            displayMessage("Invalid email or password", "red");
86
        }
87
    } catch (error) {
88
        displayMessage("An error occurred. Please try again later", "red");
89
    } finally {
90
        hideLoading();
91
    }
92
}
93

94
async function loadUserPage(user) {
95
    console.log("Loading user page for:", user);
96
    showLoading();
97

98
    try {
99
        const response = await fetch(`http://${IP}/user_page`, {
100
            method: "GET",
101
            credentials: "include",
102
        });
103

104
        if (!response.ok) {
105
            console.error("Failed to load user page", response);
106
            throw new Error("Failed to load user page");
107
        }
108

109
        const pageContent = await response.text();
110
        document.body.innerHTML = pageContent;  // Replace body content with user page
111

112
        // Ensure user data is inserted after content is loaded
113
        console.log("Populating user data into the page...");
114
        document.getElementById("user-name").textContent = user.name;
115
        document.getElementById("user-id").textContent = user.id;
116
    } catch (error) {
117
        console.error("Error loading user page:", error);
118
    } finally {
119
        hideLoading();
120
    }
121
}
122

123
async function checkSession() {
124
    console.log("Checking session...");  // Add logging here
125
    showLoading();
126

127
    try {
128
        const response = await fetch(`http://${IP}/check_session`, {
129
            method: "GET",
130
            credentials: "include",
131
        });
132

133
        const result = await response.json();
134
        console.log("Session check result:", result);  // Log the session check result
135

136
        if (result.success) {
137
            console.log("Session active, loading user page...");
138
            // If session is active, load the user page
139
            await loadUserPage(result.user);
140
        } else {
141
            console.warn("No active session. Displaying login page.");
142
            displayMessage("Please log in.", "red");
143
            hideLoading();
144
        }
145
    } catch (error) {
146
        console.error("Error checking session:", error);
147
    } finally {
148
        hideLoading();
149
    }
150
}
151

152
// Log out the user and clear session data
153
async function logout() {
154
    showLoading();
155

156
    try {
157
        await fetch(`http://${IP}logout`, {
158
            method: "POST",
159
            credentials: "include",
160
        });
161
        localStorage.removeItem("user");
162
        location.reload();
163
    } catch (error) {
164
        console.error("Error logging out:", error);
165
    } finally {
166
        hideLoading();
167
    }
168
}
169

170
// Display a message to the user
171
function displayMessage(text, color) {
172
    const message = document.getElementById("message");
173
    if (message) {
174
        message.style.color = color;
175
        message.textContent = text;
176
    }
177
}