5

Drupal 7. I'm trying to get this to work - seems simple enough. I added the .js file through my theme's .info file, and it's picking that up. I selected "Full HTML" as the format for my block, and pasted the code in (both the js and the ul). Just doesn't work.

http://www.geckonewmedia.com/blog/2009/8/14/jquery-youtube-playlist-plugin---youtubeplaylist

Any ideas? I suspect the js needs to be loaded somewhere else, that maybe it's being stripped out from the block code?


Per SoftArtisans (thanks) this is now what I have in the Body of my custom block (set to full HTML):

    <script type="text/ecmascript">

(function ($) {
  $("ul.aintv").ytplaylist({addThumbs:true, autoPlay: false, holderId: 'ytvideo'});
}(jQuery));
       
</script>


<div class="yt_holder">

<div id="ytvideo"></div>

  <ul class="aintv">
    <li><a href="http://www.youtube.com/watch?v=QBBWKvY-VDc">Video 1</a></li>
    <li><a href="http://www.youtube.com/watch?v=ZXMQqLnRhRI">Video 2</a></li>
    <li><a href="http://www.youtube.com/watch?v=Wvo-g_JvURI">Video 3</a></li>
  </ul>

</div>

It's still not working. I verified the other .js file is being picked up in the source.

  • You're missing the (jQuery) part at the end of the function so you aren't actually aliasing $ to jQuery at this point – Chaulky Aug 9 '11 at 17:05
  • Good catch - updated the question. Unfortunately still not working. – Mike Aug 9 '11 at 17:32
1
+200

Remove your JS path from the .info file and try something like this (replace /path/to/yourscript.js with the path to your script):

jQuery.noConflict();

jQuery(document).ready(function($){
   $.getScript('/path/to/yourscript.js', function() {
        $("ul.demo1").ytplaylist();
   });
});

This dynamically loads your JS when the DOM is fully loaded and it makes sure that $ can be used without conflicting with other libraries.

  • Please note that the 'path' (this is in fact a URL) for getScript is relative to your site root and don't forget to replace the JS selector for the playlist with what you need. I've tried this now on my own server and it seems to work. – Stefan Aug 17 '11 at 9:52
  • Dude, you rock, works perfectly. Cheers! – Mike Aug 17 '11 at 10:31
5

In Drupal, you can't just call jQuery quite like that. The reason is mostly because there my be other JavaScript libraries in use so jQuery is not aliased as $() in Drupal. For more details on that you can view the Drupal Docs about JavaScript compatibility, or the specific issue in the queue.

The solution is to wrap your jQuery code as described in the Drupal docs page linked to above. In your case it would look something like this...

(function ($) {
  $("ul.demo1").ytplaylist();
})(jQuery);
  • Hey - do I need to modify his jquery.youtubeplaylist.js in a similar fashion? – Mike Aug 9 '11 at 15:39
  • No, you don't have to edit his plugin, but how did you add his plugin .js file to the page? – SoftArtisans Aug 9 '11 at 15:49
  • I added "scripts[] = js/jquery.youtubeplaylist.js" to my .info file for the theme. – Mike Aug 9 '11 at 17:33
  • Note that i had a typo in the code... the parens at the end were in the wrong places. I tried setting this up on my own test site and it didn't work there either. Not sure yet what the problem is – SoftArtisans Aug 9 '11 at 19:59
  • Any luck? This is killing me. – Mike Aug 10 '11 at 20:46
1

jquery.youtubeplaylist.js uses directly $ instead of jQuery. Contrary to what is said above, you have to modify that plugin and replace all $ by jQuery.

0

It seems like you are trying to make a Drupal Module when there is already something that does this out there. Check out http://drupal.org/project/mediafront which is a video/img/music skin that works with the Media Module, Media:YouTube & Media:Vimeo Modules for url pasting (which you are looking for).

Bonus is there is a video http://www.mediafront.org/dallas-drupal-days-2011-presenting-media where the person who made the module is presenting. He demos pasting in urls at 44 minutes.

This module is written in jQuery (like the one you are trying to use) and is set up for Drupal so you don't have to figure out the configurations and is so amazing your mind will be blown.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.