模板
源码
教程
插件
运营
工具
导航 | 导航 | 抖音 | enewsshopdd
  • 帝国cms模板
  • 织梦cms模板
  • discuz模板
  • ecshop模板
  • phpcms模板
  • wordpress模板
  • 苹果cms模板
  • 海洋cms模板
  • 飞飞cms模板
  • emlog模板
  • zblog模板
  • PbootCMS模板
  • Typecho模板
  • 小程序模板
  • psd模板
  • html模板
选择子栏目精准搜索 [点击关闭]

帝国cms教程

帝国cms7.5二次开发整合CKPlayer播放器教程

我的站长站 2019-03-01 共人阅读

教程说明

将帝国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、清除浏览器缓存后即可。

相关专题
播放器
播放器
2021-10-08 1238

播放器专题为您整理了本站关于播放器相关信息,主要为播放器插件,音乐视频播放器相关源码,程序整合播放器相关教程....

帝国cms二次开发CKPlayer帝国CMS7.5教程
上一篇：帝国CMS二次开发PHP跨表查询相关文章
下一篇：帝国CMS灵动标签调用广告列表
相关推荐
  • 帝国cms二次开发
  • CKPlayer
  • 帝国CMS7.5教程
  • 帝国cms7.5二次开发整合CKPlayer播放器教程

    教程说明将帝国cms7.5编辑器整合CKPlayer播放器，支持一个页面多个视频播放教程步骤1、下载ckplayer播放器，下载地址：http://www.ckplayer.com/down/ 2、解压后放置 /e/data/ckplayer/目录3、替换信息编辑器中的视频上传js控件，路径为：/e/admin/ecmseditor...

    帝国cms教程 445 5年前
  • ckplayer视频播放器织梦插件 v1.9
    ckplayer视频播放器织梦插件 v1.9

    插件前台效果插件主要功能1、网页在线播放flv、f4v、MP4等格式的视频，兼容手机端html5视频播放功能2、播放器的皮肤风格可随意更换，本站还提供了大量的ckplayer风格，logo以及左上角水印图片等等都可...

    织梦cms插件 671 5年前
  • WordPress集成ckplayer播放器教程

    WordPress免插件集成ckplayer播放器，首先在ckplayer官网下载资源包，将ckplayer文件夹放入所使用主题里（确保wp-content/themes/motheme/ckplayer/ckplayer.js存在），然后添加代码如下：在主题的functions.php添加以下代码function MBThemes_ckplayer_scripts...

    wordpress教程 215 5年前
  • 帝国CMS7.5安装教程(图文)
    帝国CMS7.5安装教程(图文)

    安装准备工作首先我们需要去帝国CMS官方下载安装程序，下载地址：http://www.phome.net/download/然后需要配置环境，帝国CMS支持PHP和MySQL数据库”或服务器已经成功安装“PHP和MySQL数据库”。版本要...

    帝国cms教程 269 4年前
  • 帝国cms7.5版本即将发布

    帝国cms论坛已经开放帝国cms7.5预告专栏帝国CMS下版（即【7.5版】）已经开发中，本次升级主要任务如下：1、更新支持最新版的PHP7.*。2、编辑器升级为最新版本的CKEditor编辑器(目前最新版本是4.5.9)。3、动态页面新增支持缓存，让使用动态页面方式的网站速度...

    帝国cms教程 528 7年前
  • 帝国CMS7.5升级增加浏览器USER-AGENT验证功能

    帝国CMS7.5版后台新增浏览器USER-AGENT验证功能，该功能是指只有包含指定信息的浏览器才可以访问后台(后台可指定同时包含多个验证内容，配置内容存配置文件，不存数据库)，也就是说可以指定某一台机器才能访问后台，更高安全性。 帝国CMS官方建议登录后台采用...

    帝国cms教程 161 7年前
最新更新
帝国CMS教程标签
帝国CMS调用 帝国CMS分页 帝国CMS数据库 帝国cms随机 帝国CMSSQL 帝国CMS自定义列表 帝国CMS安全 帝国CMS审核 帝国CMS附件 帝国cms栏目 帝国CMS页码 帝国CMS安装 帝国CMS7.5教程 帝国CMS报错 帝国CMS调用方法 帝国CMS过滤 帝国cms验证码 帝国CMS新手教程 帝国CMS搜索 帝国CMS采集 帝国cms制作 帝国CMS升级 帝国CMS图片集 帝国CMS权限 帝国CMS评论 帝国cms使用教程 帝国CMS替换 帝国cms邮件 帝国CMS判断 帝国cms表单