MDL-23870: Replace flash and mp3 multimedia filter with flowplayer.

This commit is contained in:
Rossiani Wijaya 2010-09-09 11:30:06 +00:00
parent b95e74322a
commit 3a42ad126c
11 changed files with 238 additions and 87 deletions

View File

@ -49,61 +49,61 @@ class filter_mediaplugin extends moodle_text_filter {
$newtext = $text; // fullclone is slow and not needed here
if ($CFG->filter_mediaplugin_enable_mp3) {
$search = '/<a.*?href="([^<]+\.mp3)"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.mp3)"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_mp3_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_swf) {
$search = '/<a.*?href="([^<]+\.swf)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.swf)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_swf_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_flv) {
$search = '/<a.*?href="([^<]+\.flv)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.flv)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_flv_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_mov) {
$search = '/<a.*?href="([^<]+\.mov)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.mov)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_qt_callback', $newtext);
$search = '/<a.*?href="([^<]+\.mp4)(\?d=([\d]{1,4}%?)x([\d]{1,4}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.mp4)(\?d=([\d]{1,4}%?)x([\d]{1,4}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_qt_callback', $newtext);
$search = '/<a.*?href="([^<]+\.m4v)(\?d=([\d]{1,4}%?)x([\d]{1,4}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.m4v)(\?d=([\d]{1,4}%?)x([\d]{1,4}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_qt_callback', $newtext);
$search = '/<a.*?href="([^<]+\.m4a)(\?d=([\d]{1,4}%?)x([\d]{1,4}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.m4a)(\?d=([\d]{1,4}%?)x([\d]{1,4}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_qt_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_wmv) {
$search = '/<a.*?href="([^<]+\.wmv)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.wmv)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_wmp_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_mpg) {
$search = '/<a.*?href="([^<]+\.mpe?g)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.mpe?g)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_qt_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_avi) {
$search = '/<a.*?href="([^<]+\.avi)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.avi)(\?d=([\d]{1,3}%?)x([\d]{1,3}%?))?"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_wmp_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_ram) {
$search = '/<a.*?href="([^<]+\.ram)"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.ram)"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_real_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_rpm) {
$search = '/<a.*?href="([^<]+\.rpm)"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.rpm)"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_real_callback', $newtext);
}
if ($CFG->filter_mediaplugin_enable_rm) {
$search = '/<a.*?href="([^<]+\.rm)"[^>]*>.*?<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.rm)"[^>]*>.*?<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_real_callback', $newtext);
}
@ -118,11 +118,11 @@ class filter_mediaplugin extends moodle_text_filter {
}
if (!empty($CFG->filter_mediaplugin_enable_img)) {
$search = '/<a.*?href="([^<]+\.jpg)"[^>]*>(.*?)<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.jpg)"[^>]*>(.*?)<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_img_callback', $newtext);
$search = '/<a.*?href="([^<]+\.png)"[^>]*>(.*?)<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.png)"[^>]*>(.*?)<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_img_callback', $newtext);
$search = '/<a.*?href="([^<]+\.gif)"[^>]*>(.*?)<\/a>/is';
$search = '/<a[^>]*?href="([^<]+\.gif)"[^>]*>(.*?)<\/a>/is';
$newtext = preg_replace_callback($search, 'filter_mediaplugin_img_callback', $newtext);
}
@ -155,18 +155,42 @@ function filter_mediaplugin_mp3_callback($link) {
$url = addslashes_js($link[1]);
$args = Array();
$args['movie'] = $CFG->wwwroot.'/filter/mediaplugin/mp3player.swf?src='.$url;
$args['width'] = 90;
$args['height'] = 15;
$args['majorversion'] = 6;
$args['build'] = 40;
$args['flashvars'] = $c;
$args['quality'] = 'high';
$playerpath = $CFG->wwwroot.'/filter/mediaplugin/mp3player.swf';
$audioplayerpath = $CFG->wwwroot .'/filter/mediaplugin/flowplayer.audio.swf';
$colors = explode('&', $c);
$playercolors = array();
foreach ($colors as $color) {
$color = explode('=', $color);
$playercolors[$color[0]] = $color[1];
}
$jsoutput = create_ufo_inline($id, $args);
$output = <<<OET
<span class="mediaplugin mediaplugin_mp3" id="$id"></span>
<noscript>
<object width="100" height="15" id="nonjsmp3plugin" name="undefined" data="$playerpath" type="application/x-shockwave-flash">
<param name="movie" value="$playerpath" />
<param name="allowfullscreen" value="false" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value='config={"plugins": {"controls": {
"fullscreen": false,
"height": 15,
"autoHide": false,
"all": false,
"play": true,
"pause": true,
"scrubber": true
},
"audio": {"url": "$audioplayerpath"}
},
"clip":{"url":"$url",
"autoPlay": false},
"content":{"url":"$playerpath"}}}' />
</object>
</noscript>
OET;
$output = $link[0].'<span class="mediaplugin mediaplugin_mp3" id="'.$id.'">('.get_string('mp3audio', 'filter_mediaplugin').')</span>'.$jsoutput;
$jsoutput = create_flowplayer($id, $url, 'mp3', $playercolors);
$output .= $jsoutput;
return $output;
}
@ -208,19 +232,24 @@ function filter_mediaplugin_flv_callback($link) {
$height = empty($link[4]) ? '360' : $link[4];
$url = addslashes_js($link[1]);
$args = Array();
$args['movie'] = $CFG->wwwroot.'/filter/mediaplugin/flvplayer.swf?file='.$url;
$args['width'] = $width;
$args['height'] = $height;
$args['majorversion'] = 6;
$args['build'] = 40;
$args['allowscriptaccess'] = 'never';
$args['quality'] = 'high';
$args['allowfullscreen'] = 'true';
$jsoutput = create_ufo_inline($id, $args);
$playerpath = $CFG->wwwroot.'/filter/mediaplugin/flvplayer.swf';
$output = $link[0].'<span class="mediaplugin mediaplugin_flv" id="'.$id.'">('.get_string('flashvideo', 'filter_mediaplugin').')</span>'.$jsoutput;
$output = <<<EOT
<span class="mediaplugin mediaplugin_flv" id="$id"></span>
<noscript>
<object width="800" height="600" id="undefined" name="undefined" data="$playerpath" type="application/x-shockwave-flash">
<param name="movie" value="$playerpath" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value='config={"clip":{"url":"$url",
"autoPlay": false},
"content":{"url":"$playerpath"}}}' />
</object>
</noscript>
EOT;
$jsoutput = create_flowplayer($id, $url, 'flv');
$output .= $jsoutput;
return $output;
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

24
lib/flowplayer.js Normal file

File diff suppressed because one or more lines are too long

View File

@ -960,7 +960,7 @@ function openpopup(event, args) {
event.returnValue = false;
}
}
var fullurl = args.url;
if (!args.url.match(/https?:\/\//)) {
fullurl = M.cfg.wwwroot + args.url;
@ -974,7 +974,7 @@ function openpopup(event, args) {
windowobj.resizeTo(screen.availWidth,screen.availHeight);
}
windowobj.focus();
return false;
}
@ -1176,21 +1176,21 @@ M.util.help_icon = {
headerContent: closebtn,
bodyContent: '',
id: 'helppopupbox',
width:'400px',
width:'400px',
visible : false,
constrain : true
constrain : true
});
this.overlay.render(Y.one(document.body));
closebtn.on('click', this.overlay.hide, this.overlay);
var boundingBox = this.overlay.get("boundingBox");
// Hide the menu if the user clicks outside of its content
boundingBox.get("ownerDocument").on("mousedown", function (event) {
var oTarget = event.target;
var menuButton = Y.one("#"+args.id);
if (!oTarget.compareTo(menuButton) &&
!menuButton.contains(oTarget) &&
!oTarget.compareTo(boundingBox) &&
@ -1261,8 +1261,8 @@ M.util.help_icon = {
M.util.help_icon.instance.display(event, args);
}
},
init : function(Y) {
this.Y = Y;
init : function(Y) {
this.Y = Y;
}
}
@ -1273,7 +1273,7 @@ M.core_custom_menu = {
/**
* This method is used to initialise a custom menu given the id that belongs
* to the custom menu's root node.
*
*
* @param {YUI} Y
* @param {string} nodeid
*/
@ -1340,7 +1340,7 @@ M.form.init_smartselect = function(Y, id, options) {
}
}
}
// Display a loading message first up
this.nodes.select = nodes.select;
@ -1501,4 +1501,73 @@ M.form.init_smartselect = function(Y, id, options) {
}
smartselect.init(Y, id, options, {select:select});
});
}
M.util.init_flvflowplayer = function (id, playerpath, fileurl) {
$f(id, playerpath, {
plugins: {
controls: {
autoHide: true
}
},
clip: {
url: fileurl,
autoPlay: false,
autoBuffering: true
}
});
}
M.util.init_mp3flowplayer = function (id, playerpath, audioplayerpath, fileurl, color) {
$f(id, playerpath, {
plugins: {
controls: {
fullscreen: false,
height: 25,
autoHide: false,
background: '#'+color['bgColour'],
buttonColor: '#'+color['btnColour'],
sliderColor: '#'+color['handleColour'],
volumeSliderColor: '#'+color['handleColour'],
volumeColor: '#'+color['trackColour'],
durationColor: '#'+color['fontColour'],
buttonOverColor: '#'+color['iconOverColour'],
progressColor: '#'+color['handleColour']
},
audio: {url: audioplayerpath}
},
clip: { url: fileurl,
provider: "audio",
autoPlay: false
}
});
}
M.util.init_mp3flowplayerplugin = function (id, playerpath, audioplayerpath, fileurl, color) {
$f(id, playerpath, {
plugins: {
controls: {
all: false,
play: true,
pause: true,
scrubber: true,
autoHide: false,
height: 15,
background: '#'+color['bgColour'],
buttonColor: '#'+color['btnColour'],
sliderColor: '#'+color['handleColour'],
volumeSliderColor: '#'+color['handleColour'],
progressColor: '#'+color['handleColour'],
volumeColor: '#'+color['trackColour'],
buttonOverColor: '#'+color['iconOverColour']
},
audio: {url: audioplayerpath}
},
clip: { url: fileurl,
provider: "audio",
autoPlay: false
}
});
}

