
var loadingPage = ()=>{
    $(".page").css({"display":"none"});
     $("#loading").css({"display":"block"});
}
var loginPage = ()=>{
    $(".page").css({"display":"none"});
    $("#login").css({"display":"block"});
    $(".info").css({"display":"none"});
    $(".logout").css({"display":"none"});
    $(".backToMain").css({"display":"none"});
}
var modal = ($message,$uuid,$type)=>{
    if($type == "hard"){
        $(".button").remove();
        $(".massage").addClass("hardBox");
    }else{
    $(".okay").attr("uuid",$uuid);
    }
    $("#message").html($message);
    $("#popup").css({"display":"block"});
}
var mainPage = (access,date,username,ip)=>{
    var manifestData = chrome.runtime.getManifest();
    var daysCalculator = (date)=>{
        const expirationDate = new Date(date);
        const currentDate = new Date(); 
        const timeDifference = expirationDate - currentDate; 
        var daysRemaining = Math.ceil(timeDifference / (1000 * 60 * 60 * 24)); 
        if(daysRemaining < 0){
            daysRemaining = 0;
        }
        return daysRemaining;
    }
    $(".page").css({"display":"none"});
    $("#main").css({"display":"block"});
    $(".info").css({"display":"block"});
    $(".logout").css({"display":"block"});
    var $tools = JSON.parse(access);
    var $buttons = "";
    var $tabPanel = "";
    var $tabs = [];
    for(var $i=0;$i<$tools.length;$i++){
        $buttons +=  `<button class="cookie btn-tool" data-tab="${$tools[$i].tab}" data-tool="${$tools[$i].slug}"><span class="textonly">${$tools[$i].name}</span><span class="spinner" style="display:none;margin:0px auto;float:none;"></span></button>`;
        $tabs.indexOf($tools[$i].tab) === -1 ? $tabs.push($tools[$i].tab) : "";
        
    }
    for(var $i=0;$i<$tabs.length;$i++){
        $tabPanel += `<li class="nav-item nav-item-seo1">
        <a class="nav-link ${$i == 0 ? "active" : "" }" id="${$tabs[$i]}" data-toggle="tab" href="#seo1-container" role="tab" aria-controls="seo1-container" aria-selected="true">${$tabs[$i]}</a>
    </li>`
    }
    $(".nav-tabs").html($tabPanel);
    $(".tool-container").empty();           // clear before re-render so refresh doesn't duplicate
    $(".graphic").prepend($buttons);
    $(".days").text(daysCalculator(date))
    const progressBar = 100*daysCalculator(date)/30 > 100 ? 100 : Math.floor(100*daysCalculator(date)/30);
    $(".progress-bar").css({"width":`${progressBar}%`});
    $("#info-username").text(username);
    $("#info-ip").text(ip);
    $("#info-version").text(manifestData.version);
    $("#info-exp").text(date);
    $("#info-billing").text("1Month");
    $(".btn-tool").css({"display":"none"});
    $(`.btn-tool[data-tab="${$tabs[0]}"]`).css({"display":"block"});
}
var mainPageDisplayOnly = ()=>{
    $(".page").css({"display":"none"});
    $("#main").css({"display":"block"});
    $(".info").css({"display":"block"});
    $(".logout").css({"display":"block"});
    $(".backToMain").css({"display":"none"});
}
var info = ()=>{
    $(".page").css({"display":"none"});
    $("#info").css({"display":"block"});
    $(".info").css({"display":"none"});
    $(".logout").css({"display":"none"});
    $(".backToMain").css({"display":"block"});
}
$(".cancel").click(function(){
    $("#popup").css({"display":"none"});
});
loadingPage();
// Check for new extension version — runs once on every popup open.
// If the server reports a newer version than what we're running, show
// a banner with a download link.
(function checkForUpdates(){
    fetch("https://panel.esolution.center/api/v1/latestVersion", { cache: "no-store" })
        .then(r => r.json())
        .then(info => {
            const installed = chrome.runtime.getManifest().version;
            const latest = (info.latestVersion || "").trim();
            if (!latest || installed === latest) return;
            // Lexicographic compare works for x.y.z semver as long as parts have <10 digits
            const cmp = installed.split('.').map(Number);
            const lat = latest.split('.').map(Number);
            let isOlder = false;
            for (let i = 0; i < Math.max(cmp.length, lat.length); i++){
                const a = cmp[i]||0, b = lat[i]||0;
                if (a < b) { isOlder = true; break; }
                if (a > b) break;
            }
            if (!isOlder) return;
            const url = info.downloadUrl || "https://esolution.center/superappv2.html";
            const notes = (info.releaseNotes || "").replace(/[<>]/g, "");
            const banner = document.createElement("div");
            banner.style.cssText = "position:sticky;top:0;left:0;right:0;background:#10b981;color:#fff;padding:10px 14px;font-size:13px;z-index:99999;text-align:center;font-weight:600;";
            banner.innerHTML = `Update available: v${installed} → v${latest} &nbsp; <a href="${url}" target="_blank" style="color:#fff;text-decoration:underline;">Download</a>` + (notes ? ` <span style="opacity:.85;font-weight:400">— ${notes}</span>` : "");
            document.body.insertBefore(banner, document.body.firstChild);
        })
        .catch(() => { /* server unreachable — skip silently */ });
})();

