code-server-2/packages/web/src/index.ts

48 lines
1.3 KiB
TypeScript

import { logger, field, time } from "@coder/logger";
import { load } from "@coder/vscode";
import "./index.scss";
const loadTime = time(2500);
logger.info("Loading IDE");
const overlay = document.getElementById("overlay");
const logo = document.getElementById("logo");
const msgElement = overlay
? overlay.querySelector(".message") as HTMLElement
: undefined;
if (overlay && logo) {
overlay.addEventListener("mousemove", (event) => {
const xPos = ((event.clientX - logo.offsetLeft) / 24).toFixed(2);
const yPos = ((logo.offsetTop - event.clientY) / 24).toFixed(2);
logo.style.transform = `perspective(200px) rotateX(${yPos}deg) rotateY(${xPos}deg)`;
});
}
load().then(() => {
if (overlay) {
overlay.style.opacity = "0";
overlay.addEventListener("transitionend", () => {
overlay.remove();
});
}
}).catch((error: Error) => {
logger.error(error.message);
if (overlay) {
overlay.classList.add("error");
}
if (msgElement) {
const button = document.createElement("div");
button.className = "reload-button";
button.innerText = "Reload";
button.addEventListener("click", () => {
location.reload();
});
msgElement.innerText = `Failed to load: ${error.message}.`;
msgElement.parentElement!.appendChild(button);
}
}).finally(() => {
logger.info("Load completed", field("duration", loadTime));
});