/*

 *扩展carousel

 *通过data,tpl,store配置数据

 */

 Ext.define('ux.CardList', {

     extend: 'Ext.carousel.Carousel',

     xtype: 'cardList',

     config: {

         //单个项配置

         itemConfig: {},

         //数据展示模版

         tpl: null,

         //数据源

         store: null,

         //数据源

         data: null

     },

     //数据源事件

     storeEventHooks: {

         load: 'onLoad'

     },

     //填充数据

     updateData: function (data) {

         var me = this,

         store = me.getStore();

         if (!store) {

             this.setStore(Ext.create('Ext.data.Store', {

                 data: data,

                 autoDestroy: true

             }));

         } else {

             store.add(data);

         }

     },

     //创建store

     applyStore: function (store) {

         var me = this,

         bindEvents = Ext.apply({},

         me.storeEventHooks, {

             scope: me

         });

         //获取store,绑定事件

         if (store) {

             store = Ext.data.StoreManager.lookup(store);

             store.on(bindEvents);

         }

         return store;

     },

     //数据加载成功

     onLoad: function (store) {

         var me = this,

         tpl = me.getTpl(),

         config = me.getItemConfig(),

         item;

         if (tpl) {

             //遍历store，动态添加元素

             config.tpl = tpl;

             store.each(function (record, index, length) {

                 config.record = record;

                 //展示数据，绑定点击事件

                 item = Ext.factory(config, 'Ext.Container');

                 item.element.on({

                     scope: me,

                     tap: 'onItemTap'

                 });

                 me.add(item);

             });

         }

     },

     //更新store

     updateStore: function (newStore, oldStore) {

         var me = this,

         bindEvents = Ext.apply({},

         me.storeEventHooks, {

             scope: me

         });

         //移除绑定事件，销毁

         if (oldStore && Ext.isObject(oldStore) && oldStore.isStore) {

             oldStore.un(bindEvents);

             if (oldStore.getAutoDestroy()) {

                 oldStore.destroy();

             }

         }

         if (newStore.getCount()) {

             this.onLoad(newStore);

         }

     },

     //触发单项点击事件

     onItemTap: function () {

         var me = this,

         item = me.getActiveItem();

         me.fireEvent('itemTap', me, me.getActiveIndex(), item, item.getRecord());

     }

 });

    xtype: 'cardList',

             title: '动态',

             ui: 'card',

             store: 'trendTopList',

             height: 231,

             tpl: '<div class="imgTitle img" style="background-image:url({TopBarImgPath})"><div class="cardTitle">{Title}</div></div>'

            cardList: {

                initialize: 'listInit',

                //和list一样的监听

                itemTap: 'itemtap'

            }