Sencha Touch 2 activeitemchange слушатель для видео в карусели

Question

У меня есть карусель, которая состоит из 15 панелей. Каждая панель содержит аудиосэмпл, изображение и (локальное) видео (всего 150 КБ). Это работает, но у меня есть проблемы с производительностью (зависание) при быстром перелистывании. Вероятно, это связано с тем, что при перетаскивании на новую панель видео не имеет автоматической паузы (которая по умолчанию имеет значение true). Я бы хотел, чтобы предыдущие панели и их видео заткнулись. Мне удалось сделать это для аудиосэмплов через слушателя activeitemchange. Я не могу заставить это работать на видео.

Что я делаю неправильно? Пожалуйста помоги.

Ext.define('Test.view.Card',{
extend: 'Ext.Carousel',
id: 'gebarencarousel',
xtype:'cardpanel',
fullscreen : true,

config:{
    title: 'Speel',
    iconCls: 'star',
    store: Ext.create('Test.store.Gebaar'),

 listeners:{
    activeitemchange:function()
     {
        var activeIndex = this.getActiveIndex();           
        document.getElementById(activeIndex).play();
        document.getElementById(activeIndex-1).pause();
        console.log('video'+activeIndex);
//          document.getElementById('video'+activeIndex-1).stop(); 
     }
        },

    items:[

// -------------------------------- 1 ------------------------------------------------
       {
            html: ["<audio id=\"1\"><source src=\"resources/images/hond.mp3\" ></audio>"].join(""),
            layout: {
            type: 'vbox'                       
            },
            items: [
                {
                    flex:521,
                    xtype: 'image',
                    src: 'resources/images/hond.png'                    
                },                                      
                {
                    flex:432,
                    height: 432,
                    xtype: 'video',
                    id:'video1',
                    url: 'resources/images/hond.mp4',
                    posterUrl: 'resources/images/bekijkgebaar.png',
                    loop: true,
                    enableControls: false,
                    autoResume: true
                }]},

// -------------------------------- 2 ------------------------------------------------
etc. 

Answer 1

Я добавил слушателя к элементу видео:

listeners: {
                        tap: {
                            fn: function ()
                        {
                            var myVideo = document.getElementById('video1'); 
                            if (myVideo.paused) 
                                myVideo.play(); 
                            else 
                                myVideo.pause(); 
                        },
                        element: 'element'
                    },
                    swipe: {
                            fn: function() {
                                var swipeVideo = document.getElementById('video1');
                                swipeVideo.pause();
                            },
                            element: 'innerElement'
                    }
                    }