resources/RooUsage.txt

[app.Builder.js] / resources / roo.builder.js

diff --git a/resources/roo.builder.js b/resources/roo.builder.js
index c0292be..a53f114 100644 (file)
--- a/resources/roo.builder.js
+++ b/resources/roo.builder.js
@@ -1,5 +1,8 @@
 //<script type="text/javascript">
- 
+
+
+// IPC: - via alert("IPC:{method}:{data}
+
 
 var MODULE = { isBuilder : true };
 // BC
@@ -11,7 +14,137 @@ Builder  = {
     scriptTag : false,
     
     id : 1,
-    
+
+
+  
+    saveHTML :  function( ) 
+       {
+            //print("TRAVERSE DOM?");
+            
+            var dom = document.body;
+            //print(dom);
+            var ret = '';
+            //Roo.select('body > div',true).each(function(el) {
+            // if the tree is not ready yet?
+            
+            
+            this.traverseDOMTree(function(s) { ret+=s; }, dom, 1);
+               alert("IPC:SAVEHTML:" + ret);
+            return ret;
+        },
+        
+        
+        traverseDOMTree : function(cb, currentElement, depth) {
+            if (!currentElement ) {
+                
+                return;
+            }
+            //console.log(currentElement);
+            if (currentElement.className && currentElement.className.match(/roo-dynamic/)) {
+                return;
+            }
+            
+            //Roo.log(currentElement);
+            var j;
+            var nodeName = currentElement.nodeName;
+            var tagName = currentElement.tagName;
+            
+            if  (nodeName == '#text') {
+                cb(currentElement.nodeValue);
+                return;
+            
+            }
+            if (nodeName.match(/^#/)) { // comments?
+                return;
+            }
+             
+            
+            
+            if(nodeName == 'BR'){
+                cb("<BR/>");
+                return;
+            }
+            if (nodeName != 'BODY') {
+                //Roo.log(currentElement);
+                if (currentElement.hasAttribute('flexy:include')) {
+
+
+                    cb( '<flexy:include src="'+currentElement.getAttribute('flexy:include')+'"></flexy:include>');
+                    return;
+                }
+            
+                var i = 0;
+              // Prints the node tagName, such as <A>, <IMG>, etc
+                if (tagName) {
+                    var attr = [];
+                    for(i = 0; i < currentElement.attributes.length;i++) {
+                        var attre = currentElement.attributes.item(i);
+                        var aname = attre.name;
+                        var aval = attre.value || '';
+                        if (aname=='id' && aval.match(/^roo\-/)) { // only roo -elements hide..
+                            aname= 'xbuilderid';
+                        }
+                        // skip -- component created by the builder?
+                        if (aval == 'builderel') { 
+                            return;
+                        }
+                        attr.push(aname + '="' + aval + '"' );  //?? escaping attributes?
+                    }
+                    
+                    
+                    cb("<"+currentElement.tagName+ ( attr.length ? (' ' + attr.join(' ') ) : '') + ">");
+                } 
+                else {
+                  cb("[unknown tag]");
+                }
+            } else {
+                tagName = false;
+            }
+            
+            
+            // Traverse the tree
+            i = 0;
+            var currentElementChild = currentElement.childNodes.item(i);
+            var allText = true;
+            while (currentElementChild) {
+                // Formatting code (indent the tree so it looks nice on the screen)
+                
+                if  (currentElementChild.nodeName == '#text') {
+                    cb(currentElementChild.nodeValue);
+                    i++;
+                    currentElementChild=currentElement.childNodes.item(i);
+                    continue;
+                }   
+                allText = false;
+                cb("\n");
+                for (j = 0; j < depth; j++) {
+                  // &#166 is just a vertical line
+                  cb("  ");
+                }               
+                
+                    
+                // Recursively traverse the tree structure of the child node
+                this.traverseDOMTree(cb, currentElementChild, depth+1);
+                i++;
+                currentElementChild=currentElement.childNodes.item(i);
+            }
+            if (!allText) {
+                    // The remaining code is mostly for formatting the tree
+                cb("\n");
+                for (j = 0; j < depth - 1; j++) {
+                  cb("  ");
+                }     
+            }
+            if (tagName) {
+                cb("</"+tagName+">");
+            }
+            
+        },
+
+
+       // this lot is to deal with draging // selecting? - not used at present
+       // 
+       
      
     findNode : function(ftg , method) {
         if (!ftg) {
@@ -153,7 +286,7 @@ Builder  = {
        }
        id = ''+ id;
        var bid = id.length ? 'builder-' + id : '';
-       console.log('{ "hover-node" :  "' + bid + '"}');
+       //console.log('{ "hover-node" :  "' + bid + '"}');
        this.lastID = id;
     },
     clearBootstrap : function()
@@ -183,6 +316,9 @@ Builder  = {
     
     applyFlexy: function(tree)
     {
+        if (!tree.el) {
+            return;
+        }
         if (typeof(tree['flexy:foreach']) != 'undefined') {
             //Roo.log("add flexy:foreach");
             tree.el.attr('flexy:foreach', tree['flexy:foreach']);
@@ -196,12 +332,32 @@ Builder  = {
             tree.el.attr('xtype', tree['xtype-bootstrap']);
         }
         
+        if (typeof(tree['flexy:include']) != 'undefined') {
+            //Roo.log("add flexy:if");
+            tree.el.attr('flexy:include', tree['flexy:include']);
+        }
+        
+        if (typeof(tree['flexy:ignore']) != 'undefined') {
+            //Roo.log("add flexy:if");
+            tree.el.attr('flexy:ignore', tree['flexy:ignore']);
+        }
         
-        if (!tree.items || !tree.items.length) { return; }
+        tree.el.attr('xtype', tree['|xns'] + '.' +  tree['xtype']);
+        //Roo.log(tree);
+        //Roo.log("Add xtype")
         
-        for (var i = 0; i < tree.items.length; i++){
-            this.applyFlexy(tree.items[i]);
+        
+        
+        if (tree.items && tree.items.length > 0) { 
+        //Roo.log(tree);
+            for (var i = 0; i < tree.items.length; i++){
+                this.applyFlexy(tree.items[i]);
+            }
         }
+        if (typeof(tree.menu) == 'object') {
+            this.applyFlexy(tree.menu);
+        }
+        
     }
     
      
@@ -210,6 +366,8 @@ Builder  = {
 Roo.onReady(function() { Builder.clearBootstrap(); });
 Roo.XComponent.on('buildcomplete', function() {
     Roo.log("xcomponent built!");
+    var m = Roo.XComponent.modules;
+    Builder.applyFlexy(m[m.length-1].el);
     
-    Builder.applyFlexy(Roo.XComponent.modules[0].el);
+       Builder.saveHTML.defer(100, Builder);
 });
\ No newline at end of file