View File

@ -182,36 +182,42 @@ function resourcelib_embed_mp3($fullurl, $title, $clicktoopen) {
global $CFG, $OUTPUT, $PAGE;
$c = $OUTPUT->resource_mp3player_colors(); // You can set this up in your theme/xxx/config.php
$colors = explode('&', $c);
$playercolors = array();
foreach ($colors as $color) {
$color = explode('=', $color);
$playercolors[$color[0]] = $color[1];
}
$c .= '&volText='.get_string('vol', 'resource').'&panText='.get_string('pan','resource');
$id = 'filter_mp3_'.time(); //we need something unique because it might be stored in text cache
$ufoargs = array('movie' => $CFG->wwwroot.'/lib/mp3player/mp3player.swf?src='.urlencode($fullurl),
'width' => 600,
'height' => 70,
'majorversion' => 6,
'build' => 40,
'flashvars' => $c,
'quality' => 'high');
$playerpath = $CFG->wwwroot .'/filter/mediaplugin/mp3player.swf';
$audioplayerpath = $CFG->wwwroot .'/filter/mediaplugin/flowplayer.audio.swf';
// If we have Javascript, use UFO to embed the MP3 player, otherwise depend on plugins
$code = <<<OET
<div class="resourcecontent resourcemp3">
<span class="mediaplugin mediaplugin_mp3" id="$id"></span>
<span class="resourcemediaplugin resourcemediaplugin_mp3" id="$id"></span>
<noscript>
<object type="audio/mpeg" data="$fullurl" width="600" height="70">
<param name="src" value="$fullurl" />
<param name="quality" value="high" />
<param name="autoplay" value="true" />
<param name="autostart" value="true" />
<object width="251" height="25" id="nonjsmp3plugin" name="undefined" data="$playerpath" type="application/x-shockwave-flash">
<param name="movie" value="$playerpath" />
<param name="allowfullscreen" value="false" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value='config={"plugins": {"controls": {
"fullscreen": false,
"height": 25,
"autoHide": false
}
},
"clip":{"url":"$fullurl",
"autoPlay": false},
"content":{"url":"$playerpath"}}}' />
</object>
$clicktoopen
</noscript>
</div>
OET;
$PAGE->requires->js('/lib/flowplayer.js');
$code .= $PAGE->requires->js_function_call('M.util.init_mp3flowplayer', array('id'=>$id, 'playerpath'=>$playerpath, 'audioplayerpath'=>$audioplayerpath, 'fileurl'=>$fullurl, 'color'=>$playercolors));
$PAGE->requires->js('/lib/ufo.js');
$code .= $PAGE->requires->js_function_call('M.util.create_UFO_object', array($id, $ufoargs));
return $code;
}
@ -227,34 +233,26 @@ function resourcelib_embed_flashvideo($fullurl, $title, $clicktoopen) {
$id = 'filter_flv_'.time(); //we need something unique because it might be stored in text cache
$ufoargs = array('movie' => $CFG->wwwroot.'/filter/mediaplugin/flvplayer.swf?file='.urlencode($fullurl),
'width' => 600,
'height' => 400,
'majorversion' => 6,
'build' => 40,
'allowscriptaccess' => 'never',
'allowfullscreen' => 'true',
'quality' => 'high');
// If we have Javascript, use UFO to embed the FLV player, otherwise depend on plugins
$playerpath = $CFG->wwwroot .'/filter/mediaplugin/flvplayer.swf';
$code = <<<EOT
<div class="resourcecontent resourceflv">
<span class="mediaplugin mediaplugin_flv" id="$id"></span>
<noscript>
<object type="video/x-flv" data="$fullurl" width="600" height="400">
<param name="src" value="$fullurl" />
<param name="quality" value="high" />
<param name="autoplay" value="true" />
<param name="autostart" value="true" />
<object width="800" height="600" id="undefined" name="undefined" data="$playerpath" type="application/x-shockwave-flash">
<param name="movie" value="$playerpath" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value='config={"clip":{"url":"$fullurl",
"autoPlay": false},
"content":{"url":"$playerpath"}}}' />
</object>
$clicktoopen
</noscript>
</div>
EOT;
$PAGE->requires->js('/lib/ufo.js');
$code .= $PAGE->requires->js_function_call('M.util.create_UFO_object', array($id, $ufoargs));
$PAGE->requires->js('/lib/flowplayer.js');
$code .= $PAGE->requires->js_function_call('M.util.init_flvflowplayer', array('id'=>$id, 'playerpath'=>$playerpath, 'fileurl'=>$fullurl));
return $code;
}

