No apps yet. Deploy your first image above.
';
+ return;
+ }
+
+ elements.appsList.innerHTML = apps
+ .map((app) => `
+
+
+
+
${app.name}
+
${app.image}
+
Namespace: ${app.namespace}
+ Replicas: ${app.replicas} | Port: ${app.port}
+ URL: ${app.url ? `${app.url}` : "pending"}
+ ${app.last_error ? `Error: ${app.last_error}
` : ""}
+
+
+
+
+
+
+ `)
+ .join("");
+}
+
+async function loadReadiness() {
+ const ready = await api("/readyz", { headers: {} });
+ elements.modePill.textContent = ready.kubernetes_dry_run || ready.terraform_dry_run ? "dry-run" : ready.environment;
+}
+
+async function loadApps() {
+ if (!state.token) {
+ renderApps([]);
+ return;
+ }
+ const apps = await api("/deployments");
+ renderApps(apps);
+}
+
+async function handleAuth(event) {
+ event.preventDefault();
+ const username = elements.username.value.trim();
+ const password = elements.password.value;
+
+ try {
+ if (state.mode === "register") {
+ await api("/auth/register", {
+ method: "POST",
+ body: JSON.stringify({ username, password }),
+ });
+ elements.authMessage.textContent = "Account created. Logging you in...";
+ }
+
+ const login = await api("/auth/login", {
+ method: "POST",
+ body: JSON.stringify({ username, password }),
+ });
+ state.token = login.access_token;
+ localStorage.setItem("cloudforge_token", state.token);
+ setSignedIn(true);
+ elements.authMessage.textContent = "Signed in.";
+ await loadApps();
+ } catch (error) {
+ elements.authMessage.textContent = error.message;
+ }
+}
+
+async function handleDeploy(event) {
+ event.preventDefault();
+ elements.deployMessage.textContent = "Deploying...";
+
+ const payload = {
+ name: document.querySelector("#appName").value.trim(),
+ image: document.querySelector("#image").value.trim(),
+ port: Number(document.querySelector("#port").value),
+ replicas: Number(document.querySelector("#replicas").value),
+ min_replicas: Number(document.querySelector("#minReplicas").value),
+ max_replicas: Number(document.querySelector("#maxReplicas").value),
+ cpu_threshold: Number(document.querySelector("#cpuThreshold").value),
+ env: parseEnvVars(document.querySelector("#envVars").value),
+ };
+
+ if (state.selectedTemplate?.command) {
+ payload.command = state.selectedTemplate.command;
+ }
+
+ if (state.selectedTemplate?.args) {
+ payload.args = state.selectedTemplate.args;
+ }
+
+ const ingressHost = document.querySelector("#ingressHost").value.trim();
+ if (ingressHost) {
+ payload.ingress_host = ingressHost;
+ }
+
+ try {
+ const app = await api("/deployments", {
+ method: "POST",
+ body: JSON.stringify(payload),
+ });
+ elements.deployMessage.textContent = `${app.name} is ${app.status}.`;
+ elements.deployForm.reset();
+ document.querySelector("#port").value = 80;
+ document.querySelector("#replicas").value = 2;
+ document.querySelector("#minReplicas").value = 1;
+ document.querySelector("#maxReplicas").value = 5;
+ document.querySelector("#cpuThreshold").value = 70;
+ elements.templateSelect.value = "";
+ elements.imageSelect.value = "";
+ state.selectedTemplate = null;
+ await loadApps();
+ } catch (error) {
+ elements.deployMessage.textContent = error.message;
+ }
+}
+
+async function handleAppAction(event) {
+ const button = event.target.closest("button[data-action]");
+ if (!button) return;
+
+ const action = button.dataset.action;
+ try {
+ if (action === "status") {
+ const app = await api(`/deployments/${button.dataset.id}`);
+ elements.logsTarget.textContent = app.name;
+ elements.logsOutput.textContent = JSON.stringify(app, null, 2);
+ }
+
+ if (action === "logs") {
+ elements.logsTarget.textContent = `${button.dataset.namespace}/${button.dataset.name}`;
+ const logs = await api(`/logs/${button.dataset.name}?namespace=${button.dataset.namespace}`);
+ elements.logsOutput.textContent = logs.logs;
+ }
+
+ if (action === "delete") {
+ await api(`/deployments/${button.dataset.id}`, { method: "DELETE" });
+ await loadApps();
+ }
+ } catch (error) {
+ elements.logsOutput.textContent = error.message;
+ }
+}
+
+elements.loginTab.addEventListener("click", () => setMode("login"));
+elements.registerTab.addEventListener("click", () => setMode("register"));
+elements.authForm.addEventListener("submit", handleAuth);
+elements.deployForm.addEventListener("submit", handleDeploy);
+elements.templateSelect.addEventListener("change", (event) => applyTemplate(event.target.value));
+elements.imageSelect.addEventListener("change", (event) => applyImage(event.target.value));
+elements.refreshButton.addEventListener("click", loadApps);
+elements.appsList.addEventListener("click", handleAppAction);
+elements.logoutButton.addEventListener("click", () => {
+ state.token = "";
+ localStorage.removeItem("cloudforge_token");
+ setSignedIn(false);
+ renderApps([]);
+});
+
+setSignedIn(Boolean(state.token));
+loadCatalog().catch(() => {});
+loadReadiness().catch(() => {});
+loadApps().catch((error) => {
+ elements.appsList.innerHTML = `