if(!GOOM.Components.showCarousel) {
    GOOM.Components.showCarousel = {
        itemList : [],

        itemVisibleInCallback: function(carousel, item, i, state, evt) {
            var me = GOOM.Components.showCarousel,
                idx = carousel.index(i, me.itemList.length);
                carousel.add(i, me.getItemHTML(me.itemList[idx - 1]));
        },

        itemVisibleOutCallback: function(carousel, item, i, state, evt) {
                carousel.remove(i);
        },

        getItemHTML: function (item) {
            if (!item.href || !item.title || !item.imgSrc) {
                return '<img class="t7" src="/img/show_t7.jpg" alt="defaultImg">' +
                       '<span class="radioSlideName clear"></span>';
            }
            return '<a onclick="GOOM.Navigation.load(this.href); return false;" href="' + item.href + '" title="' + item.title + '">' +
                       '<img class="t7" src="' + item.imgSrc + '" alt="' + item.title + '" onerror="defaultImg(this, \'/img/show_t7.jpg\')">' +
                       '<span class="radioSlideName clear"></span>' +
                   '</a>';
        },

        init: function() {
            $(document).ready(function() {
                var me = GOOM.Components.showCarousel,
                    els = byId('mycarousel').getElementsByTagName('a'),
                    i = 0, len = els.length;

                while(i < len) {
                    me.itemList.push({
                       title: els[i].title,
                       href: els[i].href,
                       imgSrc: els[i].getElementsByTagName('img')[0].src
                    });
                    ++i;
                }

                $('#mycarousel').jcarousel({
                    scroll: 2,
                    wrap: 'circular',
                    itemVisibleInCallback: {onBeforeAnimation: me.itemVisibleInCallback},
                    itemVisibleOutCallback: {onAfterAnimation: me.itemVisibleOutCallback}
                });
            });
        }
    }
}

