Second commit

CarMasterDetail.js

@@ -0,0 +1,23 @@
+/*
+ * File: CarMasterDetail.js
+ * Date: Mon Apr 12 2010 15:36:27 GMT-0700 (PDT)
+ * 
+ * This file was generated by Ext Designer version xds-1.0.0.7c.
+ * http://www.sencha.com/products/designer/
+ *
+ * This file will be generated the first time you export.
+ *
+ * You should implement event handling and custom methods in this
+ * class.
+ */
+
+CarMasterDetail = Ext.extend(CarMasterDetailUi, {
+    initComponent: function() {
+        CarMasterDetail.superclass.initComponent.call(this);
+        var sm = this.grid.getSelectionModel();
+        sm.on('rowselect', this.onGridRowSelect, this);
+    },
+    onGridRowSelect: function(sm, rowIdx, r) {
+        this.detail.update(r.data);
+    }
+});

CarMasterDetail.ui.js

@@ -0,0 +1,78 @@
+/*
+ * File: CarMasterDetail.ui.js
+ * Date: Mon Apr 12 2010 22:46:29 GMT-0700 (PDT)
+ * 
+ * This file was generated by Ext Designer version xds-1.0.0.7c.
+ * http://www.sencha.com/products/designer/
+ *
+ * This file will be auto-generated each and everytime you export.
+ *
+ * Do NOT hand edit this file.
+ */
+
+CarMasterDetailUi = Ext.extend(Ext.Panel, {
+    title: 'Grid',
+    width: 565,
+    height: 400,
+    layout: 'vbox',
+    frame: true,
+    initComponent: function() {
+        this.layoutConfig = {
+            align: 'stretch'
+        };
+        this.items = [
+            {
+                xtype: 'grid',
+                title: 'My Grid',
+                store: 'MyStore',
+                flex: 1,
+                header: false,
+                viewConfig: {
+                    forceFit: true
+                },
+                ref: 'grid',
+                columns: [
+                    {
+                        xtype: 'gridcolumn',
+                        header: 'Manufacturer',
+                        sortable: true,
+                        resizable: true,
+                        width: 100,
+                        dataIndex: 'manufacturer'
+                    },
+                    {
+                        xtype: 'gridcolumn',
+                        header: 'Model',
+                        sortable: true,
+                        resizable: true,
+                        width: 100,
+                        dataIndex: 'model'
+                    },
+                    {
+                        xtype: 'numbercolumn',
+                        header: 'Price',
+                        sortable: true,
+                        resizable: true,
+                        width: 100,
+                        format: '$0,000.00',
+                        align: 'right',
+                        dataIndex: 'price'
+                    }
+                ]
+            },
+            {
+                xtype: 'panel',
+                flex: 1,
+                tpl: [
+                    '<img src="cars/{img}" style="float: right" />',
+                    'Manufacturer: {manufacturer}<br/>',
+                    'Model: <a href="{wiki}" target="_blank">{model}</a><br/>',
+                    'Price: {price:usMoney}<br/>'
+                ],
+                padding: 7,
+                ref: 'detail'
+            }
+        ];
+        CarMasterDetailUi.superclass.initComponent.call(this);
+    }
+});

carStore.js

@@ -0,0 +1,41 @@
+/*
+ * File: carStore.js
+ * Date: Mon Apr 12 2010 22:46:29 GMT-0700 (PDT)
+ * 
+ * This file was generated by Ext Designer version xds-1.0.0.7c.
+ * http://www.sencha.com/products/designer/
+ *
+ * This file will be auto-generated each and everytime you export.
+ *
+ * Do NOT hand edit this file.
+ */
+
+carStore = Ext.extend(Ext.data.JsonStore, {
+    constructor: function(cfg) {
+        cfg = cfg || {};
+        carStore.superclass.constructor.call(this, Ext.apply({
+            storeId: 'MyStore',
+            url: 'cars/cars.json',
+            root: 'data',
+            autoLoad: true,
+            fields : [
+            {
+                name: 'manufacturer'
+            },
+            {
+                name: 'model'
+            },
+            {
+                name: 'price'
+            },
+            {
+                name: 'wiki'
+            },
+            {
+                name: 'img'
+            }
+        ]
+        }, cfg));
+    }
+});
+new carStore();

cars/cars.json

@@ -0,0 +1,33 @@
+{
+    data: [{
+        manufacturer: 'Porsche',
+        model: '911',
+        price: 135000,
+        wiki: 'http://en.wikipedia.org/wiki/Porsche_997',
+        img: '2004_Porsche_911_Carrera_type_997.jpg'
+    },{
+        manufacturer: 'Nissan',
+        model: 'GT-R',
+        price: 80000,
+        wiki:'http://en.wikipedia.org/wiki/Nissan_Gt-r',
+        img: '250px-Nissan_GT-R.jpg'
+    },{
+        manufacturer: 'BMW',
+        model: 'M3',
+        price: 60500,
+        wiki:'http://en.wikipedia.org/wiki/Bmw_m3',
+        img: '250px-BMW_M3_E92.jpg'
+    },{
+        manufacturer: 'Audi',
+        model: 'S5',
+        price: 53000,
+        wiki:'http://en.wikipedia.org/wiki/Audi_S5#Audi_S5',
+        img: '250px-Audi_S5.jpg'
+    },{
+        manufacturer: 'Audi',
+        model: 'TT',
+        price: 40000,
+        wiki:'http://en.wikipedia.org/wiki/Audi_TT',
+        img: '250px-2007_Audi_TT_Coupe.jpg'
+    }]
+}

