Keeping track of Carousel pages

[ssdesign]

I am moving the Carousel pages using two buttons in the toolbar.
While doing that, I am keeping a page count.

Now my problem is, if I move pages using gesture, I am not able to keep track of the pages.
I would like to know how can I tell my javascript when a page has been changed using gesture.

Is this possible?

[ssdesign]

Once again answering myself

'cardswitch' event did the job.

I must say the API is well documented, although it would help to have some examples in it.
Keep up the good work guys, we are with you

[TommyMaintz]

Thanks. Just wanted to tell you that in the new release the Carousel has been refactored and improved drastically. The cardswitch event is still there so your code should still work.

p.s. Please keep answering your own questions

[quarkus]

hello folks...
Maybe a stupid question but i am new to Ext and Sencha ... cann you please tell me how to implement the listener?

car.on('cardswitch', onCardSwitch);
        function onCardSwitch(c){
    		console.log('lalala: '+c);            	
    	}

can't get it to work ...

thanks in advance
quarkus

[evant]

Try:

car.on('cardswitch', function(){
    console.log('foo');
});

[quarkus]

hmmm ... does not work either ...

i am doing all my stuff in the Ext.setup() method.

Ext.setup({
    icon: 'icon.png',
    glossOnIcon: false,
    onReady: function() {
	
			var videoRight =  new Ext.Video(/*params*/);
			  
			var videoLeft = new Ext.Video({/*params*/});
			    
        
        var car = new Ext.Panel({
            cls: 'cards',
            fullscreen: true,
            layout: {
                type: 'vbox',
                align: 'left'
            },
            defaults: {
            	activeItem:1,
                flex: 1
//                indicator:false
            },
            items: [{
                xtype: 'carousel',
                items: [
                        videoLeft
					,
	                {
                       id:'center',
	                    cls: 'cards card2'
	                },
	                videoRight
                ]
            }],
            
            listeners:{
            	afterrender:function(c){
            		console.log('active is: '+c.activeSlide);            	
            	}
            }
        });
        car.on('cardswitch', function(){
            console.log('foo');
        });
    }
});

thanks for the quick reply !

btw. am using version:"0.9.1"

quarkus

[evant]

Because "car" doesn't have a layout of type card, so it never fires the cardswitch.

[quarkus]

ok ... that makes sense ...
changed my layout to this:

layout: {
                type: 'card'
            }

anything else ? cause it is still not working ... dunno what i messed up again.

thanks

[TommyMaintz]

You have only put 1 card in your car panel, so it will never switch. If you want to listen to the cardswitch event, you have to add the listener to the Carousel.

[quarkus]

jep ....
found the solution but forgot to post the code.

first thing tomorrow.

thanks a lot.