帝国cms7.5二次开发整合CKPlayer播放器教程
帝国cms7.5整合CKPlayer播放器教程说明
将帝国cms7.5编辑器整合CKPlayer播放器,支持一个页面多个视频播放
帝国cms7.5整合CKPlayer播放器教程步骤
1、下载ckplayer播放器,下载地址:http://www.ckplayer.com/down/
2、解压后放置 /e/data/ckplayer/目录
3、替换信息编辑器中的视频上传js控件,路径为:/e/admin/ecmseditor/infoeditor/plugins/etranmedia/dialogs/etranmedia.js
(function() {
CKEDITOR.dialog.add(etranmedia,
function(ecmseditorv) {
return {
title: 插入视频,
minWidth: 500,
minHeight:400,
contents: [{
id: etmediainfo1,
label: 常规,
title: 常规,
expand: true,
width: 500px,
height: 400px,
padding: 0,
elements: [
{type:hbox,widths:[90%,10%],align:right,children:[
{id:etmediaurl,type:text,label:<strong>视频地址</strong> ,style:width:100%;float:left;,default:}
,{type:button,id:browse,filebrowser:{action:Browse,target:etmediainfo1:etmediaurl,url:ecmseditorv.config.filebrowserFlashUploadUrl+'FileMain.php?'+ecmseditorv.config.filebrowserImageBrowseUrl+'&doecmspage=TranMedia&type=3&tranfrom=1&field=&InstanceId='+ecmseditorv.id+'&InstanceName='+ecmseditorv.name},style:display:inline-block;margin-top:14px;,hidden:!0,label:选择}]},
{type:hbox,widths:[25%,25%,25%,25%],align:right,children:[
{id:etmediawidth,type:text,label:宽度,style:width:100%;float:left,default:100%},
{id:etmediaheight,type:text,label:高度,style:width:100%;float:left,default:auto},
{
id: 'etmediatoplay',
type: 'select',
label: '播放器',
default:7,
items: [
[ '自动选择', '0' ],
[ 'HTML5Video', '5' ],
[ 'HTML5Audio', '6' ],
[ 'Media Player', '1' ],
[ 'Real Player', '2' ],
[ 'Flv Player', '3' ],
[ 'Flash Player', '4' ],
[ 'CKPlayer', '7' ]
]
},
{
id: 'etmediaplaymod',
type: 'select',
label: '播放模式',
items: [
[ '自动播放', '0' ],
[ '手动播放', '1' ]
]
}
]},
{type:html,id:preview,style:width:100%;,html:<div><strong>+CKEDITOR.tools.htmlEncode(ecmseditorv.lang.common.preview)+
</strong>:<a onclick=etmediaview('cke_MediaPreviewBox_+ecmseditorv.name+');>[点击这里显示预览]</a><br><div id='cke_MediaPreviewBox_+ecmseditorv.name+' class='MediaPreviewBox'></div></div>}
]
},
{id:Upload,label:ecmseditorv.lang.image.upload,elements:[
{
type: html,
style: width:500;height:250,
html: ' <IFRAME frameBorder=0 id=edtmedia'+ecmseditorv.name+' name=edtmedia'+ecmseditorv.name+' scrolling=auto src='+ecmseditorv.config.filebrowserFlashUploadUrl+'editorpage/ecmseditorpage.php?'+ecmseditorv.config.filebrowserFlashBrowseUrl+'&doecmspage=TranMedia&type=3&InstanceId='+ecmseditorv.id+'&InstanceName='+ecmseditorv.name+'&CKEditorFuncNum='+ecmseditorv._.filebrowserFn+'&langCode='+ecmseditorv.langCode+' style=HEIGHT:250px;VISIBILITY:inherit;WIDTH:100%;Z-INDEX:2></IFRAME>'
}
]},
],
onOk: function() {
var ehtmlstr='';
var emediaurl=this.getValueOf('etmediainfo1','etmediaurl');
var ewidth=this.getValueOf('etmediainfo1','etmediawidth');
var eheight=this.getValueOf('etmediainfo1','etmediaheight');
var etoplay=this.getValueOf('etmediainfo1','etmediatoplay');
var eplaymod=this.getValueOf('etmediainfo1','etmediaplaymod');
ehtmlstr=etmediaViewFile(emediaurl,ewidth,eheight,etoplay,eplaymod);
//点击确定按钮后的操作
ecmseditorv.insertHtml(ehtmlstr);
document.getElementById('cke_MediaPreviewBox_'+ecmseditorv.name).innerHTML='';
},
onCancel: function() {
document.getElementById('cke_MediaPreviewBox_'+ecmseditorv.name).innerHTML='';
}
}
})
})();
//预览
function etmediaview(viewid){
var ehtmlstr='';
var emediaurl=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaurl').getValue();
var ewidth=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediawidth').getValue();
var eheight=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaheight').getValue();
var etoplay=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediatoplay').getValue();
var eplaymod=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaplaymod').getValue();
ehtmlstr=etmediaViewFile(emediaurl,ewidth,eheight,etoplay,eplaymod);
document.getElementById(viewid).innerHTML=ehtmlstr;
}
function get_uid(){
function S4() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
return (S4()+S4()+-+S4()+-+S4()+-+S4()+-+S4()+S4()+S4());
}
//返回播放器代码
function etmediaViewFileCode(toplay,width,height,autostart,furl){
var fname='';
var addauto='';
if(autostart==true)
{
addauto=' autoplay=autoplay';
}
if(toplay==1)//media
{
imgstr=<object align=middle classid=CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95 class=OBJECT id=MediaPlayer width=+width+ height=+height+><PARAM NAME=AUTOSTART VALUE=+autostart+><param name=ShowStatusBar value=-1><param name=Filename value=+furl+><embed type=application/x-oleobject codebase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701 flename=mp src=+furl+ width=+width+ height=+height+></embed></object>;
}
else if(toplay==5)//html5video
{
imgstr='<video id=ecmsvideoid width='+width+' height='+height+' controls=controls'+addauto+'><source src='+furl+'></source> Your browser is not supported </video>';
}
else if(toplay==6)//html5audio
{
imgstr='<audio id=ecmsaudioid src='+furl+' controls=controls'+addauto+'> Your browser is not supported </audio>';
}
else if(toplay==3)//flv
{
imgstr=<object classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0 width=+width+ height=+height+><param name=movie value=/e/data/images/flvplayer.swf?vcastr_file=+furl+&vcastr_title=+fname+&BarColor=0xFF6600&BarPosition=1&IsAutoPlay=+autostart+><param name=quality value=high><param name=allowFullScreen value=true /><embed src=/e/data/images/flvplayer.swf?vcastr_file=+furl+&vcastr_title=+fname+&BarColor=0xFF6600&BarPosition=1&IsAutoPlay=+autostart+ allowFullScreen=true quality=high pluginspage=http://www.macromedia.com/go/getflashplayer type=application/x-shockwave-flash width=+width+ height=+height+></embed></object>;
}
else if(toplay==4)//flash
{
imgstr=<object classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0 width=+width+ height=+height+><param name=movie value=+furl+><param name=quality value=high><embed src=+furl+ quality=high pluginspage=http://www.macromedia.com/go/getflashplayer type=application/x-shockwave-flash width=+width+ height=+height+><param name=autoplay value=+autostart+ /></embed></object>;
}
else if(toplay==7)//CKPlayer
{
var uid = get_uid();
var vid = video-+uid;
var pid = player-+uid;
imgstr=`<div class=videoplayer-box id=`+pid+` style=width:`+width+`;height:`+height+`>
<video class=videoplayer id=`+vid+` src=`+furl+` `+addauto+` width=100% height=100%></video>
</div>
<script src=/e/data/ckplayer/ckplayer.js></script>
<script type=text/javascript>
new ckplayer({
container: '#`+pid+`',
variable: 'player',
poster:'',
mobileCkControls:true,
mobileAutoFull:false,
h5container:'#`+vid+`',
video:'`+furl+`'
});
</script>`;
}
else//reaplayer
{
imgstr=<object classid=clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA HEIGHT=+height+ ID=Player WIDTH=+width+ VIEWASTEXT><param NAME=_ExtentX VALUE=12726><param NAME=_ExtentY VALUE=8520><param NAME=AUTOSTART VALUE=+autostart+><param NAME=SHUFFLE VALUE=0><param NAME=PREFETCH VALUE=0><param NAME=NOLABELS VALUE=0><param NAME=CONTROLS VALUE=ImageWindow><param NAME=CONSOLE VALUE=_master><param NAME=LOOP VALUE=0><param NAME=NUMLOOP VALUE=0><param NAME=CENTER VALUE=0><param NAME=MAINTAINASPECT VALUE=+furl+><param NAME=BACKGROUNDCOLOR VALUE=#000000></object><br><object CLASSID=clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA HEIGHT=32 ID=Player WIDTH=+width+ VIEWASTEXT><param NAME=_ExtentX VALUE=18256><param NAME=_ExtentY VALUE=794><param NAME=AUTOSTART VALUE=+autostart+><param NAME=SHUFFLE VALUE=0><param NAME=PREFETCH VALUE=0><param NAME=NOLABELS VALUE=0><param NAME=CONTROLS VALUE=controlpanel><param NAME=CONSOLE VALUE=_master><param NAME=LOOP VALUE=0><param NAME=NUMLOOP VALUE=0><param NAME=CENTER VALUE=0><param NAME=MAINTAINASPECT VALUE=0><param NAME=BACKGROUNDCOLOR VALUE=#000000><param NAME=SRC VALUE=+furl+></object>;
}
return imgstr;
}
//返回
function etmediaViewFile(furl,width,height,toplay,playmod){
var imgstr=;
var autostart;
var mediatypes=,.wmv,.asf,.wma,.mp3,.asx,.mid,.midi,;
var realtypes=,.rm,.ra,.rmvb,.mp4,.mov,.avi,.wav,.ram,.mpg,.mpeg,;
var html5types=,.mp4,.ogg,.webm,;
var html5audiotypes=,.mp3,.ogg,.wav,;
var filetype;
if(furl=='')
{
return '';
}
autostart=true;
if(playmod==1)
{
autostart=false;
}
if(toplay==0)
{
filetype=etmediaToGetFiletype(furl);
if(filetype=='.flv')
{
toplay=3;
}
else if(html5types.indexOf(','+filetype+',')!=-1)
{
toplay=5;
}
else if(html5audiotypes.indexOf(','+filetype+',')!=-1)
{
toplay=6;
}
else if(filetype=='.swf')
{
toplay=4;
}
else if(mediatypes.indexOf(','+filetype+',')!=-1)
{
toplay=1;
}
else
{
toplay=2;
}
}
imgstr=etmediaViewFileCode(toplay,width,height,autostart,furl);
return imgstr;
}
function etmediaToGetFiletype(sfile){
var filetype,s;
s=sfile.lastIndexOf(.);
filetype=sfile.substring(s+1).toLowerCase();
return '.'+filetype;
}
function EHEcmsEditorDoTranMedia(str){
CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaurl').setValue(str);
CKEDITOR.dialog.getCurrent().selectPage('etmediainfo1');
}
4、清除浏览器缓存后即可。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。



