Google Maps API的库JS文件分析(6) -拖放支持
在Google Maps API提供的JS文件中,引用了一个后台的JS库文件,该文件针对不同的浏览器有三个版本,这几天因为我想给我的Google Map扩展一些功能,所以研究了这个文件,我现在正打算陆续将我注释过的该文件放在网上,该文件一共有7000多行,我会分段渐渐的注释出来,我是按照分类注释的,所以并不会按照该JS文件顺序。
该文件Google作了处理,所有的变量名都被处理成了简单的a,b,c,d之类,所以理解起来比较费劲。
该JS文件是以IE版本的http://maps.google.com/mapfiles/maps.21.js来分析的,其他的几个我觉得基本的架构也应该差不多,所以我没有仔细看,实际上,这个文件Google也会不停的更新(在我写这个文章的时候,我发现Google已经更新到maps.25.js了),不过我想架构上也不会有太大的变动吧。
由于该文件是在比较复杂,所以难免会出现理解错误的情况,请谅解!
下面是第6个(这个是拖放支持的对象):
1
//一个用来响应拖放操作的层对象
2
function da(a,b,c,d)
3
{
4
this.src=a; //拖放操作源
5
this.container=d;
6
this.disabled=false; //是否禁用
7
this.dragPoint=new r(0,0); //当前拖动到的位置
8
this.dragging=false; //是否正在被拖动中
9
this.clickStartPos=new r(0,0); //拖动起始点坐标
10
this.src.style.position="absolute";
11
this.moveTo(b!=null?b:a.offsetLeft,c!=null?c:a.offsetTop); //将该层和源重叠
12
this.mouseDownHandler=j.createAdapter(this,this.onMouseDown);
13
this.mouseMoveHandler=j.createAdapter(this,this.onMouseMove);
14
this.mouseUpHandler=j.createAdapter(this,this.onMouseUp);
15
if(t.type==2)
16
{
17
j.bindDom(window,"mouseout",this,this.onWindowMouseOut)
18
}
19
this.eventSrc=this.src.setCapture?this.src:window;
20
j.addBuiltInListener(this.src,"mousedown",this.mouseDownHandler);
21
j.bindDom(this.src,"mouseup",this,this.onDisabledMouseUp);
22
j.bindDom(this.src,"click",this,this.onDisabledClick)
23
}
24
//移动到(a,b)点
25
da.prototype.moveTo=function(a,b)
26
{
27
if(this.left!=a||this.top!=b)
28
{
29
this.left=a;
30
this.top=b;
31
this.src.style.left=this.left+"px";
32
this.src.style.top=this.top+"px";
33
j.trigger(this,"move")
34
}
35
};
36
//当操作源被点击时,如果层没有被禁用,则触发层被点击事件?
37
da.prototype.onDisabledClick=function(a)
38
{
39
if(this.disabled)
40
{
41
j.trigger(this,"click",a)
42
}
43
};
44
//当操作源发生mouseup事件时如果层没有被禁用,则触发层mouseup事件
45
da.prototype.onDisabledMouseUp=function(a)
46
{
47
if(this.disabled)
48
{
49
j.trigger(this,"mouseup",a)
50
}
51
};
52
//当操作源发生mousedown事件时如果层没有被禁用,则触发层mousedown事件
53
da.prototype.onMouseDown=function(a)
54
{
55
j.trigger(this,"mousedown",a);
56
if(a.cancelDrag)
57
{
58
return
59
}
60
var b=a.button==0||a.button==1;
61
if(this.disabled||!b)
62
{
63
B(a); //中止事件a的执行
64
return false
65
}
66
this.dragPoint.x=a.clientX;
67
this.dragPoint.y=a.clientY;
68
this.dragging=true;
69
j.addBuiltInListener(this.eventSrc,"mousemove",this.mouseMoveHandler);
70
j.addBuiltInListener(this.eventSrc,"mouseup",this.mouseUpHandler);
71
if(this.src.setCapture)
72
{
73
this.src.setCapture() //给源发出源事件被捕获通知,不过这个方法在整个文件中没有被定义
74
}
75
this.clickStartTime=(new Date()).getTime();
76
this.clickStartPos.x=a.clientX;
77
this.clickStartPos.y=a.clientY;
78
j.trigger(this,"dragstart"); //拖动开始
79
this.originalCursor=this.src.style.cursor; //记录原来的鼠标样式
80
G(this.src,"move"); //将操作源的鼠标样式变为"Move"
81
B(a) //中止事件a的执行
82
};
83
//移动或拖动时持续触发
84
da.prototype.onMouseMove=function(a)
85
{
86
if(t.os==1)
87
{
88
if(a==null)
89
{
90
return
91
}
92
if(this.dragDisabled)
93
{
94
this.savedMove=new Object();
95
this.savedMove.clientX=a.clientX;
96
this.savedMove.clientY=a.clientY;
97
return
98
}
99
qa(this,function()
100
{
101
this.dragDisabled=false;
102
this.onMouseMove(this.savedMove)
103
}
104
,30); //30秒后执行该操作,实际上就是30毫秒内禁止执行onMouseMove操作,以便不影响性能
105
this.dragDisabled=true;
106
this.savedMove=null
107
}
108
var b=this.left+(a.clientX-this.dragPoint.x);
109
var c=this.top+(a.clientY-this.dragPoint.y);
110
var d=0;
111
var e=0;
112
if(this.container) //防止超出container边界
113
{
114
var f=b;
115
if(b<this.container.minX)
116
{
117
f=this.container.minX
118
}
119
else
120
{
121
var i=this.container.maxX-this.src.offsetWidth;
122
if(b>i)
123
{
124
f=i
125
}
126
}
127
d=f-b;
128
b=f;
129
var g=c;
130
if(c<this.container.minY)
131
{
132
g=this.container.minY
133
}
134
else
135
{
136
var h=this.container.maxY-this.src.offsetHeight;
137
if(c>h)g=h
138
}
139
e=g-c;
140
c=g
141
}
142
this.moveTo(b,c);
143
this.dragPoint.x=a.clientX+d;
144
this.dragPoint.y=a.clientY+e;
145
j.trigger(this,"drag")
146
};
147
da.prototype.onMouseUp=function(a)
148
{
149
j.trigger(this,"mouseup",a);
150
j.removeBuiltInListener(this.eventSrc,"mousemove",this.mouseMoveHandler); //结束事件捕获
151
j.removeBuiltInListener(this.eventSrc,"mouseup",this.mouseUpHandler);
152
this.dragging=false;
153
G(this.src,this.originalCursor); //还原鼠标样式
154
if(document.releaseCapture) //完成捕获,这个函数并没有在系统中定义
155
{
156
document.releaseCapture()
157
}
158
j.trigger(this,"dragend");
159
var b=(new Date()).getTime();
160
if(b-this.clickStartTime<=500&&(Math.abs(this.clickStartPos.x-a.clientX)<=2&&Math.abs(this.clickStartPos.y-a.clientY)<=2))
161
{
162
j.trigger(this,"click",a) //如果时间较短,并且距离比较近,则认为是双击
163
}
164
};
165
//鼠标离开层则触发结束拖动操作
166
da.prototype.onWindowMouseOut=function(a)
167
{
168
if(!a.relatedTarget&&this.dragging)
169
{
170
this.onMouseUp(a)
171
}
172
};
173
//禁用拖放
174
da.prototype.disable=function()
175
{
176
this.disabled=true
177
};
178
//启用拖放
179
da.prototype.enable=function()
180
{
181
this.disabled=false
182
};
//一个用来响应拖放操作的层对象2
function da(a,b,c,d)3
{4
this.src=a; //拖放操作源5
this.container=d;6
this.disabled=false; //是否禁用7
this.dragPoint=new r(0,0); //当前拖动到的位置8
this.dragging=false; //是否正在被拖动中9
this.clickStartPos=new r(0,0); //拖动起始点坐标10
this.src.style.position="absolute";11
this.moveTo(b!=null?b:a.offsetLeft,c!=null?c:a.offsetTop); //将该层和源重叠12
this.mouseDownHandler=j.createAdapter(this,this.onMouseDown);13
this.mouseMoveHandler=j.createAdapter(this,this.onMouseMove);14
this.mouseUpHandler=j.createAdapter(this,this.onMouseUp);15
if(t.type==2)16
{17
j.bindDom(window,"mouseout",this,this.onWindowMouseOut)18
}19
this.eventSrc=this.src.setCapture?this.src:window;20
j.addBuiltInListener(this.src,"mousedown",this.mouseDownHandler);21
j.bindDom(this.src,"mouseup",this,this.onDisabledMouseUp);22
j.bindDom(this.src,"click",this,this.onDisabledClick)23
}24
//移动到(a,b)点25
da.prototype.moveTo=function(a,b)26
{27
if(this.left!=a||this.top!=b)28
{29
this.left=a;30
this.top=b;31
this.src.style.left=this.left+"px";32
this.src.style.top=this.top+"px";33
j.trigger(this,"move")34
}35
};36
//当操作源被点击时,如果层没有被禁用,则触发层被点击事件?37
da.prototype.onDisabledClick=function(a)38
{39
if(this.disabled)40
{41
j.trigger(this,"click",a)42
}43
};44
//当操作源发生mouseup事件时如果层没有被禁用,则触发层mouseup事件45
da.prototype.onDisabledMouseUp=function(a)46
{47
if(this.disabled)48
{49
j.trigger(this,"mouseup",a)50
}51
};52
//当操作源发生mousedown事件时如果层没有被禁用,则触发层mousedown事件53
da.prototype.onMouseDown=function(a)54
{55
j.trigger(this,"mousedown",a);56
if(a.cancelDrag)57
{58
return59
}60
var b=a.button==0||a.button==1;61
if(this.disabled||!b)62
{63
B(a); //中止事件a的执行64
return false65
}66
this.dragPoint.x=a.clientX;67
this.dragPoint.y=a.clientY;68
this.dragging=true;69
j.addBuiltInListener(this.eventSrc,"mousemove",this.mouseMoveHandler);70
j.addBuiltInListener(this.eventSrc,"mouseup",this.mouseUpHandler);71
if(this.src.setCapture)72
{73
this.src.setCapture() //给源发出源事件被捕获通知,不过这个方法在整个文件中没有被定义74
}75
this.clickStartTime=(new Date()).getTime();76
this.clickStartPos.x=a.clientX;77
this.clickStartPos.y=a.clientY;78
j.trigger(this,"dragstart"); //拖动开始79
this.originalCursor=this.src.style.cursor; //记录原来的鼠标样式80
G(this.src,"move"); //将操作源的鼠标样式变为"Move"81
B(a) //中止事件a的执行82
};83
//移动或拖动时持续触发84
da.prototype.onMouseMove=function(a)85
{86
if(t.os==1)87
{88
if(a==null)89
{90
return91
}92
if(this.dragDisabled)93
{94
this.savedMove=new Object();95
this.savedMove.clientX=a.clientX;96
this.savedMove.clientY=a.clientY;97
return98
}99
qa(this,function()100
{101
this.dragDisabled=false;102
this.onMouseMove(this.savedMove)103
}104
,30); //30秒后执行该操作,实际上就是30毫秒内禁止执行onMouseMove操作,以便不影响性能105
this.dragDisabled=true;106
this.savedMove=null107
}108
var b=this.left+(a.clientX-this.dragPoint.x);109
var c=this.top+(a.clientY-this.dragPoint.y);110
var d=0;111
var e=0;112
if(this.container) //防止超出container边界113
{114
var f=b;115
if(b<this.container.minX)116
{117
f=this.container.minX118
}119
else120
{121
var i=this.container.maxX-this.src.offsetWidth;122
if(b>i)123
{124
f=i125
}126
}127
d=f-b;128
b=f;129
var g=c;130
if(c<this.container.minY)131
{132
g=this.container.minY133
}134
else135
{136
var h=this.container.maxY-this.src.offsetHeight;137
if(c>h)g=h138
}139
e=g-c;140
c=g141
}142
this.moveTo(b,c);143
this.dragPoint.x=a.clientX+d;144
this.dragPoint.y=a.clientY+e;145
j.trigger(this,"drag")146
};147
da.prototype.onMouseUp=function(a)148
{149
j.trigger(this,"mouseup",a);150
j.removeBuiltInListener(this.eventSrc,"mousemove",this.mouseMoveHandler); //结束事件捕获151
j.removeBuiltInListener(this.eventSrc,"mouseup",this.mouseUpHandler);152
this.dragging=false;153
G(this.src,this.originalCursor); //还原鼠标样式154
if(document.releaseCapture) //完成捕获,这个函数并没有在系统中定义155
{156
document.releaseCapture()157
}158
j.trigger(this,"dragend");159
var b=(new Date()).getTime();160
if(b-this.clickStartTime<=500&&(Math.abs(this.clickStartPos.x-a.clientX)<=2&&Math.abs(this.clickStartPos.y-a.clientY)<=2))161
{162
j.trigger(this,"click",a) //如果时间较短,并且距离比较近,则认为是双击163
}164
};165
//鼠标离开层则触发结束拖动操作166
da.prototype.onWindowMouseOut=function(a)167
{168
if(!a.relatedTarget&&this.dragging)169
{170
this.onMouseUp(a)171
}172
};173
//禁用拖放174
da.prototype.disable=function()175
{176
this.disabled=true177
};178
//启用拖放179
da.prototype.enable=function()180
{181
this.disabled=false182
};posted on 2005-10-24 09:50 K_Reverter 阅读(852) 评论(0) 收藏 举报

浙公网安备 33010602011771号