var Debug = true; // depreciated

class DBug {
  constructor(debugMode=false) {
    this.Event = null;
    this.Action = null;
    this.Debug = debugMode;
  }

  E(error = "") {
    if (this.Debug) {
      console.error("[" + this.Event + "](" + this.Action + ")<Error>: '" + error + "'");
    }
  }

  V(variable, name="") {
    if (this.Debug) {
      if (name === "") { name = '...'; }
      console.log("[" + this.Event + "](" + this.Action + ")<" + name + ">:'" + variable + "'");
    }
  }

  M(message) {
    if (this.Debug) {
      console.log("[" + this.Event + "](" + this.Action + ")<Message>:'" + message + "'");
    }
  }
}

class API {
  constructor(apiUrl) {
    this.apiUrl = apiUrl;
  }

  Fetch(endpoint) {
    var endpointUrl = this.apiUrl + endpoint;
    return new Promise((resolve, reject) => {
      d.Event = "API";
      d.Action = "Fetch";
      d.V(endpointUrl, "target");
  
      // var returnResponse = [
      //   authentication => "fail",
      //   status => "error",
      //   message => "API Fetch Failed"
      // ];
  
      fetch(endpointUrl)
        .then(httpResponse => {
          if (!httpResponse.ok) {
            throw new Error('Network response was not ok');
          }
          return httpResponse.json();
        })
        .then(response => {
          d.V(JSON.stringify(response, null, 2), "response");
          resolve(response);
        })
        .catch(error => {
          d.E(error);
          reject({
            authentication: "fail",
            status: "error",
            message: error.message
          });
        });
    })
  }

}

var api = new API("api/v1/");
var d = new DBug(true);


// function apiFetch(apiUrl) {
  
// }


function copy() {
  var copyText = document.getElementById("pass");
  var copy = document.getElementById("copy");
  copy.innerHTML = "Copied!";

  copyText.select();
  copyText.setSelectionRange(0, 99999); // For mobile devices

  document.execCommand('Copy');
  //navigator.clipboard.writeText(copyText.value)

  setTimeout(() => {
    copy.innerHTML = "Copy";
  }, 1000)
}

function clearing() {
  var pass = document.getElementById("pass");
  var name = document.getElementById("name");
  var clear = document.getElementById("clear");
  clear.innerHTML = "Cleared!";
  console.log("here")
  pass.value="";
  name.value="";

 
  setTimeout(() => {
    clear.innerHTML = "Clear";
  }, 1000)
}

