Lullabot Ideas
We know stuff. We empower you to know stuff too.
Drupal Podcast No. 53: Javascript/JQuery in Drupal
Listen online:
- LullabotPodcastNo53.mp3
John Resig joins Nate Haug, James Walker, Matt Westgate, Jeff Eaton, and Jeff Robbins in a discussion about how JavaScript and JQuery are used in Drupal, the JavaScript-related changes for Drupal 6, the new features brought by JQuery 1.2, and general strategies for using JavaScript in Drupal.
January 28, 2008 - 7:28am
67:20 minutes (15.94 MB)
mono 22kHz 33Kbps (vbr)
Comments
Packer correction :)
John Resig on board, how cool - great work. A bit sad he didn't have a more prominent place in the podcast though...
A correction about the compression (Packer) you were talking about. jquery.js in Drupal 5 is "packed". I guess it's the default packed file from jquery.com of v1.0.4, so no php port of Dean Edward's Packer involved there. From what I know, in Drupal 6 the server side compression of JavaScript files was removed (now it only merges the files). jquery.js is still packed though from start (the default packed file from jquery.com there as well I would guess).
Bummer
Thanks fajerstarter, you're correct.
The PHP version of Dean Edward's Packer was added to Drupal 6 here:
http://drupal.org/node/119441
But then was removed in December 2007 here:
http://drupal.org/node/183940#comment-664831
Now the files are just concatenated together. Bummer.
other frameworks possible?
As jQuery is part of the core it's quite difficult to use other frameworks with Drupal. Will it become easier to do this? Now one has to manually get jQuery running in compatibility mode and probably change every $ (of every module too) to jQuery because the framework you want to go and use has a $ function too. So will jQuery be running in compatibility mode and will jQuery be used instead of $? Or maybe some other wonderful rescuing thing?
Library Compatibility
There is a rescuing thing. You can wrap existing jQuery-dependent code in an anonymous function:
(function($) {// Existing code...
})(jQuery);
It should flawlessly scope only the $ variable to jQuery if the code is well-written. By well-written, I mean that it introduces global variables (if any is necessary) through
window.xinstead ofvar x. Sadly, most JavaScript code in Drupal isn't wrapped yet, even though I recall Steven saying that he planned something like that. I may write core JavaScript patches and propose them.Getting all of Drupal jQuery
Getting all of Drupal jQuery namespaced would be an excellent goal for Drupal 7. If anyone is curious how this could work, they can check out jQuery UI Backport for an example of using jQuery namespacing to get Drupal 1.2.1 and Drupal 1.0.4 running on the same page.
Drupal - only specialist or taking about it
Drupal isn't a secret at all, but for one reason or another, only specialist are working on it...
Anyone who knows about a drupal introduction video to watch ?
I would like to know a bit more about Drupal.
Pieter Jansegers
webosophy.ning.com
Do you mean Drupal in
Do you mean Drupal in general? There are lots of screencasts about Drupal under http://drupal.org/handbook/customization/videocasts
I can recommend the Drupal School if you're new to Drupal: http://theartlab.net/podcast/drupal-school
So far I've ignored the AHAH
So far I've ignored the AHAH framework completely. Now, I am sure that it'll be a big help for a project I am currently working on. Thanks a lot for opening my eyes and the good show.
Hey Ya'll, Thanks for
Hey Ya'll,
Thanks for another great lbpc! That 'liveQuery'? discussion was very interesting.
//me off to learn more about this
jQuery Plugin Manager
You guys talked about a utility module that would manage a repository jQuery plugins on a Drupal site for other modules? There's a new module called jQ
http://drupal.org/project/jq
... Sounds very promising!
jQ
Yes, the jQ module is written just for this purpose. Allows developers to call a jQuery plugin with a simple jq_add('hoverIntent'); or jq_add('jCarousel', 'my-skin'); without having to look up the specific call to invoke a plugin. This also allows administrators to see what plugins are installed on a server from a settings page. Finally, allows a jQuery wrapper module developer to add a plugin without having to take care of the housekeeping, and allowing, again, admins to see it grouped logically with other installed/enabled plugins.
The module doesn't provide any plugins itself; rather, it's a helper module for other jquery wrappers. It is distributed with a bridge module to support jquery plugin modules that haven't (or don't wish to) support jQ yet.
Current plugins supported: hoverIntent, Magnifier, Cluetip, and jCarousel. More on the way.
You mentioned that many
You mentioned that many drupalers might not notice that the jqueryness of D6 will actually drive in traffic.
I was actually ready to leave Drupal after I finish my current project specifically because of D5 jquery. Locking users down to jquery 1.0.1 (even with jquery_update.module to 1.1.2) essentially prevents developers from using jquery. Honestly! If I can't use the new features of jquery because of a version lock-down, and I really want those features, then I'll find them elsewhere in other js frameworks like scriptaculous and prototype.
However, when I go to these other frameworks, they either break my jquery, or my jquery breaks them. And since I've decided not to use jquery in the first place, since I'm limited to an older version, that's a real nuisance. If these other frameworks break jquery (which I don't even want anymore), and Drupal depends on jquery to function (fieldsets, etc), then I can't use any js framework!
After a couple of months wrestling with this issue, I decided F drupal -- I'm going Rails or something. You don't realize how golden are your words on D6's new jquery update-ability. I am staying in Drupal solely because of that.
UI makes bindings sticky?
John mentioned a secondary, yet powerful feature of UI. That jQuery bindings like $('.foo').click(function(){ /* Do something */ }); become 'sticky'. Meaning that they work even on DOM that is created through javascript instead of markup.
I have reached a blocking issue in a project where this feature would solve the issue, but cannot find ANY documentation on this feature nor make it work.
Does anyone have any links?
Microphone Pop
You *seriously* need to use screens between your microhpones and your mouths. Too much pop and breathing on the microphone makes it *way* difficult to listen on headphones (only option at work). Thanks.