mofron-comp-appbase - npm Package Compare versions

Comparing version 0.4.10 to 0.4.11

index.js

 /**
  * @file   mofron-comp-appbase/index.js
  * @brief  common application component for mofron
+ *         it makes easy to build page.
  * @author simpart
@@ -12,6 +13,2 @@ */
 
-/**
- * @class mofron.comp.AppBase
- * @brief common application component class
- */
 mf.comp.AppBase = class extends mf.Component {
@@ -21,5 +18,6 @@ /**
      *
-     * @param p1 (hash object) set option
-     * @param p1 (string) set app title
-     * @param p2 (Component Object) child component
+     * @param (string) title parameter
+     * @param (Component) child component
+     * @pmap title,child
+     * @type private
      */
@@ -41,3 +39,3 @@ constructor (po, p2) {
      * 
-     * @note private method
+     * @type private
      */
@@ -63,7 +61,9 @@ initDomConts () {
     /**
-     * setter/getter app title (header text)
+     * set app title (header text)
      *
-     * @param p1 (string) app title
-     * @param p1 (undefined) call as app title
-     * @return (string) app title
+     * @param (string/Text) app title
+     * @param (string/Image) string: path to app logo image
+     *                       Image: logo image
+     * @return (Text) app title
+     * @type parameter
      */
@@ -84,3 +84,6 @@ title (prm, lg) {
     /**
-     * setter/getter app header
+     * app header
+     * 
+     * @param (Header) header component
+     * @type parameter
      */
@@ -95,8 +98,7 @@ header (prm) {
     /**
-     * setter/getter background wrapper
+     * background wrapper
      *
-     * @param p1 (Component) background wrapper component
-     * @param p1 (undefined) call ass getter
+     * @param (Component) background wrapper component
      * @return (Component) background wrapper component
-     * @note private method
+     * @type private
      */
@@ -121,8 +123,8 @@ bgwrap (prm) {
     /**
-     * setter/getter background component
+     * background component
      * height is synchronized with window height by auto
      * 
-     * @param p1 (Component) background component
-     * @param p1 (undefined) call ass getter
+     * @param (Component) background component
      * @return (Component) background component
+     * @type parameter
      */
@@ -146,3 +148,3 @@ background (prm) {
             prm.option({
-                effect : [ new Backgd(), new Synwin([false, true], [0, hrd_ofs]) ]
+                effect : [ new Backgd(), new Synwin([false, true], ["0rem", hrd_ofs + "rem"]) ]
             });
@@ -155,2 +157,9 @@ } catch (e) {
     
+    /**
+     * height
+     * 
+     * @param (string) height size
+     * @return (string) height size
+     * @type parameter
+     */
     height (prm) {
@@ -163,5 +172,15 @@ try {
             /* setter */
+	    opt = undefined;
+	    if (true === Array.isArray(prm)) {
+	        opt = prm[1];
+		prm = prm[0];
+	    }
             let set_hei = mf.func.getSize(
                 mf.func.sizeDiff(prm, this.header().height())
             );
+	    if (undefined !== opt) {
+	        super.height((0 > set_hei.value()) ? [prm,opt] : [set_hei,opt]);
+	    } else {
+	        super.height((0 > set_hei.value()) ? prm : set_hei);
+	    }
             super.height((0 > set_hei.value()) ? prm : set_hei);
@@ -176,7 +195,7 @@ } catch (e) {
      * setter/getter header color
-     *
-     * @param p1 (string) color value (css)
-     * @param p1 (Array) [red(0-255), green(0-255), blue(0-255)]
-     * @param p1 (undefined) call as getter
-     * @return (string) color value (css)
+     * 
+     * @param (string/Array) string: color,#hex
+     *                       Array: r,g,b
+     * @return (string) color
+     * @type parameter
      */
@@ -193,15 +212,9 @@ mainColor (prm) {
      *
-     * @param p1 (string) color value (css)
-     * @param p1 (Array) [red(0-255), green(0-255), blue(0-255)]
-     * @param p1 (undefined) call as getter
-     * @return (string) color value (css)
+     * @param (string/Array) string: color,#hex
+     *                       Array: r,g,b
+     * @return (string) color
+     * @type parameter
      */
     baseColor (prm) {
-        try {
-            let cnt = this.getChild(true)[2]; 
-            if (undefined === prm) {
-                cnt.style('background');
-            }
-            mf.func.cmpColor(cnt, 'background', prm);
-        } catch (e) {
+        try { return mf.func.cmpColor(this, 'background', prm); } catch (e) {
             console.error(e.stack);
@@ -208,0 +221,0 @@ throw e;

package.json

 {
   "name": "mofron-comp-appbase",
-  "version": "0.4.10",
+  "version": "0.4.11",
   "description": "application base component for mofron",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -1,27 +0,41 @@
-# mofron-comp-appbase
-this is application base component for mofron.<br>
-please see [here](https://github.com/mofron/mofron) about an overview of mofron
+#   mofron-comp-appbase
+[mofron](https://mofron.github.io/mofron/) is module based frontend framework.
 
+ common application component for mofron
+
+ it makes easy to build page.
+
+
 # Install
-
-```bash
-npm install mofron-comp-appbase
 ```
+npm install mofron mofron-comp-appbase
+```
 
-# Quick Start
+# Sample
+```html
+<require>
+    <tag module="mofron-comp-image">Image</tag>
+    <tag module="mofron-comp-appbase">AppBase</tag>
+</require>
 
-```javascript
-require('mofron');
-let App = require('mofron-comp-appbase');
-new App({
-    title : 'Test App Title',
-    visible : true
-});
+<AppBase mainColor=#f0e6fa title=mofron>
+    <background>
+        <Image>./img/mofron.png</Image>
+    </background>
+</AppBase>
 ```
+# Parameter
 
-# Class Specification
-| Method          | Parameter                                                                    |    Description                  |
-|:------------------|:-----------------------------------------------------------------|:-------------------------------|
-| title | string,<br>text component     |application title.<br> this parameter is displayed in the page header. |
-| header | header component | replace header component.<br>default header component is [mofron-comp-apphdr](https://github.com/simpart/mofron-comp-apphdr).|
-| color | color object | color setter/getter.<br> it change header color if you called this as setter.<br>you must not specify any parameter if you call this as getter.  |
+|Simple<br>Param | Parameter Name | Type | Description |
+|:--------------:|:---------------|:-----|:------------|
+|◯ | title | string/Text | app title |
+| | | string/Image | string: path to app logo image |
+| | | | Image: logo image |
+| | header | Header | header component |
+| | background | Component | background component |
+| | height | string | height size |
+| | mainColor | string/Array | string: color,#hex |
+| | | | Array: r,g,b |
+| | baseColor | string/Array | string: color,#hex |
+| | | | Array: r,g,b |
+

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8770

increased by4.18%

Number of package files

5

increased by25%

Lines of code

203

increased by6.84%

Number of lines in readme file

42

increased by50%

No dependency changes