View File

@ -3365,3 +3365,19 @@ function create_ufo_inline($id, $args) {
$jsoutput .= html_writer::script(js_writer::function_call('M.util.create_UFO_object', array($id, $args)));
return $jsoutput;
}
function create_flowplayer($id, $fileurl, $type='flv', $color='#000000') {
global $CFG;
$playerpath = $CFG->wwwroot.'/filter/mediaplugin/'.$type.'player.swf';
$jsoutput = html_writer::script('', $CFG->wwwroot.'/lib/flowplayer.js');
if ($type == 'flv') {
$jsoutput .= html_writer::script(js_writer::function_call('M.util.init_flvflowplayer', array($id, $playerpath, $fileurl)));
} else if ($type == 'mp3') {
$audioplayerpath = $CFG->wwwroot .'/filter/mediaplugin/flowplayer.audio.swf';
$jsoutput .= html_writer::script(js_writer::function_call('M.util.init_mp3flowplayerplugin', array($id, $playerpath, $audioplayerpath, $fileurl, $color)));
}
return $jsoutput;
}

View File

@ -1,4 +1,11 @@
.path-mod-resource .popupnotice {text-align:center;margin:40px;}
.resourcecontent object {height:800px;width:100%;}
.resourcecontent object {height:600px;width:800px;}
.resourcecontent.resourcepdf object{height: 800px;width: 100%;}
.resourcecontent .resourcemediaplugin_mp3 object {height:25px; }
.path-mod-resource .resourcemediaplugin_mp3 {width: 800px;margin:10px auto;}
.resourcecontent.resourcemp3 object#nonjsmp3plugin {height:25px;}
.ie .resourcecontent .resourcemediaplugin_mp3 object {height:34px;}

View File

@ -534,7 +534,7 @@ body.tag .managelink {padding: 5px;}
#helppopupbox .yui3-widget-hd {float:right;margin:3px 3px 0 0;}
#helppopupbox .yui3-widget-bd {margin:0 1em 1em 1em;border-top:1px solid #eee;}
#helppopupbox .helpheading {font-size: 1em;}
#helppopupbox .spinner {margin:1em;}
#helppopupbox .spinner {margin:1em;}
/**
* Custom menu
@ -613,7 +613,7 @@ body.tag .managelink {padding: 5px;}
.userenrolment .col_enrol .enrolment {float:left;padding:3px;margin:3px;}
.userenrolment .col_enrol .enrolment a {float:right;margin-left:3px;}
/**
/**
* Overide for RTL layout
**/
.dir-rtl .headermain {float:right;}
@ -657,7 +657,15 @@ body.tag .managelink {padding: 5px;}
.corelightbox {background-color:#CCC;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;}
.corelightbox img {position:fixed;top:50%;}
/**
/**
* IE - Overide for RTL layout
*/
.ie.dir-rtl .mform .fitem .felement {margin-right:0;text-align:right;float:right;}
/**
* Filters
*/
.jsenabled .mediaplugin.mediaplugin_mp3 object {height:15px;width:100px; }
.jsenabled .mediaplugin.mediaplugin_flv object {height:600px;width:800px;}
.ie .mediaplugin.mediaplugin_mp3 object{height:20px;}