<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl" 
		  xmlns:xbl="http://www.mozilla.org/xbl" 
		  xmlns:html="http://www.w3.org/1999/xhtml">
		  
	<binding id="drag">
	
		<implementation>
			<constructor></constructor>
			<property name="XY">
				<getter>
					var offsetX = this.offsetLeft;
					var offsetY = this.offsetTop;
					var parent = this.offsetParent
					while (parent) {
						var x = isNaN( parent.offsetLeft) ? 0 :  parent.offsetLeft;
						var y = isNaN(parent.offsetTop) ? 0 : parent.offsetTop;
						offsetX = offsetX + x;
						offsetY = offsetY + y;
						parent = parent.offsetParent
					}
					return Array(offsetX,offsetY);
				</getter>
		
			</property>
			
			<property name="leftPx">
				<getter>
					return parseInt(this.style.left);
				</getter>
				<setter>
					this.style.left = parseInt(val);
				</setter>
			</property>
		
			<property name="topPx">
				<getter>
					return parseInt(this.style.top);
				</getter>
				<setter>
					this.style.top = parseInt(val);
				</setter>
			</property>
			
			<method name="setLeftAndTop">
				<body>
					var xy = this.XY;
					this.style.position = "absolute";
					this.style.left= xy[0];
					this.style.top = xy[1];
				</body>
			</method>
			
			<method name="move">
				<parameter name="event"/>
				<body>
					var thisd = document.drag_scope;
					var x = event.clientX - thisd._x;
					var y = event.clientY - thisd._y;
					thisd.leftPx = x;
					thisd.topPx = y;
				</body>
			</method>
			
			<method name="unload">
				<parameter name="event"/>
				<body>
					var thisd = document.drag_scope;
					
					
					document.removeEventListener("mousemove",document.drag_scope.move,true);
					document.removeEventListener("mouseup",document.drag_scope.unload,true);
					delete document.drag_scope;
				</body>
			</method>
			
			<property name="_x">0</property>
			<property name="_y">0</property>
		
		</implementation>
	
		<handlers>
			<handler event="mousedown">
				this.setLeftAndTop();
				document.drag_scope = this;
				this._x = event.clientX - this.leftPx;
				this._y = event.clientY - this.topPx;
				
				document.addEventListener("mousemove",document.drag_scope.move,true);
				document.addEventListener("mouseup",document.drag_scope.unload,true);
			</handler>		
		</handlers>
	
	</binding>
	  
</bindings>
