examples/organizer/OrgPanel.js

   1 /**
   2  * @class Ext.org.OrgPanel
   3  * @extends Ext.panel.Panel
   4  *
   5  * This class combines the {@link Ext.org.AlbumTree AlbumTree} and {@link Ext.org.ImageView ImageView}
   6  * components into a {@link Ext.layout.container.Border Border} layout.
   7  */
   8 Ext.define('Ext.org.OrgPanel', {
   9     extend: 'Ext.panel.Panel',
  10     requires: 'Ext.layout.container.Border',
  11
  12     layout: 'border',
  13
  14     initComponent: function() {
  15         this.items = [
  16             {
  17                 xtype: 'albumtree',
  18                 region: 'west',
  19                 padding: 5,
  20                 width: 200
  21             },
  22             {
  23                 xtype: 'panel',
  24                 title: 'My Images',
  25                 layout: 'fit',
  26                 region: 'center',
  27                 padding: '5 5 5 0',
  28                 items: {
  29                     xtype: 'imageview',
  30                     /*  (add a '/' at the front of this line to turn this on)
  31                     listeners: {
  32                         containermouseout: function (view, e) {
  33                             Ext.log('ct', e.type);
  34                         },
  35                         containermouseover: function (view, e) {
  36                             Ext.log('ct', e.type);
  37                         },
  38                         itemmouseleave: function (view, record, item, index, e) {
  39                             Ext.log('item', e.type, ' id=', record.id);
  40                         },
  41                         itemmouseenter: function (view, record, item, index, e) {
  42                             Ext.log('item', e.type, ' id=', record.id);
  43                         }
  44                     },/**/
  45                     trackOver: true
  46                 }
  47             }
  48         ];
  49
  50         this.callParent(arguments);
  51     }
  52 });