详情页

帝国cms7.5编辑器的播放器整合CKPlayer播放器

时间:2023年05月22日

编辑:佚名

需求:将帝国CMS7.5信息编辑器的播放器整合CKPlayer播放器,支持一个页面多个视频播放
第一步:下载ckplayer播放器解压后放置 /e/extend/ckplayer/目录
CKplayer使用必需文件.zip
链接: https://pan.baidu.com/s/10Bjh0DaMEVaEF8ODQ2hUSg 提取码: u83x
帝国cms7.5编辑器的播放器整合CKPlayer播放器
链接: https://pan.baidu.com/s/1eJDY8NTHo5S6Q8wFFmxdnw 提取码: gpny
第二步:替换信息编辑器中的视频上传js控件
替换信息编辑器中的视频上传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:"视频地址 ",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:"
"+CKEDITOR.tools.htmlEncode(ecmseditorv.lang.common.preview)+
"
: [点击这里显示预览]
"}
]
},
{id:"Upload",label:ecmseditorv.lang.image.upload,elements:[
{
type: "html",
style: "width:500;height:250",
html: ' '
}
]},
],
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="";
}
else if(toplay==5)//html5video
{
imgstr=' Your browser is not supported ';
}
else if(toplay==6)//html5audio
{
imgstr=' Your browser is not supported ';
}
else if(toplay==3)//flv
{
imgstr="";
}
else if(toplay==4)//flash
{
imgstr="";
}
else if(toplay==7)//CKPlayer
{
var uid = get_uid();
var vid = "video-"+uid;
var pid = "player-"+uid;
imgstr=`
new ckplayer({
container: '#`+pid+`',
variable: 'player',
poster:'',
mobileCkControls:true,
mobileAutoFull:false,
h5container:'#`+vid+`',
video:'`+furl+`'
});
`;
}
else//reaplayer
{
imgstr="";
}
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');
}
清除浏览器缓存后即可。
相关文章
猜你需要