$(() => {

    //App constants
    const baseUrl = "https://baas.kinvey.com/";
    const appKey = "kid_HkexmJALb";
    const appSecret = "cb9ec67d89fb4796a8a722e43604fa3a";

    setGreeting();
    $('#linkHome').click(() => showView('home'));
    $('#linkLogin').click(() => showView('login'));
    $('#linkRegister').click(() => showView('register'));
    $('#linkBooks').click(() => showView('books'));
    $('#linkCreate').click(() => showView('create'));
    $('#linkLogout').click(logout);


    $('#viewLogin').find('form').submit(login);
    $('#viewRegister').find('form').submit(register);
    $('#viewCreate').find('form').submit(createBook);

    $(document).on({
        ajaxStart: () => $('#loadingBox').show(),
        ajaxStop: () => $('#loadingBox').hide()
    });

    $('#infoBox').click((event) => $(event.target).hide()); // при клик да ни изчезва
    $('#errorBox').click((event) => $(event.target).hide());

    function showInfo(message) {
        $('#infoBox').text(message);
        $('#infoBox').show();
        setTimeout(() => $('#infoBox').fadeOut(), 3000);
    }

    function showError(message) {
        $('#errorBox').text(message);
        $('#errorBox').show();
    }

    function handleError(reason) {
        showError(reason.responseJSON.description);
    }

    function showView(name) {
        $('section').hide();

        switch (name) {
            case 'home':
                $('#viewHome').show();
                break;
            case 'login':
                $('#viewLogin').show();
                break;
            case 'register':
                $('#viewRegister').show();
                break;
            case 'books':
                getBooks();
                $('#viewBooks').show();
                break;
            case 'create':
                $('#viewCreate').show();
                break;
            case 'logout':
                $('#viewLogout').show();
                break;
        }
    }

    function setGreeting() {
        let username = localStorage.getItem('username');
        if (username !== null) {
            $('#loggedInUser').text(`Welcome, ${username}!`);
            $('#linkLogin').hide();
            $('#linkRegister').hide();
            $('#linkBooks').show();
            $('#linkCreate').show();
            $('#linkLogout').show();
        } else {
            $('#loggedInUser').text(``);
            $('#linkLogin').show();
            $('#linkRegister').show();
            $('#linkBooks').hide();
            $('#linkCreate').hide();
            $('#linkLogout').hide();
        }
    }

    function setStorage(data) {
        localStorage.setItem('authtoken', data._kmd.authtoken); //data._kmd.authtoken = token
        localStorage.setItem('username', data.username);  //data.username = username
        localStorage.setItem('userId', data._id);
        $('#loggedInUser').text(`Welcome, ${data.username}!`);
        setGreeting();
        showView('books');

    }

    function login(e) {
        e.preventDefault();
        let username = $('#inputUsername').val();
        let password = $('#inputPassword').val();

        let req = {
            url: baseUrl + 'user/' + appKey + '/login',
            method: 'POST',
            headers: {
                'Authorization': 'Basic ' + btoa(appKey + ":" + appSecret),
                'Content-Type': 'application/json'
            },
            data: JSON.stringify({
                username: username,
                password: password
            }),
            success: (data) => {
                showInfo("Login successful");
                setStorage(data);
            },
            error: handleError
        };

        $.ajax(req);

        // function loginSuccess(data) {
        //     localStorage.setItem('authtoken', data._kmd.authtoken);
        //     localStorage.setItem('username', data.username);
        //     showView('books');
        // }
    }

    function register(e) {
        e.preventDefault();
        let username = $('#inputNewUsername').val();
        let password = $('#inputNewPassword').val();
        let repeat = $('#inputNewPassRepeat').val();

        if(username.length === 0){
            showError("Username cannot be empty!");
            return;
        }

        if(password.length === 0){
            showError("Password cannot be empty!");
            return;
        }

        if (password !== repeat) {
            showError("Passwords don't match");
            return;
        }

        let req = {
            url: baseUrl + 'user/' + appKey,
            method: 'POST',
            headers: {
                'Authorization': 'Basic ' + btoa(appKey + ":" + appSecret),
                'Content-Type': 'application/json'
            },
            data: JSON.stringify({
                username: username,
                password: password
            }),
            success: (data) => {
                showInfo("Register successful");
                setStorage(data);
            },
            error: handleError
        };

        $.ajax(req);

        // function registerSuccess(data) {
        //     localStorage.setItem('authtoken', data._kmd.authtoken);
        //     localStorage.setItem('username', data.username);
        //     showView('books');
        // }
    }

    function logout() {
        let req = {
            url: baseUrl + 'user/' + appKey + '/_logout',
            method: 'POST',
            headers: {
                'Authorization': 'Kinvey ' + localStorage.getItem('authtoken')
            },
            success: (data) => {
                showInfo("Logout successful");
                logoutSuccess(data);
            },
            error: handleError
        };

        $.ajax(req);

        function logoutSuccess(data) {
            localStorage.clear();
            setGreeting();
            showView('home');
        }
    }

    //Catalog
    function getBooks() {
        let req = {
            url: baseUrl + 'appdata/' + appKey + '/books',
            headers: {
                'Authorization': 'Kinvey ' + localStorage.getItem('authtoken'),

            },
            success: displayBooks,
            error: handleError
        };

        $.ajax(req);

        function displayBooks(data) {
            let tbody = $('#viewBooks').find('table').find('tbody');
            tbody.empty();
          for(book of data){
              let actions = '';
              if(book._acl.creator === localStorage.getItem('userId')){
                actions = `<a href="#">[Edit]</a><a href="#">[Delete]</a>`
              }

              let row = $('<tr>');
              row.append(`<td>${book.title}</td>`);
              row.append(`<td>${book.author}</td>`);
              row.append(`<td>${book.description}</td>`);
              row.append(`<td>${actions}</td>`);
              row.appendTo(tbody);
          }
        }
    }

    function createBook() {
        let title = $('#inputNewTitle').val();
        let author = $('#inputNewAuthor').val();
        let description = $('#inputNewDescription').val();


        if(title.length === 0){
            showError("Title cannot be empty!");
            return;
        }

        if(author.length === 0){
            showError("Author cannot be empty!");
            return;
        }

        let req = {
            url: baseUrl + 'appdata/' + appKey + '/books',
            method: 'POST',
            headers: {
                'Authorization': 'Kinvey ' + localStorage.getItem('authtoken')
            },
            data: JSON.stringify({
                title,
                author,
                description
            }),
            success: createSuccess,
            error: handleError
        };
        $.ajax(req);

        function createSuccess(data) {
            console.log(data);
        }
    }

});