Ext.onReady(function(){
    Ext.select('.tx-pagecarousel-container').each(function(el){
        var carouselHeight = 0;
        var ct = el.select('.tx-pagecarousel-slides').item(0);
        var slides = ct.select('.tx-pagecarousel-slide');
        var controls = el.select('.tx-pagecarousel-control a');

        if(slides.getCount() == 0){
            return;
        }

        slides.each(function(s){
            if(s.getHeight() > carouselHeight){
                carouselHeight = s.getHeight();
            }
        });

        var carousel = new Ext.ux.Carousel(Ext.id(ct), {
            itemSelector: 'div.tx-pagecarousel-slide',
            interval: 3,
            autoPlay: false,
            showPlayButton: false,
            pauseOnNavigate: true,
            freezeOnHover: false,
            transitionType: 'easeIn',
            navigationOnHover: false,
            height: carouselHeight
        });

        controls.item(0).parent('li').addClass('active');

        var scrollTo = el.select('.tx-pagecarousel-scrollto');
        if(scrollTo.getCount() > 0){
            var dest = Ext.id(scrollTo.item(0).parent('.tx-pagecarousel-slide'));
            carousel.setSlide(slides.indexOf(dest));
            controls.each(function(c){c.parent().removeClass('active');});
            el.select('a[rel~='+dest+']').item(0).parent('li').addClass('active');
        }

        controls.on('click', function(ev,t){
           ev.preventDefault();
           if(ev.getTarget('li', 3, true).hasClass('tx-pagecarousel-doktype4')){
               window.location = ev.getTarget('a', 3, true).getAttribute('href');
           } else {
               carousel.setSlide(slides.indexOf(ev.getTarget('a').getAttribute('rel').split(' ')[0]));
               controls.each(function(c){c.parent().removeClass('active');});
               Ext.fly(ev.getTarget('a')).parent('li').addClass('active');
           }
        });
    });
});