chrome.runtime.sendMessage({ to: "background",type:"checkToken" }, function(response) {
    if(response.type == "success"){
    if(response.token == "notDefind"){
        loginPage();
    }else{
        // Render immediately from cached token, then silently refresh from server
        // so any tool added/removed in WHMCS shows up without forcing logout.
        mainPage(response.token.access,response.token.expireTime,response.token.username,response.token.uia);
        chrome.runtime.sendMessage({ to:"background", type:"refreshToken" }, function(r){
            if(r && r.statusCode == 200 && r.token){
                mainPage(r.token.access, r.token.expireTime, r.token.username, r.token.uia);
            }
        });
        // And keep refreshing every 30s while popup is open (admin toggles propagate live)
        setInterval(() => {
            chrome.runtime.sendMessage({ to:"background", type:"refreshToken" }, function(r){
                if(r && r.statusCode == 200 && r.token){
                    mainPage(r.token.access, r.token.expireTime, r.token.username, r.token.uia);
                }
            });
        }, 30000);
    }
}else if(response.type == "error-secure"){
    $extentions = response.extentions[0];
    modal(`For using seotech extension you must Enable this extension:<br> <span>${$extentions}</span>`,"","hard");
}else if(response.type == "error-incognito"){
    modal(`For using seotech extension you must Enable "Allow in Incognito"`,"","hard");  
}else if(response.type == "error-Secureincognito"){
    modal(`For using seotech extension you must Enable "Allow in Incognito" in Seotech Security`,"","hard"); 
}else{
    var $extentions = ""
    for(var $i=0;$i<response.extentions.length;$i++){

        $extentions += ($i+1) == response.extentions.length ? `${$i+1}: ${response.extentions[$i]} ` : `${$i+1}: ${response.extentions[$i]} <br>`
    }
    modal(`for using seotech extension you must disable these extension(s):<br> <span>${$extentions}</span>`,"","hard");
}
   });

$("#username, #password").on("keydown", (e) => {
    if (e.key === "Enter") { e.preventDefault(); $("#login-btn").click(); }
});

$("#login-btn").click(()=>{
    $("#error_wrapper").css({"display":"none"});
    var username = $("#username").val();
    var password =$("#password").val();
    if(username != "" && password != ""){
        loadingPage();
        chrome.runtime.sendMessage({ to: "background",type:"login","username":username,"password":password }, function(response) {
            if(response.statusCode != 200){
            $("#error_wrapper").css({"display":"block"}).text(response.message);
            loginPage();
            }else{
                setTimeout(()=>{
                    window.location.reload();
                },400);  
            }
           });
    }else{
        $("#error_wrapper").css({"display":"block"}).text("Username or Password can not be empty");
    }
});
$(".info").click(function(){
    info();
});
$(".backToMain").click(function(){
    mainPageDisplayOnly();
});
$(".logout").click(function(){
    chrome.runtime.sendMessage({ to: "background",type:"logout" }, function(response) {
        if(response.message == "success"){
            window.location.reload();
        }
        
    });
});
$(document).on('click',".btn-tool",function(){
    var object = $(this);
    object.addClass("buttonloading");
    object.find(".textonly").css({"display":"none"});
    object.find(".spinner").css({"display":"block"});
    var $toolName = $(this).attr("data-tool");
    chrome.runtime.sendMessage({ to: "background",type:"getcookie","tool":$toolName }, function(response) {
        if(response.statusCode == 401){
            modal(response.message,response.uuid);
        }else if(response.statusCode == 444){
            modal(response.message,"","hard");
        }else if(response.statusCode != 200){
            window.location.reload();
        }else{
            object.removeClass("buttonloading");
            object.find(".textonly").css({"display":"block"});
            object.find(".spinner").css({"display":"none"});
        }
    });
});
$(".okay").click(function(){
    chrome.runtime.sendMessage({ to: "background",type:"clearSession","uuid":$(this).attr("uuid")}, function(response) {
        if(response.statusCode == 200){
            setTimeout(()=>{
                window.location.reload();
            },400);  
        }
       });
});
$("body").on('click','.nav-link',function(){
    var id = $(this).attr("id");
$(".nav-link").removeClass("active");
 $(this).addClass("active");
 $(".btn-tool").css({"display":"none"});
 $(`.btn-tool[data-tab="${id}"]`).css({"display":"block"});
});
$("body").on('click','#downloadExtention',function(){
    const URL = $(this).attr("data-pageurl");
    chrome.runtime.sendMessage({ to: "background",type:"openWindowstab","url":URL}, function(response) {});
});
