Skip to content
Snippets Groups Projects
main.js 1.88 KiB
Newer Older
  • Learn to ignore specific revisions
  • Alexis Poyen's avatar
    Alexis Poyen committed
    import * as Home from "/components/home/home.js";
    import * as Users from "/components/users/users.js";
    import * as Client from "/components/clientPage/clientPage.js";
    import * as Banker from "/components/bankerPage/bankerPage.js";
    import * as Login from "/components/login/login.js";
    import * as Navbar from "/components/navbar/navbar.js";
    import { AnimateCSS } from "/services/common/common.js";
    
    const mountPoint = document.getElementById("main");
    const spinner = document.getElementById("spinner");
    let sysInfoInterval;
    
    document.addEventListener("DOMContentLoaded", function() {
      Navbar.mount("navbar");
      window.addEventListener("hashchange", navigate);
      navigate();
    });
    
    async function navigate() {
      clearInterval(sysInfoInterval);
      switch (location.hash) {
        case "#home":
          load(mountPoint, async function() {
            await Home.mount("main");
          });
          break;
        case "#users":
          load(mountPoint, async function() {
            await Users.mount("main");
          });
          break;
        case "#client":
          load(mountPoint, async function() {
            await Client.mount("main");
          });
          break;
          case "#banker":
          load(mountPoint, async function() {
            await Banker.mount("main");
          });
          break;
        case "#login":
          load(mountPoint, async function() {
            await Login.mount("main");
          });
          break;
        default:
          location.hash = "#home";
          break;
      }
    }
    
    async function load(element, domAlteration) {
      AnimateCSS(element, "fadeOut", async function() {
        element.classList.add("is-hidden");
        spinner.classList.remove("is-hidden");
        AnimateCSS(spinner, "fadeIn");
        if (typeof domAlteration === "function") {
          await domAlteration();
          AnimateCSS(spinner, "fadeOut", function() {
            spinner.classList.add("is-hidden");
          });
          element.classList.remove("is-hidden");
          AnimateCSS(element, "fadeIn");
        }
      });
    }