~cdparra/gelee/trunk

« back to all changes in this revision

Viewing changes to webui/ecosystem/workspace/extjs/examples/view/data-view.js

  • Committer: parra
  • Date: 2010-03-15 15:56:56 UTC
  • Revision ID: svn-v4:ac5bba68-f036-4e09-846e-8f32731cc928:trunk/gelee:1448
merged gelee at svn

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/*!
 
2
 * Ext JS Library 3.0.0
 
3
 * Copyright(c) 2006-2009 Ext JS, LLC
 
4
 * licensing@extjs.com
 
5
 * http://www.extjs.com/license
 
6
 */
 
7
Ext.onReady(function(){
 
8
    var xd = Ext.data;
 
9
 
 
10
    var store = new Ext.data.JsonStore({
 
11
        url: 'get-images.php',
 
12
        root: 'images',
 
13
        fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date', dateFormat:'timestamp'}]
 
14
    });
 
15
    store.load();
 
16
 
 
17
    var tpl = new Ext.XTemplate(
 
18
                '<tpl for=".">',
 
19
            '<div class="thumb-wrap" id="{name}">',
 
20
                    '<div class="thumb"><img src="{url}" title="{name}"></div>',
 
21
                    '<span class="x-editable">{shortName}</span></div>',
 
22
        '</tpl>',
 
23
        '<div class="x-clear"></div>'
 
24
        );
 
25
 
 
26
    var panel = new Ext.Panel({
 
27
        id:'images-view',
 
28
        frame:true,
 
29
        width:535,
 
30
        autoHeight:true,
 
31
        collapsible:true,
 
32
        layout:'fit',
 
33
        title:'Simple DataView (0 items selected)',
 
34
 
 
35
        items: new Ext.DataView({
 
36
            store: store,
 
37
            tpl: tpl,
 
38
            autoHeight:true,
 
39
            multiSelect: true,
 
40
            overClass:'x-view-over',
 
41
            itemSelector:'div.thumb-wrap',
 
42
            emptyText: 'No images to display',
 
43
 
 
44
            plugins: [
 
45
                new Ext.DataView.DragSelector(),
 
46
                new Ext.DataView.LabelEditor({dataIndex: 'name'})
 
47
            ],
 
48
 
 
49
            prepareData: function(data){
 
50
                data.shortName = Ext.util.Format.ellipsis(data.name, 15);
 
51
                data.sizeString = Ext.util.Format.fileSize(data.size);
 
52
                data.dateString = data.lastmod.format("m/d/Y g:i a");
 
53
                return data;
 
54
            },
 
55
            
 
56
            listeners: {
 
57
                selectionchange: {
 
58
                        fn: function(dv,nodes){
 
59
                                var l = nodes.length;
 
60
                                var s = l != 1 ? 's' : '';
 
61
                                panel.setTitle('Simple DataView ('+l+' item'+s+' selected)');
 
62
                        }
 
63
                }
 
64
            }
 
65
        })
 
66
    });
 
67
    panel.render(document.body);
 
68
 
 
69
});
 
 
b'\\ No newline at end of file'