separated web and api, build improvements

wip:
- separate web and api servers.
- script for building static pages.
- building improvements.
- async localisation preloading.

src/modules/build.js

@@ -1,6 +1,7 @@
 import * as esbuild from "esbuild";
 import * as fs from "fs";
-import { languageList } from "../localization/manager.js";
+import { loadLoc, languageList } from "../localization/manager.js";
+
 import page from "./pageRender/page.js";
 
 function cleanHTML(html) {
@@ -10,6 +11,9 @@ function cleanHTML(html) {
 }
 export async function buildFront(commitHash, branch) {
     try {
+        // preload localization files
+        await loadLoc();
+
         // build html
         if (!fs.existsSync('./build/')){
             fs.mkdirSync('./build/');
@@ -17,6 +21,10 @@ export async function buildFront(commitHash, branch) {
             fs.mkdirSync('./build/pc/');
             fs.mkdirSync('./build/mob/');
         }
+        // get rid of old build path
+        if (fs.existsSync('./min')) {
+            fs.rmSync('./min', { recursive: true, force: true });
+        }
         for (let i in languageList) {
             i = languageList[i];
             let params = {
@@ -36,7 +44,7 @@ export async function buildFront(commitHash, branch) {
         // build js & css
         await esbuild.build({
             entryPoints: ['src/front/cobalt.js', 'src/front/cobalt.css'],
-            outdir: 'min/',
+            outdir: 'build/min/',
             minify: true,
             loader: { '.js': 'js', '.css': 'css', },
             charset: 'utf8'

src/modules/buildStatic.js

@@ -0,0 +1,7 @@
+import { buildFront } from "./build.js";
+import { getCurrentBranch, shortCommit } from "./sub/currentCommit.js";
+
+const commitHash = shortCommit();
+const branch = getCurrentBranch();
+
+await buildFront(commitHash, branch);

src/modules/pageRender/elements.js

@@ -89,14 +89,13 @@ export function multiPagePopup(obj) {
         tabs += `<button id="tab-button-${obj.name}-${obj.tabs[i]["name"]}" class="switch tab tab-${obj.name}" onclick="changeTab(event, 'tab-${obj.name}-${obj.tabs[i]["name"]}', '${obj.name}')">${obj.tabs[i]["title"]}</button>`
         tabContent += `<div id="tab-${obj.name}-${obj.tabs[i]["name"]}" class="popup-tab-content tab-content-${obj.name}">${obj.tabs[i]["content"]}</div>`
     }
-    tabs += `<button id="close-button" class="switch tab-${obj.name}" onclick="popup('${obj.name}', 0)" ${obj.closeAria ? `aria-label="${obj.closeAria}"` : ''}>x</button>`
     return `
     <div id="popup-${obj.name}" class="popup center box scrollable" style="visibility: hidden;">
         <div id="popup-content">${obj.header ? `<div id="popup-header" class="popup-header">
         ${obj.header.aboveTitle ? `<a id="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
         ${obj.header.title ? `<div id="popup-title">${obj.header.title}</div>` : ''}
         ${obj.header.subtitle ? `<div id="popup-subtitle">${obj.header.subtitle}</div>` : ''}</div>` : ''}${tabContent}</div>
-        <div id="popup-tabs" class="switches popup-tabs">${tabs}</div>
+        <div id="popup-tabs" class="switches popup-tabs"><div class="switches popup-tabs-child">${tabs}</div><button id="close-button" class="switch tab-${obj.name}" onclick="popup('${obj.name}', 0)" ${obj.closeAria ? `aria-label="${obj.closeAria}"` : ''}>x</button></div>
     </div>`
 }
 export function collapsibleList(arr) {

src/modules/stream/manage.js

@@ -39,7 +39,7 @@ export function createStream(obj) {
         exp = streamInfo.exp;
         ghmac = streamInfo.hmac;
     }
-    return `${process.env.selfURL}api/stream?t=${streamID}&e=${exp}&h=${ghmac}`;
+    return `${process.env.apiURL || process.env.selfURL}api/stream?t=${streamID}&e=${exp}&h=${ghmac}`;
 }
 
 export function verifyStream(ip, id, hmac, exp) {