mofron - npm Package Compare versions

Comparing version 0.5.7 to 0.6.0

package.json

 {
   "name": "mofron",
-  "version": "0.5.7",
+  "version": "0.6.0",
   "description": "front-end framework for javascript",
@@ -10,42 +10,33 @@ "main": "./dist/mofron.js",
   "dependencies": {
-    "mofron-comp-accordion"  : "",
-    "mofron-comp-button"     : "",
-    "mofron-comp-carousel"   : "",
-    "mofron-comp-checkbox"   : "",
-    "mofron-comp-code"       : "",
-    "mofron-comp-date"       : "",
-    "mofron-comp-dialog"     : "",
-    "mofron-comp-dropdown"   : "",
-    "mofron-comp-form"       : "",
-    "mofron-comp-frame"      : "",
-    "mofron-comp-header"     : "",
-    "mofron-comp-heading"    : "",
-    "mofron-comp-image"      : "",
-    "mofron-comp-inputtext"  : "",
-    "mofron-comp-loading"    : "",
-    "mofron-comp-menu"       : "",
-    "mofron-comp-message"    : "",
-    "mofron-comp-notify"     : "",
-    "mofron-comp-pagination" : "",
-    "mofron-comp-progress"   : "",
-    "mofron-comp-radio"      : "",
-    "mofron-comp-rating"     : "",
-    "mofron-comp-switch"     : "",
-    "mofron-comp-tab"        : "",
-    "mofron-comp-table"      : "",
-    "mofron-comp-text"       : "",
-    "mofron-comp-textarea"   : "",
-    "mofron-comp-time"       : "",
-    "mofron-comp-tooltip"    : "",
-    "mofron-comp-tree"       : "",
-    "mofron-comp-wizard"     : "",
-    
-    "mofron-event-click"     : "",
-    "mofron-event-mouseover" : "",
-    "mofron-layout-horizon"   : "",
-    "mofron-layout-hrzcenter" : "",
-    "mofron-layout-margin"    : "",
-    "mofron-layout-padding"   : "",
-    
-    "mofron-effect-fade"     : ""
+    "mofron-comp-accordion": "",
+    "mofron-comp-button": "",
+    "mofron-comp-carousel": "",
+    "mofron-comp-checkbox": "",
+    "mofron-comp-code": "",
+    "mofron-comp-date": "",
+    "mofron-comp-dialog": "",
+    "mofron-comp-dropdown": "",
+    "mofron-comp-form": "",
+    "mofron-comp-frame": "",
+    "mofron-comp-header": "",
+    "mofron-comp-heading": "",
+    "mofron-comp-image": "",
+    "mofron-comp-inputtext": "",
+    "mofron-comp-loading": "",
+    "mofron-comp-menu": "",
+    "mofron-comp-message": "",
+    "mofron-comp-notify": "",
+    "mofron-comp-pagination": "",
+    "mofron-comp-progress": "",
+    "mofron-comp-radio": "",
+    "mofron-comp-rating": "",
+    "mofron-comp-switch": "",
+    "mofron-comp-tab": "",
+    "mofron-comp-table": "",
+    "mofron-comp-text": "",
+    "mofron-comp-textarea": "",
+    "mofron-comp-time": "",
+    "mofron-comp-tooltip": "",
+    "mofron-comp-tree": "",
+    "mofron-comp-wizard": ""
   },
@@ -59,3 +50,3 @@ "repository": {
   ],
-  "author": "siparts",
+  "author": "simparts",
   "license": "SEE LICENSE IN LICENSE",
@@ -67,7 +58,9 @@ "bugs": {
   "devDependencies": {
-    "babel-core": "^6.21.0",
+    "babel": "^6.5.2",
+    "babel-core": "^6.22.1",
     "babel-loader": "^6.2.10",
-    "babel-preset-es2015": "^6.18.0",
-    "webpack": "^1.14.0"
+    "babel-preset-es2015": "^6.22.0",
+    "expose-loader": "^0.7.1",
+    "webpack": "^2.2.1"
   }
 }

src/Component.js

 /**
- * @file   component.js
+ * @file   Component.js
  * @author simpart
@@ -28,3 +28,3 @@ */
             this.layout   = new Array();
-            this.m_style  = new mofron.util.Vdom('div');
+            this.m_style  = new mofron.util.Dom();
             this.m_vdom   = null;
@@ -424,5 +424,12 @@ this.m_target = null;
     
-    update () {
+    destroy () {
         try {
+            if (false === this.isRendered()) {
+                throw new Error('not render yet');
+            }
+            var del_tgt = this.vdom().getChild();
             
+            for (var idx_del in del_tgt) {
+                del_tgt[idx_del].getRawDom().remove();
+            }
         } catch (e) {
@@ -434,11 +441,2 @@ console.error(e.stack);
     
-    destroy () {
-        try {
-            this.vdom().getDom().innerHTML = null;
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
     initDomContsCtl() {
@@ -449,3 +447,3 @@ try {
             }
-            this.vdom(new mofron.util.Vdom('div',this));
+            this.vdom(new mofron.util.Vdom());
             this.initDomConts(this.param);
@@ -477,2 +475,3 @@
             this.target(this.vdom());
+            this.vdom().addChild(new mofron.util.Dom('div',this));
         } catch (e) {
@@ -491,2 +490,3 @@ console.error(e.stack);
             if (null === _flg) {
+                /* getter */
                 if (false === this.isRendered()) {
@@ -493,0 +493,0 @@ return false;

src/entry.js

@@ -1,4 +0,5 @@
-require('expose?mofron!./core.js');
+require('expose-loader?mofron!./core.js');
 require('./Base.js');
 require('./function.js');
+require('./util/Dom.js');
 require('./util/Vdom.js');
@@ -15,3 +16,1 @@ require('./util/Style.js');
 require('./Template.js');
-
-export {mofron};

src/Event.js

@@ -20,3 +20,2 @@ /**
             super();
-            this.setBaseName('Event');
             this.name('Event');
@@ -23,0 +22,0 @@ var _fnc    = (fnc === undefined) ? null : fnc;

src/util/Font.js

@@ -223,3 +223,3 @@ /**
             if (true === this.thm_flg) {
-                tgt.getTarget().addClname(this.thm_sel);
+                tgt.getTarget().addClass(this.thm_sel);
             } else {
@@ -226,0 +226,0 @@ tgt.style('font-family', this.getFamilyStyle());

src/util/Style.js

@@ -55,3 +55,3 @@ /**
                      (true === this.target.isRendered()) ) {
-                    this.target.getDom().style[mofron.func.getCamelStyle(key)] = _val;
+                    this.target.getRawDom().style[mofron.func.getCamelStyle(key)] = _val;
                 }
@@ -58,0 +58,0 @@ }

src/util/Vdom.js

@@ -8,5 +8,5 @@ /**
  * @class Vdom
- * @brief virtual dom defined
+ * @brief virtual dom class
  */
-mofron.util.Vdom = class extends mofron.Base {
+mofron.util.Vdom = class extends mofron.util.Dom {
     /**
@@ -18,23 +18,7 @@ * initialize member
      */
-    constructor (tg, cmp) {
+    constructor () {
         try {
             super();
+            this.m_style = {};
             this.name('Vdom');
-            
-            this.id       = null;
-            this.comp     = (undefined === cmp) ? null : cmp;
-            this.m_tag    = null;
-            this.clname   = new Array();
-            this.m_parent = null;
-            this.child    = new Array();
-            this.m_style  = new mofron.util.Style(this);
-            this.m_attr   = {};
-            this.m_text   = null;
-            this.value    = null;
-            this.entity   = null;
-            
-            this.tag(tg);
-            if (null !== this.comp) {
-                this.attr('component', this.comp.name());
-            }
         } catch (e) {
@@ -47,7 +31,6 @@ console.error(e.stack);
     /**
-     * tar name setter / getter
-     * r('invalid parameter');
-     *
+     * tag name setter / getter to(from) children
+     * 
      * @param tg : (string) tag name (option)
-     * @return (string) tag name
+     * @return (string,null) tag name
      */
@@ -57,4 +40,8 @@ tag (tg) {
             var _tg = (undefined === tg) ? null : tg;
+            var chd = this.getChild();
             if (null === _tg) {
                 /* getter */
+                if ((0 === chd.length) || (null === this.m_tag)) {
+                    return null;
+                }
                 return this.m_tag;
@@ -64,4 +51,9 @@ }
                 throw new Error('invalid parameter');
+            } else if (0 === chd.length) {
+                throw new Error('there are no child in vdom');
             }
             /* setter */
+            for (var idx in chd) {
+                chd[idx].tag(_tg);
+            }
             this.m_tag = _tg;
@@ -75,63 +67,4 @@ } catch (e) {
     /**
-     * get tag id
-     * 
-     * @return (string) tag id
-     */
-    getId () {
-        try {
-            if (null === this.id) {
-                this.id = mofron.func.getId();
-            }
-            return this.id;
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
-     * add child vdom
+     * style setter / getter to(from) children
      *
-     * @param chd : (object) child vdom
-     */
-    addChild (chd) {
-        try {
-            if ('object' != (typeof chd)) {
-                throw new Error('invalid parameter');
-            }
-            
-            chd.parent(this);
-            this.child.push(chd);
-            this.value = null;
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
-     * get child vdom object
-     *
-     * @param idx : (number) child index
-     * @return (object) child vdom object
-     */
-    getChild (idx) {
-        try {
-            var _idx = (idx === undefined) ? null : idx;
-            if (null === _idx) {
-                return this.child;
-            }
-            if ((0 > _idx) || ((this.child.length-1) < _idx)) {
-                throw new Error('invalid parameter');
-            }
-            return this.child[_idx];
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
-     * style setter / getter
-     *
      * @param key : (string) style key (option)
@@ -144,15 +77,22 @@ * @param val : (string) style value (option)
         try {
-            if ( (undefined === val) &&
-                 ('string'  === typeof key) ) {
+            if (undefined === val) {
                 /* getter */
-                return this.m_style.get(key);
+                if ('string' === (typeof key)) {
+                    if (undefined === this.m_style[kay]) {
+                        return null;
+                    }
+                    return this.m_style[key];
+                } else if (undefined === key) {
+                    return this.m_style;
+                } else {
+                    throw new Error('invalid parameter');
+                }
             } else if ( ('string' === typeof key) &&
                         (('string' === typeof val) || (null === val)) ) {
                 /* setter */
-                this.m_style.set(key, val);
-                this.value;
-            } else if ( (undefined === key) &&
-                        (undefined === val) ) {
-                /* getter */
-                return this.m_style;
+                this.m_style[key] = val;
+                var chd = this.getChild();
+                for (var idx in chd) {
+                    chd[idx].style(key, val);
+                }
             } else {
@@ -168,20 +108,2 @@ throw new Error('invalid parameter');
     /**
-     * set style object
-     * 
-     */
-    setStyle(sty) {
-        try {
-            if ('object' !== (typeof sty)) {
-                throw new Error('invalid parameter');
-            }
-            for (var key in sty) {
-                this.m_style.set(key, sty[key]);
-            }
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
      * tag attribute setter / getter
@@ -191,22 +113,25 @@ *
      * @param val : (string) attribute value (option)
-     * @return
+     * @return (string,null) attribute value 
      */
     attr (key, val) {
         try {
-            if ( ('string' === typeof key) &&
-                 (('string' === typeof val) || (null === val)) ) {
+            if (undefined === val) {
+                /* getter */
+                if ('string' === (typeof key)) {
+                    if (undefined === this.m_attr[key]) {
+                        return null;
+                    }
+                    return this.m_attr[key];
+                } else if (undefined === kay) {
+                    return this.m_attr;
+                } else {
+                    throw new Error('invalid parameter');
+                }
+            } else if ('string' === (typeof key)) {
                 /* setter */
+                var chd = this.getChild();
+                for (var idx in chd) {
+                    chd[idx].attr(key, val);
+                }
                 this.m_attr[key] = val;
-                if (true === this.isRendered()) {
-                    this.getDom().setAttribute(key, val);
-                }
-                this.value = null;
-            } else if ( ('string'  === typeof key) &&
-                        (undefined === val) ) {
-                /* getter */
-                return this.m_attr[key];
-            } else if ( (undefined === key) ||
-                        (undefined === val) ) {
-                /* getter */
-                return this.m_attr;
             } else {
@@ -226,3 +151,3 @@ throw new Error('invalid parameter');
      */
-    addClname(name) {
+    addClass(name) {
         try {
@@ -232,3 +157,7 @@ if ('string' != (typeof name)) {
             }
-            this.clname.push(name);
+            var chd = this.getChild();
+            for (var idx in chd) {
+                chd[idx].addClass(name);
+            }
+            this.m_class.push(name);
         } catch (e) {
@@ -250,6 +179,7 @@ console.error(e.stack);
                 /* setter */
-                if (true === this.isRendered()) {
-                    this.getDom().innerHTML = txt;
+                var chd = this.getChild();
+                for (var idx in chd) {
+                    chd[idx].text(txt);
                 }
-                this.m_text  = txt;
+                this.m_text = txt;
             } else if (undefined === txt) {
@@ -275,48 +205,2 @@ /* getter */
             var ret_val = '';
-            if (null != this.value) {
-                ret_val += this.value;
-            } else {
-                //console.log(this.getId() + ' -> getValue()');
-                ret_val += '<'+ this.tag() + ' ';
-                
-                /* set id attribute */
-                ret_val += 'id="'+ this.getId() +'" ';
-                
-                /* set class attribute:*/
-                var clname_str = 'class="';
-                for (var idx in this.clname) {
-                    clname_str += this.clname[idx] + ' ';
-                }
-                clname_str += '"';
-                if ('class=""' != clname_str) {
-                    ret_val += clname_str;
-                }
-                
-                /* get style string */
-                var style_conts = this.m_style.get();
-                var style = 'style="';
-                for(var key in style_conts) {
-                    if (null === style_conts[key]) {
-                        continue;
-                    }
-                    style += key + ':'+ style_conts[key] + ';';
-                }
-                style += '"';
-                if ('style=""' != style) {
-                    ret_val += style;
-                }
-                
-                /* get attribute string */
-                var attr_conts = '';
-                var attr_val   = this.attr();
-                for (var key in attr_val) {
-                    attr_conts += key;
-                    if (null != attr_val[key]) {
-                        attr_conts += '=' + attr_val[key] + ' ';
-                    }
-                }
-                ret_val += attr_conts + '>';
-                
-                this.value = ret_val;
-            }
             
@@ -330,10 +214,2 @@ /* get child value */
             
-            if (null != this.text()) {
-                ret_val += this.text();
-            }
-            
-            if (false === this.isSimpleTag()) {
-                ret_val += '</'+ this.tag() +'>';
-            }
-
             return ret_val;
@@ -346,59 +222,4 @@ } catch (e) {
     
-    /**
-     * draw dom to target dom
-     * 
-     * @param tgt : (object) target dom
-     * @param upd : (boolean) update flag
-     */
-    pushDom (tgt, upd) {
-        try {
-            var _upd = (undefined === upd) ? false : upd;
-            if ('boolean' !== typeof _upd) {
-                throw new Error('invalid parameter');
-            }
-            
-            if (true === this.isRendered()) {
-                throw new Error('already pushed');
-            }
-            
-            this.parent(tgt);
-            
-            var tgt_dom = null;
-            if (null === this.parent()) {
-                tgt_dom = document.body;
-            } else {
-                tgt_dom = this.parent().getDom();
-            }
-            
-            if (false === _upd) {
-                tgt_dom.insertAdjacentHTML('beforeend',this.getValue());
-            } else {
-                tgt_dom.innerHTML = this.getValue();
-            }
-            this.setPushed();
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
     
     /**
-     * get vdom status
-     *
-     * @return (boolean) true : this vdom had pushed
-     * @return (boolean) false : this vdom had not pushed
-     */
-    isRendered () {
-        try {
-            if (null === this.entity) {
-                return false;
-            }
-            return true;
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
      * update vdom status
@@ -410,2 +231,9 @@ *
         try {
+            var pnt = this.parent();
+            if (null === pnt) {
+                this.entity = document.body;
+            } else {
+                this.entity = pnt.getRawDom();
+            }
+            
             if (0 != this.child.length) {
@@ -416,3 +244,3 @@ for(var chd_idx in this.child) {
             }
-            this.entity = document.querySelector('#' + this.getId());
+            
         } catch (e) {
@@ -425,52 +253,8 @@ console.error(e.stack);
     /**
-     * check whether tag name is simple tag
+     * get parent's  pushed dom object from blowser
      *
-     * @return (boolean) true  : this vdom is simple tag
-     * @return (boolean) false : this vdom is not simple tag
+     * @return (object) raw dom object
      */
-    isSimpleTag () {
+    getRawDom () {
         try {
-            if ( ('br'    == this.m_tag) ||
-                 ('hr'    == this.m_tag) ||
-                 ('input' == this.m_tag) ||
-                 ('img'   == this.m_tag)) {
-                return true;
-            }
-            return false;
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
-     * parent vdom setter / getter
-     * 
-     * @param pnt : (object) parent vdom
-     * @return (object) parant vdom
-     */
-    parent (pnt) {
-        try {
-            if ('object' === (typeof pnt)) {
-                /* setter */
-                this.m_parent = pnt;
-            } else if (undefined === pnt) {
-                /* getter */
-                return this.m_parent;
-            } else {
-                throw new Error('invalid parameter');
-            }
-        } catch (e) {
-            console.error(e.stack);
-            throw e;
-        }
-    }
-    
-    /**
-     * get pushed dom object
-     *
-     * @return (object) dom object
-     */
-    getDom () {
-        try {
             if (false === this.isRendered()) {
@@ -477,0 +261,0 @@ throw new Error('this vdom is not rendered yet');

webpack.config.js

@@ -11,3 +11,3 @@ module.exports = {
             exclude: /node_modules/,
-            loader: 'babel',
+            loader: 'babel-loader',
             query: {
@@ -14,0 +14,0 @@ presets: ['es2015']

Fixed alerts

Wildcard dependency

Quality

Package has a dependency with a floating version range. This can cause issues if the dependency publishes a new major version.

Found 7 instances in 1 package

Improved metrics

Total package byte prevSize

186156

increased by10.45%

Dependency count

31

decreased by-18.42%

Number of package files

22

increased by4.76%

Lines of code

5386

increased by12.49%

Number of medium quality alerts

32

decreased by-17.95%

Worsened metrics

Dev dependency count

6

increased by50%

Dependency changes

• - Removedmofron-effect-fade@

• - Removedmofron-event-click@

• - Removedmofron-event-mouseover@

• - Removedmofron-layout-horizon@

• - Removedmofron-layout-hrzcenter@

• - Removedmofron-layout-margin@

• - Removedmofron-layout-padding@

• - Removedmofron-event-mouseover@0.6.1(transitive)

• - Removedmofron-layout-hrzcenter@0.5.5(transitive)

• - Removedmofron-layout-padding@0.2.1(transitive)