Dynamic image galleries

gistfile1.txt

// Dynamic project image galleries
    $('.project-item-wrapper').click(function(e) {
        e.preventDefault();
        
        // .project-item-wrapper should have the page destination as its link src, this way is JS is disabled the user would still get to the images
        var link = $(this).attr('href');

        $.ajax({
            url: link,
            success: function( data ) {
                
                // Get project title
                var projectTitle = $(data).find('.section-title').html().toUpperCase();
                
                // Set empty array to push images to
                var projectImgs = [];

                $(data).find('[rel=lightbox]').each(function(){

                    // Get image attr's
                    var imgURL = $(this).attr('href');
                    var imgCaption = $(this).next('.wp-caption-text').html();

                    // If no image caption provided set the attr to and empty string
                    if (imgCaption == undefined) {
                        imgCaption = "";
                    }

                    // Push images, title and caption to array
                    projectImgs.push({
                        'href' : imgURL,
                        'title' : '<span>'+ projectTitle +'</span>'+ imgCaption
                    });
                });
                // console.log(projectImgs);
                
                // Call lightbox with array as the source (requires fancybox2)
                $.fancybox.open(
                    projectImgs,
                    {
                        padding: 0,
                        helpers:  {
                            title : {
                                type : 'over'
                            }
                        }
                    }
                );
            }
        });
    });

I can't believe it took me so long to make this... I still need to add error states.