+++ /dev/null
-<html>\r
-<head>\r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js">Ext.onReady(function(){\r
- var xd = Ext.data;\r
-\r
- var store = new Ext.data.JsonStore({\r
- url: 'get-images.php',\r
- root: 'images',\r
- fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date', dateFormat:'timestamp'}]\r
- });\r
- store.load();\r
-\r
- var tpl = new Ext.XTemplate(\r
- '<tpl for=".">',\r
- '<div class="thumb-wrap" id="{name}">',\r
- '<div class="thumb"><img src="{url}" title="{name}"></div>',\r
- '<span class="x-editable">{shortName}</span></div>',\r
- '</tpl>',\r
- '<div class="x-clear"></div>'\r
- );\r
-\r
- var panel = new Ext.Panel({\r
- id:'images-view',\r
- frame:true,\r
- width:535,\r
- autoHeight:true,\r
- collapsible:true,\r
- layout:'fit',\r
- title:'Simple DataView (0 items selected)',\r
-\r
- items: new Ext.DataView({\r
- store: store,\r
- tpl: tpl,\r
- autoHeight:true,\r
- multiSelect: true,\r
- overClass:'x-view-over',\r
- itemSelector:'div.thumb-wrap',\r
- emptyText: 'No images to display',\r
-\r
- plugins: [\r
- new Ext.DataView.DragSelector(),\r
- new Ext.DataView.LabelEditor({dataIndex: 'name'})\r
- ],\r
-\r
- prepareData: function(data){\r
- data.shortName = Ext.util.Format.ellipsis(data.name, 15);\r
- data.sizeString = Ext.util.Format.fileSize(data.size);\r
- data.dateString = data.lastmod.format("m/d/Y g:i a");\r
- return data;\r
- },\r
- \r
- listeners: {\r
- selectionchange: {\r
- fn: function(dv,nodes){\r
- var l = nodes.length;\r
- var s = l != 1 ? 's' : '';\r
- panel.setTitle('Simple DataView ('+l+' item'+s+' selected)');\r
- }\r
- }\r
- }\r
- })\r
- });\r
- panel.render(document.body);\r
-\r
-});</pre> \r
-</body>\r
-</html>
\ No newline at end of file