demo.xds

@@ -0,0 +1,129 @@
+{
+	"name": "demo.xds",
+	"projectId": "B96B7C54-028F-4F0E-BC24-E0F04CF95AFD",
+	"settings": {
+		"urlPrefix": "http://localhost/releases/ext-3.2-rc/examples/demo/",
+		"directAPI": "",
+		"spacesToIndent": "4",
+		"codeGenFormat": "Class",
+		"extPath": "http://extjs.cachefly.net/ext-3.2.0/"
+	},
+	"xdsVersion": "xds-1.0.0.7c",
+	"components": [
+		{
+			"cid": "panel",
+			"jsClass": "CarMasterDetail",
+			"layoutConfig": {
+				"align": "stretch"
+			},
+			"userConfig": {
+				"layout": "vbox",
+				"height": 400,
+				"frame": true,
+				"title": "Grid",
+				"width": 565
+			},
+			"cn": [
+				{
+					"cid": "grid",
+					"jsClass": "MyGrid",
+					"userConfig": {
+						"flex": 1,
+						"header": false,
+						"store": "MyStore",
+						"autoRef": "grid",
+						"viewConfig": {
+							"forceFit": true
+						}
+					},
+					"cn": [
+						{
+							"cid": "gridcolumn",
+							"jsClass": "MyColumn",
+							"userConfig": {
+								"header": "Manufacturer",
+								"dataIndex": "manufacturer"
+							}
+						},
+						{
+							"cid": "gridcolumn",
+							"jsClass": "MyColumn1",
+							"userConfig": {
+								"header": "Model",
+								"dataIndex": "model"
+							}
+						},
+						{
+							"cid": "numbercolumn",
+							"jsClass": "MyColumn2",
+							"userConfig": {
+								"header": "Price",
+								"dataIndex": "price",
+								"format": "$0,000.00"
+							}
+						}
+					]
+				},
+				{
+					"cid": "panel",
+					"jsClass": "MyPanel1",
+					"userConfig": {
+						"flex": 1,
+						"tpl": "<img src=\"cars/{img}\" style=\"float: right\" />\nManufacturer: {manufacturer}<br/>\nModel: <a href=\"{wiki}\" target=\"_blank\">{model}</a><br/>\nPrice: {price:usMoney}<br/>",
+						"padding": 7,
+						"autoRef": "detail",
+						"title": "-ext-undefined-"
+					}
+				}
+			]
+		}
+	],
+	"stores": [
+		{
+			"cid": "jsonstore",
+			"jsClass": "carStore",
+			"userConfig": {
+				"url": "cars/cars.json",
+				"root": "data",
+				"autoLoad": true
+			},
+			"cn": [
+				{
+					"cid": "datafield",
+					"jsClass": "MyField",
+					"userConfig": {
+						"name": "manufacturer"
+					}
+				},
+				{
+					"cid": "datafield",
+					"jsClass": "MyField1",
+					"userConfig": {
+						"name": "model"
+					}
+				},
+				{
+					"cid": "datafield",
+					"jsClass": "MyField2",
+					"userConfig": {
+						"name": "price"
+					}
+				},
+				{
+					"cid": "datafield",
+					"jsClass": "MyField3",
+					"userConfig": {
+						"name": "wiki"
+					}
+				},
+				{
+					"cid": "datafield",
+					"jsClass": "MyField4",
+					"userConfig": {
+						"name": "img"
+					}
+				}
+			]
+		}
+	]
+}

xds_includeOrder.txt

@@ -0,0 +1,3 @@
+<script type="text/javascript" src="CarMasterDetail.ui.js"></script>
+<script type="text/javascript" src="CarMasterDetail.js"></script>
+<script type="text/javascript" src="carStore.js"></script>

xds_index.html

@@ -0,0 +1,15 @@
+<!-- Auto Generated with Ext Designer -->
+<!-- Modifications to this file will be overwritten. -->
+<html>
+<head>
+    <title>/home/aaron/www/releases/ext-3.2-rc/examples/demo/demo.xds</title>
+    <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.0/resources/css/ext-all.css"/>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/ext-all-debug.js"></script>
+    <script type="text/javascript" src="CarMasterDetail.ui.js"></script>
+    <script type="text/javascript" src="CarMasterDetail.js"></script>
+    <script type="text/javascript" src="carStore.js"></script>
+    <script type="text/javascript" src="xds_index.js"></script>
+</head>
+<body></body>
+</html>

xds_index.js

@@ -0,0 +1,18 @@
+/*
+ * File: xds_index.js
+ * Date: Mon Apr 12 2010 22:46:29 GMT-0700 (PDT)
+ * 
+ * This file was generated by Ext Designer version xds-1.0.0.7c.
+ * http://www.sencha.com/products/designer/
+ *
+ * This file will be auto-generated each and everytime you export.
+ *
+ * Do NOT hand edit this file.
+ */
+
+Ext.onReady(function() {
+    var carMasterDetail = new CarMasterDetail({
+        renderTo: Ext.getBody()
+    });
+    carMasterDetail.show();
+});