After investigation, I discovered why TubePress isn't working when loaded via Ajax. Here's the technical explanation...
If you examine the HTML source of http://projects.45pr...com/cash/video/, you'll see that TubePress appends to each of its galleries a little JavaScript to initialize that particular gallery. e.g.
<script type="text/javascript">
var tubePressDomInjector = tubePressDomInjector || [], tubePressGalleryRegistrar = tubePressGalleryRegistrar || [];
tubePressDomInjector.push(['loadGalleryJs']);
tubePressGalleryRegistrar.push(['register', '2142447596', {"nvpMap":{"embeddedHeight":"350","embeddedWidth":"425","playerLocation":"normal","galleryId":2142447596},"jsMap":{"playerLocationJsUrl":"http:\/\/projects.45press.com\/cash\/wp-content\/plugins\/tubepress_pro_3_1_1\/src\/main\/web\/players\/normal\/normal.js","playerLocationProducesHtml":true,"ajaxPagination":true,"fluidThumbs":true,"httpMethod":"GET","sequence":["eJlN9jdQFSc","Tr0Vt7E7U7w","tfp2O9ADwGk","WOHPuY88Ry4","VEyujOSEexM","GzChsjd4CzU","tfF5k1nbxgA","JpGdcg8TdVI","aGnG8XhoUR4","yE_K3ZmHHnU","SOisJKfyQdk","SNxeguRCeNw","1UyjQoRnz5w","K5YiXL_xGL0","aFkcAH-m9W0","9mVItCBuN78","TwSATziEJ4I","xf86xEUriRM","8QZCGPEMU9o","sIshqGWyTgA"],"autoNext":true}} ]);
</script>
Now, your particular theme is loading that same HTML via jQuery's Ajax, which automatically strips out any HTML <script> tags. The result is that while the HTML for the TubePress gallery shows up normally, there is no corresponding JavaScript to initialize the gallery properly. So why is jQuery stripping out the <script> tags? If you look at your theme's JavaScript, you'll see:
// Ajax content load
function loadContent(url) {
$('#main-content > *').fadeOut();
$.ajax({
url: url,
success: function (responseHtml) {
document.title = $(responseHtml).filter('title').text();
$('#main-content').html($(responseHtml).find('#main-content > *'));
$('#main-content > *').hide();
$('#main-content > *').fadeIn();
// Contact Form 7
$.get('/cash/wp-content/plugins/contact-form-7/includes/js/scripts.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/js/ngg.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/js/jquery.cycle.all.min.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/js/ngg.slideshow.min.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/shutter/shutter-reloaded.js');
$.get('/cash/wp-content/plugins/tubepress_pro_3_1_1/src/main/web/js/tubepress.js');
},
error: function () {
document.title = 'Johnny Cash | Error';
$('#main-content').html('<div class="row"><div class="span12 text-center"><h3>Error</h3>An error has occurred while attempting to load the page.</div></div>');
$('#main-content > *').hide();
$('#main-content > *').fadeIn();
}
});
}
What I would try is adding a "dataType" parameter to this code so that it looks like this:
// Ajax content load
function loadContent(url) {
$('#main-content > *').fadeOut();
$.ajax({
dataType: "html",
url: url,
success: function (responseHtml) {
document.title = $(responseHtml).filter('title').text();
$('#main-content').html($(responseHtml).find('#main-content > *'));
$('#main-content > *').hide();
$('#main-content > *').fadeIn();
// Contact Form 7
$.get('/cash/wp-content/plugins/contact-form-7/includes/js/scripts.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/js/ngg.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/js/jquery.cycle.all.min.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/js/ngg.slideshow.min.js');
$.get('/cash/wp-content/plugins/nextgen-gallery/shutter/shutter-reloaded.js');
$.get('/cash/wp-content/plugins/tubepress_pro_3_1_1/src/main/web/js/tubepress.js');
},
error: function () {
document.title = 'Johnny Cash | Error';
$('#main-content').html('<div class="row"><div class="span12 text-center"><h3>Error</h3>An error has occurred while attempting to load the page.</div></div>');
$('#main-content > *').hide();
$('#main-content > *').fadeIn();
}
});
}
That should tell jQuery to include and parse the <script> tags (reference) and thus make TubePress work properly. Give it a try and let us know?
Thanks!
