Make client.html and Autotools style input file

code/web/client.html.in

@@ -1,5 +1,5 @@
 <!DOCTYPE html><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">
-<title>__CLIENTBIN__ Emscripten demo</title>
+<title>@CLIENT_NAME@ Emscripten demo</title>
 <style>
 html, body { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; background: rgb(0, 0, 0); display:flex; align-items: center; justify-content: center; }
 canvas { max-width: 100%; max-height: 100%; min-width: 100%; min-height: 100%; object-fit: contain; }
@@ -9,28 +9,28 @@ canvas { max-width: 100%; max-height: 100%; min-width: 100%; min-height: 100%; o
 
 <script type=module>
 // These strings are set in the generated HTML file in the build directory.
-let CLIENTBIN = '__CLIENTBIN__';
-let BASEGAME = '__BASEGAME__';
-let EMSCRIPTEN_PRELOAD_FILE = Number('__EMSCRIPTEN_PRELOAD_FILE__');
+const CLIENT_NAME = '@CLIENT_NAME@';
+const BASEGAME = '@BASEGAME@';
+const EMSCRIPTEN_PRELOAD_FILE = '@EMSCRIPTEN_PRELOAD_FILE@' === 'ON';
 // Detect if it's not the generated HTML file.
-let clientHtmlFallback = (CLIENTBIN === '\_\_CLIENTBIN\_\_');
+let clientHtmlFallback = (CLIENT_NAME === '@'+'CLIENT_NAME@');
 
 // Path or URL containing the client engine .js, .wasm, and possibly .data.
 let enginePath = './';
 // Path or URL containing fs_game directories.
 let dataPath = './';
 // Path or URL for config file that specifies the files to load for each fs_game.
-let configFilename = `./${CLIENTBIN}-config.json`;
+let configFilename = `./${CLIENT_NAME}-config.json`;
 
 // If displaying the unmodified HTML file, fallback to defaults.
 if (clientHtmlFallback) {
-    CLIENTBIN='ioquake3';
+    CLIENT_NAME='ioquake3';
     BASEGAME='baseq3';
-    EMSCRIPTEN_PRELOAD_FILE=0;
+    EMSCRIPTEN_PRELOAD_FILE=false;
     configFilename='./client-config.json';
 }
 
-if (window.location.protocol === 'file:') throw new Error(`Unfortunately browser security restrictions prevent loading wasm from a file: URL. This file must be loaded from a web server. The easiest way to do this is probably to use Python\'s built-in web server by running \`python3 -m http.server\` in the top level source directory and then navigate to http://localhost:8000/build/debug-emscripten-wasm32/${CLIENTBIN}.html`);
+if (window.location.protocol === 'file:') throw new Error(`Unfortunately browser security restrictions prevent loading wasm from a file: URL. This file must be loaded from a web server. The easiest way to do this is probably to use Python\'s built-in web server by running \`python3 -m http.server\` in the top level source directory and then navigate to http://localhost:8000/build/debug-emscripten-wasm32/${CLIENT_NAME}.html`);
 
 // First set up the command line arguments and the Emscripten filesystem.
 const urlParams = new URLSearchParams(window.location.search);
@@ -55,7 +55,7 @@ if (clientHtmlFallback) {
     let buildPath = urlParams.get('buildPath');
     if (buildPath && !buildPath.endsWith('/')) buildPath += '/';
     const buildPaths = buildPath ? [buildPath] : ['../../build/debug-emscripten-wasm32/', '../../build/release-emscripten-wasm32/', './'];
-    const scriptPaths = buildPaths.map(buildPath => buildPath + `${CLIENTBIN}_opengl2.wasm32.js`);
+    const scriptPaths = buildPaths.map(buildPath => buildPath + `@CLIENT_BINARY@.js`);
     const scriptResponses = await Promise.all(scriptPaths.map(p => fetch(p, {method: 'HEAD'})));
     const validBuilds = scriptResponses.filter(r => r.ok).length;
     const goodURL = (newPath) => {
@@ -63,7 +63,7 @@ if (clientHtmlFallback) {
         url.searchParams.set('buildPath', newPath);
         return url.toString().replace(/%2f/gi, '/');
     };
-    if (validBuilds === 0) throw new Error(`Didn't find any wasm builds. Run \`emmake make debug\` to build one, or use the buildPath query parameter to specify a directory containing ${CLIENTBIN}_opengl2.wasm32.[js,wasm,data], e.g. ${goodURL('../../build/debug-emscripten-wasm32/')}`);
+    if (validBuilds === 0) throw new Error(`Didn't find any wasm builds. Run \`emmake make debug\` to build one, or use the buildPath query parameter to specify a directory containing @CLIENT_BINARY@.[js,wasm,data], e.g. ${goodURL('../../build/debug-emscripten-wasm32/')}`);
     if (validBuilds > 1) throw new Error(`Found multiple valid builds at the following paths: [${buildPaths.filter((path, i)=>scriptResponses[i].ok)}]. Please specify which one to run by adding a buildPath query parameter to the URL, e.g. ${goodURL(buildPaths.filter((path, i)=>scriptResponses[i].ok)[0])}`);
     const buildIndex = scriptResponses.findIndex(r => r.ok);
 
@@ -73,10 +73,10 @@ if (clientHtmlFallback) {
 
 const dataURL = new URL(dataPath, location.origin + location.pathname);
 
-const configPromise = ( EMSCRIPTEN_PRELOAD_FILE === 1 ) ? Promise.resolve({[BASEGAME]: {files: []}})
+const configPromise = EMSCRIPTEN_PRELOAD_FILE ? Promise.resolve({[BASEGAME]: {files: []}})
   : fetch(configFilename).then(r => r.ok ? r.json() : { /* empty config */ });
 
-const ioquake3 = (await import(enginePath + `${CLIENTBIN}_opengl2.wasm32.js`)).default;
+const ioquake3 = (await import(enginePath + `@CLIENT_BINARY@.js`)).default;
 ioquake3({
     canvas: canvas,
     arguments: generatedArguments.trim().split(/\s+/),