$().ready(function(){
    var lightbox = new Ctrl_Dialog_Lightbox({
        resizable: false,
        modal: true
    });
    
    $('.gallery').each(function(){
        var $this = $(this);
        var $thumbs = $this.children('.thumbnails');
        var $primary = $this.children('.primary');
        var $viewport = $thumbs.children('.viewport');

        $thumbs.find('li').click(function(){
            var id = this.id.substr(this.id.lastIndexOf('-')+1);
            $.getJSON(Ctrl.Config.baseUrl + '/media/thumbnail/format/json/id/'+ id +'/width/' + $primary.width() + '/height/' + $primary.height() + '/crop/0', function(json) {
                var newImg = $(json.tag).hide().appendTo($primary).fadeIn(600);
                newImg.wrap('<a href="'+ Ctrl.Config.baseUrl +'/media/thumbnail/id/'+ id +'/width/800/height/600/crop/0"></a>');
                newImg.load(function(){
                    $primary.find(':first').fadeOut(600, function(){ $primary.find(':first').remove(); });
                });

            });
        });
        
         $viewport.css({height: $thumbs.height(), overflow: 'hidden'}).jScrollPane({
            scrollbarWidth: 8,
            showArrows: false,
            dragMinHeight: 38,
            dragMaxHeight: 38,
            trackPadding: 12
        });
         var $o = $this.find('.overlay');
         var on = false;44
         $primary.bind('mouseenter', function(){$o.fadeIn()});
         $this.bind('mouseleave', function(){$o.fadeOut()});
    });
    
    $('.gallery .primary a').live('click', function(){
        lightbox.open(this.href);
        return false;
    });  
});
