neo.mjs 3.0.5 → 3.1.2

package/buildScripts/createApp.mjs

@@ -0,0 +1,288 @@
+import chalk         from 'chalk';
+import { spawnSync } from 'child_process';
+import { Command }   from 'commander/esm.mjs';
+import envinfo       from 'envinfo';
+import fs            from 'fs-extra';
+import inquirer      from 'inquirer';
+import os            from 'os';
+import path          from 'path';
+
+const __dirname    = path.resolve(),
+      cwd          = process.cwd(),
+      requireJson  = path => JSON.parse(fs.readFileSync((path))),
+      packageJson  = requireJson(path.join(__dirname, 'package.json')),
+      insideNeo    = packageJson.name === 'neo.mjs',
+      neoPath      = insideNeo ? './' : './node_modules/neo.mjs/',
+      addonChoices = fs.readdirSync(path.join(neoPath, '/src/main/addon')).map(item => item.slice(0, -4)),
+      program      = new Command(),
+      programName  = `${packageJson.name} create-app`,
+      questions    = [],
+      scssFolders  = fs.readdirSync(path.join(neoPath, '/resources/scss')),
+      themeFolders = [];
+
+scssFolders.forEach(folder => {
+    if (folder.includes('theme')) {
+        themeFolders.push(`neo-${folder}`);
+    }
+});
+
+program
+    .name(programName)
+    .version(packageJson.version)
+    .option('-i, --info',                     'print environment debug info')
+    .option('-a, --appName <value>')
+    .option('-m, --mainThreadAddons <value>', `Comma separated list of:\n${addonChoices.join(', ')}\nDefaults to DragDrop, Stylesheet`)
+    .option('-t, --themes <value>',           ['all', ...themeFolders, 'none'].join(", "))
+    .option('-u, --useSharedWorkers <value>', '"yes", "no"')
+    .allowUnknownOption()
+    .on('--help', () => {
+        console.log('\nIn case you have any issues, please create a ticket here:');
+        console.log(chalk.cyan(process.env.npm_package_bugs_url));
+    })
+    .parse(process.argv);
+
+const programOpts = program.opts();
+
+if (programOpts.info) {
+    console.log(chalk.bold('\nEnvironment Info:'));
+    console.log(`\n  current version of ${packageJson.name}: ${packageJson.version}`);
+    console.log(`  running from ${__dirname}`);
+
+    envinfo
+        .run({
+            System     : ['OS', 'CPU'],
+            Binaries   : ['Node', 'npm', 'Yarn'],
+            Browsers   : ['Chrome', 'Edge', 'Firefox', 'Safari'],
+            npmPackages: ['neo.mjs']
+        }, {
+            duplicates  : true,
+            showNotFound: true
+        })
+        .then(console.log);
+} else {
+    console.log(chalk.green(programName));
+
+    if (programOpts.mainThreadAddons) {
+        programOpts.mainThreadAddons = programOpts.mainThreadAddons.split(',');
+    }
+
+    if (!programOpts.appName) {
+        questions.push({
+            type   : 'input',
+            name   : 'appName',
+            message: 'Please choose a name for your neo app:',
+            default: 'MyApp'
+        });
+    }
+
+    if (!programOpts.themes) {
+        questions.push({
+            type   : 'list',
+            name   : 'themes',
+            message: 'Please choose a theme for your neo app:',
+            choices: ['all', ...themeFolders, 'none'],
+            default: 'all'
+        });
+    }
+
+    if (!programOpts.mainThreadAddons) {
+        questions.push({
+            type   : 'checkbox',
+            name   : 'mainThreadAddons',
+            message: 'Please choose your main thread addons:',
+            choices: addonChoices,
+            default: ['DragDrop', 'Stylesheet']
+        });
+    }
+
+    if (!programOpts.useSharedWorkers) {
+        questions.push({
+            type   : 'list',
+            name   : 'useSharedWorkers',
+            message: 'Do you want to use SharedWorkers? Pick yes for multiple main threads (Browser Windows):',
+            choices: ['yes', 'no'],
+            default: 'no'
+        });
+    }
+
+    inquirer.prompt(questions).then(answers => {
+        let appName          = programOpts.appName          || answers.appName,
+            mainThreadAddons = programOpts.mainThreadAddons || answers.mainThreadAddons,
+            themes           = programOpts.themes           || answers.themes,
+            useSharedWorkers = programOpts.useSharedWorkers || answers.useSharedWorkers,
+            lAppName         = appName.toLowerCase(),
+            appPath          = 'apps/' + lAppName + '/',
+            dir              = 'apps/' + lAppName,
+            folder           = path.resolve(cwd, dir),
+            startDate        = new Date();
+
+        if (!Array.isArray(themes)) {
+            themes = [themes];
+        }
+
+        if (themes.length > 0 && !themes.includes('none') && !mainThreadAddons.includes('Stylesheet')) {
+            console.error('ERROR! The Stylesheet mainThreadAddon is mandatory in case you are using themes');
+            console.log('Exiting with error.');
+            process.exit(1);
+        }
+
+        fs.mkdir(path.join(folder, '/view'), { recursive: true }, (err) => {
+            if (err) {
+                throw err;
+            }
+
+            const appContent = [
+                "import MainContainer from './view/MainContainer.mjs';",
+                "",
+                "const onStart = () => Neo.app({",
+                "    mainView: MainContainer,",
+                "    name    : '" + appName + "'",
+                "});",
+                "",
+                "export {onStart as onStart};"
+            ].join(os.EOL);
+
+            fs.writeFileSync(folder + '/app.mjs', appContent);
+
+            const indexContent = [
+                "<!DOCTYPE HTML>",
+                "<html>",
+                "<head>",
+                '    <meta name="viewport" content="width=device-width, initial-scale=1">',
+                '    <meta charset="UTF-8">',
+                "    <title>" + appName + "</title>",
+                "</head>",
+                "<body>",
+                '    <script src="../../src/MicroLoader.mjs" type="module"></script>',
+                "</body>",
+                "</html>",
+            ];
+
+            fs.writeFileSync(path.join(folder, 'index.html'), indexContent.join(os.EOL));
+
+            let neoConfig = {
+                appPath    : `${insideNeo ? '' : '../../'}${appPath}app.mjs`,
+                basePath   : '../../',
+                environment: 'development',
+                mainPath   : './Main.mjs'
+            };
+
+            if (!(mainThreadAddons.includes('DragDrop') && mainThreadAddons.includes('Stylesheet') && mainThreadAddons.length === 2)) {
+                neoConfig.mainThreadAddons = mainThreadAddons;
+            }
+
+            if (!themes.includes('all')) { // default value
+                if (themes.includes('none')) {
+                    neoConfig.themes = [];
+                } else {
+                    neoConfig.themes = themes;
+                }
+            }
+
+            if (useSharedWorkers !== 'no') {
+                neoConfig.useSharedWorkers = true;
+            }
+
+            if (!insideNeo) {
+                neoConfig.workerBasePath = '../../node_modules/neo.mjs/src/worker/';
+            }
+
+            let configs = Object.entries(neoConfig).sort((a, b) => a[0].localeCompare(b[0]));
+            neoConfig = {};
+
+            configs.forEach(([key, value]) => {
+                neoConfig[key] = value;
+            });
+
+            fs.writeFileSync(path.join(folder, 'neo-config.json'), JSON.stringify(neoConfig, null, 4));
+
+            const mainContainerContent = [
+                "import Component    from '../../../" + (insideNeo ? '' : 'node_modules/neo.mjs/') + "src/component/Base.mjs';",
+                "import TabContainer from '../../../" + (insideNeo ? '' : 'node_modules/neo.mjs/') + "src/tab/Container.mjs';",
+                "import Viewport     from '../../../" + (insideNeo ? '' : 'node_modules/neo.mjs/') + "src/container/Viewport.mjs';",
+                "",
+                "/**",
+                " * @class " + appName + ".view.MainContainer",
+                " * @extends Neo.container.Viewport",
+                " */",
+                "class MainContainer extends Viewport {",
+                "    static getConfig() {return {",
+                "        className: '" + appName + ".view.MainContainer',",
+                "        autoMount: true,",
+                "        layout   : {ntype: 'fit'},",
+                "",
+                "        items: [{",
+                "            module: TabContainer,",
+                "            height: 300,",
+                "            width : 500,",
+                "            style : {flex: 'none', margin: '20px'},",
+                "",
+                "            itemDefaults: {",
+                "                module: Component,",
+                "                cls   : ['neo-examples-tab-component'],",
+                "                style : {padding: '20px'},",
+                "            },",
+                "",
+                "            items: [{",
+                "                tabButtonConfig: {",
+                "                    iconCls: 'fa fa-home',",
+                "                    text   : 'Tab 1'",
+                "                },",
+                "                vdom: {innerHTML: 'Welcome to your new Neo App.'}",
+                "            }, {",
+                "                tabButtonConfig: {",
+                "                    iconCls: 'fa fa-play-circle',",
+                "                    text   : 'Tab 2'",
+                "                },",
+                "                vdom: {innerHTML: 'Have fun creating something awesome!'}",
+                "            }]",
+                "        }]",
+                "    }}",
+                "}",
+                "",
+                "Neo.applyClassConfig(MainContainer);",
+                "",
+                "export {MainContainer as default};"
+            ].join(os.EOL);
+
+            fs.writeFileSync(path.join(folder + '/view/MainContainer.mjs'), mainContainerContent);
+
+            let appJsonPath = path.resolve(cwd, 'buildScripts/myApps.json'),
+                appJson;
+
+            if (fs.existsSync(appJsonPath)) {
+                appJson = requireJson(appJsonPath);
+            } else {
+                appJsonPath = path.resolve(__dirname, 'buildScripts/webpack/json/myApps.json');
+
+                if (fs.existsSync(appJsonPath)) {
+                    appJson = requireJson(appJsonPath);
+                } else {
+                    appJson = requireJson(path.resolve(__dirname, 'buildScripts/webpack/json/myApps.template.json'));
+                }
+            }
+
+            if (!appJson.apps.includes(appName)) {
+                appJson.apps.push(appName);
+                appJson.apps.sort();
+            }
+
+            fs.writeFileSync(appJsonPath, JSON.stringify(appJson, null, 4));
+
+            if (mainThreadAddons.includes('HighlightJS')) {
+                spawnSync('node', [
+                    './buildScripts/copyFolder.mjs',
+                    '-s',
+                    path.resolve(neoPath, 'docs/resources'),
+                    '-t',
+                    path.resolve(folder, 'resources'),
+                ], { env: process.env, cwd: process.cwd(), stdio: 'inherit' });
+            }
+
+            const processTime = (Math.round((new Date - startDate) * 100) / 100000).toFixed(2);
+            console.log(`\nTotal time for ${programName}: ${processTime}s`);
+
+            process.exit();
+        });
+    });
+}

