+++ /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">Imgorg.ImageDv = Ext.extend(Ext.DataView,{
- tpl: new Ext.XTemplate(
- '<tpl for=".">',
- '<div class="thumb-wrap" id="{id}">',
- '<div class="thumb"><img src="images/thumbs/{filename}" class="thumb-img"></div>',
- '<span class="x-editable">{filename:ellipsis(15)}</span></div>',
- '</tpl>'
- ),
-
- initComponent: function() {
- Ext.apply(this, {
- itemSelector: 'div.thumb-wrap',
- style: 'overflow:auto',
- multiSelect: true,
- overClass: 'x-view-over',
- emptyText: 'No images to display',
- plugins: [new Ext.DataView.DragSelector({
- dragSafe: true
- }), new Ext.DataView.LabelEditor({
- allowBlank: false,
- alignment: 'c-c',
- dataIndex: 'filename'
- })],
- store: new Ext.data.DirectStore({
- directFn: Imgorg.ss.Images.load,
- root: '',
- fields: ['filename', 'url', 'id', 'size']
- })
- });
-
- this.addEvents('viewitem');
- Imgorg.ImageDv.superclass.initComponent.call(this);
- this.on({// hacks to force the labeleditor to stop editing when we get a click elsewhere
- click: function() {
- this.plugins[1].completeEdit();
- },
- containerclick: function(dv, e) {
- this.plugins[1].completeEdit();
- },
- contextmenu: this.onContextMenu,
- containercontextmenu: this.onContextMenu,
- scope: this
- });
- this.store.on('update', this.syncRename, this);
- },
-
- afterRender: function() {
- Imgorg.ImageDv.superclass.afterRender.call(this);
- this.el.unselectable(); // messy if they can select the text of the file names
- },
-
- onContextMenu: function(e, node) {
- e.stopEvent();
- if(!this.contMenu) {
- this.contMenu = new Ext.menu.Menu({
- items: [{
- text: 'View in Tab(s)',
- handler: function() {
- this.fireEvent('viewitem', this, node);
- },
- scope: this
- },{
- text: 'Add to Album',
- handler: this.selectAlbum,
- scope: this
- },{
- text: 'Tag',
- handler: this.tag,
- scope: this
- },{
- text: 'Remove',
- handler: this.removeImages,
- scope: this
- }]
- });
- }
- this.currentNode = node;
- this.contMenu.showAt(e.getXY());
- },
-
- selectAlbum: function() {
- if (!this.albumWin) {
- this.albumWin = new Imgorg.AlbumWin();
- }
- this.albumWin.selectedRecords = this.getSelectedRecords();
- this.albumWin.show(this.currentNode);
- },
-
- tag: function() {
- Imgorg.TagWin.selectedRecords = this.getSelectedRecords();
- Imgorg.TagWin.show(this.currentNode);
- },
-
- syncRename: function(store, rec, op) {
- if (op == 'edit') {
- Imgorg.ss.Images.rename({image: rec.data.id, name: rec.data.filename, url: rec.data.url});
- }
- },
-
- removeImages: function() {
- var recs = this.getSelectedRecords();
- var imageIds = [];
- for (var i = 0;i < recs.length;i++) {
- imageIds.push(recs[i].data.id);
- this.store.remove(recs[i]);
- }
- Imgorg.ss.Images.remove({images: imageIds});
- }
-});
-Ext.reg('img-dv', Imgorg.ImageDv);
-</pre> \r
-</body>\r
-</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff