/*
* jQuery Media Plugin for converting elements into rich media content.
*
* Examples and documentation at: http://malsup.com/jquery/media/
* Copyright (c) 2007 M. Alsup
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* @author: M. Alsup
* @version: 0.70 (7/05/2007)
* @requires jQuery v1.1.2 or later
*
* Supported Media Players:
* - Flash
* - Quicktime
* - Real Player
* - Silverlight
* - Windows Media Player
* - iframe
*
* Supported Media Formats:
* Any types supported by the above players, such as:
* Video: asf, avi, flv, mov, mpg, mpeg, mp4, qt, smil, swf, wmv, 3g2, 3gp
* Audio: aif, aac, au, gsm, mid, midi, mov, mp3, m4a, snd, rm, wav, wma
* Other: bmp, html, pdf, psd, qif, qtif, qti, tif, tiff, xaml
*
* Thanks to Mark Hicken and Brent Pedersen for helping me debug this on the Mac!
*/
(function($) {
/**
* Chainable method for converting elements into rich media.
*
* @name media
* @param Object options Options object
* @param Function callback fn invoked for each matched element before conversion
* @param Function callback fn invoked for each matched element after conversion
* @cat Plugins/media
*/
$.fn.media = function(options, f1, f2) {
return this.each(function() {
if (typeof options == 'function') {
f2 = f1;
f1 = options;
options = {};
}
var o = getSettings(this, options);
// pre-conversion callback, passes original element and fully populated options
if (typeof f1 == 'function') f1(this, o);
var r = getTypesRegExp();
var m = r.exec(o.src) || [''];
o.type ? m[0] = o.type : m.shift();
for (var i=0; i < m.length; i++) {
fn = m[i].toLowerCase();
if (isDigit(fn[0])) fn = 'fn' + fn; // fns can't begin with numbers
if (!$.fn.media[fn])
continue; // unrecognized media type
// normalize autoplay settings
var player = $.fn.media[fn+'_player'];
if (!o.params) o.params = {};
if (player) {
var num = player.autoplayAttr == 'autostart';
o.params[player.autoplayAttr || 'autoplay'] = num ? (o.autoplay ? 1 : 0) : o.autoplay ? true : false;
}
var $div = $.fn.media[fn](this, o);
$div.css('backgroundColor', o.bgColor).width(o.width);
// post-conversion callback, passes original element, new div element and fully populated options
if (typeof f2 == 'function') f2(this, $div[0], o, player.name);
break;
}
});
};
/**
* Chainable method for preparing elements to display rich media with
* a page overlay.
*
* @name mediabox
* @param Object options Options object
* @param Object css values for the media div
* @cat Plugins/media
*/
$.fn.mediabox = function(options, css) {
return this.click(function() {
if (typeof $.blockUI == 'undefined' || typeof $.blockUI.version == 'undefined' || $.blockUI.version < 1.26) {
if (typeof $.fn.mediabox.warning != 'undefined') return this; // one warning is enough
$.fn.mediabox.warning = 1;
alert('The mediabox method requires blockUI v1.26 or later.');
return false;
}
var o, p, div=0, $e = $(this).clone();
$e.appendTo('body').hide().css({margin: 0});
options = $.extend({}, options, { autoplay: 1 }); // force autoplay in box mode
$e.media(options, function(){}, function(origEl, newEl, opts, player) {
div = newEl;
o = opts;
p = player;
});
if (!div) return false;
// don't pull element from the dom on Safari
var $div = $.browser.safari ? $(div).hide() : $(div).remove();
if (o.loadingImage)
$div.css({
backgroundImage: 'url('+o.loadingImage+')',
backgroundPosition: 'center center',
backgroundRepeat: 'no-repeat'
});
if (o.boxTitle)
$div.prepend('
' + o.boxTitle + '
');
if (css) $div.css(css);
$div.displayBox( { width: o.width, height: o.height }, function(el) {
// quirkiness; sometimes media doesn't stop when removed from the DOM (especially in IE)
$('object,embed', el).each(function() {
try { this.Stop(); } catch(e) {} // quicktime
try { this.DoStop(); } catch(e) {} // real
try { this.controls.stop(); } catch(e) {} // windows media player
});
}, p == 'flash'); // <-- mac/ff workaround
return false;
});
};
/**
* Non-chainable method for adding or changing file format / player mapping
* @name mapFormat
* @param String format File format extension (ie: mov, wav, mp3)
* @param String player Player name to use for the format (one of: flash, quicktime, realplayer, winmedia, silverlight or iframe
*/
$.fn.media.mapFormat = function(format, player) {
if (!format || !player || !$.fn.media.defaults.players[player]) return; // invalid
format = format.toLowerCase();
if (isDigit(format[0])) format = 'fn' + format;
$.fn.media[format] = $.fn.media[player];
};
// global defautls; override as needed
$.fn.media.defaults = {
width: 400,
height: 400,
preferMeta: 1, // true if markup metadata takes precedence over options object
autoplay: 0, // normalized cross-player setting
bgColor: '#ffffff', // background color
params: {}, // added to object element as param elements; added to embed element as attrs
attrs: {}, // added to object and embed elements as attrs
flashvars: {}, // added to flash content as flashvars param/attr
flashVersion: '7', // required flash version
// MediaBox options
boxTitle: null, // MediaBox titlebar
loadingImage: null, // MediaBox loading indicator
// default flash video and mp3 player (@see: http://jeroenwijering.com/?item=Flash_Media_Player)
flvPlayer: 'mediaplayer.swf',
mp3Player: 'mediaplayer.swf',
// @see http://msdn2.microsoft.com/en-us/library/bb412401.aspx
silverlight: {
inplaceInstallPrompt: 'true', // display in-place install prompt?
isWindowless: 'true', // windowless mode (false for wrapping markup)
framerate: '24', // maximum framerate
version: '0.9', // Silverlight version
onError: null, // onError callback
onLoad: null, // onLoad callback
initParams: null, // object init params
userContext: null // callback arg passed to the load callback
}
};
// Media Players; think twice before overriding
$.fn.media.defaults.players = {
flash: {
name: 'flash',
types: 'flv,mp3,swf',
oAttrs: {
classid: 'clsid:d27cdb6e-ae6d-11cf-96b8-444553540000',
type: 'application/x-oleobject',
codebase: 'http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=' + $.fn.media.defaults.flashVersion
},
eAttrs: {
type: 'application/x-shockwave-flash',
pluginspage: 'http://www.adobe.com/go/getflashplayer'
}
},
quicktime: {
name: 'quicktime',
types: 'aif,aiff,aac,au,bmp,gsm,mov,mid,midi,mpg,mpeg,mp4,m4a,psd,qt,qtif,qif,qti,snd,tif,tiff,wav,3g2,3gp',
oAttrs: {
classid: 'clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B',
codebase: 'http://www.apple.com/qtactivex/qtplugin.cab'
},
eAttrs: {
pluginspage: 'http://www.apple.com/quicktime/download/'
}
},
realplayer: {
name: 'real',
types: 'ra,ram,rm,rpm,rv,smi,smil',
autoplayAttr: 'autostart',
oAttrs: {
classid: 'clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA'
},
eAttrs: {
type: 'audio/x-pn-realaudio-plugin',
pluginspage: 'http://www.real.com/player/'
}
},
winmedia: {
name: 'winmedia',
types: 'asf,avi,wma,wmv',
autoplayAttr: 'autostart',
oUrl: 'url',
oAttrs: {
classid: 'clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6',
type: 'application/x-oleobject'
},
eAttrs: {
type: 'application/x-mplayer2',
pluginspage: 'http://www.microsoft.com/Windows/MediaPlayer/'
}
},
// special cases
iframe: {
name: 'iframe',
types: 'html,pdf'
},
silverlight: {
name: 'silverlight',
types: 'xaml'
}
};
//
// everything below here is private
//
var counter = 1;
for (var player in $.fn.media.defaults.players) {
var types = $.fn.media.defaults.players[player].types;
$.each(types.split(','), function(i,o) {
if (isDigit(o[0])) o = 'fn' + o;
$.fn.media[o] = $.fn.media[player] = getGenerator(player);
$.fn.media[o+'_player'] = $.fn.media.defaults.players[player];
});
};
function getTypesRegExp() {
var types = '';
for (var player in $.fn.media.defaults.players) {
if (types.length) types += ',';
types += $.fn.media.defaults.players[player].types;
};
return new RegExp('\\.(' + types.replace(/,/g,'|') + ')\\b');
};
function getGenerator(player) {
return function(el, options) {
return generate(el, options, player);
};
};
function isDigit(c) {
return '0123456789'.indexOf(c) > -1;
};
// flatten all possible options: global defaults, meta, option obj
function getSettings(el, options) {
options = options || {};
var $el = $(el);
var cls = el.className || '';
var meta = $.meta ? $el.data() : {};
var w = meta.width || parseInt(((cls.match(/w:(\d+)/)||[])[1]||0));
var h = meta.height || parseInt(((cls.match(/h:(\d+)/)||[])[1]||0));
if (w) meta.width = w;
if (h) meta.height = h;
if (cls) meta.cls = cls;
var a = $.fn.media.defaults;
var b = $.meta && $.fn.media.defaults.preferMeta ? options : meta;
var c = b == options ? meta : options;
var p = { params: { bgColor: options.bgColor || $.fn.media.defaults.bgColor } };
var opts = $.extend({}, a, b, c);
$.each(['attrs','params','flashvars','silverlight'], function(i,o) {
opts[o] = $.extend({}, p[o] || {}, a[o] || {}, b[o] || {}, c[o] || {});
});
if (typeof opts.caption == 'undefined') opts.caption = $el.text();
// make sure we have a source!
opts.src = opts.src || $el.attr('href') || $el.attr('src') || 'unknown';
return opts;
};
//
// Flash Player
//
// generate flash using SWFObject if possible
$.fn.media.swf = function(el, opts) {
if (typeof SWFObject == 'undefined') {
// roll our own
if (opts.flashvars) {
var a = [];
for (var f in opts.flashvars)
a.push(f + '=' + opts.flashvars[f]);
if (!opts.params) opts.params = {};
opts.params.flashvars = a.join('&');
}
return generate(el, opts, 'flash');
}
var id = el.id ? (' id="'+el.id+'"') : '';
var cls = opts.cls ? (' class="' + opts.cls + '"') : '';
var $div = $('');
$(el).after($div).remove();
var so = new SWFObject(opts.src, 'movie_player_' + counter++, opts.width, opts.height, opts.flashVersion, opts.bgColor);
for (var p in opts.params)
if (p != 'bgColor') so.addParam(p, opts.params[p]);
for (var f in opts.flashvars)
so.addVariable(f, opts.flashvars[f]);
so.write($div[0]);
if (opts.caption) $('
').appendTo($div).html(opts.caption);
return $div;
};
// map flv and mp3 files to the swf player by default
$.fn.media.flv = $.fn.media.mp3 = function(el, opts) {
var src = opts.src;
var player = /\.mp3\b/i.test(src) ? $.fn.media.defaults.mp3Player : $.fn.media.defaults.flvPlayer;
opts.src = player;
opts.src = opts.src + '?soundFile=' + src;
opts.flashvars = $.extend({}, { file: src }, opts.flashvars );
return $.fn.media.swf(el, opts);
};
//
// Silverlight
//
$.fn.media.xaml = function(el, opts) {
if (!window.Sys || !window.Sys.Silverlight) {
if ($.fn.media.xaml.warning) return;
$.fn.media.xaml.warning = 1;
alert('You must include the Silverlight.js script.');
return;
}
var props = {
width: opts.width,
height: opts.height,
background: opts.bgColor,
inplaceInstallPrompt: opts.silverlight.inplaceInstallPrompt,
isWindowless: opts.silverlight.isWindowless,
framerate: opts.silverlight.framerate,
version: opts.silverlight.version
};
var events = {
onError: opts.silverlight.onError,
onLoad: opts.silverlight.onLoad
};
var id1 = el.id ? (' id="'+el.id+'"') : '';
var id2 = opts.id || 'AG' + counter++;
// convert element to div
var cls = opts.cls ? (' class="' + opts.cls + '"') : '';
var $div = $('');
$(el).after($div).remove();
Sys.Silverlight.createObjectEx({
source: opts.src,
initParams: opts.silverlight.initParams,
userContext: opts.silverlight.userContext,
id: id2,
parentElement: $div[0],
properties: props,
events: events
});
if (opts.caption) $('
').appendTo($div).html(opts.caption);
return $div;
};
//
// generate object/embed markup
//
function generate(el, opts, player) {
var $el = $(el);
var o = $.fn.media.defaults.players[player];
if (player == 'iframe') {
var o = $('');
o.attr('src', opts.src);
o.css('backgroundColor', o.bgColor);
}
else if ($.browser.msie) {
var a = ['