document.getElementById("searchBar").onkeyup = function () {
    searchTabs();
}

// Set click events for tab blocks
document.addEventListener("click", (e) => {
    var target    = (!e.target.className.includes("pTagTitleText")) ? e.target : e.target.parentElement;
    var targetID  = target.id;
    var parentElm = target.parentElement;
    var id        = 0;

    if (targetID == "closeBttn") {
        if (hoverTarget) {
            closeBttnAction(hoverTarget, hoverTarget.id);
        }
    } else if (targetID == "iconElm") {
        setNewTabAction(target, targetID, parentElm, id);
    } else if (targetID == "goTop") {
        window.scrollTo(0,0);
    } else if (targetID == "goBottom") {
        window.scrollTo(0, document.body.scrollHeight);
    } else if (targetID == "goToTab") {
        scrollToView(200);
    } else if (targetID == "newTab") {
        createTab();
    } else if (targetID == "hideTgglBttn") {
        if (hoverTarget) {
            hideSelectedTabAction(hoverTarget, hoverTarget.id);
        }
    } else if (targetID == "hideAllBttn") {
        showHideTabsAction(0)
    } else if (targetID == "showAllBttn") {
        showHideTabsAction(1);
    } else if (targetID == "searchMode") {
        setSearchModeAction(target, targetID, parentElm, id);
    }
});

function closeBttnAction(target, targetID) {
    parentElm = target.parentElement;

    if (target == oldElm) {
        var index = Array.from(parentElm.children).indexOf(target);
        (index - 1 < 0) ? index++ :  index-- ;  // Check what index to chose
        var newElm = parentElm.children[index];

        id = parseInt(newElm.getAttribute("tabID"));
        browser.tabs.update(id, { active: true });
        setOldElm(newElm);
    }

    id = parseInt(target.getAttribute("tabID"));
    browser.tabs.remove(id);
    parentElm.removeChild(target);
    hoverTarget = undefined;
    document.getElementById("tabControls").style.display = "none";
}

function setNewTabAction(target, targetID, parentElm, id) {
    id = parseInt(target.getAttribute("tabID"));
    tabsAction.get(id).then((tab) => {
        browser.windows.update(tab.windowId, {focused: true});
        browser.tabs.update(id, { active: true });
    },id);
    setOldElm(target);
    document.getElementById("tabControls").querySelector("#hideTgglBttn").src = "../icons/eyeOpen.png";
}

function hideSelectedTabAction(target, targetID) {
    parentElm = target.parentElement;
    id        = parseInt(target.getAttribute("tabID"));
    control   = document.getElementById("tabControls").querySelector("#hideTgglBttn");

    if (id != oldElm.getAttribute("tabID")) {
        if (control.src.includes("eyeClosed.png")) {
            target.setAttribute("class", "block");
            control.src  = "../icons/eyeOpen.png";
            unhideSelectedTab(id);
        } else {
            target.setAttribute("class", "block hiddenBGColor");
            control.src  = "../icons/eyeClosed.png";
            hideSelectedTab(id);
        }
    }
}

function setSearchModeAction(target, targetID, parentElm, id) {
    var currentMode = target.getAttribute("searchwindowsmode");
    if (currentMode == "true") {
        // In generateview
        setSearchMode(target, "curent window", "window", false);
    } else {
        setSearchMode(target, "all windows", "windows", true);
    }
    clearNodes(listZone);
}

function setOldElm(target) {
    oldElm.setAttribute("class", "block");
    oldElm = target;
    target.setAttribute("class", "block block-focused");
}

function scrollToView(time) {
    setTimeout(function () {
        // Go to selected and 100px up
        oldElm.scrollIntoView();
        window.scrollBy(0, -100);
    }, time);
}
