jQuery Media

This is a wrapper for the jQuery Media plug-in.

The jQuery Media plugin will automatically turn links to media into their embedded media equivalents. The module works best in conjuction with the File Field module, but may be used in other cases as well.

Basic Configuration

See the New Video Tutorial!

Once installed, you need to go to the settings page for the module, and enter a few items for basic support. Simply tell it which node types to load the plug-in. If those node types have File Fields, it will automatically work. If you have updated the module from an earlier version, and have already visited the settings page, you may need to go back and add .filefield-item a to the Classes section to make that work.

To work with links other than File Field links, or to affect only certain File Fields (or to remove automatic File Field conversion), you'll need to add the classes of the link(s) to convert. By default, with .filefield-item a in the Classes section, all File Fields in the activated node types will be converted. If you need more fine-tune control, you can enter more specific CSS identifiers, separated by commas, such as .field-video-file a, .field-audio-file a.

You'll also need to have a media player installed, such as the JW FLV Player or Wimpy Rave. You'll need to enter the path to that player in the Default players section.

There are many more settings available, such as player width/height and color, and advanced settings, such as specific parameters and flash variables (useful for adding loading screens, logos, and the like). Additionally, you can override any of the global settings on an individual basis, usually in combination with template theming, as outlined below. Make sure to read the Help page installed on your server after enabling the module for the most up-do-date documentation.

Note that the Drupal 6 version no longer supports modal popups via MediaBox. There are much better plugins for this support, such as Thickbox. The Drupal 5 version still supports that; see that version's help page for more info.

It is strongly recommended that you use the latest revision of the jQ module in conjunction with this module, although its use is optional. You may also wish to download the jQuery BlockUI module if you wish to use the MediaBox functionality (although you would also need to update your jQuery to 1.2.3).

Advanced Customization

Theming is outside of the scope of this help page. You might look at Drupal's Theme Developer's Guide for more information. However, once you are ready to theme your elements, you only need to add a class and invoke this plugin. For instance, if you have a File Field with a video, simply use something like the following: jq_add('jquery_media'); print l($node->title, $node->field_file_field[0]['filepath'], array('class' => 'media'));

You may override the global defaults of this plugin when configuring. Additionally, you may override a global default on a case-by-case basis by including the override in an options array when invoking the plugin. For instance, you might override the background color of players on a specific page with jq_add('jquery_media', array('bgcolor' => '#33FF00'));. This will override the defaults of the plugin for every media link on that page, which may in turn override those individually (more on that later).

The full array of global overrides are as follows:

• 'flvplayer' => The path to the Flash Video Player to be used, such as the JW FLV Player or Wimpy Rave.
• 'mp3player' => The path to the MP3 Audio Player to be used, such as the JW FLV Player or Wimpy MP3 Player.
• 'media width' => The width the media will be displayed as.
• 'media height' => The height the media will be displayed as.
• 'autoplay' => If TRUE, then play the media as soon as loading it.
• 'bgcolor' => This will be the background color for the media player, in hexidecimal code (#RRGGBB).
• 'invoke media' => If TRUE, then cause all links with the 'media class' to automatically be turned into embedded media when invoking the plugin.
• 'media class' => The class that will be turned into embedded media on invocation. It uses jQuery CSS notation, so should be something like 'a.media' for links.

Finally, you may override a global setting on an individual basis. The customizations here are extensive, and rather than repeating that here, you are directed to the jQuery Media homepage for more information. As an example, you might set the size of a specific file with the following, while leaving any other jquery media links on the page at their default. (Note that we change the class away from the default 'media' in this example. It also assumes we've already invoked it as above.): print l($node->title, $node->field_audio_file, array('class' => 'media-audio')); drupal_add_js("$('a.media-audio').media( { width: 200, height: 15, autoplay: true } )", 'inline');

Note that by default, the module will add its default overrides inline. However, you may set it to output them to a dynamic javascript file, and may additionally wish to set the defaults to a static js file, once development is complete. You can alter those settings when configuring the module.