(() => {
    var upBtn = $('#article_vote_up');
    var downBtn = $('#article_vote_down');
    var voteCountLabel = $('#vote_count_label');

    async function linkClicked(e) {
        const articleId = e.target.getAttribute("article-id");
        const vc = e.target.getAttribute("vc");
        const uv = e.target.getAttribute('uv');
        if(localStorage.getItem("vote")) {
                return;
        }
        
        const id = e.target.id;
        $(`#${id}`).toggleClass('article-vote-controls__item--voted');
        let headers = new Headers();
        headers.append("Content-Type", "application/x-www-form-urlencoded");
        let urlencoded = new URLSearchParams();
        urlencoded.append('vote', id);
        urlencoded.append('articleId', articleId);
        urlencoded.append('vc', vc);
        urlencoded.append('uv', uv);

        const requestOptions = {
            method: 'POST',
            headers: headers,
            body: urlencoded,
        }

        try {
            const data = await fetch(window.location.href, requestOptions);
            const label = await data.text();
            if(label && label != "false") {
                voteCountLabel.html(label);
            }
            localStorage.setItem("vote", articleId);
        } catch (error) {
            console.log(error)
            return;
        }
    }

    upBtn.click(linkClicked);
    downBtn.click(linkClicked);
})()