因为phpcms对于js进行过滤,且有其它原因,需要对页面中的标签转换成一个视频播放器.所以需要这个处理js
这个flash 视频播放器使用的是一个叫Jaris FLV Player的开源项目 http://www.jarisflvplayer.org/
需要使用这个功能时,需要加载以下二个js,后面的js代码在下面,其它的东西使用player自带的.
<script language="javascript" src="/statics/plugin/my/js/swfobject.js"></script>
<script language="javascript" src="/statics/plugin/my/js/moviePlayer/showSwfPlayer.js"></script>
配置的可用参数,为了方便,乱写了一下在showSwfPlayer.js中.
var swfVars = [//下面的参数可以在a标签中写格式是 swf_其它参数的名字="可以使用的值", 如,'type' <a .... swf_type="audio"
'source' //视频地址 如http://sss.com/sss.flv
,'type' //视频类型有audio, video.
,'streamtype' // 视频连接方式 file, http, rmtp, youtube
,'server' // Used for rtmp streams
,'duration' // 视频长度(分钟) 120
,'poster' // 播放前视频截图 http://sss.dd.com/s.png
,'aspectratio' // 屏幕比有,1:1, 3:2, 4:3, 5:4, 14:9, 14:10, 16:9, 16:10
,'autostart' //是否自动播放 false|true
,'logo' // 播放器的logo,图片地址 http://sss.dd.com/s.png
,'logoposition' // logo显示位置有top left, top right, bottom left , bottom right
,'logoalpha' //logo透明度,1-100
,'logowidth' //logo大小px 100
,'logolink' // logo链接 http://jaris.sourceforge.net
,'hardwarescaling' //是否打开硬件解码false|true
,'controls' //是否显示播放器控制条 false|true
,'darkcolor' //000000 控制条的背景色如 #000000 只能输入 000000
,'brightcolor' //按钮色同上
,'controlcolor' //播放器按钮色同上格式
,'hovercolor' //hover时按钮色 同上格式
,'controltype' //1 控制条显示方式.1是在下方
,'loop' //0 是否循环 0|1
];
然后页面中放置的a标签应该是如下
<a href="播放电影的urlHTTp地址" name="bindSwfMoviePlayer" swf_height="100" swf_width="100" swf_source="电影的http地址">电影名字,用于无法加载js时,能够点击下载</a>
上面这样的a可以随意增加多个.
name="bindSwfMoviePlayer" 属性不能变,swf_height="100" swf_width="100"是控制显示大小,swf_source是需要使用下面js中的var swfVars参数时,必须在前面加swf_前缀,以防止跟a中的正常属性出现同名情况而设定.后面就是var swfVars中的'参数名';
/* showSwfPlayer.js 代码
* 检测页面是否放置了要显示swf视频播放器的请求,如果有,就显示
* 放置格式是
*/
(function() {
var binds = document.getElementsByName('bindSwfMoviePlayer');
if (!binds.length) return;
var swfVars = [//下面的参数可以在a标签中写格式是 swf_其它参数的名字="可以使用的值", 如,'type' <a .... swf_type="audio"
'source' //视频地址 如http://sss.com/sss.flv
,'type' //视频类型有audio, video.
,'streamtype' // 视频连接方式 file, http, rmtp, youtube
,'server' // Used for rtmp streams
,'duration' // 视频长度(分钟) 120
,'poster' // 播放前视频截图 http://sss.dd.com/s.png
,'aspectratio' // 屏幕比有,1:1, 3:2, 4:3, 5:4, 14:9, 14:10, 16:9, 16:10
,'autostart' //是否自动播放 false|true
,'logo' // 播放器的logo,图片地址 http://sss.dd.com/s.png
,'logoposition' // logo显示位置有top left, top right, bottom left , bottom right
,'logoalpha' //logo透明度,1-100
,'logowidth' //logo大小px 100
,'logolink' // logo链接 http://jaris.sourceforge.net
,'hardwarescaling' //是否打开硬件解码false|true
,'controls' //是否显示播放器控制条 false|true
,'darkcolor' //000000 控制条的背景色如 #000000 只能输入 000000
,'brightcolor' //按钮色同上
,'controlcolor' //播放器按钮色同上格式
,'hovercolor' //hover时按钮色 同上格式
,'controltype' //1 控制条显示方式.1是在下方
,'loop' //0 是否循环 0|1
];
var params = {
menu: "false",
scale: "noScale",
allowFullscreen: "true",
allowScriptAccess: "always",
bgcolor: "#000000",
quality: "high",
wmode: "opaque"
};
for (var i = 0; i < binds.length; i++) {
var a = binds[i];
var swfH = a.getAttribute('swf_height');
swfH = isNaN(swfH) ? 100 : swfH;
var swfW = a.getAttribute('swf_width');
swfW = isNaN(swfW) ? 200 : swfW;
var attributes = {id:'JarisFLVPlayer' + i};
a.id = 'altContentOneNewControls' + i;
var flashvarsVideoNewControls = {};
for (var h = 0; h < swfVars.length; h++) {
var ag = a.getAttribute('swf_' + swfVars[h]);
if ( (null == ag) || (undefined == ag) ) continue;
flashvarsVideoNewControls[swfVars[h]] = ag;
}
swfobject.embedSWF("http://www.cedcm.com.cn/statics/plugin/my/js/moviePlayer/JarisFLVPlayer.swf", "altContentOneNewControls" + i, swfW + "px", swfH + "px", "10.0.0", "http://www.cedcm.com.cn/statics/plugin/my/js/moviePlayer/expressInstall.swf", flashvarsVideoNewControls, params, attributes);
}
})();
效果图