binhend 1.2.5 → 1.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "binhend",
-  "version": "1.2.5",
+  "version": "1.3.0",
   "description": "",
   "main": "index.js",
   "author": "Nguyen Duc Binh",

package/src/binh.web.builder.js

@@ -6,13 +6,15 @@ const ComponentFormat = require('./component.format');
 const ComponentBuild = require('./component.build');
 
 function WebBuilder(binh, Binh) {
-    binh.context = function(module) {
-        var context = { module };
+    binh.context = function(module, defaultRequire) {
+        var context = { module, require: defaultRequire };
         return {
             context,
             tag: tag.bind(context),
-            script: script.bind(context)
-        }
+            script: script.bind(context),
+            require: customRequire.bind(context),
+            css: css.bind(context)
+        };
     };
 
     function tag(tagNames) {
@@ -26,6 +28,17 @@ function WebBuilder(binh, Binh) {
         var links = this.component.links;
         links.push.apply(links, scripts);
     }
+
+    function customRequire(filePath) {
+        filePath = filePath.endsWith('.css') ? (filePath+'.js') : filePath;
+        return this.require(filePath);
+    }
+
+    function css() {
+        var csses = Array.from(arguments);
+        var appliedStyles = this.component.options.csses;
+        appliedStyles.push.apply(appliedStyles, csses);
+    }
     
     binh.component = function(context, ui, service, style) {
         var component = ui || service || style;
@@ -36,6 +49,7 @@ function WebBuilder(binh, Binh) {
         context.component = component;
         component.htmltags = [];
         component.links = [];
+        component.options = { csses: [] };
 
         binh.bundle(type, context.module, component);
     };
@@ -99,6 +113,7 @@ function WebBuilder(binh, Binh) {
 
     function alias(name) {
         this.alias = name;
+        return this;
     }
 
     Binh.web = function(webPath, sourcePath, modulePath) {

package/src/code.js

@@ -49,10 +49,7 @@ function dependencies(component, root, metadata) {
         var { type, name, url, component } = current;
 
         if (existed) {
-            var sameVariableName = (name === existed.name);
-            if (sameVariableName) return;
-
-            declaration += `${name} = Binh.${type}('${url}');\r\n`;
+            declaration += `Binh.later(function() {${name} = Binh.${type}('${url}');});\r\n`;
             variables[name] = true;
         }
         else {
@@ -61,6 +58,12 @@ function dependencies(component, root, metadata) {
             variables[name] = true;
         };
 
+        var optionCode = buildCodeApplyOptions(name, component);
+
+        if (optionCode) {
+            declaration += `Binh.later(function() {${optionCode};});\r\n`;
+        }
+
         code += IIF([
             dependencies(component, root, Object.assign({}, global, local)),
             declaration
@@ -78,6 +81,24 @@ function dependencies(component, root, metadata) {
     return code;
 }
 
+function buildCodeApplyOptions(componentName, component) {
+    var options = component.options, variableNames = [];
+
+    if (!options) return '';
+
+    component.type === 'ui' && options.csses.forEach(function(cssModule) {
+        var filename = cssModule.filename;
+        var variableName = component.vars[filename] || parse(filename).name.replace(/-/g, '').replace(/\W.*/, '');
+        variableNames.push(variableName);
+    });
+
+    if (variableNames.length) {
+        return `${componentName}.style([${variableNames.join(',')}])`;
+    }
+
+    return '';
+}
+
 function bundle(component, root) {
     var code = '';
 
@@ -85,7 +106,7 @@ function bundle(component, root) {
 
     code += '\r\n';
 
-    code += `Binh.${component.type}(${component.toString()});\r\n`;
+    code += `Binh.${component.type}(${component.toString()})${buildCodeApplyOptions('', component)};\r\n`;
 
     return code;
 }

package/src/component.format.js

@@ -7,28 +7,35 @@ const { scanNestedFiles, cloneFile, printError, makeFullDirPath } = require('./c
 // [-] Enhance code by removing sync logics (except for existsSync, mkdirSync): readdir, readFileSync, (statSync?)
 
 const PREFIX_CODE =
-`var { context, tag, script } = binh.context(module);
+`var { context, tag, script, require, css } = binh.context(module, require);
 binh.component(context, ui, service, style);
 var ui = null, service = null, style = null;\r\n\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);
+    console.info('[BINHEND][COMPONENT] Format files from:', sourceRootPath);
+    console.info('[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);
-
-        makeFullDirPath(fileOutputPath);
-
-        if (parse(file.name).ext !== '.js') {
-            return cloneFile(fileSourcePath, fileOutputPath);
-        }
         
         try {
+            makeFullDirPath(fileOutputPath);
+
+            var fileExtension = parse(file.name).ext;
+    
+            if (fileExtension === '.css') {
+                var cssModuleCode = 'binh.css(module);';
+                writeFileSync(fileOutputPath + '.js', cssModuleCode, { encoding: 'utf8', flag: 'w' });
+            }
+    
+            if (fileExtension !== '.js') {
+                return cloneFile(fileSourcePath, fileOutputPath);
+            }
+
             var content = readFileSync(fileSourcePath, { encoding: 'utf8', flag: 'r' });
             var code = PREFIX_CODE + content.trim() + '\r\n\r\n;binh.final(module);';
             writeFileSync(fileOutputPath, code, { encoding: 'utf8', flag: 'w' });