$(document).ready(function() {
    // Initialize dark mode from localStorage
    var isDarkMode = localStorage.getItem("dark_mode") === 'on';
    if (isDarkMode) {
        document.documentElement.classList.add("dark-mode");
        document.body.classList.add("dark-mode");
        // Change profile icon in h1 to orange if it exists
        var profileIcon = document.querySelector("h1 img");
        if (profileIcon && profileIcon.src.includes("profile_icon-dark.svg")) {
            profileIcon.src = profileIcon.src.replace(/profile_icon-dark\.svg/, "profile_icon-orange.svg");
        }
    }
    
    // Ensure that touch-screens can switch language and access accounts
    $(".current-language").on("click", function(e) {
        e.stopPropagation();
        $(".language-select .dropdown-content").toggleClass("show")
        $(".user-section .dropdown-content").removeClass("show")
        $(".user-link, .login").removeClass("active")
    });
    $(".user-link, .login").on("click", function(e) {
        e.stopPropagation();
        $(".user-section .dropdown-content").toggleClass("show")
        $(".user-link, .login").toggleClass("active")
        $(".language-select .dropdown-content").removeClass("show")
    });
    
    // Close dropdowns when clicking outside
    $(document).on("click", function(e) {
        if (!$(e.target).closest(".language-select, .user-section").length) {
            $(".language-select .dropdown-content").removeClass("show");
            $(".user-section .dropdown-content").removeClass("show");
            $(".user-link, .login").removeClass("active");
        }
    });
    //
    // // ensure mouse hovers remove any overlaying other menus still shown after click
    // $(".current-language").hover(function() {
    //     $(".user-section .dropdown-content").removeClass("show")
    //     $(".user-link, .login").removeClass("active")
    // });
    // $(".user-link, .login").hover(function() {
    //     $(".language-select .dropdown-content").removeClass("show")
    // });

    // Pressing enter in login either takes you to the next field or logs you in
    $(document).on('keypress', '.login-line input', function (e) {
        if(e.which == 13) {
            e.preventDefault();

            if($('#login_email').val() == "") {
                $('#login_email').focus();
            } else if($('#login_password').val() == "") {
                $('#login_password').focus();
            } else {
                login($('#login_email').val(), $('#login_password').val())
            }
        }
    });
})


// JSON API call helper
function jsonApi(url, payload, use_mountpoint=false) {
    const mountpoint = $('meta[name="mountpoint"]').attr('content');
    return $.ajax({
        type: 'POST',
        url: use_mountpoint ? mountpoint + url : url,
        data: JSON.stringify(payload),
        contentType: "application/json",
        dataType: 'json',
        beforeSend: function(request, settings) {
            // Store the invoked URL on the request object that's going to error out if the request fails.
            // This way, the error handlers can get their hands in the actual API URL that was invoked.
            request.url = url
        }
    });
}


function login(email, password) {
    jsonApi('/login-api', {
        'email': email,
        'password': password,
        'in-place': true
    }).then(function(reply) {
        if(reply.reload) {
            window.location.reload(true);
        } else {
            window.location.href = reply.location;
        }
    }).catch(function(reply) {
        var err_message = reply.responseJSON;
        if(typeof err_message == 'undefined') {
            console.log(reply.responseText);
        } else {
            alert(err_message.message)
            console.log(err_message);
        }
    });
    return false;
}


function register(email, password, name, company, language, location) {
    jsonApi('/register-api', {
        'email': email,
        'password': password,
        'name': name,
        'company': company,
        'language': language,
        'location': location,
    }).then(function(reply) {
        if(reply.reload) {
            window.location.reload(true);
        } else {
            window.location.href = reply.location;
        }
    }).catch(function(reply) {
        var err_message = reply.responseJSON;
        if(typeof err_message == 'undefined') {
            console.log(reply.responseText);
        } else {
            alert(err_message.message)
            console.log(err_message);
        }
    });
    return false;
}


function update_password(old_password, new_password) {
    jsonApi('/update-password', {
        'old_password': old_password,
        'new_password': new_password,
    }).then(function(reply) {
        if(reply.success) {
            var language = $(".main").data("language");
            switch(language) {
                case "nl":
                    flash_message("Wachtwoord is aangepast.");
                    break;
                case "de":
                    flash_message("Das Passwort wurde geändert.")
                    break;
                case "en":
                default:
                    flash_message("Password has been changed.")
                    break;
            }
        } else {
            alert("Something went wrong")
        }
    }).catch(function(reply) {
        var err_message = reply.responseJSON;
        if(typeof err_message == 'undefined') {
            console.log(reply.responseText);
        } else {
            alert(err_message.message)
            console.log(err_message);
        }
    });
    return false;
}


function update_info(email, name, company, preferred_language, location) {
    jsonApi('/update-info-api', {
        'email': email,
        'name': name,
        'company': company,
        'preferred_language': preferred_language,
        'location': location,
    }).then(function(reply) {
        if(reply.success) {
            var language = $(".main").data("language");
            switch(language) {
                case "nl":
                    flash_message("Uw gegevens zijn aangepast.");
                    break;
                case "de":
                    flash_message("Ihre Daten wurden angepasst.")
                    break;
                case "en":
                default:
                    flash_message("Your information has been updated.")
                    break;
            }
        } else {
            alert("Something went wrong")
        }
    }).catch(function(reply) {
        var err_message = reply.responseJSON;
        if(typeof err_message == 'undefined') {
            console.log(reply.responseText);
        } else {
            alert(err_message.message)
            console.log(err_message);
        }
    });
    return false;
}


function logout() {
    jsonApi('/logout-api', {
        'in-place': true
    }).then(function(reply) {
        if(reply.reload) {
            window.location.reload(true);
        } else {
            window.location.href = reply.location;
        }
    }).catch(function(reply) {
        // If we get a 403 Forbidden, we are very likely already logged out, so
        // we simply reload in place...
        if(reply.status == 403) {
            window.location.reload(true);
        } else {
            var err_message = reply.responseJSON;
            if(typeof err_message == 'undefined') {
                console.log(reply.responseText);
            } else {
                alert(err_message.message)
                console.log(err_message);
            }
        }
    });
    return false;
}


function password_reset(email) {
    jsonApi('/reset-api', {
        'email': email,
    }).then(function(reply) {
        if(reply.reload) {
            window.location.reload(true);
        } else {
            window.location.href = reply.location;
        }
    }).catch(function(reply) {
        var err_message = reply.responseJSON;
        if(typeof err_message == 'undefined') {
            console.log(reply.responseText);
        } else {
            alert(err_message.message)
            console.log(err_message);
        }
    });
    return false;
}


function flash_message(message) {
    var flash_entry = $("<div></div>").addClass("flash-entry");
    flash_entry.html(message);
    $(".flash-location").append(flash_entry)
    setTimeout(function() { flash_entry.fadeOut(1500); }, 5000)
}