Webdisk 开发文档
一、 关于jqueryFileTree
1、给树添加元素(ICON图标和名称)
● webdisk / jqueryFileTree.php //增加元素
● webdisk / scripts / jqueryFileTree.css //设置该目录的icon和样式
jqueryFileTree.php里。添加如下代码：
echo "
Calendar
";
根据实际情况，添加两处地方，注：elseif($_POST['isInit'] == 'calendar')处也得添加
在jqueryFileTree.css里，约36行：增加如下样式
.jqueryFileTree LI.calendar { background: url(images/calendar.gif) left top no-repeat; }
2、给新添加的树元素添加点击事件
● webdisk / scripts / jqueryFileTree / jqueryFileTree.js
jqueryFileTree.js增加代码提示:
大约在45行处,＂if( o.script3 == undefined ) o.script3 = './?module=calendar';＂
注析:增加一个操作对象，直接指向index.php的calendar。
大约在323行，＂}else if($(this).parent().hasClass('calendar')){＂，注释:如果点击上一级(父节点)的样式是’calendar’，则收缩所有节点，通过回调函数，获得calendar页面，设置cookie，调用showTree绑定点击事件。
代码如下：
}else if($(this).parent().hasClass('calendar')){
// Collapse 收缩(收缩父节点的父节点的ul
$(this).parent().parent().find('UL').slideUp({
duration: o.collapseSpeed,
easing: o.collapseEasing
});
showTree($(this), escape(o.script3),'click' );//绑定点击事件
}
大约在114行，＂if($.cookie('default_path')=='calendar')＂
注析:如果cookie(‘default_path’)等于calendar,则用post方式发送变量isInit给页面,否则，才认为其点击的是文件夹，显示文件夹里的文件
代码如下：
if($.cookie('default_path')=='calendar')
{
//get calendar
$.post(o.script3,{
dir: t,isInit: ‘calendar’
},function(data) {
$('#all_right_menu').html(data);
//绑定目录列表
bindList();
});
}else{
//get file list in center
$.post(o.script2,{
dir: t,isInit: isInit
},function(data) {
$('#all_right_menu').html(data);
//绑定目录列表
bindList();
});
}
3、 在新加项元素打开页面里，添加／移除右键菜单
webdisk /webdisk.php
webdisk / scripts / function.js
就拿calendar的右键菜单”add_event”作例子。
首先添加一个”桌面右键菜单”.
Webdisk.php 大概171行：
add_even
增加一个
元素,并设置其显示的图片。
然后，在js里，实现当点击了树元素里的calendar后。右边内容显示calendar时，右键里移除add_event以外的菜单。
Functions.js大概478行：
}else if($.cookie('default_path') == 'calendar'){
//如果当前默认路径是calendar，则把右键菜单全部删除
$('#f_upfile', menu).remove();
$('#p_upfile', menu).remove();
$('#refresh', menu).remove();
$('.paste', menu).remove();
$('#paste', menu).remove();
$('#_paste', menu).remove();
$('#search', menu).remove();
$('#newfile', menu).remove();
$('#newfolder', menu).remove();
$('#empty_all', menu).remove();
$('#restore_all', menu).remove();
4、 给新添加的右键菜单添加点击事件
● webdisk / scripts / function.js
给add_event添加点击事件，见function.js大概第500行：
bindings: {
'add_event':function(t){
add_event();
},
以上是绑定了add_event()事件。下面我们还需要自定义一个add_event()函数。如下，见function.js大概372行：
function add_event(){
iframe_box('Add Event', '.?module=add_event', '600', '500', true);
};
注析：iframe_box是弹出一个以box的层窗口，其最后一个参数为true,设置窗口关闭时，执行reload()操作。
5、 关闭iframe_box时，自动局部reload页面，刷新本次操作，回到此操作页面。
webdisk / scripts / function.js
function.js大概296行：
//全局刷新和局部刷新
function reload(){
var id = unescape($.cookie('treeid'));//获得左边树id
if(id=='?module=calenda')
{
var element= document.getElementById('calendar');//获得左边树元素
//alert(id);
}
else
{
var element= document.getElementById(id);//获得左边树元素
}
$(element).click();//控制左边树点击
}
注析：如果cookie里的treeid等于?module=calenda,则把元素ID’calendar’赋值给element，模拟重新点击该元素。实现局部刷新原操作模块功能和跳转。
webdisk开发难点说明文档
文章评论(查看全部)