//na klik nekog navbara collapsaj
$("#navbarID, #collaspse_target > div > div > a").on('click', function () {
    $('.navbar-collapse').collapse('hide');
    $(".MyClass > div").css("padding-top", "0.50px");

});
// if ($(window).width() >768)
//provjeri da li je collapse ili ne (mob ili komp)
//kako namistit da kad je vecu od collapsa tj 768px da se ispuni uvjet ????
// if (window.matchMedia('(max-width: 768px)').matches == false)
if ($(window).width() > 768) {
    //hover na navbar
    $('#navbarID, #collaspse_target > div > div > a').on('click', function () {
        $(".MyClass > div").css("padding-top", "0.25px");
        // $(selector).hover(inFunction,outFunction)
        $(".navbar").hover(function () {
            $(this).css("opacity", "1");
            $(".navbar *").css('color', 'white');
            $(this).css("background-color", "#17A2B8");
        }, function () {
            $(this).css("opacity", "0"); //0.5
            $(".navbar *").css('color', '');
            $(this).css("background-color", "");
        });

    });

}

// kosarica toggle MyClass
$(".MyKos").click(function () {
    $(".MyClass").toggle("milliseconds", "swing");
});
//kad se sakrija MyClass ako se pritisne nesto drugo iz navbara pokazi MyClass
$("#navbarID:not(:last-child), #collaspse_target > div > div > a").on('click', function () {
    $(".MyClass").show();
});

var list = [];

function InBasket(target) {
    console.log(target);
    const Ponuda = target.querySelector('h5').textContent;
    const Price = target.querySelector('li').textContent;
    const onlyPrice = Price.split(' ')[0];
    console.log(Ponuda);
    console.log(Price);
    console.log(onlyPrice);
    //alert('U' + ' ' + 'kosarici' + ' ' + 'je' + ' ' + Ponuda + ' ' + 'po' + ' ' + 'cijeni' + ' ' + 'od:' + ' ' + ' ' + Price + ' ' + ':D');

    document.getElementById("Empty").innerHTML = "U kosarici se nalazi:"

    let x = target.innerHTML;
    console.log(x);

    //provjeri jel postoji u kosarici
    let odluka = PostojiliUKosarici(target)

    if (odluka == -1) {
        Dodaj(target);
        return 0;
    }

    //dodaj novi div ( na zadnje misto ide) i u njega spremi x
    $(".BuyKosarica").append("<div>");
    $(".BuyKosarica>div:last-of-type").append(x);

    //$( ".BuyKosarica li:nth-child(2)" ).remove();
    $(".BuyKosarica .MyBtn").remove(); //$(".BuyKosarica .MyBtn").prop("onclick", null).off("click");
    // $(".BuyKosarica .MyBtn").removeAttr("href");  $( ".BuyKosarica .card-text" ).remove();

    //dodaj X
    $(".BuyKosarica > div > h5").attr('id', 'naziv'); //dobro selektira
    let dodaj_spam = `<i class="fas fa-window-close" id="iks" onclick="Remove(this.parentElement.parentElement.parentElement)"></i> `;
    console.log(dodaj_spam);
    $(".BuyKosarica #naziv:last").append("<spam>"); //radi?
    $(".BuyKosarica #naziv:last > spam ").append(dodaj_spam);

    //dodaj kolicnu
    $(".BuyKosarica li:nth-child(2)").append("<div>");
    let dodaj_div = `<div class="" id="Stanje">
    <p><i class="fas fa-minus-square"
    onclick="Ukloni(this.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement)">
    </i> <spam> 1 </spam> <i class="fas fa-plus-square"
    onclick="Dodaj(this.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement)"></i> </p>
    </div>`
    $(".BuyKosarica li:nth-child(2):last > div ").append(dodaj_div);


    //racunjane cijene
    CountPriceAdd(onlyPrice);

    //racunanje ikone
    CountIconAdd();
}
// $( "li.item-a" )
//   .parentsUntil( ".level-1" )

