function showGallery(id){
    var idRef = '#'+id;
    
    var slideShowContainer = idRef + ' #sliders';
    var controlsContainer = idRef + '.block_slideshow .controls';
    var thumbnailsContainer = idRef + ' .thumbnails';
    var thumbnailControls = idRef + ' #thumb_prev_btn, ' + idRef + ' #thumb_next_btn';
    var controlsFocus = false;
    var controlsFadeTime = 200;
    var resetControls = function(){
            $(this).css({'opacity':1});
    //	$(this).attr("title", "reset");
            //alert("reset");
    }
    var $thumbnails = $(idRef + ' .thumbnails ul li').clone();
    $(idRef + ' .thumbnails ul li').remove();
    $(slideShowContainer).cycle({
        fx: 'fade',
        speed:  1000,
        containerResize: 0,
        easeIn:  'easeOutExpo',
        easeOut: 'easeOutExpo',
        next:    idRef + ' #slide_next_btn',
        prev:    idRef + ' #slide_prev_btn',
        pager:   idRef + ' .thumbnails ul',
        pagerAnchorBuilder: pagerFactory,
        timeout: 6000,
        prevNextClick: pauseSlideShow,
        pagerClick: pauseSlideShow,
        before: centerElement,
        after:   onAfter
    });
    //adjust thumbnail container width
    $(idRef + ' .thumbnails ul').css('width', (($(idRef + ' .thumbnails ul li').outerWidth() + 15) * $(idRef + ' .thumbnails ul li').length)+ 'px');
    //deactivate thumbnails prev btn
    $(idRef + ' #thumb_prev_btn').addClass('inactive').hide();

    $(slideShowContainer).bind('mouseenter',function(){
            $(controlsContainer).stop().fadeIn(controlsFadeTime, resetControls);
    })
    .bind('mouseleave',function(event){
            var curTarget = $(event.relatedTarget).attr('class');
            //alert(curTarget);
            if(curTarget != "controls" && curTarget != "button_left" && curTarget != "button_right"){
                    $(controlsContainer).stop().fadeOut(controlsFadeTime, resetControls);
            }
    });
    $(controlsContainer).bind('mouseleave',function(event){
            var curTarget = $(event.relatedTarget).attr('class');
            if(curTarget != "button_left" && curTarget != "button_right"){
                    $(controlsContainer).stop().fadeOut(controlsFadeTime);
            }
    });
    $(thumbnailsContainer).bind('mouseenter',function(){
            if($(idRef + ' .thumbnails ul li').length > 6){
                //$(this).parent().children('a:not(".inactive")').stop().fadeIn(controlsFadeTime, resetControls);
                $(idRef + ' .thumbnails a:not(".inactive")').stop().fadeIn(controlsFadeTime, resetControls);
            }
    })
    .bind('mouseleave',function(event){
            var curTarget = $(event.relatedTarget).attr('id');
            if(curTarget != "thumb_prev_btn" && curTarget != "thumb_next_btn"){
                //$(this).parent().children('a').stop().fadeOut(controlsFadeTime, resetControls);
                $(thumbnailControls).stop().fadeOut(controlsFadeTime, resetControls);
            }
    });
    //store current last thumbnail
    $(idRef + ' .thumbnails ul').data('first', 0);
    $(idRef + ' .thumbnails ul').data('last', $(idRef + ' .thumbnails ul li').length > 6 ? 5 : $(idRef + ' .thumbnails ul li').length-1);
    /*
    $(thumbnailControls).bind('mouseleave',function(event){
            var curTarget = $(event.relatedTarget).attr('class');
            if(curTarget != "thumbnails"){
                $(thumbnailControls).stop().fadeOut(controlsFadeTime);
            }
    });
    */
    $(idRef + ' #thumb_prev_btn').bind('click', function(){
            slideThumbs('prev', 3);
    });
    $(idRef + ' #thumb_next_btn').bind('click', function(){
            slideThumbs('next', 3);
    });

    function slideThumbs(direction, maxElems){
            var nextElemsNum = $(idRef + ' .thumbnails ul li').length - $(idRef + ' .thumbnails ul').data('last') - 1;
            var prevElemsNum = $(idRef + ' .thumbnails ul').data('first');
            nextElemsNum = nextElemsNum > maxElems-1 ? maxElems : nextElemsNum;
            prevElemsNum = prevElemsNum > maxElems-1 ? maxElems : prevElemsNum;
            var offset = 0;
            //alert(nextElemsNum);
            if(direction == 'next' && nextElemsNum > 0){
                offset = - (115 * nextElemsNum);
                $(idRef + ' .thumbnails ul').data('first', $(idRef + ' .thumbnails ul').data('first')+nextElemsNum);
                $(idRef + ' .thumbnails ul').data('last', $(idRef + ' .thumbnails ul').data('last')+nextElemsNum);
                $(idRef + ' #thumb_prev_btn').removeClass('inactive').show();
                if($(idRef + ' .thumbnails ul').data('last') >= $(idRef + ' .thumbnails ul li').length-1){
                    $(idRef + ' #thumb_next_btn').addClass('inactive').hide();
                }
            }else if(direction == 'prev' && prevElemsNum > 0){
                offset = 115 * prevElemsNum;
                $(idRef + ' .thumbnails ul').data('first', $(idRef + ' .thumbnails ul').data('first')-prevElemsNum);
                $(idRef + ' .thumbnails ul').data('last', $(idRef + ' .thumbnails ul').data('last')-prevElemsNum);
                $(idRef + ' #thumb_next_btn').removeClass('inactive').show();
                if($(idRef + ' .thumbnails ul').data('first') == 0){
                    $(idRef + ' #thumb_prev_btn').addClass('inactive').hide();
                }
            }
            $(idRef + ' .thumbnails ul').animate({left: '+=' + offset}, Math.abs(offset)/115*150, 'easeInOutQuint');
    }

    function pagerFactory(index, slide) {
            return $thumbnails.eq(index);
        }


    function onAfter(curr, next, opts) {
            //set image index
            $(idRef + ' .imagecounter').text((opts.currSlide+1) + "/" + opts.slideCount);
            //set author text
            $(idRef + ' .imageauthor').text($(next).attr('title'));
            //set image caption
            var $imginfo = $(idRef + ' .infotext p').children().clone();
            $(idRef + ' .infotext p').empty();
            $(idRef + ' .infotext p').append($imginfo).append($(next).attr('alt'))

            //centerElement(curr, next, opts);
    }
    function centerElement(curr, next, opts){
        var marginLeft = Math.round(($(this).parent().width() - $(this).width()) / 2);
        var marginTop = Math.round(($(this).parent().height() - $(this).height()) / 2);
        /* console.log('center next:'+marginLeft+"/"+marginTop); */
        $(this).css({left: marginLeft, top: marginTop});
    }
    function pauseSlideShow(){
        $(slideShowContainer).cycle('pause');
    }
}