折腾过的TeskLink上传图片功能

testlink折腾的最久的部分就是图片上传的部分了。只能吐血推荐了。

tesklink使用的图片上传插件是第三方插件FCKEDITOR,09年已经更名为CKEditor.

百度释义:

FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器,用JavaScript编写。它志于轻量化,不需要太复杂的安装步骤即可使用。它可和PHP、JavaScript、ASP、ASP.NET、ColdFusion、Java、以及ABAP等不同的编程语言相结合。“FCKeditor”名称中的“FCK” 是这个编辑器的作者的名字Frederico Caldeira Knabben的缩写。

官网:http://ckeditor.com/

先来看看ckeditor中对于图片上传的样子,打开官网demo:http://ckeditor.com/demo
就看Standard editor的模式:
折腾过的TeskLink上传图片功能_第1张图片
点击上传图片按钮,弹出上传图片窗口:
第一个tab可以调整图片的属性
折腾过的TeskLink上传图片功能_第2张图片

查了发现ckeditor使用ckfinder管理上传文件,搜索发现testlink目录doc文件夹下面有一个Configuration of FCKEditor 2.6.5.pdf的文件。

第一步:放出上传tab

全局搜索字符串”上传”,找到对应的变量为“upload”。
全局搜索字符串”upload”在/ckeditor/plugins/image/dialogs/image.js中:
注:图片插件的所有配置功能都在image.js中
注释hidden:!0
id: "Upload",
// hidden: !0,

折腾过的TeskLink上传图片功能_第3张图片

查看该元素,

<a style="-moz-user-select: none;" href="javascript:void(0)" title="上传到服务器" hidefocus="true" class="cke_dialog_ui_fileButton cke_dialog_ui_button cke_disabled" role="button" aria-labelledby="cke_126_label" id="cke_127_uiElement">
<span id="cke_126_label" class="cke_dialog_ui_button">上传到服务器span>
a>

搜索 id class 发现唯一值cke_dialog_ui_button 在文件ckeditor.js

现在点击还没有反应,继续配置:
官方文档:http://docs.ckeditor.com/#!/guide/dev_howtos_file_upload

放出放出图像tab上的浏览服务器按钮

用fileSeek(windows上面的字符串搜索神器),在testlink安装目录下搜索“浏览服务器”,找到翻译前的变量为”browseServer”,再搜索“browseServer”,找到image.js中的变量,注释hidden: !0,显示出按钮。

你可能感兴趣的:(TestLink)