binhend 1.1.12 → 1.2.1

package/bin/backend.js

@@ -0,0 +1,3 @@
+module.exports = () => {
+    console.log('Generate back-end structure...');
+};

package/bin/frontend.js

@@ -0,0 +1,3 @@
+module.exports = () => {
+    console.log('Generate front-end structure...');
+};

package/bin/index.js

@@ -0,0 +1,31 @@
+#!/usr/bin/env node
+// console.log('Welcome to the binh!');
+// console.log('process.argv', process.argv);
+
+const argves = process.argv;
+const command = argves[2];
+
+// switch (command) {
+//     case 'backend':
+//         console.log('Generate back-end structure...');
+//         break;
+
+//     case 'frontend':
+//         console.log('Generate front-end structure...');
+//         break;
+
+//     default:
+//         console.log('Unknown command...');
+//         break;
+// }
+
+const map = {
+    backend: require('./backend'),
+    frontend: require('./frontend'),
+}
+
+const handler = map[command];
+
+if (handler) handler();
+else console.log('Unknown command...');
+

package/package.json

@@ -1,14 +1,18 @@
 {
   "name": "binhend",
-  "version": "1.1.12",
+  "version": "1.2.1",
   "description": "",
   "main": "index.js",
   "author": "Nguyen Duc Binh",
   "license": "UNLICENSED",
+  "bin": {
+    "binh": "./bin/index.js"
+  },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "example-api": "node example_api PORT=5555",
-    "example-webcomp": "node example_webcomp"
+    "example-webcomp": "node example_webcomp",
+    "example-web2": "node example_web2"
   },
   "dependencies": {
     "express": "^4.17.1"

package/src/binh.js

@@ -1,3 +1,4 @@
+const fs = require('fs');
 const path = require('path');
 const Crypto = require('./cryptography');
 
@@ -30,6 +31,15 @@ function Binh() {
         return rootpath;
     };
 
+    this.remove = function(path, callbackError) {
+        try {
+            fs.rmSync(path, { recursive: true, force: true, maxRetries: 3, retryDelay: 1000 });
+        }
+        catch (error) {
+            callbackError(error);
+        }
+    };
+
     function binh(modulePath) {
         return modulePath == undefined ? module.exports : require(path.join(rootpath, modulePath));
     };

package/src/binh.web.builder.js

@@ -2,8 +2,59 @@
 const path = require('path');
 
 const Component = require('./component');
+const ComponentFormat = require('./component.format');
+const ComponentBuild = require('./component.build');
 
 function WebBuilder(binh, Binh) {
+    binh.context = function(module) {
+        var context = { module };
+        return {
+            context,
+            tag: tag.bind(context),
+            script: script.bind(context)
+        }
+    };
+
+    function tag(tagNames) {
+        var tags = typeof tagNames === 'string' ? tagNames.split(/\s+/) : [];
+        var htmltags = this.component.htmltags;
+        htmltags.push.apply(htmltags, tags);
+    }
+
+    function script() {
+        var scripts = Array.from(arguments);
+        var links = this.component.links;
+        links.push.apply(links, scripts);
+    }
+    
+    binh.component = function(context, ui, service, style) {
+        var component = ui || service || style;
+        var type = ui && 'ui' || service && 'service' || style && 'style';
+
+        if (component == null) return;
+
+        context.component = component;
+        component.htmltags = [];
+        component.links = [];
+
+        binh.bundle(type, context.module, component);
+    };
+
+    binh.final = function(module) {
+        var component = module.exports;
+
+        if (!(component instanceof Function)) return;
+        if (component && component.constructor !== Component) return;
+
+        module.children.forEach(function(child) {
+            child = child.exports;
+            if (child.constructor !== Component) return;
+            if (child.alias) {
+                component.vars[child.filename] = child.alias;
+            }
+        });
+    };
+
     binh.ui = function(module, component, htmltags, links) {
         component.htmltags = htmltags;
         component.links = links;
@@ -50,21 +101,75 @@ function WebBuilder(binh, Binh) {
         this.alias = name;
     }
 
-    Binh.web = function(buildpath, sourcepath) {
-        if (typeof buildpath !== 'string') return this;
+    Binh.web = function(webPath, sourcePath, modulePath) {
+        switch (arguments.length) {
+            case 1:
+                Binh.webStatic(webPath);
+                break;
 
-        var rootpath = Binh.getRootpath(),
-            destination = path.join(rootpath, buildpath);
+            case 2:
+                Binh.webApp(sourcePath, webPath);
+                break;
         
-        if (typeof sourcepath === 'string') {
-            var source = path.join(rootpath, sourcepath);
-            Component.generate(source, destination);
+            default:
+                if (arguments.length > 2) {
+                    Binh.webApp(webPath, sourcePath, modulePath);
+                }
+                break;
         }
 
-        Binh.web.value = destination;
+        return Binh;
+    };
 
+    Binh.webStatic = function(webPath) {
+        if (!isString(webPath)) return Binh;
+        Binh.web.value = getAbsolutePaths(webPath).web;
         return Binh;
     };
+
+    Binh.webApp = function(sourcePath, webPath, modulePath) {
+        if (!isString(sourcePath)) return Binh;
+
+        modulePath = isString(modulePath) ? modulePath : isString(webPath) ? webPath : null;
+
+        var { source, web, module } = getAbsolutePaths(webPath, sourcePath, modulePath);
+
+        ComponentFormat.generate(source, web, () => ComponentBuild.generate(source, web, module));
+
+        Binh.web.value = web;
+
+        return Binh;
+    };
+
+    Binh.webModule = function(sourcePath, modulePath) {
+        if (!isString(sourcePath)) return Binh;
+        
+        var { source, module } = getAbsolutePaths(null, sourcePath, modulePath);
+
+        ComponentFormat.generate(source, module);
+
+        return Binh;
+    };
+
+    function getAbsolutePaths(webPath, sourcePath, modulePath) {
+        webPath = isString(webPath) ? webPath : 'web/app';
+        modulePath = isString(modulePath) ? modulePath : 'web/modules';
+
+        var rootpath = Binh.getRootpath(),
+        sourcePathAbsolute = isString(sourcePath) ? path.join(rootpath, sourcePath) : null,
+        webPathAbsolute = path.join(rootpath, webPath),
+        modulePathAbsolute = path.join(rootpath, modulePath);
+
+        return {
+            web: webPathAbsolute,
+            source: sourcePathAbsolute,
+            module: modulePathAbsolute
+        };
+    }
+
+    function isString(input) {
+        return typeof input === 'string';
+    }
 }
 
 module.exports = {

package/src/component.build.js

@@ -0,0 +1,52 @@
+
+const { parse } = require('path');
+const { scanNestedFiles, cloneFile, writeToFile } = require('./component.file');
+const CodeFormat = require('./code');
+const Component = require('./component');
+
+// TODO
+// [-] Able to minify/beautify generated files
+
+function generate(sourceRootPath, outputRootPath, stageRootPath) {
+    if (sourceRootPath == undefined || outputRootPath == undefined) return;
+    stageRootPath = stageRootPath || outputRootPath;
+    console.info('[BINHEND][COMPONENT] Build web components from:', stageRootPath);
+    console.info('[BINHEND][COMPONENT] to:', outputRootPath);
+
+    scanNestedFiles(stageRootPath, (file) => {
+        var fileSourcePath = file.path.replace(stageRootPath, sourceRootPath);
+        var fileOutputPath = file.path.replace(stageRootPath, outputRootPath);
+
+        if (parse(file.name).ext !== '.js') {
+            return cloneFile(fileSourcePath, fileOutputPath);
+        }
+
+        try {
+            var component = require(file.path);
+        }
+        catch (error) {
+            return cloneFile(fileSourcePath, fileOutputPath);
+        }
+
+        if (!(component instanceof Function) || component.constructor !== Component) {
+            return cloneFile(fileSourcePath, fileOutputPath);
+        }
+
+        var code = joinCodes(component, outputRootPath);
+
+        writeToFile(fileOutputPath, code);
+    });
+}
+
+function joinCodes(component, rootPath) {
+    var fullcode = CodeFormat.prequire(component, [
+        CodeFormat.bundle(component, rootPath),
+        CodeFormat.htmltags(component)
+    ]);
+
+    return fullcode;
+}
+
+module.exports = {
+    generate
+};

package/src/component.file.js

@@ -0,0 +1,115 @@
+
+const { readdir, statSync, copyFile, writeFile } = require('fs');
+const { join } = require('path');
+
+// TODO
+// [-] Enhance code by removing sync logics (except for existsSync, mkdirSync): readdir, readFileSync, (statSync?)
+
+function getItemInfo(itemPath) {
+    var info = {};
+
+    try {
+        var stat = statSync(itemPath);
+        info.isFile = stat.isFile();
+        info.isDirectory = stat.isDirectory();
+    }
+    catch (error) {
+        console.error('Failed getting info for item:', path, error);
+    }
+
+    return info;
+}
+
+function scanItems(path, callback) {
+    readdir(path, (error, dirents) => {
+        if (error) return console.error('Failed reading directory', path, error);
+
+        dirents.forEach((dirent) => {
+            var fullPath = join(path, dirent),
+                info = getItemInfo(fullPath);
+
+            callback({
+                name: dirent,
+                path: fullPath,
+                isFile: info.isFile,
+                isDirectory: info.isDirectory
+            }, false);
+        });
+
+        if (callback.length > 1) callback(null, true);
+    });
+}
+
+function scanNestedItems(path, callback, counter) {
+    counter = counter || { current: 1 };
+
+    scanItems(path, (item, done) => {
+        if (done) {
+            --counter.current;
+            if (counter.current > 0) return;
+            else if (onComplete(done, callback)) return;
+        }
+
+        callback(item, false);
+
+        if (item.isDirectory) {
+            ++counter.current;
+            scanNestedItems(item.path, callback, counter);
+        }
+    });
+}
+
+function scanFiles(path, callback) {
+    scanItems(path, (item, done) => {
+        if (onComplete(done, callback)) return;
+        if (item.isFile) callback(item, false);
+    });
+}
+
+function scanNestedFiles(path, callback) {
+    scanNestedItems(path, (item, done) => {
+        if (onComplete(done, callback)) return;
+        if (item.isFile) callback(item, false);
+    });
+}
+
+function onComplete(done, callback) {
+    if (done && callback.length > 1) {
+        callback(null, done);
+        return true;
+    }
+    if (done) return true;
+}
+
+function cloneFile(filepath, outpath) {
+    copyFile(filepath, outpath, function(error) {
+        if (error) {
+            console.error(`[BINHEND][COMPONENT] Failed copying file from:`, filepath);
+            console.error(`[BINHEND][COMPONENT] to:`, outpath);
+            console.error('[BINHEND][COMPONENT] Error details:', error);
+        }
+    });
+}
+
+function writeToFile(fileOutputPath, content) {
+    writeFile(fileOutputPath, content, { encoding: 'utf8', flag: 'w' }, function(error) {
+        if (error) {
+            printError('Failed writing file', filepath, error);
+        }
+    });
+}
+
+function printError(message, id, error) {
+    console.error(`[BINHEND][COMPONENT] ${message}:`, id);
+    console.error('[BINHEND][COMPONENT] Error details:', error);
+}
+
+module.exports = {
+    scanItems,
+    scanNestedItems,
+    scanFiles,
+    scanNestedFiles,
+    cloneFile,
+    writeToFile,
+    printError
+};

package/src/component.format.js

@@ -0,0 +1,51 @@
+
+const { writeFileSync, existsSync, mkdirSync, readFileSync } = require('fs');
+const { dirname, parse } = require('path');
+const { scanNestedFiles, cloneFile, printError } = require('./component.file');
+
+// TODO
+// [-] Enhance code by removing sync logics (except for existsSync, mkdirSync): readdir, readFileSync, (statSync?)
+
+const PREFIX_CODE =
+`var { context, tag, script } = binh.context(module);
+binh.component(context, ui, service, style);
+var ui = null, service = null, style = null;\r\n`;
+
+function generate(sourceRootPath, outputRootPath, callbackDone) {
+    if (sourceRootPath == undefined || outputRootPath == undefined) return;
+    console.log('[BINHEND][COMPONENT] Format files from:', sourceRootPath);
+    console.log('[BINHEND][COMPONENT] to:', outputRootPath);
+
+    scanNestedFiles(sourceRootPath, (file, done) => {
+        if (done) return callbackDone instanceof Function ? callbackDone() : null;
+
+        var fileSourcePath = file.path;
+        var fileOutputPath = fileSourcePath.replace(sourceRootPath, outputRootPath);
+
+        ensureDirectoryExistence(fileOutputPath);
+
+        if (parse(file.name).ext !== '.js') {
+            return cloneFile(fileSourcePath, fileOutputPath);
+        }
+        
+        try {
+            var content = readFileSync(fileSourcePath, { encoding: 'utf8', flag: 'r' });
+            var code = PREFIX_CODE + content + '\r\n;binh.final(module);';
+            writeFileSync(fileOutputPath, code, { encoding: 'utf8', flag: 'w' });
+        }
+        catch (error) {
+            printError('Failed formatting file:', fileSourcePath, error);
+        }
+    });
+}
+
+function ensureDirectoryExistence(filePath) {
+    var dirPath = dirname(filePath);
+    if (existsSync(dirPath)) return true;
+    ensureDirectoryExistence(dirPath);
+    mkdirSync(dirPath);
+}
+
+module.exports = {
+    generate
+};

package/example_api/config.js

@@ -1,13 +0,0 @@
-
-module.exports = function(loader) {
-    var sample = {
-        ABC: 123,
-        Text: 'Hello',
-        NAME: 'MyApp',
-        PORT: 1400
-    };
-
-    var { filter, object } = loader;
-
-    filter(object, sample, ['PORT', 'NAME']);
-};

package/example_api/index.js

@@ -1,15 +0,0 @@
-'use strict';
-
-const { Binh } = require('../src/binh');
-
-new Binh()
-    .id()
-    .global('config', binh.config)
-    .config('config')
-    .api('routes')
-    .cors()
-    .port('PORT')
-    .cluster.fork(0)
-    .start(function(server, configs) {
-        console.log('### START >>> configs:', configs);
-    });

package/example_api/routes/test/bb.js

@@ -1,9 +0,0 @@
-const { get } = binh.router(module);
-
-// get('/', function(req, res) {
-//     res.json({ path:'/', dir: __dirname, file: __filename });
-// });
-
-get('/hihi', function(req, res) {
-    res.json({ path:'/hihi', dir: __dirname, file: __filename });
-});

package/example_api/routes/test/index.js

@@ -1,13 +0,0 @@
-const { router, get, post } = binh.router(module);
-
-get('/', function(req, res) {
-    res.json({ path:'/', dir: __dirname, file: __filename });
-});
-
-get('/sub', function(req, res) {
-    res.json({ path:'/sub', dir: __dirname, file: __filename });
-});
-
-get('/goo', function(req, res) {
-    res.json({ path:'/goo', dir: __dirname, file: __filename });
-});

package/example_api/routes/test/some.js

@@ -1,9 +0,0 @@
-const { router, get, post } = binh.router(module);
-
-get('/', function(req, res) {
-    res.json({ path:'/', dir: __dirname, file: __filename });
-});
-
-get('/sub', function(req, res) {
-    res.json({ path:'/sub', dir: __dirname, file: __filename });
-});

package/example_api/routes/test.js

@@ -1,13 +0,0 @@
-const { get } = binh.router(module);
-
-get('/', function(req, res) {
-    res.json({ path:'/', dir: __dirname, file: __filename });
-});
-
-get('/bb', function(req, res) {
-    res.json({ path:'/bb', dir: __dirname, file: __filename });
-});
-
-get('/cc', function(req, res) {
-    res.json({ path:'/cc', dir: __dirname, file: __filename });
-});

package/example_api/routes/testa.js

@@ -1,13 +0,0 @@
-const { router, get, post } = binh.router(module);
-
-get('/', function(req, res) {
-    res.json({ path:'/', dir: __dirname, file: __filename });
-});
-
-get('/sub', function(req, res) {
-    res.json({ path:'/sub', dir: __dirname, file: __filename });
-});
-
-get('/gaa', function(req, res) {
-    res.json({ path:'/gaa', dir: __dirname, file: __filename });
-});

package/example_webcomp/components/common/InputText.js

@@ -1,24 +0,0 @@
-
-require('./../services/ServiceToDos').as('Toto');
-
-function main() {
-    // var addTodoItem = Toto.debounce('add', 1500, true);
-
-    // setTimeout(function() {
-    //     addTodoItem('over 10kms');
-    // }, 10000);
-    
-    var inputbox = input({ type: 'text', placeholder: 'Enter to-do item' });
-
-    var submit = inputbox.action('submit');
-    
-    inputbox.on('keypress', function (event) {
-        if (event.key === "Enter") {
-            submit(inputbox.element.value);
-        }
-    });
-    
-    return inputbox;
-}
-
-binh.ui(module, main, ['input']);

package/example_webcomp/components/common/Link.js

@@ -1,16 +0,0 @@
-
-
-function Link() {
-    var { a } = Binh.element();
-
-    var text = arguments[0];
-    var path = arguments[1];
-
-    var link = a(text).on('click', function() {
-        Binh.Router.navigate(path);
-    });
-
-    return link;
-}
-
-binh.ui(module, Link);

package/example_webcomp/components/common/Link2.js

@@ -1,13 +0,0 @@
-
-Binh.ui(function() {
-    var { a } = Binh.element('a');
-
-    var text = arguments[0];
-    var path = arguments[1];
-
-    var link = a(text).on('click', function() {
-        Binh.Router.navigate(path);
-    });
-
-    return link;
-});

package/example_webcomp/components/index.html

@@ -1,18 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <title>Binh Demo</title>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- <link rel="stylesheet" href="/lib/bootstrap.3.4.1.min.css"> -->
-    <!-- <link rel="stylesheet" href="style.css"> -->
-    <!-- <script src="/lib/jquery.3.5.1.min.js"></script>
-    <script src="/lib/bootstrap.3.4.1.min.js"></script> -->
-
-    <script src="http://localhost:1300/dev/binh.min.js"></script>
-    <!-- <script src="https://binhjs.pages.dev/dist/binh.min.js"></script> -->
-    <!-- <script src="https://cdn.jsdelivr.net/gh/penciless/binhjs/dist/binh.min.js"></script> -->
-    <script src="/index.js"></script>
-  </head>
-  <body></body>
-</html>

package/example_webcomp/components/index.js

@@ -1,14 +0,0 @@
-
-Binh.script('https://cdn.jsdelivr.net/gh/jquery/jquery@3.5.1/dist/jquery.min.js', function() {
-    Binh.link('https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/css/bootstrap.min.css');
-    Binh.script('https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/js/bootstrap.min.js');
-});
-
-Binh.Router.onload(function() {
-    console.log('#### ON ROUTING !!!');
-});
-
-Binh({
-    '':         '/layouts/AppMainLayout.js',
-    '/todos':    '/layouts/AppToDos.js'
-});

package/example_webcomp/components/layouts/AppMainLayout.js

@@ -1,22 +0,0 @@
-
-require('./PageHeader');
-require('./PageContent');
-require('./../services/AnyService');
-
-function AppMainLayout() {
-    var MainLayout = div({ id: 'app-main-layout' });
-
-    MainLayout(
-        PageHeader,
-        PageContent,
-        function (thisEl) {
-            setTimeout(function() {
-                console.log('>>> App Main Layout:', thisEl);
-            }, 1000);
-        }
-    );
-    
-    return MainLayout;
-}
-
-binh.ui(module, AppMainLayout, ['div'], ['https://code.jquery.com/jquery-3.7.0.min.js', 'https://code.jquery.com/jquery-3.7.0.min.js']);

package/example_webcomp/components/layouts/AppToDos.js

@@ -1,49 +0,0 @@
-
-require('./PageHeader');
-// require('./ToDoItem');
-require('./../common/InputText');
-require('./Link');
-require('./../services/ServiceToDos').as('Dodo');
-
-
-function main() {
-    var ServiceToDos = Dodo;
-    // var PageHeader = Binh.ui('/layouts/PageHeader.js');
-    var ToDoItem = Binh.ui('/layouts/ToDoItem.js');
-    // var addTodoItem = ServiceToDos.does('add');
-    // var addTodoItem = ServiceToDos.debounce('add', 1500); // trailing only
-    var addTodoItem = ServiceToDos.debounce('add', 1500, true); // both leading & trailing
-    // var addTodoItem = ServiceToDos.debounce('add', 1500, true, true); // leading only
-    // var addTodoItem = ServiceToDos.throttle('add', 1500);
-    // var addTodoItem = ServiceToDos.once('add', 1500);
-    
-    var inputbox = InputText().when('submit', addTodoItem);
-    
-    var todolist = div({ class: 'todo-items' });
-    
-    todolist.subscribe('todos', function(data) {
-        todolist.empty();
-        data.forEach(function(datum) {
-            todolist(
-                ToDoItem(datum).when('remove', ServiceToDos.instant('remove'))
-            );
-        });
-    });
-    
-    var maindiv = div({ class: 'container' });
-    var left_section = div({ id: 'left-section' })('left section')(PageHeader);
-    var right_section = div({ id: 'right-section' })('right section');
-    
-    maindiv(
-        left_section,
-        right_section(
-            div('To-Do List'),
-            inputbox,
-            todolist
-        )
-    );
-    
-    return maindiv;
-}
-
-binh.ui(module, main, ['div', 'span'], ['https://code.jquery.com/jquery-3.7.0.min.js']);

package/example_webcomp/components/layouts/Link.js

@@ -1,16 +0,0 @@
-
-
-function Link() {
-    var { a } = Binh.element('a');
-
-    var text = arguments[0];
-    var path = arguments[1];
-
-    var link = a(text).on('click', function() {
-        Binh.Router.navigate(path);
-    });
-
-    return link;
-}
-
-binh.ui(module, Link);

package/example_webcomp/components/layouts/PageContent.js

@@ -1,25 +0,0 @@
-
-function PageContent() {
-    var { Router } = Binh;
-
-    var PageContent = div({ id: 'page-content' });
-
-    PageContent(
-        new Router({
-            '': div('default work!'),
-            '/abc': div('abc work!'),
-            '/haha': trans('haha work!')
-        })
-    )
-    (
-        function (thisEl) {
-            setTimeout(function() {
-                console.log('>>> Page Content:', thisEl);
-            }, 1000);
-        }
-    );
-
-    return PageContent;
-}
-
-binh.ui(module, PageContent, ['div', 'trans'], ['https://code.jquery.com/jquery-3.7.0.min.js']);

package/example_webcomp/components/layouts/PageHeader.js

@@ -1,49 +0,0 @@
-
-var { Link } = require('./../common/Link');
-
-function PageHeader() {
-    // var Link = Binh.ui('/common/Link2.js');
-    
-    var PageHeader = div({ id: 'page-header' });
-    
-    PageHeader(
-        div({ class: 'container' })(
-            div({ class: 'row' })(
-                nav({ class: 'navbar navbar-default' })(
-                    div({ class: 'container-fluid' })([
-                        div({ class: 'navbar-header' })(
-                            a({ class: 'navbar-brand', href: '#' })(
-                                'Website Name'
-                            )
-                        ),
-                        ul({ class: 'nav navbar-nav' })(
-                            li({ class: 'active' })(
-                                Link('Home', '/')
-                            ),
-                            li(
-                                Link('Abc', '/abc')
-                            ),
-                            li(
-                                Link('Haha', '/haha')
-                            ),
-                            li(
-                                a('Page 3')
-                            )
-                        )
-                    ])
-                )
-            )
-        ),
-        function (thisEl) {
-            setTimeout(function() {
-                console.log('>>> Page Header:', thisEl);
-            }, 1000);
-        }
-    );
-    
-    return PageHeader;
-}
-
-var htmltags = ['div', 'nav', 'ul', 'li', 'a'];
-
-binh.ui(module, PageHeader, htmltags);

package/example_webcomp/components/layouts/ToDoItem.js

@@ -1,26 +0,0 @@
-
-// require('./../styles/ToDoItemStyle');
-require('./../styles/ToDoItemStyle2');
-// require('../styles/todo.css.js');
-
-function main(props) {
-    // var ToDoItemStyle = Binh.style('/styles/todo.css');
-
-    var todoitem = div({ style: 'margin: 3px;' });
-    var removeToDoItem = todoitem.action('remove');
-
-    var remove_button = span({ class: 'btn-remove' })('X');
-
-    remove_button.on('click', function() {
-        removeToDoItem(props.id);
-    });
-
-    todoitem(span(props.text), span('-------'), remove_button);
-
-    // return todoitem.style(ToDoItemStyle);
-    // return todoitem.style('styles/todo.css');
-    return todoitem.style(ToDoItemStyle2);
-    // return todoitem.style(todo);
-}
-
-binh.ui(module, main, ['div', 'span']);

package/example_webcomp/components/services/AnyService.js

@@ -1,6 +0,0 @@
-
-function AnyService() {
-
-}
-
-binh.service(module, AnyService);

package/example_webcomp/components/services/ServiceToDos.js

@@ -1,42 +0,0 @@
-
-binh.service(module, function(define, state, http) {
-    var todos = state.as('todos');
-    
-    todos.schema(function(resolve) {
-        new http(api('get'))
-            .get(function(response) {
-                resolve(parseResponse(response));
-            });
-    });
-    
-    function handleResponse(response) {
-        todos.set(parseResponse(response));
-    }
-    
-    function parseResponse(response) {
-        var todoitems = [];
-    
-        Object.keys(response).forEach(function(key) {
-            var each = response[key];
-            todoitems.push({ id: key, text: each.text });
-        });
-    
-        return todoitems;
-    }
-    
-    define('add', function(value) {
-        new http(api('add'))
-            .body({ text: value })
-            .post(handleResponse);
-    });
-    
-    define('remove', function(id) {
-        new http(api('remove'))
-            .body({ id: id })
-            .post(handleResponse);
-    });
-    
-    function api(relative_url) {
-        return 'https://todolist-of-binh.fly.dev/todos/' + relative_url;
-    }
-});

package/example_webcomp/components/styles/ToDoItemStyle.js

@@ -1,40 +0,0 @@
-
-binh.style(module, function(css) {
-    // css('@charset "utf-8";');
-
-    css(`@import url("styles/temp.css");`);
-    
-
-    css('.btn-remove', [
-        'color: purple;',
-        'margin-left: 10px'
-    ]);
-
-    css(
-    `@media (min-width: 800px) {
-        .btn-remove {
-            color: red;
-            margin-left: '15px';
-        }
-    }`
-    );
-
-    css(`
-    @keyframes slidein {
-        from {
-            transform: translateX(0%);
-        }
-    
-        to {
-            transform: translateX(100%);
-        }
-    }
-    `);
-
-    css(`
-    @page {
-        size: 8.5in 9in;
-        margin-top: 4in;
-    }
-    `);
-});

package/example_webcomp/components/styles/ToDoItemStyle2.js

@@ -1,2 +0,0 @@
-
-binh.css(module, './todo.css');

package/example_webcomp/components/styles/temp.css

@@ -1,7 +0,0 @@
-
-@import url("/styles/todo.css");
-
-.btn-remove {
-    color: purple;
-    margin-left: '15px';
-}

package/example_webcomp/components/styles/todo.css

@@ -1,31 +0,0 @@
-@charset "utf-8";
-
-@import url("/styles/temp.css");
-
-/* .btn-remove {
-    color: blue;
-    margin-left: '15px';
-} */
-
-@media (min-width: 800px) {
-
-    .btn-remove {
-        color: red;
-        margin-left: '15px';
-    }
-}
-
-@keyframes slidein {
-    from {
-        transform: translateX(0%);
-    }
-
-    to {
-        transform: translateX(100%);
-    }
-}
-
-@page {
-    size: 8.5in 9in;
-    margin-top: 4in;
-}

package/example_webcomp/components/styles/todo.css.js

@@ -1,2 +0,0 @@
-
-binh.css(module);

package/example_webcomp/config.js

@@ -1,13 +0,0 @@
-
-module.exports = function(loader) {
-    var sample = {
-        ABC: 123,
-        Text: 'Hello',
-        NAME: 'MyApp',
-        PORT: 1400
-    };
-
-    var { filter, object } = loader;
-
-    filter(object, sample, ['PORT', 'NAME']);
-};

package/example_webcomp/index.js

@@ -1,10 +0,0 @@
-'use strict';
-
-const { Binh } = require('../src/binh');
-
-new Binh()
-    .web('public', 'components')
-    .port(1234)
-    .start(function(server, configs) {
-        console.log('### START >>> configs:', configs);
-    });