package/buildScripts/docs/{jsdocx.js → jsdocx.mjs}

@@ -1,9 +1,12 @@
-const fs          = require('fs-extra'),
-      jsdocx      = require('neo-jsdoc-x'),
-      path        = require('path'),
+import fs      from 'fs-extra';
+import helper  from 'neo-jsdoc-x/src/lib/helper.js';
+import jsdocx  from 'neo-jsdoc-x';
+import path    from 'path';
+
+const __dirname   = path.resolve(),
       cwd         = process.cwd(),
-      helper      = require(path.join(cwd, 'node_modules/neo-jsdoc-x/src/lib/helper.js')),
-      packageJson = require(path.resolve(process.cwd(), 'package.json')),
+      requireJson = path => JSON.parse(fs.readFileSync((path))),
+      packageJson = requireJson(path.resolve(cwd, 'package.json')),
       insideNeo   = packageJson.name === 'neo.mjs',
       neoPath     = insideNeo ? '' : 'node_modules/neo.mjs/',
       appNames    = [],
@@ -20,25 +23,23 @@ let appJsonPath = path.resolve(cwd, 'buildScripts/myApps.json'),
     appJson;
 
 if (fs.existsSync(appJsonPath)) {
-    appJson = require(appJsonPath);
+    appJson = requireJson(appJsonPath);
 } else {
-    appJsonPath = path.resolve(__dirname, '../webpack/json/myApps.json');
+    appJsonPath = path.resolve(__dirname, 'buildScripts/webpack/json/myApps.json');
 
     if (fs.existsSync(appJsonPath)) {
-        appJson = require(appJsonPath);
+        appJson = requireJson(appJsonPath);
     } else {
-        appJson = require(path.resolve(__dirname, '../webpack/json/myApps.template.json'));
+        appJson = requireJson(path.resolve(__dirname, 'buildScripts/webpack/json/myApps.template.json'));
     }
 }
 
