1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
| /**
| * @class Ext.org.ImageView
| * @extends Ext.view.View
| * @xtype imageview
| *
| * This class implements the "My Images" view (the images in the organizer). This class
| * incorporates {@link Ext.ux.DataView.Draggable Draggable} to enable dragging items as
| * well as {@link Ext.ux.DataView.DragSelector DragSelector} to allow multiple selection
| * by simply clicking and dragging the mouse.
| */
| Ext.define('Ext.org.ImageView', {
| extend: 'Ext.view.View',
| alias : 'widget.imageview',
| requires: ['Ext.data.Store'],
| mixins: {
| dragSelector: 'Ext.ux.DataView.DragSelector',
| draggable : 'Ext.ux.DataView.Draggable'
| },
|
| tpl: [
| '<tpl for=".">',
| '<div class="thumb-wrap">',
| '<div class="thumb">',
| (!Ext.isIE6? '<img src="../view/chooser/icons/{thumb}" />' :
| '<div style="width:76px;height:76px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'../view/chooser/icons/{thumb}\')"></div>'),
| '</div>',
| '<span>{name}</span>',
| '</div>',
| '</tpl>'
| ],
|
| itemSelector: 'div.thumb-wrap',
| multiSelect: true,
| singleSelect: false,
| cls: 'x-image-view',
| autoScroll: true,
|
| initComponent: function() {
| this.store = Ext.create('Ext.data.Store', {
| autoLoad: true,
| fields: ['name', 'thumb', {name: 'leaf', defaultValue: true}],
| proxy: {
| type: 'ajax',
| url : '../view/chooser/icons.json',
| reader: {
| type: 'json',
| root: ''
| }
| }
| });
|
| this.mixins.dragSelector.init(this);
| this.mixins.draggable.init(this, {
| ddConfig: {
| ddGroup: 'organizerDD'
| },
| ghostTpl: [
| '<tpl for=".">',
| '<img src="../view/chooser/icons/{thumb}" />',
| '<tpl if="xindex % 4 == 0"><br /></tpl>',
| '</tpl>',
| '<div class="count">',
| '{[values.length]} images selected',
| '<div>'
| ]
| });
|
| this.callParent();
| }
| });
|
|
