'use strict';

function add_chips() {
        const selected = document.getElementById('selected-skills')
        let newVal = selected.value != "" ? selected.value.split(',') : []
        const skill = document.getElementById('skills')
        if (!newVal.includes(skill.value)) {
                document.getElementById('skill-selected').innerHTML += `<span>${skill.value} <span name="${skill.value}" onClick="removeChip(this)"> ✖ </span></span>`
                newVal.push(skill.value)
                selected.value = newVal.join(",")
        }
        skill.value = ""
}

function removeChip(elm) {
        const chipName = elm.getAttribute('name')
        const selected = document.getElementById('selected-skills')
        let newVal = selected.value.split(',')
        newVal = newVal.filter(ele => ele != chipName)
        selected.value = newVal.join(",")
        elm.parentNode.remove()
}
let fileInputBtns = 1;
function addMoreFileInput() {
        if (fileInputBtns <= 4)
                document.getElementById('file-wrp').children[fileInputBtns].classList.remove('d-none')
        fileInputBtns++
}

function setFileLabel(elm) {
        elm.parentNode.children[1].innerHTML = elm.files[0].name
}

$('a.jq-confrm-edit').confirm({
        title: 'Confirm !',
        content: 'Want to EDIT this ?',
        buttons: {
                Edit: {
                        btnClass: 'btn-blue',
                        action: function () {
                                location.href = this.$target.attr('href');
                        }
                },
                cancel: function () {

                },
        }
});

$('.jq-confrm-del').confirm({
        title: 'Confirm !',
        content: 'Want to DELETE this ?',
        buttons: {
                Delete: {
                        btnClass: 'btn-danger',
                        action: function () {
                                location.href = this.$target.attr('href');
                        }
                },
                cancel: function () {

                },
        }
});

$('.jq-confirm-bid').on('click', function (e) {
        //  e.preventDefault()
        e.stopPropagation()
        $.confirm({
                title: 'Confirm !',
                content: 'Want to Hire this worker ?',
                buttons: {
                        Hire: {
                                btnClass: 'btn-success',
                                action: function () {
                                        $('#bid-form').submit();
                                }
                        },
                        cancel: function () {
                        },
                }
        });
})

$('.jq-confirm-give-paid').confirm({
        title: 'Confirm !',
        content: 'Want to GIVE PAID ?',
        buttons: {
                Yes: {
                        btnClass: 'btn-success',
                        action: function () {
                                location.href = this.$target.attr('href');
                        }
                },
                No: function () {

                },
        }
});


function send_chat() {
        let chat = document.getElementById('chat')
        if (chat.innerHTML != "" && chat.innerHTML != " ") {
                console.log(chat.innerHTML);
                let hiredId = document.getElementById('hired_id').value
                let recentChat = document.getElementById('recent_chat')
                recentChat.innerHTML = `
                <div class="row mt-2">
                <div class="col-12 col-md-6">
                <div class="d-flex align-items-center">
                        <img class="bid-profile-img" src="${window.location.origin}/app-assets/images/members/avater_4.png"
                        alt="profile image">
                        <div class="d-flex" style="flex-direction:column">
                        &nbsp; You
                        <small class="text-gray ">&nbsp; Client</small>
                        </div>
                </div>
                <div class="border20 bg-white p-2">${chat.innerHTML.trim()}</div>
                </div>
                </div>` + recentChat.innerHTML;

                axios.post('/chat-save', {
                        chat: chat.innerHTML,
                        hiredId: hiredId
                })
                chat.innerHTML = ""
        }
}

if(document.getElementById('send-btn')!=null){
document.getElementById('send-btn').addEventListener('click', () => {
        send_chat()
})}

if(document.getElementById('chat')!=null)
document.getElementById('chat').addEventListener('keydown', e => {
        if (e.keyCode === 13 && e.shiftKey === false) {
                //e.preventDefault()
                // document.execCommand('insertHTML', false, '<br>');
                //e.target.innerHTML += '<br><br>'  
        }
        else if (e.keyCode === 13 && e.shiftKey === true) {
                e.preventDefault()
                send_chat()
        }
})