$(()=>{
    let baseUsersUrl = "https://baas.kinvey.com/user/kid_BJk5Bg8db";
    let baseDataUrl = "https://baas.kinvey.com/appdata/kid_BJk5Bg8db";
    let app_key = "kid_BJk5Bg8db";
    let app_secret = "500d08f97c3c4d8aa96418d1de21bcd9";
    setGreeting();
    $('#linkLogout').on('click',logOut);
    let regBtn = $('#viewRegister input[value="Register"]');
    let loginBtn = $('#viewLogin input[value="Login"]');
    let createBtn = $(' #viewCreateAd input[value="Create"]');
    createBtn.on('click', createAdd)
    loginBtn.on('click', logIn);
    regBtn.on('click', registerUser);
    console.log($('main'));
    const app = Sammy('main', function () {
        this.use('Handlebars')
        this.get('#/Home', function(){
            hideSections();
            $('#viewHome').show('slow')
        });
        this.get('#/Login', function(){
            hideSections();
            $('#viewLogin').show('slow')
        });
        this.get('#/Register', function(){
            hideSections();
            $('#viewRegister').show('slow')
        });
        this.get('#/Delete', function(){
            hideSections();
            deletePost();
            $('#viewHome').show('slow')
        });
        this.get('#/Ads', function(){
            hideSections();
            $('#viewAds').show('slow')
        });
        this.get('#/Create', function(){
            hideSections();
            $('#viewCreateAd').show('slow')
        });
        this.get('#/Details', function(){
            hideSections();
            $('#viewCreateAd').show('slow')
        });
        this.get('#/Edit', function(){
            hideSections();
            $('#viewEditAd').show('slow')
        });
    }).run();
    function hideSections(){
        $('section').hide();
    }
    //user stuff
    function logIn(e){
        e.preventDefault();
        let password = $('#viewLogin input[name="passwd"]');
        let username = $('#viewLogin input[name="username"]');
        let obj = {
            url:baseUsersUrl+"/login",
            method:"POST",
            headers:{
                "Authorization":`Basic ${btoa(app_key +":" +app_secret)}:`,
                "Content-Type":'application/json',
            },
            data:JSON.stringify({
                username:username.val(),
                password:password.val(),
            }),
            success:function(res){
                location.hash="#/Ads"
                setUsernameAndAuth(res);
                infoBoxShow('Successfully logged in');
            },
            error:function(err){
                errorBoxShow(err.statusText)
            }
        };

        $.ajax(obj);
        password.val('');
        username.val('');
    }
    function registerUser(e){
        let username = $('#viewRegister input[name="username"]');
        let password = $('#viewRegister input[name="passwd"]');
        let passwordRep = $('#viewRegister input[name="passwdRep"]');
        e.preventDefault()
        if(password.val()!==passwordRep.val()){
            errorBoxShow("Passwords do not match");
        }
        else {
            let obj = {
                url:baseUsersUrl,
                method:"POST",
                headers:{
                    "Authorization":`Basic ${btoa(app_key +":" +app_secret)}:`,
                    "Content-Type":'application/json',
                },
                data:JSON.stringify({
                    username:username.val(),
                    password:password.val(),
                    adverts:""
                }),
                success:function(res){
                    setUsernameAndAuth(res);
                    infoBoxShow('Success');
                    console.log()
                },
                error:function(err){
                    errorBoxShow(err.statusText)
                }
            }
            $.ajax(obj)
        }
        password.val('');
        passwordRep.val('');
        username.val('');
    }
    function logOut(){
        let obj = {
            url:baseUsersUrl+"/_logout",
            method:"POST",
            headers:{
                "Authorization":`Kinvey ${sessionStorage.getItem("authtoken")}`,
                "X-Kinvey-Api-Version":'1',
            },
            success:function(){
                hideSections();
                $('#loggedInUser').text("");
                sessionStorage.clear();
                setGreeting();
                location.hash = "#/Home";
                infoBoxShow('Successfully logged out')
            },
            error:function(err){
                errorBoxShow(err.statusText)
            }
        }
        $.ajax(obj)
    }
    function setUsernameAndAuth(res){
        console.log(res)
        sessionStorage
            .setItem('authtoken', res._kmd.authtoken);
        sessionStorage
            .setItem('username', res.username);
        sessionStorage
            .setItem('id', res._id);
        setGreeting();
    }
    function setGreeting() {
        if (sessionStorage.getItem("username")) {
            $('#ads tr').has("td").remove();
            // console.log($('#viewBooks table'));
            listAds();
            $('#loggedInUser').text("Greetings, " + sessionStorage.getItem("username")).show();
            $('#linkLogout').show();
            $('#linkLogin').hide();
            $('#linkRegister').hide();
            $('#linkListAds').show();
            $('#linkCreateAd').show();
            $('#linkCreateAd').show();
            $('#linkHome').show();
        }
        else {
            //let firstChild = $('#viewBooks tr:has(td)').first();
            //console.log(firstChild);
            $('#linkHome').show();
            $('#linkLogin').show();
            $('#linkRegister').show();
            $('#linkListAds').hide();
            $('#linkCreateAd').hide();
            $('#linkLogout').hide();
        }
    }
    //notifications
    function infoBoxShow(msg){
        let infoBox = $('#infoBox');
        infoBox.text(msg);
        infoBox.show('slow');
        setTimeout(()=>{infoBox.hide()}, 3000)
    }
    function errorBoxShow(msg){
        let errorBox = $('#errorBox');
        errorBox.text(msg);
        errorBox.show('slow');
        setTimeout(()=>{errorBox.fadeOut()}, 3000)
    }
    //Ads
    function createAdd(e){
        e.preventDefault();
        let title = $('#viewCreateAd input[name="title"]');
        let date = $('#viewCreateAd input[name="datePublished"]');
        let description = $('#viewCreateAd textarea[name="description"]');
        let price = $('#viewCreateAd input[name="price"]');
        let obj = {
            url:baseDataUrl+ "/adds",
            method:"POST",
            headers:{
                "Authorization":`Kinvey ${sessionStorage.getItem("authtoken")}`,
                "Content-Type":"application/json"
            },
            data:JSON.stringify({
                title:title.val(),
                date:date.val(),
                description:description.val(),
                price:Number(price.val()).toFixed(2)
            }),
            success: function(res) {
                res.author = sessionStorage.getItem("username");
                res.ownAdd = true;
                console.log(res)
                res.aDelete='<a href="#">[Delete]</a>';
                res.aEdit='<a href="#/Edit">[Edit]</a>';
                $.get('templates/add.html').then((data)=>{
                    let template = Handlebars.compile(data);
                    let finale = $(template(res));
                    console.log(finale)
                    finale.find('a:contains("Delete")').on('click', ()=>{
                        let postId = res._id;
                        let anchor = $(this);
                        let obj = {
                            url:baseDataUrl + `/adds/${postId}`,
                            method:"DELETE",
                            headers:{
                                "Authorization":`Kinvey ${sessionStorage.getItem("authtoken")}`
                            },
                            success: function(){
                                console.log(anchor.parent().parent());
                                anchor.parent().parent().remove();
                                infoBoxShow('Deleted successfully')
                            },
                            error:function(err){
                                errorBoxShow(err.statusText);
                            }
                        };
                        $.ajax(obj);
                    });
                    finale.find('a:contains("Edit")').on('click', (e)=>{sessionStorage.setItem('toEdit', res._id)})
                    $('#viewAds #ads table').append(finale);
                })

                location.hash = "#/Ads";
                //$('//#books table')
                //    .append($("<tr>")
                //        .append($(`<td>${title.val()}</td>>`))
                //        .append($(`<td>${author.val()}</td>>`))
                //        .append($(`<td>${description.val()}</td>>`))
                //        .append($('<td>')
                //            .append($('<a href="#">[Edit]</a>'))
                //            .append($('<a href="#">[Delete]</a>'))));
                infoBoxShow("You; successfully uploaded the book")
            },
            error:(err)=>{
                errorBoxShow(err.statusText)
            }
        };
        $.ajax(obj);
        title.val('');
        date.val('');
        price.val('');
        description.val('');
    }
    function listAds(){
        let obj = {
            url:baseDataUrl+ "/adds",
            method:"GET",
            headers:{
                "Authorization":`Kinvey ${sessionStorage.getItem("authtoken")}`,
            },
            success:loadAds,
            error:(err)=>{
                errorBoxShow(err.statusText)
            }
        };
        $.ajax(obj);
        function loadAds(allAds){
            console.log(allAds);
            for (let ad of allAds) {
                let lastTd = $('<td>');
                if(sessionStorage.getItem('id') == ad._acl.creator){
                    ad.ownAdd = true;
                    ad.author = sessionStorage.getItem('username')
                    ad.aDelete = '<a href="#/Delete">[Delete]</a>';
                    ad.aEdit = '<a href="#/Edit">[Edit]</a>';
                }

                $.get('templates/add.html').then((templateAd)=>{
                    let template = Handlebars.compile(templateAd);
                    $('#viewAds #ads table').append(template(ad));
                })
            }
        }
    }
});