K_Reverter的网页开发记录

要么不做,要么就当作艺术品来做!

导航

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    }
;

posted on 2005-10-24 09:50  K_Reverter  阅读(848)  评论(0编辑  收藏  举报