帝国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、清除浏览器缓存后即可。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。