add bootstap
authorAlan Knowles <alan@roojs.com>
Fri, 10 Jan 2014 01:49:09 +0000 (09:49 +0800)
committerAlan Knowles <alan@roojs.com>
Fri, 10 Jan 2014 01:49:09 +0000 (09:49 +0800)
examples/bootstrap/bootstrap.html [new file with mode: 0644]
examples/bootstrap/bootstrap.js [new file with mode: 0644]

diff --git a/examples/bootstrap/bootstrap.html b/examples/bootstrap/bootstrap.html
new file mode 100644 (file)
index 0000000..6903a3c
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Bootstrap 101 Template</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+           <link rel="stylesheet" type="text/css" href="../../cssX/roojs-all.css"/>
+
+    <!-- Bootstrap -->
+    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
+    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
+    
+    <script type="text/javascript" src="../../roojs-debug.js"></script>   
+    
+    <!-- bootstrap js.. needs to compile it later.. -->
+    <script type="text/javascript" src="../../Roo/XComponent.js"></script>   
+
+<script type="text/javascript" src="../../Roo/bootstrap/Component.js"></script>
+<script type="text/javascript" src="../../Roo/bootstrap/Body.js"></script>   
+
+<script type="text/javascript" src="../../Roo/bootstrap/Container.js"></script>   
+<script type="text/javascript" src="../../Roo/bootstrap/Column.js"></script>
+<script type="text/javascript" src="../../Roo/bootstrap/Navbar.js"></script>   
+<script type="text/javascript" src="../../Roo/bootstrap/Navbar.Dropdown.js"></script>
+<script type="text/javascript" src="../../Roo/bootstrap/Navbar.Dropdown.Item.js"></script>   
+<script type="text/javascript" src="../../Roo/bootstrap/Navbar.Item.js"></script>   
+<script type="text/javascript" src="../../Roo/bootstrap/Row.js"></script>   
+
+    
+    <script type="text/javascript" src="bootstrap.js"></script>
+    
+  </head>
+  <body id="body">
+   
+
+
+
+
+  </body>
+  <script type="text/javascript">
+    Roo.onReady(function() {
+        Roo.XComponent.build();
+    });
+</script>
+</html>
\ No newline at end of file
diff --git a/examples/bootstrap/bootstrap.js b/examples/bootstrap/bootstrap.js
new file mode 100644 (file)
index 0000000..6e9fc1c
--- /dev/null
@@ -0,0 +1,128 @@
+
+
+Roo.example = Roo.example || {};
+
+Roo.example.bootstrap = new Roo.XComponent({
+    part     :  ["layout","viewpanel"],
+    order    : '001-viewpanel',
+    region   : '',
+    parent   : '#bootstrap',
+    name     : "unnamed module",
+    disabled : false, 
+    permname : '', 
+    _tree : function()
+    {
+        this.parent = {
+            el : new Roo.bootstrap.Body(),
+        }
+        this.parent.el.layout = false;
+        this.parent.el.render(document.body);
+        
+        var _this = this;
+        var MODULE = this;
+        return {
+            xtype: 'Body',
+            xns: Roo.bootstrap,
+            items : [
+                 {
+                    xtype: 'Navbar',
+                    cls : 'navbar-fixed-top navbar-inverse',
+                    role : 'navigation',
+                    xns: Roo.bootstrap,
+                    items : [
+                                
+                        {
+                            xtype: 'Item',
+                            xns: Roo.bootstrap.Navbar,
+                            html: "hello",
+                            href : 'http://roojs.com'
+                        },
+                                
+                        {
+                            xtype: 'Dropdown',
+                            xns: Roo.bootstrap.Navbar,
+                            items : [
+                                {
+                                    xtype: 'Item',
+                                    xns: Roo.bootstrap.Navbar.Dropdown,
+                                    html: "hello",
+                                    href : 'http://roojs.com'
+                                }   ,
+                                {
+                                    xtype: 'Item',
+                                    xns: Roo.bootstrap.Navbar.Dropdown,
+                                    html: "hello",
+                                    href : 'http://roojs.com'
+                                }   
+                            ]
+                        }            
+                    ]
+                },
+                {
+                    xtype: 'Container',
+                    xns: Roo.bootstrap,
+                    style :  'margin-top:60px', 
+                    html : '<h1> hello world </h1><p>test</p>'
+                },
+                {
+                    xtype: 'Container',
+                    xns: Roo.bootstrap,
+                    style :  'margin-top:50px', 
+                    items : [
+                        {
+                            xtype: 'Row',
+                            xns: Roo.bootstrap,
+                            items : [
+                                
+                                {
+                                    xtype: 'Column',
+                                    xns: Roo.bootstrap,
+                                    colspan : 12,
+                                    items : [
+                                        
+                                        {
+                                            xtype: 'Navbar',
+                                            xns: Roo.bootstrap,
+                                            items : [
+                                                        
+                                                {
+                                                    xtype: 'Item',
+                                                    xns: Roo.bootstrap.Navbar,
+                                                    html: "hello",
+                                                    href : 'http://roojs.com'
+                                                },
+                                                        
+                                                {
+                                                    xtype: 'Dropdown',
+                                                    xns: Roo.bootstrap.Navbar,
+                                                    items : [
+                                                        {
+                                                            xtype: 'Item',
+                                                            xns: Roo.bootstrap.Navbar.Dropdown,
+                                                            html: "hello",
+                                                            href : 'http://roojs.com'
+                                                        }   ,
+                                                        {
+                                                            xtype: 'Item',
+                                                            xns: Roo.bootstrap.Navbar.Dropdown,
+                                                            html: "hello",
+                                                            href : 'http://roojs.com'
+                                                        }   
+                                                    ]
+                                                }            
+                                            ]
+                                        }
+                                                
+                                                
+                                    ]
+                                        
+                                }
+                            ]
+                    
+                        }
+                    ]
+                }
+            ]
+        };
+    }
+});
\ No newline at end of file