jsgui3-server 0.0.99 → 0.0.100

package/examples/controls/1) window/client.js

@@ -132,7 +132,8 @@ Demo_UI.css = `
 }
 
 body {
-    
+    overflow-x: hidden;
+    overflow-y: hidden;
     background-color: #E0E0E0;
 }
 

package/examples/controls/1) window/server.js

@@ -83,7 +83,8 @@ if (require.main === module) {
 
 
         //'js_mode': 'debug',
-        'src_path_client_js': require.resolve('./client.js')
+        'src_path_client_js': require.resolve('./client.js'),
+        debug: true // should not minify the js, should include the symbols.
         //js_client: require.resolve('./square_box.js')
     });
     // A callback or event for when the bundling has been completed

package/examples/controls/__old/_html-server-color-palette.js

@@ -17,9 +17,9 @@ var jsgui = require('jsgui3-html');
 var Start_Stop_Toggle_Button = jsgui.Start_Stop_Toggle_Button;
 var Color_Palette = jsgui.Color_Palette;
 
-var Server = require('../../server');
+var Server = require('../../../server');
 var port = 8000;
-var Server_Page_Context = require('../../page-context');
+var Server_Page_Context = require('../../../page-context');
 
 var server = new Server({
 	'routes': {

package/package.json

@@ -14,7 +14,7 @@
     "esbuild": "^0.19.4",
     "fnl": "^0.0.29",
     "fnlfs": "^0.0.29",
-    "jsgui3-client": "^0.0.82",
+    "jsgui3-client": "^0.0.84",
     "jsgui3-webpage": "^0.0.6",
     "jsgui3-website": "^0.0.6",
     "lang-tools": "^0.0.17",
@@ -45,5 +45,5 @@
     "type": "git",
     "url": "https://github.com/metabench/jsgui3-server.git"
   },
-  "version": "0.0.99"
+  "version": "0.0.100"
 }

package/publishers/helpers/preparers/static/bundle/Static_Routes_Responses_Webpage_Bundle_Preparer.js

@@ -10,6 +10,13 @@ class Static_Routes_Responses_Webpage_Bundle_Preparer {
 
     constructor(spec = {}) {
 
+        // Probably should be able to operate in debug mode.
+        //   Not minifying the js, and including the js debug symbols / map as well.
+
+        // But something else prepares the bundle....
+
+        //if (spec.debug !== undefined) this.debug = spec.debug;
+
         this.routes_assigner = new Single_Control_Webpage_Server_Static_Routes_Assigner();
 
         // And the uncompressed response buffer(s) assigner....?

package/publishers/http-webpage-publisher.js

@@ -126,6 +126,9 @@ class HTTP_Webpage_Publisher extends HTTP_Webpageorsite_Publisher {
             }
         });
 
+
+        
+
         // But like the website publisher, this would need to bundle the page (JS, CSS, maybe more).
         //   Consider that an SPA may reference images. May not exactly be one page in some ways.
 

package/publishers/http-webpageorsite-publisher.js

@@ -97,6 +97,8 @@ class HTTP_Webpageorsite_Publisher extends HTTP_Publisher {
     constructor(spec) {
         super(spec);
 
+        if (spec.debug !== undefined) this.debug = spec.debug;
+
         // But then some properties to do with the js client(s?) file path.
 
         // This should be fairly simple in terms of making use of the bundler, then providing the server (maybe the router component)
@@ -124,7 +126,9 @@ class HTTP_Webpageorsite_Publisher extends HTTP_Publisher {
 
         // Maybe need a get_ready (async or obs) function....
 
-        this.js_bundler = new JS_Bundler();
+        this.js_bundler = new JS_Bundler({
+            'debug': this.debug || false
+        });
 
 
     }
@@ -156,6 +160,9 @@ class HTTP_Webpageorsite_Publisher extends HTTP_Publisher {
 
         //console.log('src_path_client_js', src_path_client_js);
 
+
+        // The js_bundler may need to operate in 'debug' mode.
+
         const js_bundler_res = await js_bundler.bundle(src_path_client_js);
         // Should also get the CSS from it....
 

package/resources/processors/bundlers/js/esbuild/Advanced_JS_Bundler_Using_ESBuild.js

@@ -21,12 +21,20 @@ class Advanced_JS_Bundler_Using_ESBuild extends Bundler_Using_ESBuild {
     constructor(spec) {
         super(spec);
 
+        if (spec.debug !== undefined) this.debug = spec.debug;
+
         //this.css_extractor = new CSS_Extractor();
 
 
-        this.non_minifying_bundler = new Core_JS_Non_Minifying_Bundler_Using_ESBuild();
+        this.non_minifying_bundler = new Core_JS_Non_Minifying_Bundler_Using_ESBuild({
+            debug: this.debug
+        });
+
+
         this.css_and_js_from_js_string_extractor = new CSS_And_JS_From_JS_String_Extractor();
 
+
+        // Probably don't use that minifying bundler in debug mode.
         this.minifying_js_single_file_bundler = new Core_JS_Single_File_Minifying_Bundler_Using_ESBuild();
 
     }
@@ -59,132 +67,184 @@ class Advanced_JS_Bundler_Using_ESBuild extends Bundler_Using_ESBuild {
                         //console.log('bundle_item', bundle_item);
 
                         if (bundle_item.type === 'JavaScript') {
+
+                            // But in debug mode don't minify it.
+                            //   Maybe create and add the sourcemap here instead....?
+
                             const {text} = bundle_item;
                             // Then use the css and js from js extractor.
 
                             const res_extract_css_and_js_from_js = await css_and_js_from_js_string_extractor.extract(text);
+                            const {css, js} = res_extract_css_and_js_from_js;
 
+                            if (this.debug) {
 
-                            const {css, js} = res_extract_css_and_js_from_js;
+                                // sourcemap: 'inline'
 
-                            const minified_js = await minifying_js_single_file_bundler.bundle(js);
+                                // Don't minify the js.
 
-                            //console.log('minified_js', minified_js);
-                            //console.log('minified_js.length', minified_js.length);
+                                // Make res bundle items that include the CSS and the non-minified JS.
 
-                            // it's an array....
+                                // Including the source map would be better still.
 
-                            if (is_array(minified_js)) {
+                                const res_bundle = new Bundle();
+                                // Add the non-minified JS (as a bundle item object)
 
-                                if (minified_js.length === 1) {
+                                const o_js_bundle_item = {
+                                    type: 'JavaScript',
+                                    extension: 'JS',
+                                    text: js
+                                }
+                                res_bundle.add(o_js_bundle_item);
+                                const o_css_bundle_item = {
+                                    type: 'CSS',
+                                    extension: 'css',
+                                    text: css
+                                }
 
+                                res_bundle.push(o_css_bundle_item);
+                                next(res_bundle);
+                                complete(res_bundle);
 
-                                    // Should put it all in a single res bundle though....
-                                    //   Though merging / concating bundles will be fine too.
 
 
 
-                                    const minified_js_bundle_collection = minified_js[0];
 
-                                    
 
-                                    const o_css_bundle_item = {
-                                        type: 'CSS',
-                                        extension: 'css',
-                                        text: css
-                                    }
 
-                                    minified_js_bundle_collection.push(o_css_bundle_item);
 
+                            } else {
+
+
+                                const minified_js = await minifying_js_single_file_bundler.bundle(js);
 
-                                    // Maybe will provide the class / class instance that processes CSS or SASS/SCSS / whatever else.
+                                //console.log('minified_js', minified_js);
+                                //console.log('minified_js.length', minified_js.length);
 
+                                // it's an array....
 
+                                if (is_array(minified_js)) {
 
-                                    // Could add the extracted CSS here.
+                                    if (minified_js.length === 1) {
 
 
+                                        // Should put it all in a single res bundle though....
+                                        //   Though merging / concating bundles will be fine too.
 
-                                    next(minified_js_bundle_collection);
 
-                                    // But create a CSS bundle item...
 
+                                        const minified_js_bundle_collection = minified_js[0];
 
+                                        
 
+                                        const o_css_bundle_item = {
+                                            type: 'CSS',
+                                            extension: 'css',
+                                            text: css
+                                        }
 
+                                        minified_js_bundle_collection.push(o_css_bundle_item);
 
-                                    // And also the CSS...
 
+                                        // Maybe will provide the class / class instance that processes CSS or SASS/SCSS / whatever else.
 
 
 
+                                        // Could add the extracted CSS here.
 
-                                    complete(minified_js_bundle_collection);
 
 
+                                        next(minified_js_bundle_collection);
 
-                                    const unneeded_looking_into_the_js_bundle = () => {
-                                        if (minified_js_bundle_collection._arr) {
+                                        // But create a CSS bundle item...
 
-                                            if (minified_js_bundle_collection._arr.length === 1) {
 
-                                                const minified_js_bundle_item = minified_js_bundle_collection._arr[0];
-                                                console.log('minified_js_bundle_item', minified_js_bundle_item);
 
 
-                                                if (minified_js_bundle_item.type === 'JavaScript') {
 
-                                                    //const str_minified_js = minified_js_bundle_item.text;
+                                        // And also the CSS...
 
-                                                    //const res = 
 
 
 
 
+                                        complete(minified_js_bundle_collection);
 
-                                                } else {
 
-                                                    console.trace();
-                                                    throw 'NYI';
 
-                                                }
+                                        const unneeded_looking_into_the_js_bundle = () => {
+                                            if (minified_js_bundle_collection._arr) {
+
+                                                if (minified_js_bundle_collection._arr.length === 1) {
+
+                                                    const minified_js_bundle_item = minified_js_bundle_collection._arr[0];
+                                                    console.log('minified_js_bundle_item', minified_js_bundle_item);
+
+
+                                                    if (minified_js_bundle_item.type === 'JavaScript') {
+
+                                                        //const str_minified_js = minified_js_bundle_item.text;
+
+                                                        //const res = 
 
 
-                                                // Could even check it's js here...?
 
 
-                                                console.trace();
-                                                throw 'NYI';
 
+                                                    } else {
+
+                                                        console.trace();
+                                                        throw 'NYI';
+
+                                                    }
+
+
+                                                    // Could even check it's js here...?
+
+
+                                                    console.trace();
+                                                    throw 'NYI';
+
+
+                                                } else {
+                                                    console.trace();
+                                                    throw 'NYI';
+                                                }
 
                                             } else {
+
                                                 console.trace();
                                                 throw 'NYI';
-                                            }
 
-                                        } else {
-
-                                            console.trace();
-                                            throw 'NYI';
+                                            }
 
                                         }
 
-                                    }
+                                        
 
-                                    
+                                    } else {
+                                        console.trace();
+                                        throw 'stop';
+                                    }
 
                                 } else {
+
                                     console.trace();
                                     throw 'stop';
                                 }
 
-                            } else {
 
-                                console.trace();
-                                throw 'stop';
                             }
 
 
+                            
+
+
+
+
+                            
+
+
 
                             //console.trace();
                             //throw 'stop';

package/resources/processors/bundlers/js/esbuild/Core_JS_Non_Minifying_Bundler_Using_ESBuild.js

@@ -16,6 +16,10 @@ const Bundler_Using_ESBuild = require('./Bundler_Using_ESBuild');
 class Core_JS_Non_Minifying_Bundler_Using_ESBuild extends Bundler_Using_ESBuild {
     constructor(spec) {
         super(spec);
+
+        if (spec.debug !== undefined) this.debug = spec.debug;
+
+
     }
 
     // And the options....
@@ -47,7 +51,7 @@ class Core_JS_Non_Minifying_Bundler_Using_ESBuild extends Bundler_Using_ESBuild
 
             // Looks like we need better linking build options....
 
-            let result = await esbuild.build({
+            const o_build = {
                 entryPoints: [js_file_path],
                 bundle: true,
                 
@@ -59,23 +63,31 @@ class Core_JS_Non_Minifying_Bundler_Using_ESBuild extends Bundler_Using_ESBuild
                 //sourcemap: 'external',
                 write: false,
                 outdir: 'out',
-            })
-            console.log('result.outputFiles:\n\n');
-            for (let out of result.outputFiles) {
-                //console.log('out.path, out.contents, out.hash, out.text', out.path, out.contents, out.hash, out.text)
             }
 
-            console.log('result.outputFiles.length', result.outputFiles.length);
+            if (this.debug) {
+                o_build.sourcemap = 'inline';
+            }
+
+
+
+            let result = await esbuild.build(o_build);
+            //console.log('result.outputFiles:\n\n');
+            //for (let out of result.outputFiles) {
+                //console.log('out.path, out.contents, out.hash, out.text', out.path, out.contents, out.hash, out.text)
+            //}
+
+            //console.log('result.outputFiles.length', result.outputFiles.length);
 
 
             if (result.outputFiles.length === 1) {
 
                 const output_file = result.outputFiles[0];
 
-                console.log('output_file.text.length', output_file.text.length);
+                //console.log('output_file.text.length', output_file.text.length);
                 //console.log('output_file.text', output_file.text);
 
-                console.log('Object.keys(output_file)', Object.keys(output_file));
+                //console.log('Object.keys(output_file)', Object.keys(output_file));
 
                 // The Bundle is a subclass of Collection.
                 //  Maybe its better to make it an Object class that assigns all properties from spec.

package/server.js

@@ -50,6 +50,11 @@ class JSGUI_Single_Process_Server extends Evented_Class {
 			disk_path_client_js = spec.source_path_client_js;
 		};
 
+
+		if (spec.debug !== undefined) {
+			this.debug = spec.debug;
+		}
+
 		// or src_path_client_js as well...
 
 		Object.defineProperty(this, 'disk_path_client_js', {get: () => disk_path_client_js, set: (value) => disk_path_client_js = value});
@@ -166,12 +171,19 @@ class JSGUI_Single_Process_Server extends Evented_Class {
 
 			};
 
+			if (this.debug) {
+				opts_wp_publisher.debug = this.debug;
+			}
+
 			if (disk_path_client_js) opts_wp_publisher.src_path_client_js = disk_path_client_js;
 
 			
 
 			// HTTP_Webpage_Publisher probably needs to build the JavaScript. Possibly other assets too.
 			const wp_publisher = new HTTP_Webpage_Publisher(opts_wp_publisher);
+			// Specific options for when that publisher is in debug mode.
+
+
 			console.log('waiting for wp_publisher ready');
 
 			// Server can (maybe just in theory) serve multiple websites at once.