-if (appJson) {
-    appJson.apps.forEach(key => {
-        if (key !== 'Docs') { // the docs app is automatically included
-            appNames.push(key);
-            options.files.push(`apps/${key.toLowerCase()}/**/*.mjs`);
-        }
-    });
-}
+appJson?.apps.forEach(key => {
+    if (key !== 'Docs') { // the docs app is automatically included
+        appNames.push(key);
+        options.files.push(`apps/${key.toLowerCase()}/**/*.mjs`);
+    }
+});
 
 function ns(names, create) {
     names = Array.isArray(names) ? names : names.split('.');
@@ -50,7 +51,7 @@ function ns(names, create) {
         if (prev) {
             return prev[current];
         }
-    }, this);
+    }, globalThis);
 }
 
 const neoStructure = [{
@@ -199,15 +200,15 @@ function generateStructure(target, parentId, docs) {
         // console.log(srcPath);
 
         neoStructure.push({
-            className: className,
+            className,
             collapsed: appNames.includes(key) || key === 'Docs',
-            id       : id,
-            isLeaf   : isLeaf,
+            id,
+            isLeaf,
             name     : key,
-            path     : path,
-            parentId : parentId,
-            singleton: singleton,
-            srcPath  : srcPath
+            path,
+            parentId,
+            singleton,
+            srcPath
         });
 
         generateStructure(target + '.' + key, id, docs);
@@ -326,13 +327,11 @@ jsdocx.parse(options)
                 item.description = item.description.replace(/\n/g, "<br />");
             }
 
-            if (item.params) {
-                item.params.forEach(param => {
-                    if (param.description) {
-                        param.description = param.description.replace(/\n/g, "<br />");
-                    }
-                });
-            }
+            item.params?.forEach(param => {
+                if (param.description) {
+                    param.description = param.description.replace(/\n/g, "<br />");
+                }
+            });
 
             if (item.kind === 'member') {
                 if (item.comment) {

package/buildScripts/webpack/buildMyApps.mjs

@@ -0,0 +1,125 @@
+import chalk         from 'chalk';
+import { spawnSync } from 'child_process';
+import { Command }   from 'commander/esm.mjs';
+import envinfo       from 'envinfo';
+import fs            from 'fs-extra';
+import inquirer      from 'inquirer';
+import os            from 'os';
+import path          from 'path';
+
+const __dirname    = path.resolve(),
+      cwd         = process.cwd(),
+      cpOpts      = {env: process.env, cwd: cwd, stdio: 'inherit', shell: true},
+      requireJson = path => JSON.parse(fs.readFileSync((path))),
+      packageJson = requireJson(path.resolve(cwd, 'package.json')),
+      program     = new Command(),
+      configPath  = path.resolve(cwd, 'buildScripts/myApps.json'),
+      neoPath     = packageJson.name === 'neo.mjs' ? './' : './node_modules/neo.mjs/',
+      webpackPath = path.resolve(neoPath, 'buildScripts/webpack'),
+      programName = `${packageJson.name} buildMyApps`,
+      questions   = [];
+
+let webpack = './node_modules/.bin/webpack',
+    config;
+
+if (fs.existsSync(configPath)) {
+    config = requireJson(configPath);
+} else {
+    const myAppsPath = path.resolve(neoPath, 'buildScripts/webpack/json/myApps.json');
+
+    if (fs.existsSync(myAppsPath)) {
+        config = requireJson(myAppsPath);
+    } else {
+        config = requireJson(path.resolve(neoPath, 'buildScripts/webpack/json/myApps.template.json'));
+    }
+}
+
+let index = config.apps.indexOf('Docs');
+
+index > -1 && config.apps.splice(index, 1);
+
+program
+    .name(programName)
+    .version(packageJson.version)
+    .option('-i, --info',         'print environment debug info')
+    .option('-a, --apps <value>', ['all'].concat(config.apps).map(e => `"${e}"`).join(', '))
+    .option('-e, --env <value>',  '"all", "dev", "prod"')
+    .option('-f, --framework')
+    .option('-n, --noquestions')
+    .allowUnknownOption()
+    .on('--help', () => {
+        console.log('\nIn case you have any issues, please create a ticket here:');
+        console.log(chalk.cyan(packageJson.bugs.url));
+    })
+    .parse(process.argv);
+
+const programOpts = program.opts();
+
+if (programOpts.info) {
+    console.log(chalk.bold('\nEnvironment Info:'));
+    console.log(`\n  current version of ${packageJson.name}: ${packageJson.version}`);
+    console.log(`  running from ${__dirname}`);
+
+    envinfo
+        .run({
+            System     : ['OS', 'CPU'],
+            Binaries   : ['Node', 'npm', 'Yarn'],
+            Browsers   : ['Chrome', 'Edge', 'Firefox', 'Safari'],
+            npmPackages: ['neo.mjs']
+        }, {
+            duplicates  : true,
+            showNotFound: true
+        })
+        .then(console.log);
+} else {
+    console.log(chalk.green(programName));
+
+    if (!programOpts.noquestions) {
+        if (!programOpts.env) {
+            questions.push({
+                type   : 'list',
+                name   : 'env',
+                message: 'Please choose the environment:',
+                choices: ['all', 'dev', 'prod'],
+                default: 'all'
+            });
+        }
+
+        if (!programOpts.apps && config.apps.length > 1) {
+            questions.push({
+                type   : 'checkbox',
+                name   : 'apps',
+                message: 'Please choose which apps you want to build:',
+                choices: config.apps
+            });
+        }
+    }
+
+    inquirer.prompt(questions).then(answers => {
+        const apps      = (answers.apps.length > 0 ? answers.apps : null) || programOpts.apps || ['all'],
+              env       = answers.env || programOpts.env || ['all'],
+              insideNeo = !!programOpts.framework || false,
+              startDate = new Date();
+
+        if (os.platform().startsWith('win')) {
+            webpack = path.resolve(webpack).replace(/\\/g,'/');
+        }
+
+        // dist/development
+        if (env === 'all' || env === 'dev') {
+            console.log(chalk.blue(`${programName} starting dist/development`));
+            spawnSync(webpack, ['--config', `${webpackPath}/development/webpack.config.myapps.mjs`, `--env apps=${apps}`, `--env insideNeo=${insideNeo}`], cpOpts);
+        }
+
+        // dist/production
+        if (env === 'all' || env === 'prod') {
+            console.log(chalk.blue(`${programName} starting dist/production`));
+            spawnSync(webpack, ['--config', `${webpackPath}/production/webpack.config.myapps.mjs`, `--env apps=${apps}`, `--env insideNeo=${insideNeo}`], cpOpts);
+        }
+
+        const processTime = (Math.round((new Date - startDate) * 100) / 100000).toFixed(2);
+        console.log(`\nTotal time for ${programName}: ${processTime}s`);
+
+        process.exit();
+    });
+}

package/buildScripts/webpack/buildThreads.mjs

@@ -0,0 +1,115 @@
+import chalk         from 'chalk';
+import { spawnSync } from 'child_process';
+import { Command }   from 'commander/esm.mjs';
+import envinfo       from 'envinfo';
+import fs            from 'fs-extra';
+import inquirer      from 'inquirer';
+import path          from 'path';
+
+const __dirname   = path.resolve(),
+      cwd         = process.cwd(),
+      cpOpts      = {env: process.env, cwd: cwd, stdio: 'inherit', shell: true},
+      requireJson = path => JSON.parse(fs.readFileSync((path))),
+      packageJson = requireJson(path.resolve(cwd, 'package.json')),
+      neoPath     = packageJson.name === 'neo.mjs' ? './' : './node_modules/neo.mjs/',
+      program     = new Command(),
+      webpackPath = path.resolve(neoPath, 'buildScripts/webpack'),
+      programName = `${packageJson.name} buildThreads`,
+      questions   = [];
+
+let webpack = './node_modules/.bin/webpack';
+
+program
+    .name(programName)
+    .version(packageJson.version)
+    .option('-i, --info',            'print environment debug info')
+    .option('-e, --env <value>',     '"all", "dev", "prod"')
+    .option('-f, --framework')
+    .option('-n, --noquestions')
+    .option('-t, --threads <value>', '"all", "app", "data", "main", "vdom"')
+    .allowUnknownOption()
+    .on('--help', () => {
+        console.log('\nIn case you have any issues, please create a ticket here:');
+        console.log(chalk.cyan(packageJson.bugs.url));
+    })
+    .parse(process.argv);
+
+const programOpts = program.opts();
+
+if (programOpts.info) {
+    console.log(chalk.bold('\nEnvironment Info:'));
+    console.log(`\n  current version of ${packageJson.name}: ${packageJson.version}`);
+    console.log(`  running from ${__dirname}`);
+
+    envinfo
+        .run({
+            System     : ['OS', 'CPU'],
+            Binaries   : ['Node', 'npm', 'Yarn'],
+            Browsers   : ['Chrome', 'Edge', 'Firefox', 'Safari'],
+            npmPackages: ['neo.mjs']
+        }, {
+            duplicates  : true,
+            showNotFound: true
+        })
+        .then(console.log);
+} else {
+    console.log(chalk.green(programName));
+
+    if (!programOpts.noquestions) {
+        if (!programOpts.threads) {
+            questions.push({
+                type   : 'list',
+                name   : 'threads',
+                message: 'Please choose the threads to build:',
+                choices: ['all', 'app', 'canvas', 'data', 'main', 'vdom'],
+                default: 'all'
+            });
+        }
+
+        if (!programOpts.env) {
+            questions.push({
+                type   : 'list',
+                name   : 'env',
+                message: 'Please choose the environment:',
+                choices: ['all', 'dev', 'prod'],
+                default: 'all'
+            });
+        }
+    }
+
+    inquirer.prompt(questions).then(answers => {
+        const env       = answers.env     || programOpts.env     || 'all',
+              threads   = answers.threads || programOpts.threads || 'all',
+              insideNeo = programOpts.framework || false,
+              startDate = new Date();
+
+        if (path.sep === '\\') {
+            webpack = path.resolve(webpack).replace(/\\/g,'/');
+        }
+
+        function parseThreads(tPath) {
+            (threads === 'all' || threads === 'main')   && spawnSync(webpack, ['--config', `${tPath}.main.mjs`],                                                    cpOpts);
+            (threads === 'all' || threads === 'app')    && spawnSync(webpack, ['--config', `${tPath}.appworker.mjs`, `--env insideNeo=${insideNeo}`],               cpOpts);
+            (threads === 'all' || threads === 'canvas') && spawnSync(webpack, ['--config', `${tPath}.worker.mjs`,    `--env insideNeo=${insideNeo} worker=canvas`], cpOpts);
+            (threads === 'all' || threads === 'data')   && spawnSync(webpack, ['--config', `${tPath}.worker.mjs`,    `--env insideNeo=${insideNeo} worker=data`],   cpOpts);
+            (threads === 'all' || threads === 'vdom')   && spawnSync(webpack, ['--config', `${tPath}.worker.mjs`,    `--env insideNeo=${insideNeo} worker=vdom`],   cpOpts);
+        }
+
+        // dist/development
+        if (env === 'all' || env === 'dev') {
+            console.log(chalk.blue(`${programName} starting dist/development`));
+            parseThreads(`${webpackPath}/development/webpack.config`);
+        }
+
+        // dist/production
+        if (env === 'all' || env === 'prod') {
+            console.log(chalk.blue(`${programName} starting dist/production`));
+            parseThreads(`${webpackPath}/production/webpack.config`);
+        }
+
+        const processTime = (Math.round((new Date - startDate) * 100) / 100000).toFixed(2);
+        console.log(`\nTotal time for ${programName}: ${processTime}s`);
+
+        process.exit();
+    });
+}