
Best Answer eric, 05 June 2014 - 10:13 PM
Thanks for your detailed question. I believe I understand what you're after, and it should be very doable with TubePress Pro. First to answer your question:
I wasn't clear if it was or wasn't possible to have the Tubepress Pro search input only search the content displayed on the page? Similar to the function with categories - a search term would repopulate the thumbnails list.
Currently TubePress's interactive searching only works via the backend; if you want to filter the content currently shown on the page, you'll have to either (1) implement your own filter in JavaScript or (2) use Ajax to fetch a new set of results from TubePress and replace the current content. The former is obviously very limited in functionality, so I don't recommend that, and the latter sounds a lot more like what you're trying to build.
TubePress Pro doesn't offer this functionality exactly, but it comes very close with Ajax-enabled interactive searching. If you aren't familiar with this feature, please test it out now on your dev site. If you look at the HTML for the Ajax-enabled search input that TubePress produces, you'll see something like:
<form accept-charset="utf-8"> <fieldset class="tubepress_search"> <input type="text" ... /> <button ...></button> </fieldset> </form> <script type="text/javascript"> (function () { //TubePress JavaScript that performs the Ajax search when the user clicks the search button }()); </script>
This HTML is generated using the template at tubepress_pro_3_1_5/src/main/php/add-ons/procore/resources/templates/search/ajax_search_input.tpl.php. If I were in your shoes, I would modify this template to show a button (i.e. for "cats") instead of a text input and search button. You would then need to write a line or two of jQuery to fire off the search when the user clicks the cats button. e.g. your template might look like:
<button id="cats-button">Cats!</button> <script type="text/javascript"> jQuery('#cats-button').click(function () { jQuery('fieldset.tubepress_search input:first').val('cats'); jQuery('fieldset.tubepress_search button:first').trigger('click'); }); </script> <form accept-charset="utf-8" style="display:none"> <fieldset class="tubepress_search"> <input type="text" ... /> <button ...></button> </fieldset> </form> <script type="text/javascript"> (function () { //TubePress JavaScript that performs the Ajax search }()); </script>
Notice that we are completely hiding the original form. I haven't tested that code but hopefully you get the idea? You could even narrow the search results down to your YouTube channel using a shortcode like:
[tubepress output="ajaxSearchInput" searchResultsDomId="#somediv" searchProvider="youtube" searchResultsRestrictedToUser="myYouTubeChannel"]
Does that make sense or did I manage to confuse us all further? One way or another, we should be able to figure something out for you!
Go to the full post