function Remove(target) {
    console.log(target);
    let Price = target.querySelector('li').textContent;
    const onlyPrice = Price.split(' ')[0];

    let n = target.querySelector('#Stanje > p > spam').textContent;
    console.log(n);

    while (n != 0) {
        CountPriceSub(onlyPrice);
        CountIconSub();
        n--;

    }
    DeleteFromArray(target);

    $(target).remove();


}

function DeleteFromArray(target){
    let i;
    const Ponuda = target.querySelector('h5').textContent;
    console.log(Ponuda);

    console.log(list);


    for (i = 0; i < list.length;)
    {
        if ((list[i].localeCompare(Ponuda))) {
            console.log(list);
            list.splice(i, 1)
            console.log(list);  // Starting at index position 0, remove two elements
            return -1;
        }
        else {
            i++;
        }
    }
}

function Dodaj(target) {
    console.log(target.innerHTML);
    console.log(target);

   let klasa =  target.className;
   console.log(klasa);
   if((klasa=="card-body")==1)
   {
      target = Dohvati(target);
   }
   console.log(target);

    let kolicina = target.querySelector('#Stanje > p > spam').textContent;

    let Price = target.querySelector('li').textContent;
    const onlyPrice = Price.split(' ')[0];
    console.log(onlyPrice);

    kolicina++;
    target.querySelector('#Stanje > p > spam').textContent = kolicina;

    CountIconAdd();
    CountPriceAdd(onlyPrice);
}

function Ukloni(target) {
    console.log(target);

    let kolicina = target.querySelector('#Stanje > p > spam').textContent;
    console.log(kolicina);

    if (kolicina == 1) {
        Remove(target)
    }
    else {
        kolicina--;
        target.querySelector('#Stanje > p > spam').textContent = kolicina;
        let Price = target.querySelector('li').textContent;
        const onlyPrice = Price.split(' ')[0];
        console.log(onlyPrice);

        CountIconSub();
        CountPriceSub(onlyPrice);
    }

}

function PostojiliUKosarici(target) {

    let i;
    const Ponuda = target.querySelector('h5').textContent;
    console.log(Ponuda);

    for (i = 0; i < list.length;) {
        if (list[i] == Ponuda) {
            return -1;
            alert("alo");
        }
        else {
            i++;
        }
    }

    if (i == list.length) {
        list.push(Ponuda);
        console.log(list);
        return 0;
    }

}

function Dohvati(target) {
    console.log(target);
    const Ponuda = target.querySelector('h5').textContent;
    console.log(Ponuda);
    let i = 1;
    let count = 0;
    let j = 10;

    let divBuyKosarica = document.querySelector('#Kosarica > div > div');
    let ime = divBuyKosarica.querySelector('#naziv').textContent;
    let n = divBuyKosarica.childElementCount;
    let child;
    console.log(ime);
    console.log(divBuyKosarica);
    console.log(n);


    while (count != n) {
        if((ime.localeCompare(Ponuda))==1){
         count = n;
       }
        else{
        child = divBuyKosarica.children[i];
        console.log(child);
        ime = child.querySelector('#naziv').textContent;
        console.log(ime);
        i++;
        console.log(i);
        j = 5;
        }
    }

    if(j == 10){
        child = divBuyKosarica.querySelector('div');
    console.log(child);

    }
    console.log(child);

    return child;

}

function CountIconAdd() {
    let Count = document.getElementById("KosNum").textContent;
    console.log(Count);

    Count = parseInt(Count) + 1;
    document.getElementById("KosNum").innerHTML = Count;
}
function CountIconSub() {
    let Count = document.getElementById("KosNum").textContent;
    console.log(Count);

    Count = parseInt(Count) - 1;
    document.getElementById("KosNum").innerHTML = Count;
}
function CountPriceAdd(price) {

    let tmp = document.getElementById("Cijena").textContent;
    console.log(tmp);

    tmp = parseInt(tmp) + parseInt(price);

    document.getElementById("Cijena").textContent = tmp;
    console.log(tmp);

}
function CountPriceSub(price) {

    let tmp = document.getElementById("Cijena").textContent;
    console.log(tmp);

    tmp = parseInt(tmp) - parseInt(price);

    document.getElementById("Cijena").textContent = tmp;
}