function login(pageName) {
  var info = document.getElementById("info");
  var lock = document.getElementById("lock");
  var loadingCircle = document.getElementById('loadingCircle');
  
  info.classList.remove('error');

  lock.style.display = 'none'; // Hide the lock SVG
  loadingCircle.style.display = 'block'; // Show the loading circle
  
  var pass = document.getElementById('passkey');
  setTimeout(() => {
    var xhr = new XMLHttpRequest();
    xhr.open('post', 'auth/auth.php', true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.onload = function() {
      if (xhr.status === 200) {
        var logged_in = xhr.responseText;
        if (logged_in) {
          navigateTo(pageName);
          
        } else {
          lock.style.display = 'block';
          loadingCircle.style.display = 'none';

          info.classList.add('error');
          info.innerHTML = 'Invalid Passkey';
            
        }
      }
    }
    xhr.send('passkey=' + pass.value);
  }, 1500);
}

function logout() {
  var info = document.getElementById("info");

  startLoadAnim();
  setTimeout(() => {
    var xhr = new XMLHttpRequest();
    xhr.open('post', 'auth/logout.php', true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.onload = function() {
      if (xhr.status === 200) {
        var response = xhr.responseText;
        if (response) {
          endLoadAnim();
          location.reload()
          info.classList.remove('error');
          info.classList.add('show');
          info.innerHTML = 'Successfully Locked';
        } else {
          endLoadAnim();
          info.classList.add('error');
          info.innerHTML = 'Error Logging Out';
        }
      } else {
        endLoadAnim();
      }
    }
    xhr.send('logout=true');
  }, 1500);
}

function process() {
  var info = document.getElementById("info");
  
  var name = document.getElementById('name');
  var pass = document.getElementById('pass');

  startLoadAnim();
  setTimeout(() => {
    var xhr = new XMLHttpRequest();
    xhr.open('post', '/api/v1/process', true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.onload = function() {
      if (xhr.status === 200) {
        var response = JSON.parse(xhr.responseText);

        if (response.success) {
          endLoadAnim();
          
          info.classList.remove('error');
          info.classList.add('show');
          info.innerHTML = 'Success!';
          pass.value = response.password;
          
        } else {
          endLoadAnim();

          info.classList.add('error');
          info.innerHTML = response.error;

          if (response.error == "Not Authenticated!") {
            navigateTo('/passwords');
          }
            
        } 
      } else {
        endLoadAnim();
      }
    }
    xhr.send('name=' + name.value);
  }, 1500);
}

function startLoadAnim() {
  var spinner = document.getElementById('spinner-anim');
  spinner.style.display = "block";
}

function endLoadAnim() {
  var spinner = document.getElementById('spinner-anim');
  spinner.style.display = "none";
}

// function changePageURL(newPage) {
//   history.pushState(null, null, '/' + newPage);
// }

// window.onload = function() {
//   const pathArray = window.location.pathname.split('/');
//   const pageName = pathArray[1]; // This gets 'home' from the URL path
//   loadModule(pageName);

//   console.log(pageName); // Outputs: home
// };


// function loadModule(name) {
//   var moduleBox = document.getElementById("moduleBox");
//   startLoadAnim();
//   setTimeout(() => {
//     var xhr = new XMLHttpRequest();
//     xhr.open('post', 'modules/load_module.php', true);
//     xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
//     xhr.onload = function() {
//       if (xhr.status === 200) { 
//         console.log(xhr.responseText);
//         var response = JSON.parse(xhr.responseText);
//         if (response.success) {
//           var decodedContent = atob(response.page);
//           moduleBox.innerHTML = decodedContent;
//           var btn = document.getElementById(response.btn + "Btn");
//           btn.classList.add("active-btn")
//         }
        
//         endLoadAnim();
//       } else {
//         endLoadAnim();
//       }
//     }
//     xhr.send('page=' + name);
//   }, 1500);
// }

//======================================================================================


window.onload = () => {
  var path = location.pathname;
  d.Event = "Window";
  d.Action = "onload";
  d.V(path, 'path');
  navigateTo(path);
};

function navigateTo(path) {
  d.Event = "Function";
  d.Action = "navigateTo";
  d.V(path, 'path');

  var oldPage = location.pathname;
  oldPage = oldPage.slice(1);
  history.pushState(null, null, path);
  loadPageContent(path, oldPage); // Assuming path includes the leading '/', slice it off
  
}

function loadPageContent(pageName, oldPage = "search") {
  d.Event = "Function";
  d.Action = "loadPageContent";
  d.V(oldPage, "oldPage");
  if (pageName != oldPage) {
    document.getElementById(oldPage + "Btn").classList.remove("active-btn");
  }
  api.Fetch(`get-content?page=${pageName}`)
  .then(response => {
    // response = [];
    d.Event = "Function";
    d.Action = "loadPageContent";
    var auth = response.authentication;
    var status = response.status;
    var message = response.message;
    
    d.V(auth, 'auth');
    d.V(status, 'status');
    d.V(message, 'message');

    if (auth === 'pass') {
      if (status === 'success') {
        var data = response.data;
        var page = data.page;
        var content = data.content;

        document.getElementById('moduleBox').innerHTML = content; // Update content area with fetched HTML
        
        document.getElementById(page + 'Btn').classList.add("active-btn");
        
      } else {
        document.getElementById('moduleBox').innerHTML = message; // Update content area with fetched HTML
        document.getElementById(page + 'Btn').classList.add("active-btn");
      }
    } else if (auth === 'fail') {
      var data = response.data;
      var page = data.page;
      var content = data.content;

      d.V(page, "page");
      
      document.getElementById(page + 'Btn').classList.add("active-btn");

      document.getElementById('moduleBox').innerHTML = content;
      document.getElementById('loginBtn').onclick = function() {login(page);}

      
    } else {
      d.E("Auth-Fail-Hard");
      document.getElementById('moduleBox').innerHTML = message; 
    }
  }).catch(error => {
    d.E(error);
  })
  
}




// function loadPageContent(pageName) {
//   if (Debug) {
//     console.log("[LoadPageContent-F]: " + pageName);
//   }
//   const token = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VybmFtZSI6ImFiYXJ0b2xvbmUwMDEiLCJleHAiOjE3MTM0NTA2ODd9.y5zrgBJVQnvuILtvsD1Fvd1USRGRu1VwOzvN/niyxYM=";
//   // const token = "eyJ0eXAiOiJKV1QiLCJhbGci.sddgsdfgsdfdsf.BJVQnvuILtvsD1Fvd1USRGRu1VwOzvN/niyxYM=";
//   fetch(`/api/v1/get-content?page=${pageName}`) // Adjust the URL as per your backend setup
//   .then(response => {
//     if (!response.ok) {
//         throw new Error('Network response was not ok');
//     }
//     return response.json(); // Assuming the response is text content (HTML, JSON, etc.)
//   })
//   .then(html => {
//       document.getElementById('moduleBox').innerHTML = html; // Update content area with fetched HTML
//       document.getElementById(pageName + 'Btn').classList.add("active-btn");
//   })
//   .catch(error => {
//       console.error('Error fetching page content:', error);
//       document.getElementById('moduleBox').innerHTML = 'Failed to load page content.';
//   });
// }

document.querySelectorAll('.nav-link').forEach(link => {
  link.addEventListener('click', function(e) {
      e.preventDefault(); // Prevent the link from triggering a page load
      var path = e.target.getAttribute('href'); // Adjust based on your actual URL structure
      navigateTo(path);
      if (Debug) {
        console.log("[NAVLINK-QuerySelecter]: " + path);
      }
  });
});

window.addEventListener('popstate', function() {
  // When the user navigates with back/forward, load the appropriate content
  var path = location.pathname;// Adjust based on your actual URL structure
  d.Event = "Window";
  d.Action = "popstate";
  d.V(path, "path");
  loadPageContent(path);
});

//











/*

  ████╗          █████╗   ████╗   ████╗  ██████╗  ████╗  ████╗
 ██╔═██╗         ██╔═██╗ ██╔═██╗ ██╔═██╗ ╚═██╔═╝ ██╔═██╗   ██║
 ██████║         █████╔╝ ██████║ █████╔╝   ██║   ██║ ██║   ██║
 ██╔═██║         ██╔═██╗ ██╔═██║ ██╔═██╗   ██║   ██║ ██║   ██║
 ██║ ██║ ██████╗ █████╔╝ ██║ ██║ ██║ ██║   ██║    ████╔╝ ██████╗
 ╚═╝ ╚═╝ ╚═════╝ ╚════╝  ╚═╝ ╚═╝ ╚═╝ ╚═╝   ╚═╝    ╚═══╝  ╚═════╝

 */