// app_cockpit.js
// const socket = io(`http://${window.location.host}`);
const socket = io();
      
function getFormData() {
  return {
    instance:      document.getElementById('instance').value,
    clientId:      document.getElementById('clientId').value,
    clientSecret:  document.getElementById('clientSecret').value,
    username:      document.getElementById('username').value,
    password:      document.getElementById('password').value,
    influxdbToken: document.getElementById('influxdbToken').value
  };
}

function togglePassword(fieldId) {
  const field = document.getElementById(fieldId);
  field.type = field.type === "password" ? "text" : "password";
}

document.getElementById('btnTest').onclick = function() {
  socket.emit("test_cockpit_connection", getFormData());
  const status = document.getElementById('statusMessage');
  status.innerText = "Testing...";
  status.style.color = "#bb86fc";
};

document.getElementById('btnSave').onclick = function() {
  const data = getFormData();
  console.log("Saving data:", data);
  socket.emit("save_cockpit_config", data);
};

socket.on("connect", () => {
  console.log("Connected to server");
  socket.emit("get_current_config", {});
});

socket.on("connect_error", (err) => {
  console.error("Connection error:", err);
});

socket.on("cockpit_response", function(data) {
  const status = document.getElementById('statusMessage');
  status.innerText = data.message;
  status.style.color = data.success ? "#4db6ac" : "#e57373";

  if (data.success && data.redirect) {
    let secondsLeft = 5;
    status.innerText = data.message + " Redirecting in " + secondsLeft + "s...";

    const countdownInterval = setInterval(() => {
      secondsLeft--;
      if (secondsLeft > 0) {
        status.innerText = data.message + " Redirecting in " + secondsLeft + "s...";
      } else {
        clearInterval(countdownInterval);
        window.location.href = "index.html";
      }
    }, 1000);
  }
});

socket.on("current_config_data", function(data) {
  if (data) {
    document.getElementById('instance').value      = data.instance      || "";
    document.getElementById('clientId').value      = data.clientId      || "";
    document.getElementById('clientSecret').value  = data.clientSecret  || "";
    document.getElementById('username').value      = data.username      || "";
    document.getElementById('password').value      = data.password      || "";
    document.getElementById('influxdbToken').value = data.influxdbToken || "";
  }
});