var nodes = [];
var sensors = [];
var index = -1;

var nodeName = document.getElementById("nodeName");
var nodeIP = document.getElementById("nodeIP");
var nodeArch = document.getElementById("nodeArch");
var sensorName = document.getElementById("sensorName");
var addSensor = document.getElementById("addSensor");
var prevNode = document.getElementById("prevNode");
var allDone = document.getElementById("allDone");
var nextNode = document.getElementById("nextNode");
var addNode = document.getElementById("addNode");
var delNode = document.getElementById("delNode");
//var editNode = document.getElementById("editNode");

function displayNetwork(){
    var divNetwork = document.getElementById("network");
    divNetwork.innerHTML = "";
    console.log(nodes.length);
    var firstUl = document.createElement("UL");
    firstUl.setAttribute("class", "list-group");
    for(var i=0;i<nodes.length;i++){
        console.log("SALUT");
        var firstIl = document.createElement("IL");
        firstIl.setAttribute("class", "list-group-item");
        var tempText = document.createTextNode(nodes[i].name);
        firstIl.appendChild(tempText);
        var secondUl = document.createElement("UL");
        secondUl.setAttribute("class", "list-group");
        for(var j=0;j<nodes[i].sensors.length;j++){
            var secondIl = document.createElement("IL");
            secondIl.setAttribute("class", "list-group-item");
            tempText = document.createTextNode(nodes[i].sensors[j].name);
            secondIl.appendChild(tempText);
            secondUl.appendChild(secondIl);
        }
        firstIl.appendChild(secondUl);
        firstUl.appendChild(firstIl);
    }
    divNetwork.appendChild(firstUl);
    //var container = document.getElementsByClassName("container");
    //container.appendChild(divNetwork);
}

function deleteRow(r) {
    var i = r.parentNode.parentNode.rowIndex;
    var name = r.parentNode.parentNode.firstElementChild.innerText;

    function search(array) {
        return array.name === name;
    }

    var idx = sensors.findIndex(search);
    if (idx > -1) {
        sensors.splice(idx, 1);
    }

    document.getElementById("sensorsTable").deleteRow(i);
}

addSensor.addEventListener('click', function() {
    if(sensorName.value !== "") {
        var table = document.getElementById("sensorsTable");
        var row = table.insertRow(0);
        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);
        cell1.innerHTML = sensorName.value;
        cell2.innerHTML = "<button type=\"button\" class=\"close\" aria-label=\"Close\" onclick=\"deleteRow(this)\">\n" +
            "<span aria-hidden=\"true\">&times;</span>\n" +
            "</button>";
        sensors.push({"name": sensorName.value });
        sensorName.value = "";
    }
})

function displayNode(index) {
    clearAll();
    nodeName.value = nodes[index].name;
    nodeIP.value = nodes[index].ip;
    nodeArch.value = nodes[index].arch;
    sensors = nodes[index].sensors.slice(0);
    var table = document.getElementById("sensorsTable");
    for(var i = 0; i < sensors.length; i++) {
        var row = table.insertRow(0);
        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);
        cell1.innerHTML = sensors[i].name;
        cell2.innerHTML = "<button type=\"button\" class=\"close\" aria-label=\"Close\" onclick=\"deleteRow(this)\">\n" +
            "<span aria-hidden=\"true\">&times;</span>\n" +
            "</button>";
    }
}

function clearAll() {
    nodeName.value = "";
    nodeIP.value = "";
    nodeArch.value = "";
    sensorName.value = "";
    sensors.splice(0, sensors.length);
    document.getElementById("sensorsTable").innerHTML = "";
}

addNode.addEventListener('click', function() {
    var node = {
        'name': nodeName.value,
        'ip': nodeIP.value,
        'arch': nodeArch.value,
        'sensors': sensors.slice(0)
    };
    if(node.name === "" || node.ip === "" || node.arch === "" || sensors.length === 0) {
        $("#warningConf").modal();
    }
    else {
        nodes.push(node);
        clearAll();
        index = nodes.length;
    }
    displayNetwork();
})


editNode.addEventListener('click', function() {
    console.log("edit : " + index);
    if(index !== -1 && index !== nodes.length) {
        nodes[index].name = nodeName.value;
        nodes[index].ip = nodeIP.value;
        nodes[index].arch = nodeArch.value;
        nodes[index].sensors = sensors.slice(0);
        clearAll();
        index = nodes.length;
        displayNetwork();
    }
})

delNode.addEventListener('click', function() {
    if(index != nodes.length) {
        nodes.splice(index, 1);
        clearAll();
        index = nodes.length;
    }
})

allDone.addEventListener('click', function() {
    if(nodes.length !== 0) {
        var divNetwork = document.getElementById("network");
        divNetwork.innerHTML = "";
        var xhr = new XMLHttpRequest();
        var url = "/updatenodes";
        xhr.open("POST", url, true);
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                location.reload();
            }
        };
        var data = JSON.stringify(nodes);
        console.log(data);
        xhr.send(data);
    }
})

prevNode.addEventListener('click', function() {
    index--;
    if(index < 0) {
        index = 0;
        //index = nodes.length - 1;
    }
    if(nodes.length != 0) {
        displayNode(index);
    }
    console.log("prev : " + index);
})

nextNode.addEventListener('click', function() {
    index++;
    if(index >= nodes.length) {
        clearAll();
        index = nodes.length;
        //index = 0;
    }
    else if(nodes.length != 0) {
        displayNode(index);
    }
    console.log("next : " + index);
})