Carousel - supress cardswitch event for app-initiated switches

[tomas.fejfar]

I have a problem with carousel. I use it to display a presentation. There is an audio element. Based on the audio's currentTime (on audio element's timechange event) the slide is slided (i have from/to times stored with slides).

Problem is that I want to let the users slide the slides themselves for example to skip boring passages. Because current slide is depending on the audio time I change the audio time inside cardswitch event. Problem is that the events are obviously asynchronous - that means that the cardswitch is called even if cards were changed from the timechange event. That means that there is a race condition between the timechange event timer and user who want to switch slides. If timechange event is triggered and user slides at the same time it sometimes works and sometimes it reverts hit slide, because of the timechange won the racecondition :(

Do you please have any idea how to synchronize the event so that when user start the tap the timechange event will be supressed until the slide is finished. Or even better - how to suppress the cardswitch event for any event, that is not user-initiated.

[mitchellsimoens]

You can listen for the touch events to lock and unlock an event... meaning on touch start set a property to stop the firing of your event and then unlock after the transition.

[tomas.fejfar]

I'll try that. I tried to use the tap event on carousel, but it does not seem to work (tried listeners in config, el.on(), ...) - looks like the tap event is "stolen" by the carousel itself somewhere inside, so I assumed that starttap won't work either :)

[tomas.fejfar]

As I expected. The touch event is not fired on carousel :( The bottom code works - audio is rewinded. The touch events above do not.

me.player.carousel.on({ touchstart : function() {
console.log('touch start');
// me.player.toolbar.show({type:'slide', direction:'up'});
},
touchend : function() {
console.log('touch end');
}
});


me.player.carousel.on({
cardswitch : function(container, newCard, oldCard, newCardIndex, animated) {
me.player.audio.media.dom.currentTime = me.player.store.getAt(
newCardIndex).get('from');
}
});Any idea?

[mitchellsimoens]

The touch events are on the element, not component

[tomas.fejfar]

Pardon my dumbness, but can you please give me a code sample, how to attach such event to the element?

[mitchellsimoens]

me.player.carousel.el.on(....);

[tomas.fejfar]

Thanks. It works. I just needed to put it inside afterrender, so that the element is accessible. I created a flag on tapstart and remove it on cardswitch. Works really fine.

Nevertheless it would be nice to have an option to suppress cardswitch event when calling setActiveItem().