Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / examples / tree / two-trees.js
index 0c23d64..7372044 100644 (file)
@@ -1,78 +1,66 @@
-/*!
- * Ext JS Library 3.3.1
- * Copyright(c) 2006-2010 Sencha Inc.
- * licensing@sencha.com
- * http://www.sencha.com/license
- */
-var TreeTest = function(){
-    // shorthand
-    var Tree = Ext.tree;
-    
-    return {
-        init : function(){
-            // yui-ext tree
-            var tree = new Tree.TreePanel({
-                animate:true, 
-                autoScroll:true,
-                loader: new Tree.TreeLoader({dataUrl:'get-nodes.php'}),
-                enableDD:true,
-                containerScroll: true,
-                border: false,
-                width: 250,
-                height: 300,
-                dropConfig: {appendOnly:true}
-            });
-            
-            // add a tree sorter in folder mode
-            new Tree.TreeSorter(tree, {folderSort:true});
-            
-            // set the root node
-            var root = new Tree.AsyncTreeNode({
-                text: 'Ext JS', 
-                draggable:false, // disable root node dragging
-                id:'src'
-            });
-            tree.setRootNode(root);
-            
-            // render the tree
-            tree.render('tree');
-            
-            root.expand(false, /*no anim*/ false);
-            
-            //-------------------------------------------------------------
-            
-            // ExtJS tree            
-            var tree2 = new Tree.TreePanel({
-                animate:true,
-                autoScroll:true,
-                //rootVisible: false,
-                loader: new Ext.tree.TreeLoader({
-                    dataUrl:'get-nodes.php',
-                    baseParams: {path:'extjs'} // custom http params
-                }),
-                containerScroll: true,
-                border: false,
-                width: 250,
-                height: 300,
-                enableDD:true,
-                dropConfig: {appendOnly:true}
-            });
-            
-            // add a tree sorter in folder mode
-            new Tree.TreeSorter(tree2, {folderSort:true});
-            
-            // add the root node
-            var root2 = new Tree.AsyncTreeNode({
-                text: 'Extensions', 
-                draggable:false, 
-                id:'ux'
-            });
-            tree2.setRootNode(root2);
-            tree2.render('tree2');
-            
-            root2.expand(false, /*no anim*/ false);
-        }
-    };
-}();
+Ext.require(['*']);
 
-Ext.EventManager.onDocumentReady(TreeTest.init, TreeTest, true);
\ No newline at end of file
+Ext.onReady(function(){
+    var store = Ext.create('Ext.data.TreeStore', {
+        proxy: {
+            type: 'ajax',
+            url: 'get-nodes.php'
+        },
+        root: {
+            text: 'Ext JS',
+            id: 'src',
+            expanded: true
+        },
+        folderSort: true,
+        sorters: [{
+            property: 'text',
+            direction: 'ASC'
+        }]
+    });
+
+    var tree = Ext.create('Ext.tree.Panel', {
+        id: 'tree',
+        store: store,
+        width: 250,
+        height: 300,
+        viewConfig: {
+            plugins: {
+                ptype: 'treeviewdragdrop',
+                appendOnly: true
+            }
+        },
+        renderTo: document.body
+    });
+
+    var store2 = Ext.create('Ext.data.TreeStore', {
+        proxy: {
+            type: 'ajax',
+            url: 'get-nodes.php'
+        },
+        root: {
+            text: 'Custom Ext JS',
+            id: 'src',
+            expanded: true,
+            children: []
+        },
+        folderSort: true,
+        sorters: [{
+            property: 'text',
+            direction: 'ASC'
+        }]
+    });
+
+    var tree2 = Ext.create('Ext.tree.Panel', {
+        id: 'tree2',
+        width: 250,
+        height: 300,
+        store: store2,
+        viewConfig: {
+            plugins: {
+                ptype: 'treeviewdragdrop',
+                appendOnly: true
+            }
+        },
+        renderTo: document.body
+    });
+});