feat: <add uku-current-state on component and add setState function o…

…n cc>
momoko8443 · Sep 21, 2018 · 7cfbc7e · 7cfbc7e
1 parent 9e9fde4
commit 7cfbc7e
Show file tree

Hide file tree

Showing 8 changed files with 58 additions and 13 deletions.
diff --git a/demo/components/comp6.html b/demo/components/comp6.html
@@ -4,11 +4,14 @@
         <div>{{cc.b}}</div>
         <div>{{cc.user.name}}</div>
         <button uku-onclick="cc.sayHello()">click</button>
+        <p uku-render="cc._currentState === 'notlogin'">not login</p>
+        <p uku-render="cc._currentState === 'islogin'">login success</p>
     </template>
     <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
     <script>
         this.a = 'a';
         this.b = 'b';
+        this._currentState = 'notlogin';
         this.sayHello = function(){
             alert(uku);
             alert($);

diff --git a/demo/native.html b/demo/native.html
@@ -12,22 +12,32 @@
     </head>
 
 <body uku-application>
-    <my-comp5 uku-item-value="99 + myCtrl.number" uku-item-value2="myCtrl.show"></my-comp5>
-    <my-comp6></my-comp6>
+    <!-- <my-comp5 uku-item-value="99 + myCtrl.number" uku-item-value2="myCtrl.show"></my-comp5> -->
+    <my-comp6 id="comp6" uku-current-state="myCtrl.loginState"></my-comp6>
+    <button uku-onclick="myCtrl.switchState()">change state</button>
 </body>
 <script>
     var uku = new Ukulele();
     uku.registerController('myCtrl',new MyCtrl(uku));
-    //uku.registerComponent('my-comp2',"components/comp2.html");
-    //uku.registerComponent('my-comp',"components/comp1.html");
-    //uku.registerComponent('my-item',"components/my_item.html");
-    //uku.registerComponent('my-comp3','components/comp3.html');
-    //uku.registerComponent('my-comp4','components/comp4.html');
-    uku.registerComponent('my-comp5','components/comp5.html');
+
+    //uku.registerComponent('my-comp5','components/comp5.html');
     uku.registerComponent('my-comp6','components/comp6.html');
     uku.init();
 
     function MyCtrl(uku){
+        var state = 'notlogin';
+        this.switchState = function(){ 
+            if(state === 'notlogin'){
+                state = 'islogin';
+
+            }else{
+                state = 'notlogin';
+
+            }
+            this.loginState = state;
+            // uku.getComponentController('comp6').setState(state);
+
+        };
         this.clickHandler = function(e){
             console.log(e.data.message);
         }

diff --git a/dist/uku.js b/dist/uku.js
diff --git a/dist/uku.js.map b/dist/uku.js.map
diff --git a/src/core/Analyzer.ts b/src/core/Analyzer.ts
@@ -134,7 +134,6 @@ export class Analyzer extends EventEmitter {
 
     private async dealWithComponent(tag, template, Clazz, attrs): Promise<any> {
         let randomAlias = 'cc_' + Math.floor(10000 * Math.random()).toString();
-
         //should consider white space between characters
         template = template.replace(new RegExp("\'cc\\.", 'gm'), "'" + randomAlias + '.');
         template = template.replace(new RegExp('"cc\\.', 'gm'), '"' + randomAlias + '.');
@@ -161,6 +160,24 @@ export class Analyzer extends EventEmitter {
                 event['data'] = data;
                 cc._dom.dispatchEvent(event);
             };
+            /* if(!cc.setState){
+                cc.setState = function(state){
+                    cc._currentState = state;
+                    self.uku.refresh(cc._alias);
+                }
+                Object.defineProperty(cc, 'currentState', {
+                    set: function(value){
+                        if(value){
+                            cc._currentState = value;
+                            self.uku.refresh(cc._alias);
+                        }
+                    },
+
+                    get: function(){
+                        return cc._currentState;
+                    }
+                })
+            } */
             this.uku.registerController(randomAlias, cc);
             for (let i = 0; i < attrs.length; i++) {
                 let attr = attrs[i];

diff --git a/src/core/IUkulele.ts b/src/core/IUkulele.ts
@@ -17,6 +17,8 @@ export interface IUkulele extends IEventEmitter{
 
 	getComponent(tagName);
 
+	getComponentController(componentId): Object;
+
 	refresh(alias,excludeElement?);
 	//internal function
 	_internal_getDefinitionManager():DefinitionManager;

diff --git a/src/model/directive/BoundItemAttrRender.ts b/src/model/directive/BoundItemAttrRender.ts
@@ -10,7 +10,6 @@ export class BoundItemAttrRender extends BoundItemAttribute{
     }
     render(controllers):void{
         let attr:string = this.attributeName;
-        let elementName:string = this.element.tagName;
         let finalValue = UkuleleUtil.getFinalValue(controllers,attr);
         if(finalValue){
             let oldDisplaySetting = this.element.getAttribute("data-old-display");

diff --git a/src/util/UkuleleUtil.ts b/src/util/UkuleleUtil.ts
@@ -191,7 +191,21 @@ export class UkuleleUtil {
             }else{
                 let selfExcutingFrame = 
                 `	(function(){
-                        return function(uku){
+                        return function(uku){                
+                            Object.defineProperty(this, 'currentState', {
+                                set: function(value){
+                                    if(value){
+                                        this._currentState = value;
+                                        uku.refresh(this._alias);
+                                    }
+                                }
+                            });
+
+                            this.setState = function(state){
+                                this._currentState = state;
+                                uku.refresh(this._alias);
+                            };
+
                             ${originalScript}
                         };
                     })();