/**

* 跑马灯自动切换

*/

Ext.define('ux.RotatingCarousel', {

    extend: 'Ext.carousel.Carousel',

    alternateClassName: 'rotatingCarousel',

    xtype: 'rotatingCarousel',

    config: {

        delay: 3000,

        start: true,

        listeners: {

            tap: {

                fn: function () {

                    this.pause();

                },

                element: 'element'

            },

            swipe: {

                fn: function () {

                    this.start();

                },

                element: 'innerElement'

            }

        }

    },

    initialize: function () {

        if (this.config.start) {

            this.start();

        }

    },

    rotate: function () {

        if (this.timeout) {

            clearTimeout(this.timeout);

        }

        if (this.getActiveIndex() === this.getMaxItemIndex()) {

            this.setActiveItem(0, 'slide');

        } else {

            this.next();

        }

        this.timeout = Ext.defer(this.rotate, this.config.delay, this);

    },

    start: function (delayStart) {

        this.timeout = Ext.defer(this.rotate, delayStart || this.config.delay, this);

    },

    pause: function (delayStart) {

        if (this.timeout) {

            clearTimeout(this.timeout);

        }

        if (delayStart) {

            this.start(delayStart);

        }

        return this;

    },

    stop: function (delayStart) {

        this.pause(delayStart);

        this.setActiveItem(0, 'slide');

        return this;

    }

});

 Ext.define('app.view.Home', {

     extend: 'Ext.Container',

     xtype: 'home',

     requires: ['ux.RotatingCarousel'],

     config: {

         items: [{

             xtype: 'rotatingCarousel',

             height: '200px',

             items: [{

                 html: '<div class="homeImg" style="background-image:url(\'resources/images/lg1.png\')"></div>'

             },

             {

                 html: '<div class="homeImg" style="background-image:url(\'resources/images/lg2.png\')"></div>'

             },

             {

                 html: '<div class="homeImg" style="background-image:url(\'resources/images/lg3.png\')"></div>'

             }]

         }]

     }

 });