网上有利用原来的flash或media插件修改的方法,不过为了不影响原编辑器的使用或升级,还是采用新增一个flvplayer插件的办法
1、在plugin下建立文件夹flvplayer, 建立flvplaery.js文件 源码如下
/******************************************************************************* * KindEditor - WYSIWYG HTML Editor for Internet * Copyright (C) 2006-2011 kindsoft.net * * @author Roddy <luolonghao@gmail.com> * @site http://www.kindsoft.net/ * @licence http://www.kindsoft.net/license.php *******************************************************************************/ KindEditor.plugin( 'flvplayer' , function (K) { var self = this , name = 'flvplayer' , lang = self.lang(name + '.' ), allowFlashUpload = K.undef(self.allowFlashUpload, true ), allowFileManager = K.undef(self.allowFileManager, false ), formatUploadUrl = K.undef(self.formatUploadUrl, true ), extraParams = K.undef(self.extraFileUploadParams, {}), filePostName = K.undef(self.filePostName, 'imgFile' ), uploadJson = K.undef(self.uploadJson, self.basePath + 'php/upload_json.php' ); self.plugin.flash = { edit : function () { var html = [ '<div style="padding:20px;">' , //url '<div class="ke-dialog-row">' , '<label for="keUrl" style="width:60px;">' + lang.url + '</label>' , '<input class="ke-input-text" type="text" id="keUrl" name="url" value="" style="width:160px;" /> ' , '<input type="button" class="ke-upload-button" value="' + lang.upload + '" /> ' , '<span class="ke-button-common ke-button-outer">' , '<input type="button" class="ke-button-common ke-button" name="viewServer" value="' + lang.viewServer + '" />' , '</span>' , '</div>' , //width '<div class="ke-dialog-row">' , '<label for="keWidth" style="width:60px;">' + lang.width + '</label>' , '<input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="550" maxlength="4" /> ' , '</div>' , //height '<div class="ke-dialog-row">' , '<label for="keHeight" style="width:60px;">' + lang.height + '</label>' , '<input type="text" id="keHeight" class="ke-input-text ke-input-number" name="height" value="400" maxlength="4" /> ' , '</div>' , '</div>' ].join( '' ); var dialog = self.createDialog({ name : name, width : 450, title : self.lang(name), body : html, yesBtn : { name : self.lang( 'yes' ), click : function (e) { var url = K.trim(urlBox.val()), width = widthBox.val(), height = heightBox.val(); if (url == 'http://' || K.invalidUrl(url)) { alert(self.lang( 'invalidUrl' )); urlBox[0].focus(); return ; } if (!/^\d*$/.test(width)) { alert(self.lang( 'invalidWidth' )); widthBox[0].focus(); return ; } if (!/^\d*$/.test(height)) { alert(self.lang( 'invalidHeight' )); heightBox[0].focus(); return ; } // var html = K.mediaImg(self.themesPath + 'common/blank.gif', { // src : url, // type : K.mediaType('.swf'), // width : width, // height : height, // quality : 'high' // }); var html= '<script src="/flowplayer/flowplayer-3.2.11.min.js"></script>' + '<a href="' +url+ '" style="display:block;width:' +width+ 'px;height:' +height+ 'px;" id="player"> </a> <script language="JavaScript"> flowplayer("player", "/flowplayer/flowplayer-3.2.15.swf"); </script>' ; self.insertHtml(html).hideDialog().focus(); } } }), div = dialog.div, urlBox = K( '[name="url"]' , div), viewServerBtn = K( '[name="viewServer"]' , div), widthBox = K( '[name="width"]' , div), heightBox = K( '[name="height"]' , div); urlBox.val( 'http://' ); if (allowFlashUpload) { var uploadbutton = K.uploadbutton({ button : K( '.ke-upload-button' , div)[0], fieldName : filePostName, extraParams : extraParams, url : K.addParam(uploadJson, 'dir=flvplayer' ), afterUpload : function (data) { dialog.hideLoading(); if (data.error === 0) { var url = data.url; if (formatUploadUrl) { url = K.formatUrl(url, 'absolute' ); } urlBox.val(url); if (self.afterUpload) { self.afterUpload.call(self, url, data, name); } alert(self.lang( 'uploadSuccess' )); } else { alert(data.message); } }, afterError : function (html) { dialog.hideLoading(); self.errorDialog(html); } }); uploadbutton.fileBox.change( function (e) { dialog.showLoading(self.lang( 'uploadLoading' )); uploadbutton.submit(); }); } else { K( '.ke-upload-button' , div).hide(); } if (allowFileManager) { viewServerBtn.click( function (e) { self.loadPlugin( 'filemanager' , function () { self.plugin.filemanagerDialog({ viewType : 'LIST' , dirName : 'flvplayer' , clickFn : function (url, title) { if (self.dialogs.length > 1) { K( '[name="url"]' , div).val(url); if (self.afterSelectFile) { self.afterSelectFile.call(self, url); } self.hideDialog(); } } }); }); }); } else { viewServerBtn.hide(); } var img = self.plugin.getSelectedFlash(); if (img) { var attrs = K.mediaAttrs(img.attr( 'data-ke-tag' )); urlBox.val(attrs.src); widthBox.val(K.removeUnit(img.css( 'width' )) || attrs.width || 0); heightBox.val(K.removeUnit(img.css( 'height' )) || attrs.height || 0); } urlBox[0].focus(); urlBox[0].select(); }, 'delete' : function () { self.plugin.getSelectedFlash().remove(); } }; self.clickToolbar(name, self.plugin.flash.edit); }); |
2、css文件中增加
.ke-icon-flvplayer { background-position : 0px -512px ; width : 16px ; height : 16px ; } |
3、默认插件调用增加
kindeditor.js
items : 里面增加 'flvplayer'
4、关于上传和文件管理 的服务器脚本修改(以asp为例)
If instr(lcase("image,flash,media,file,flvplayer"), dirName) < 1 Then showError("目录名不正确。"&dirName) End If Select Case dirName Case "flash" extStr = flashExtStr Case "media" extStr = mediaExtStr Case "file" extStr = fileExtStr Case "flvplayer" extStr = flashExtStr Case Else extStr = imageExtStr End Select
相应的还要在flashExtStr 里面增加 播放器支持的格式 如 .flv .f4v .mp4等
file_manager_json.asp 里面对应增加 flvplayer 目录权限、格式等
综上,插件安装好后,以后如果换Flv网页播放器 只需对应换第1条里面的红色html部分代码即可
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步