?? treeview.js
字號:
?/**
** ==================================================================================================
** ClassName :treeview
** ==================================================================================================
**/
function treeview(id,path,check,drag){
var me = this;
var target = null;
this.nodes = new node("root","roottag").nodes;
this.id = id?id:"";
this.icon = true;
this.selected = null;
this.path = path?path:"";
this.selected = null;
this.dragTo = null;
this.dragFrom = null;
this.drag = drag?true:false;
this.check = check?true:false;
var icons = {
root :'root.gif',
open :'open.gif',
close :'close.gif',
file :'file.gif',
rplus :'rplus.gif',
rminus :'rminus.gif',
join :'t.gif',
joinbottom:'l.gif',
jointop :'r.gif',
plus :'tplus.gif',
plusbottom:'lplus.gif',
minus :'tminus.gif',
minusbottom:'lminus.gif',
blank :'blank.gif',
line :'I.gif'
};
this.Ficons = {};
for(i in icons){
this.Ficons[i]= new Image()
this.Ficons[i].src= path + "/" + icons[i];
}
this.create = function(oTarget){
if(oTarget){
for(var i=0;i<this.nodes.length;i++){
oTarget.appendChild(this.nodes.items[i].toString(me));
}
target = oTarget;
}
}
this.add = function(oo){
this.insert(this.nodes.length,oo);
}
this.insert = function(index,oo){
if(index>=0&&index<=this.nodes.length){
var pre = null;
if(index<this.nodes.length){
pre = this.nodes.items[index].baseNode;
}
this.nodes.insert(index,oo);
if(target){
if(index==this.nodes.length){
target.appendChild(oo.toString());
}else{
if(pre){
target.insertBefore(oo.toString(),pre);
}
}
}
}
}
}
//event
treeview.prototype.onnodeclick = function(sender){return false;}
treeview.prototype.onnodeexpand = function(sender){}
treeview.prototype.onnodecollapse = function(sender){}
treeview.prototype.onnodedblclick = function(sender){sender.toggle();return false;}
treeview.prototype.onnodeafteredit = function(sender,oldstr){}
treeview.prototype.onnodebeforeedit = function(sender,oldstr,newstr){}
treeview.prototype.onnodedrag = function(from,to){}
treeview.prototype.onnodekeydown = function(sender,e){
var e=e||event;
switch(e.keyCode){
case 61: //fx +
case 187: //=
case 107: //number +
sender.expand();
break;
case 109: //number -
case 189: //-
sender.collapse();
break;
case 38: //up
if(sender.previous()){
sender.previous().select();
}else{
if(sender.parent&&sender.parent.level>=0){
sender.parent.select();
}
}
break;
case 40: //down
if(sender.next()){
sender.next().select();
}
break;
case 37: //left
if(sender.parent&&sender.parent.level>=0){
sender.parent.select();
}
break;
case 39: //right
if(sender.firstChild()){
sender.firstChild().select();
}else{
if(sender.next()){
sender.next().select();
}
}
break;
}
}
treeview.prototype.onnodemousedown = function(sender,e){}
treeview.prototype.onnodemouseup = function(sender,e){}
treeview.prototype.oncontextmenu = function(sender){}
treeview.prototype.onnodecheck = function(sender){}
treeview.prototype.onselectchange = function(before,after){}
treeview.prototype.onnodeclick = function(sender){
//alert("caption:" + sender.caption + ",id:" + sender.id + ",deepth:" + sender.level + ",tag:" + sender.tag);
//alert("islast:" + sender.isLast +",indent:" + sender.indent);
// alert(sender.baseNode.outerHTML);
return false;
}
treeview.prototype.onnodecheck = function(sender){alert(sender.caption + " selected:" + sender.checked);}
treeview.prototype.onselectchange = function(before,after){
// if(before)
// alert(before.caption + "," + after.caption);
// else
// alert(after.caption);
}
// treeview.prototype.onnodekeydown = function(sender,e){var e = event||e;alert(e.keyCode);}
treeview.prototype.onnodedrag = function(from,to){
to.moveToChild(from);
}
/**
** ==================================================================================================
** ClassName :node
** ==================================================================================================
**/
function node(caption,title,url,target,tag,callback,check){
var me = this;
this.nodes = new nodes();
// this.id = getid();
this.caption= caption;
this.title = title?title:caption;
this.parent = null;
this.tag = tag?tag:"";
this.loaded = false;
this.level = -1;
this.isLast = false;
this.opened = false;
this.showed = false;
this.checked= check?true:false;
this.indent = [];
this.action =url?url:"";
var contol = null;
this.container = document.createElement("div");
this.baseNode = null;
this.handleNode = null;
this.folderNode = null;
this.textNode = null;
this.checkNode = null;
//get the id by rand
function getid(){
var a = Math.random() + "";
var b = Math.random() + "";
var c = Math.random() + "";
var d = Math.random() + "";
return a.substr(2,8) + "-" + b.substr(2,8) + "-" + c.substr(2,8) + "-" + d.substr(2,8);
}
//node collection
function nodes(){
var n = [];
//get the lenght of the collection
this.length = {valueOf:function(){return n.length;},toString:function(){return n.length;}}
this.toString = function(){
return n.toString();
}
//insert a node at index
this.insert = function(index,oo){
if(index>=0&&index<=n.length){
var ol = n.length;
oo.parent = me;
oo.level = me.level+1;
if(index>=n.length){
oo.isLast = true;
if(n.length>0){
n[n.length-1].isLast = false;
n[n.length-1].setIndent(n[n.length-1].level,n[n.length-1].isLast);
n[n.length-1].refresh(0);
}
}else{
oo.isLast = false;
}
oo.indent = me.indent.concat();
oo.indent[oo.indent.length]=oo.isLast;
if(oo.nodes.length>0){
refreshchildindent(oo);
}
function refreshchildindent(node){
for(var i=0;i<node.nodes.length;i++){
node.nodes.items[i].indent = node.indent.concat();
node.nodes.items[i].indent[node.nodes.items[i].indent.length] = node.nodes.items[i].isLast;
if(node.nodes.items[i].nodes.length>0){
arguments.callee(node.nodes.items[i]);
}
}
}
if(me.loaded){
if(index==n.length){
me.container.appendChild(oo.toString());
}else{
var pre = n[index].baseNode;
if(pre){
me.container.insertBefore(oo.toString(),pre);
}
}
}
n.splice(index,0,oo);
if(ol==0){
me.refresh(0);
}
}
return me;
}
//add a node after the last node
this.add = function(oo){
return this.insert(n.length,oo);
}
//remove a node by node
this.remove = function(node){
if(node){
for(var i=0;i<n.length;i++){
if(n[i] ==node){
this.removeAt(i);
}
}
}
}
//remove a node at index
this.removeAt = function(index){
if(index>=0&&index<n.length){
if(index>0&&index==n.length-1){
n[index-1].isLast = true;
n[index-1].setIndent(n[index-1].level,n[index-1].isLast);
}
n[index].nodes.removeChildren();
var c = n[index];
if(c.showed){
if(control){
if(c==control.selected){
if(index>0){
control.selected = c.previous();
}else{
control.selected = c.next();
}
if(!control.selected){
if(c.parent.level>=0){
control.selected = c.parent;
}
}
if(control.selected)control.selected.select();
}
}
var oNode = c.baseNode;
if (oNode) {oNode.parentNode.removeChild(oNode); }
}
n.splice(index,1);
if(n.length>0){
var o = n[n.length-1];
o.isLast = true;
o.setIndent(o.level,o.isLast);
if(o.showed){o.refresh(0);}
}else{
me.loaded = false;
me.opened = false;
me.container.style.display = "none";
me.refresh(0);
}
}
}
this.removeChildren = function (){
for(var i=n.length-1;i>=0;i--){
var o = me.nodes.items[i];
o.nodes.removeChildren();
if(o.showed){
if(control){
if(o==control.selected){
control.selected = this;
}
}
var oNode = me.baseNode;
if (oNode) {oNode.parentNode.removeChild(oNode); }
}
}
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -