// const lineWithValuePattern = /[a-zA-Z]:/i
//^\s+[a-zA-Z-_]+:\s+["'A-Za-zА-Яа-я&<\{\}\>\[\]§]+|^\s+-\s+["'A-Za-zА-Яа-я&<\{\}\>\[\]§]+
const lineWithValuePattern = /["'].*?["']|["'].*?|.*?["']/i;
//System
const inputEl = document.getElementById("input");
const outputEl = document.getElementById("output");
const collectionInput = document.getElementById("key");
const languageSelector = document.getElementById("language");

//Runtime
let collectionName;
let currentLanguage;
let result = {};
let langCache = {}
//utils
function getArgs(){
    let args = [];
    for(let i = 0; i < argsElement.children.length; i++){
        args[i] = argsElement.children[i].children[0].innerHTML.trim().replace("&lt;", "<").replace("&gt;", ">");
    }
    return args;
}

function buildRegex(args){
    let regex = ""
    for(let i = 0; i < args.length; i++){
        regex += args[i];
        if(i !== args.length-1) regex += "|"
    }
    return new RegExp(regex);
}

function parseResulting(value){
    // console.log(value.match(/['"].*?['"]/i));
    value = value.trim();
    let match = value.match(/^['"].*?['"]$/i)
    if(match != null){
        value = (match+"").substring(1, (match+"").length-1);
    }
    // if(value.match(/['"].*?['"]/i) != null) {
    //     value = (value.match(/^['"].*?['"]$/i)+"").substring(1,);
    // }
    return value;
}

//Handlers
function switchLang(e){
    console.log(e.target.selectedOptions.item(0).value);
    currentLanguage = e.target.selectedOptions.item(0).value;
    if(currentLanguage in langCache) inputEl.value = langCache[currentLanguage];
    else {
        inputEl.value = "";
        inputEl.placeholder = "Please enter a localization for lang " + e.target.selectedOptions.item(0).innerHTML;
    }

    handleInput()
}

function switchCollectionName(e){
    collectionName = e.target.value;
    handleInput();
}

function handleInput() {
    if(!collectionName){
        outputEl.value = "Please enter a Collection Name";
        return;
    }
    if(!currentLanguage){
        outputEl.value = "Waiting for select language";
        return;
    }

    let args = getArgs();
    let lines = inputEl.value.split("\n");
    let argsRegex = buildRegex(args);

    outputEl.value = "";
    langCache[currentLanguage] = "";
    let counter = 0;
    lines.forEach(line => {
        langCache[currentLanguage] += line +"\n";
        if(line.match(lineWithValuePattern) == null){
            outputEl.value += line + "\n";
            return;
        }
        let data = line.includes(":") ? line.split(/:(.*)/s) : line.split(/-(.*)/s);
        let key = line.includes(":") ? data[0] +": " : data[0] +"- ";
        let value = data[1];
        // console.log(data);
        if(args === undefined || args.length === 0 || value.match(argsRegex) == null){
            //No args...
            let locId = collectionName + "_" + counter;
            outputEl.value += key + '\'[lang]' + locId + "[/lang]\'\n"
            // lang[currentLanguage] += key + value +"\n";
            // if(!(locId in data)) result[locId] = {};
            if(!(locId in result)) result[locId] = {};
            result[locId][currentLanguage] = parseResulting(value);
            counter++;
            return;
        }

        let re = /[%<\[<\{]{1}[a-zA-Z_-]+[%>\]\}]{1}/g;
        let locId = collectionName + "_" + counter;
        outputEl.value += key + "'[lang]" +locId+"[args]";
        let m;
        let newVal = value;
        let argNum = 1;
        do {
            m = re.exec(value);
            if (m) {
                if(args.indexOf(m+"") > -1){
                    outputEl.value+= "[arg]" + m + "[/arg]";
                    newVal = newVal.replace(m+"", "%"+argNum);
                    argNum++;
                }
            }
        } while (m);
        if(!(locId in result)) result[locId] = {};
        result[locId][currentLanguage] = parseResulting(newVal);
        outputEl.value += "[/args][/lang]'\n";
        counter++;
    });
}

let dbHost = document.getElementById("db_host")
let dbPort = document.getElementById("db_port")
let dbUser = document.getElementById("db_user")
let dbPass = document.getElementById("db_pass")
let dbBase = document.getElementById("db_base")
let dbPref = document.getElementById("db_prefix")


function loadFromCache(){
    dbHost.value = localStorage.getItem("db_host") != null ? localStorage.getItem("db_host") : "";
    dbPort.value = localStorage.getItem("db_port") != null ? localStorage.getItem("db_port") : "3306";
    dbUser.value = localStorage.getItem("db_user") != null ? localStorage.getItem("db_user") : "";
    dbPass.value = localStorage.getItem("db_pass") != null ? localStorage.getItem("db_pass") : "";
    dbBase.value = localStorage.getItem("db_base") != null ? localStorage.getItem("db_base") : "";
    dbPref.value = localStorage.getItem("db_pref") != null ? localStorage.getItem("db_pref") : "triton_";
}

function reset(){
    langCache = {};
    result = {};
    currentLanguage = undefined;
    collectionName = undefined;

    collectionInput.value = "";
    inputEl.value = "";
    $(inputEl).attr("disabled");
    outputEl.value = "Please enter a Collection Name";
    languageSelector.value = "choose";
}

function saveToCache(){
    localStorage.setItem("db_host", dbHost.value);
    localStorage.setItem("db_port", dbPort.value);
    localStorage.setItem("db_user", dbUser.value);
    localStorage.setItem("db_pass", dbPass.value);
    localStorage.setItem("db_base", dbBase.value);
    localStorage.setItem("db_pref", dbPref.value);
}

function uploadToDB(){
    saveToCache();
    if(!collectionName || !currentLanguage) return;
    const data = {
        "database": {
            "host": dbHost.value === undefined ? "" : dbHost.value,
            "user": dbUser.value === undefined ? "" : dbUser.value,
            "pass": dbPass.value === undefined ? "" : dbPass.value,
            "base": dbBase.value === undefined ? "" : dbBase.value,
            "pref": dbPref.value === undefined ? "" : dbPref.value,
            "port": dbPort.value === undefined ? 3306 : parseInt(dbPort.value)
        },
        "collection": collectionName,
        "data": result
    }

    console.log(JSON.stringify(data));

    $.ajax({
        url: "/index.php",
        method: "POST",
        // dataType: "json",
        data: { data: JSON.stringify(data)},
        success: (data) => {
            let result = JSON.parse(data);
            if(result.success) {
                alert("Successfully saved to database");
            }else {
                alert("Error saving to database <br> " + result.message);
            }
            document.getElementById("btn").innerHTML = "Upload translations to database";
        },
        error: (e, err, err1) => {
            alert("Error saving to database: <br> ");
	    console.log(err);
	    console.log(err1);
            document.getElementById("btn").innerHTML = "Upload translations to database";
        },
        beforeSend: () => { document.getElementById("btn").innerHTML = "Saving to database... Please wait" }
    })
}

handleInput();
loadFromCache();

//Register Listeners
collectionInput.addEventListener("input", switchCollectionName);
languageSelector.addEventListener("change", switchLang)
inputEl.addEventListener("input", handleInput);
document.getElementById("btn").addEventListener("click", uploadToDB)
document.getElementById("reset").addEventListener("click", reset);