Added embeed PDF Reader with media.jQuery
This commit is contained in:
+511
@@ -0,0 +1,511 @@
|
||||
/*
|
||||
* jQuery Media Plugin for converting elements into rich media content.
|
||||
*
|
||||
* Examples and documentation at: http://malsup.com/jquery/media/
|
||||
* Copyright (c) 2007-2010 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.99 (05-JUN-2013)
|
||||
* @requires jQuery v1.1.2 or later
|
||||
* $Id: jquery.media.js 2460 2007-07-23 02:53:15Z malsup $
|
||||
*
|
||||
* 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!
|
||||
* Thanks to Dan Rossi for numerous bug reports and code bits!
|
||||
* Thanks to Skye Giordano for several great suggestions!
|
||||
* Thanks to Richard Connamacher for excellent improvements to the non-IE behavior!
|
||||
*/
|
||||
/*global SWFObject alert Sys */
|
||||
/*jshint forin:false */
|
||||
;(function($) {
|
||||
"use strict";
|
||||
|
||||
var mode = document.documentMode || 0;
|
||||
var msie = /MSIE/.test(navigator.userAgent);
|
||||
var lameIE = msie && (/MSIE (6|7|8)\.0/.test(navigator.userAgent) || mode < 9);
|
||||
|
||||
/**
|
||||
* Chainable method for converting elements into rich media.
|
||||
*
|
||||
* @param options
|
||||
* @param callback fn invoked for each matched element before conversion
|
||||
* @param callback fn invoked for each matched element after conversion
|
||||
*/
|
||||
$.fn.media = function(options, f1, f2) {
|
||||
if (options == 'undo') {
|
||||
return this.each(function() {
|
||||
var $this = $(this);
|
||||
var html = $this.data('media.origHTML');
|
||||
if (html)
|
||||
$this.replaceWith(html);
|
||||
});
|
||||
}
|
||||
|
||||
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.toLowerCase()) || [''];
|
||||
var fn;
|
||||
|
||||
if (o.type)
|
||||
m[0] = o.type;
|
||||
else
|
||||
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);
|
||||
|
||||
if (o.canUndo) {
|
||||
var $temp = $('<div></div>').append(this);
|
||||
$div.data('media.origHTML', $temp.html()); // store original markup
|
||||
}
|
||||
|
||||
// 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;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 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];
|
||||
$.fn.media[format+'_player'] = $.fn.media.defaults.players[player];
|
||||
};
|
||||
|
||||
// global defautls; override as needed
|
||||
$.fn.media.defaults = {
|
||||
standards: true, // use object tags only (no embeds for non-IE browsers)
|
||||
canUndo: true, // tells plugin to store the original markup so it can be reverted via: $(sel).mediaUndo()
|
||||
width: 400,
|
||||
height: 400,
|
||||
autoplay: 0, // normalized cross-player setting
|
||||
bgColor: '#ffffff', // background color
|
||||
params: { wmode: 'transparent'}, // added to object element as param elements; added to embed element as attrs
|
||||
attrs: {}, // added to object and embed elements as attrs
|
||||
flvKeyName: 'file', // key used for object src param (thanks to Andrea Ercolino)
|
||||
flashvars: {}, // added to flash content as flashvars param/attr
|
||||
flashVersion: '7', // required flash version
|
||||
expressInstaller: null, // src for express installer
|
||||
|
||||
// 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',
|
||||
title: 'Flash',
|
||||
types: 'flv,mp3,swf',
|
||||
mimetype: 'application/x-shockwave-flash',
|
||||
pluginspage: 'http://www.adobe.com/go/getflashplayer',
|
||||
ieAttrs: {
|
||||
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
|
||||
}
|
||||
},
|
||||
quicktime: {
|
||||
name: 'quicktime',
|
||||
title: 'QuickTime',
|
||||
mimetype: 'video/quicktime',
|
||||
pluginspage: 'http://www.apple.com/quicktime/download/',
|
||||
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',
|
||||
ieAttrs: {
|
||||
classid: 'clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B',
|
||||
codebase: 'http://www.apple.com/qtactivex/qtplugin.cab'
|
||||
}
|
||||
},
|
||||
realplayer: {
|
||||
name: 'real',
|
||||
title: 'RealPlayer',
|
||||
types: 'ra,ram,rm,rpm,rv,smi,smil',
|
||||
mimetype: 'audio/x-pn-realaudio-plugin',
|
||||
pluginspage: 'http://www.real.com/player/',
|
||||
autoplayAttr: 'autostart',
|
||||
ieAttrs: {
|
||||
classid: 'clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA'
|
||||
}
|
||||
},
|
||||
winmedia: {
|
||||
name: 'winmedia',
|
||||
title: 'Windows Media',
|
||||
types: 'asx,asf,avi,wma,wmv',
|
||||
mimetype: isFirefoxWMPPluginInstalled() ? 'application/x-ms-wmp' : 'application/x-mplayer2',
|
||||
pluginspage: 'http://www.microsoft.com/Windows/MediaPlayer/',
|
||||
autoplayAttr: 'autostart',
|
||||
oUrl: 'url',
|
||||
ieAttrs: {
|
||||
classid: 'clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6',
|
||||
type: 'application/x-oleobject'
|
||||
}
|
||||
},
|
||||
// special cases
|
||||
img: {
|
||||
name: 'img',
|
||||
title: 'Image',
|
||||
types: 'gif,png,jpg'
|
||||
},
|
||||
iframe: {
|
||||
name: 'iframe',
|
||||
types: 'html,pdf'
|
||||
},
|
||||
silverlight: {
|
||||
name: 'silverlight',
|
||||
types: 'xaml'
|
||||
}
|
||||
};
|
||||
|
||||
//
|
||||
// everything below here is private
|
||||
//
|
||||
|
||||
|
||||
// detection script for FF WMP plugin (http://www.therossman.org/experiments/wmp_play.html)
|
||||
// (hat tip to Mark Ross for this script)
|
||||
function isFirefoxWMPPluginInstalled() {
|
||||
var plugs = navigator.plugins || [];
|
||||
for (var i = 0; i < plugs.length; i++) {
|
||||
var plugin = plugs[i];
|
||||
if (plugin['filename'] == 'np-mswmp.dll')
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
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(/,/ig,'|') + ')\\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 a, n;
|
||||
var $el = $(el);
|
||||
var cls = el.className || '';
|
||||
// support metadata plugin (v1.0 and v2.0)
|
||||
var meta = $.metadata ? $el.metadata() : $.meta ? $el.data() : {};
|
||||
meta = meta || {};
|
||||
var w = meta.width || parseInt(((cls.match(/\bw:(\d+)/)||[])[1]||0),10) || parseInt(((cls.match(/\bwidth:(\d+)/)||[])[1]||0),10);
|
||||
var h = meta.height || parseInt(((cls.match(/\bh:(\d+)/)||[])[1]||0),10) || parseInt(((cls.match(/\bheight:(\d+)/)||[])[1]||0),10);
|
||||
|
||||
if (w) meta.width = w;
|
||||
if (h) meta.height = h;
|
||||
if (cls) meta.cls = cls;
|
||||
|
||||
// crank html5 style data attributes
|
||||
var dataName = 'data-';
|
||||
for (var i=0; i < el.attributes.length; i++) {
|
||||
a = el.attributes[i], n = $.trim(a.name);
|
||||
var index = n.indexOf(dataName);
|
||||
if (index === 0) {
|
||||
n = n.substring(dataName.length);
|
||||
meta[n] = a.value;
|
||||
}
|
||||
}
|
||||
|
||||
a = $.fn.media.defaults;
|
||||
var b = options;
|
||||
var c = meta;
|
||||
|
||||
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 library if possible
|
||||
$.fn.media.swf = function(el, opts) {
|
||||
var f, p;
|
||||
if (!window.SWFObject && !window.swfobject) {
|
||||
// roll our own
|
||||
if (opts.flashvars) {
|
||||
var a = [];
|
||||
for (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 = $('<div' + id + cls + '>');
|
||||
|
||||
// swfobject v2+
|
||||
if (window.swfobject) {
|
||||
$(el).after($div).appendTo($div);
|
||||
if (!el.id) el.id = 'movie_player_' + counter++;
|
||||
|
||||
// replace el with swfobject content
|
||||
window.swfobject.embedSWF(opts.src, el.id, opts.width, opts.height, opts.flashVersion,
|
||||
opts.expressInstaller, opts.flashvars, opts.params, opts.attrs);
|
||||
}
|
||||
// swfobject < v2
|
||||
else {
|
||||
$(el).after($div).remove();
|
||||
var so = new SWFObject(opts.src, 'movie_player_' + counter++, opts.width, opts.height, opts.flashVersion, opts.bgColor);
|
||||
if (opts.expressInstaller) so.useExpressInstall(opts.expressInstaller);
|
||||
|
||||
for (p in opts.params)
|
||||
if (p != 'bgColor') so.addParam(p, opts.params[p]);
|
||||
for (f in opts.flashvars)
|
||||
so.addVariable(f, opts.flashvars[f]);
|
||||
so.write($div[0]);
|
||||
}
|
||||
|
||||
if (opts.caption) $('<div>').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) ? opts.mp3Player : opts.flvPlayer;
|
||||
var key = opts.flvKeyName;
|
||||
src = encodeURIComponent(src);
|
||||
opts.src = player;
|
||||
opts.src = opts.src + '?'+key+'=' + (src);
|
||||
var srcObj = {};
|
||||
srcObj[key] = src;
|
||||
opts.flashvars = $.extend({}, srcObj, 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 = $('<div' + id1 + cls + '>');
|
||||
$(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) $('<div>').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];
|
||||
var a, key, v;
|
||||
|
||||
if (player == 'iframe') {
|
||||
o = $('<iframe' + ' width="' + opts.width + '" height="' + opts.height + '" >');
|
||||
o.attr('src', opts.src);
|
||||
o.css('backgroundColor', o.bgColor);
|
||||
}
|
||||
else if (player == 'img') {
|
||||
o = $('<img>');
|
||||
o.attr('src', opts.src);
|
||||
if (opts.width)
|
||||
o.attr('width', opts.width);
|
||||
if (opts.height)
|
||||
o.attr('height', opts.height);
|
||||
o.css('backgroundColor', o.bgColor);
|
||||
}
|
||||
else if (lameIE) {
|
||||
a = ['<object width="' + opts.width + '" height="' + opts.height + '" '];
|
||||
for (key in opts.attrs)
|
||||
a.push(key + '="'+opts.attrs[key]+'" ');
|
||||
for (key in o.ieAttrs || {}) {
|
||||
v = o.ieAttrs[key];
|
||||
if (key == 'codebase' && window.location.protocol == 'https:')
|
||||
v = v.replace('http','https');
|
||||
a.push(key + '="'+v+'" ');
|
||||
}
|
||||
a.push('></ob'+'ject'+'>');
|
||||
var p = ['<param name="' + (o.oUrl || 'src') +'" value="' + opts.src + '">'];
|
||||
for (key in opts.params)
|
||||
p.push('<param name="'+ key +'" value="' + opts.params[key] + '">');
|
||||
o = document.createElement(a.join(''));
|
||||
for (var i=0; i < p.length; i++)
|
||||
o.appendChild(document.createElement(p[i]));
|
||||
}
|
||||
else if (opts.standards) {
|
||||
// Rewritten to be standards compliant by Richard Connamacher
|
||||
a = ['<object type="' + o.mimetype +'" width="' + opts.width + '" height="' + opts.height +'"'];
|
||||
if (opts.src) a.push(' data="' + opts.src + '" ');
|
||||
if (msie) {
|
||||
for (key in o.ieAttrs || {}) {
|
||||
v = o.ieAttrs[key];
|
||||
if (key == 'codebase' && window.location.protocol == 'https:')
|
||||
v = v.replace('http','https');
|
||||
a.push(key + '="'+v+'" ');
|
||||
}
|
||||
}
|
||||
a.push('>');
|
||||
a.push('<param name="' + (o.oUrl || 'src') +'" value="' + opts.src + '">');
|
||||
for (key in opts.params) {
|
||||
if (key == 'wmode' && player != 'flash') // FF3/Quicktime borks on wmode
|
||||
continue;
|
||||
a.push('<param name="'+ key +'" value="' + opts.params[key] + '">');
|
||||
}
|
||||
// Alternate HTML
|
||||
a.push('<div><p><strong>'+o.title+' Required</strong></p><p>'+o.title+' is required to view this media. <a href="'+o.pluginspage+'">Download Here</a>.</p></div>');
|
||||
a.push('</ob'+'ject'+'>');
|
||||
}
|
||||
else {
|
||||
a = ['<embed width="' + opts.width + '" height="' + opts.height + '" style="display:block"'];
|
||||
if (opts.src) a.push(' src="' + opts.src + '" ');
|
||||
for (key in opts.attrs)
|
||||
a.push(key + '="'+opts.attrs[key]+'" ');
|
||||
for (key in o.eAttrs || {})
|
||||
a.push(key + '="'+o.eAttrs[key]+'" ');
|
||||
for (key in opts.params) {
|
||||
if (key == 'wmode' && player != 'flash') // FF3/Quicktime borks on wmode
|
||||
continue;
|
||||
a.push(key + '="'+opts.params[key]+'" ');
|
||||
}
|
||||
a.push('></em'+'bed'+'>');
|
||||
}
|
||||
// convert element to div
|
||||
var id = el.id ? (' id="'+el.id+'"') : '';
|
||||
var cls = opts.cls ? (' class="' + opts.cls + '"') : '';
|
||||
var $div = $('<div' + id + cls + '>');
|
||||
$el.after($div).remove();
|
||||
if (lameIE || player == 'iframe' || player == 'img')
|
||||
$div.append(o);
|
||||
else
|
||||
$div.html(a.join(''));
|
||||
|
||||
if (opts.caption)
|
||||
$('<div>').appendTo($div).html(opts.caption);
|
||||
return $div;
|
||||
}
|
||||
|
||||
|
||||
})(jQuery);
|
||||
Reference in New Issue
Block a user