checkToken();
signOut();
var param = {}

param["limit"] = 20;

var listSearch = [ "email", "uuid", "search"];
for(var i=0; i<listSearch.length; i++){
  var search = getQuery(listSearch[i]);
  if(search.length > 0){
    document.getElementById("searchUser").value=search;
  }
}

var listQuery = [{"query": "roles", "id":"inputRoles"}, {"query":"status", "id":"inputStatus"}]

for (var i=0; i<listQuery.length; i++){
  var query = getQuery(listQuery[i]["query"]);
  if(query.length > 0){
    
    var listOption = document.querySelectorAll("#"+listQuery[i]["id"]+" option");
    for(var j=0; j<listOption.length; j++){
      if(query == listOption[j].value){
        listOption[j].setAttribute("selected", true);
      }
    }
  }
}


instance.get("users/count",  { withCredentials: true }).then(function(response){
   
    var count = response.data["count"] / param["limit"];
    var reste = response.data["count"] % param["limit"];
    var total = 0;
    if(reste != 0){
      total = Number.parseInt(count) + 1;
    }

    if(total > 1){
      document.getElementById("page").classList.remove("hidden");
      var pageCurrent = getQuery("skip");
      var page = 1;
      if(pageCurrent.length > 0){
        page = Number.parseInt(pageCurrent);
      }

      
      for (var i=0; i<total; i++){
        var liPage = document.querySelectorAll(".page-item")[i+1];
        var cloneLi = liPage.cloneNode(true);
        liPage.after(cloneLi);
        var newPage = i + 2;
        var aPage = document.querySelectorAll(".page-item")[newPage].querySelector("a");
        aPage.text=newPage;
        var newPage = updateParam("page", newpage);
        aPage.href="/html/users.html?"+newPage;
      }
      document.querySelectorAll(".page-item")[page].classList.add("active");
      if(page != 1){
        document.querySelectorAll(".page-item")[0].classList.remove("disabled");
      }
      if(page == total){
        document.querySelectorAll(".page-item")[page].classList.add("disabled");
      }
    }
    

});

param["skip"] = 0;
var pageCurrent = getQuery("skip");
if (pageCurrent.length > 0){
  param["skip"] = Number.parseInt(pageCurrent);
  param["skip"] = param["skip"] - 1;
}

var listQuery = ["search", "id", "roles", "status", "email"];
for (var i=0; i<listQuery.length; i++){
  var query = getQuery(listQuery[i]);
  if(query.length > 0){
    param[listQuery[i]]=query;
  }
}

instance.get("users", {withCredentials: true, params:param}).then(function(response){
  var listData = response.data;
  if(!Array.isArray(listData)){
    var listData = []
    listData.push(response.data);
  }
  if(listData.length > 0 ){
    var listModalButton = ["disable", "enable",  "remove"];

    for (var i=0; i<listModalButton.length; i++){
      document.getElementById(listModalButton[i]+"UserButton").addEventListener("click", function(e){
        var httpMethod = ""
        var httpUrl = "";
        param = {};
        userids= [];
        checkboxList = document.getElementsByClassName("checkboxList");
        for (var j=0; j<checkboxList.length; j++){
          if(checkboxList[j].checked){
            userid = checkboxList[j].getAttribute("userid");
            if (userid.length > 0){
              userids.push(userid);
            }
          }
        }

        param["ids"]=userids;

        switch(e.currentTarget.id){
          case "disableUserButton":
            httpMethod = "delete";
            httpUrl = "users/groups";
            break;
          case "removeUserButton":
            httpMethod = "delete";
            httpUrl = "users/groups?remove=true";
            break;
          default:
            httpMethod = "patch";
            httpUrl = "users/groups";
            break;
        }
        instance({
          method: httpMethod,
          url: httpUrl,
          data:param,
          withCredentials: true
        })
        .then(function(response){
          if(response.status == 200){
            location.href="/html/users.html";        
          }
        })
        .catch(function(error){
          console.log(error);
        });
      });
    }
  }
  for (var i=0; i<listData.length; i++){
    var trTag = document.querySelector("#users tbody tr").cloneNode(true);
    if(i != 0){
      document.querySelector("#users tbody").append(trTag);
    }
    var trAll = document.querySelectorAll("#users tbody tr")
    td = trAll[i].querySelectorAll("td");
    td[0].querySelector("input").setAttribute("userid", listData[i].id)
    td[1].textContent = listData[i].id;
    td[2].textContent = listData[i].username;
    td[3].textContent = listData[i].email;
    td[4].textContent = listData[i].roles;
    var classTd = "";
    switch(listData[i].status){
      case 1:
        classTd = ".activeStatus";
        break;
      case 0:
        classTd = ".disableStatus";
        break;
      case 2:
        classTd = ".confirmStatus";
        break;
      case -1:
        classTd = ".removeStatus";
        break;
      default:
        classTd = ".unknownStatus"
        break;
    }
    td[5].querySelector(".activeStatus").classList.add("hidden");
    td[5].querySelector(classTd).classList.remove("hidden");

    td[6].querySelector("button").setAttribute("userid", listData[i].id)
    
    td[6].querySelector("button").addEventListener("click", function(e){ 
      var id = e.currentTarget.getAttribute("userid");
      location.href="/html/user.html?id="+id;
    });

  }
  document.getElementById("checkboxPrincipal").addEventListener("click", function(e){
    listCheck = document.getElementsByClassName("checkboxList");
    var checkPrincipal = e.currentTarget.checked;
    for (var i=0; i<listCheck.length; i++){
        listCheck[i].checked = checkPrincipal;
    }

  });
});


document.getElementById("addUser").addEventListener("click", function(){
  location.href="/html/adduser.html";
});

document.getElementById("searchUser").addEventListener("keydown", function(ev){
  if(ev.key === "Enter"){
    var param = buildParam("", "");
    location.href="/html/users.html?"+param;
  }
});

document.getElementById("inputStatus").addEventListener("change", function(e){
  var param = buildParam(e, "inputRoles");
  location.href="/html/users.html?"+param;
});

document.getElementById("inputRoles").addEventListener("change", function(e){
  var param = buildParam(e, "inputStatus");
  location.href="/html/users.html?"+param;
});