$(function() {
	var currentId;
	var objects = {};
	var zIndex = 0;
	
	init();
	
	//Initialize draggability
	function init() {
		document.addEventListener("touchstart", startmove, false);
		document.addEventListener("touchmove", move, false);
		document.addEventListener("touchend", endmove, false);
		
		makeObjectMovable(lg_hot);
		makeObjectMovable(lg_it);
		makeObjectMovable(lg_nba);
		makeObjectMovable(lg_de);
		makeObjectMovable(lg_sp);
		makeObjectMovable(lg_en);
	}
	
	//Register touch event
	function startmove(event) {
		init();
		
		var touch = event.touches[0];
		var id = touch.identifier;
		var dropId = touch.target.id;
		
		if (id) {
			currentId = id;
		}
		
		if (touch.target.className == "movable") {
			objects[id] = {
				target: touch.target,
				beginX: touch.clientX,
				beginY: touch.clientY,
				pozX: touch.target.pozXinit,
				pozY: touch.target.pozYinit
			}
			touch.target.style.opacity = 0.5;
			touch.target.style.zIndex = ++zIndex;
			
			makeDropPoint(dropId);
			event.preventDefault();
		}
	}
	
	//Register touch end
	function endmove(event) {
		var touch = event.touches[0];
		var id = currentId;
		
		if (objects[id] != null) {
		
			if (objects[id].target.className == "movable") {
				objects[id].target.style.opacity = 1;
				
				var currposX = (findPosX(objects[id].target) + objects[id].target.pozXinit);
				var currposY = (findPosY(objects[id].target) + objects[id].target.pozYinit);
				
				removeDropPoint();
				
				if ((currposX >= 66 && currposX <= 198) && (currposY >= 100 && currposY <= 265)) {
				
					if (objects[id].target.id == "lg_it") 
					{
						$('#drop').append("<h2>意甲赛程</h2>");
						setOriginal(objects[id].target);
						self.location="/match_show_e_it.html";

						
					}
					else if (objects[id].target.id == "lg_nba") 
					{
						$('#drop').append("<h2>NBA赛程</h2>");
						setOriginal(objects[id].target);
						self.location="/match_show_e_nba.html";
					}	
					else if (objects[id].target.id == "lg_de") 
					{
						$('#drop').append("<h2>德甲赛程</h2>");
						setOriginal(objects[id].target);
						self.location="/match_show_e_de.html";
															
					} 
					else if (objects[id].target.id == "lg_sp")
					{
						$('#drop').append("<h2>西甲赛程</h2>");
						setOriginal(objects[id].target);
						self.location="/match_show_e_sp.html";
					}  
					else if (objects[id].target.id == "lg_en") 
					{
						$('#drop').append("<h2>英超赛程</h2>");
						setOriginal(objects[id].target);
						self.location="/match_show_e_en.html";
						
					}  
					else if (objects[id].target.id == "lg_hot") 
					{
						$('#drop').append("<h2>热门推荐</h2>");
						setOriginal(objects[id].target);
						self.location="/match_show_e_hot.html";
					}
				}
			}
			
			setOriginal(objects[id].target);
			
			delete objects[id];
		}
	
		event.preventDefault();
	}
	
	//Register if object is moving
	function move(event) {
		var touch = event.touches[0];
		var id = touch.identifier;
		
		if (objects[id] != null) {
	        var currposX = (findPosX(objects[id].target) + objects[id].target.pozXinit);
			var currposY = (findPosY(objects[id].target) + objects[id].target.pozYinit);
			
			if ((currposX >= 66 && currposX <= 198) && (currposY >= 127 && currposY <= 265)) {
				makeHitPoint();
			} else {
				removeHitPoint(touch.target.id);
			}
		}
		
		if (objects[id] != null && objects[id].target.className == "movable") {
			objects[id].target.pozXinit = objects[id].pozX + touch.clientX - objects[id].beginX;
			objects[id].target.pozYinit = objects[id].pozY + touch.clientY - objects[id].beginY;
			objects[id].target.style['-webkit-transform'] = 'translate(' + objects[id].target.pozXinit + 'px,' + objects[id].target.pozYinit + 'px)';
			
			event.preventDefault();
		}
	}
	
	//Add movability to an object
	function makeObjectMovable(obj) {
		obj.className = "movable";
		obj.pozXinit = 0;
		obj.pozYinit = 0;
	}
	
	//Prepare our drop point
	function makeDropPoint(dropId) {
		var droptext = document.getElementById(dropId).innerHTML;
		
		document.getElementById('drop').innerHTML = droptext;
		document.getElementById('drop').style.backgroundPosition = "-270px 0";
		document.getElementById('drop').style.color = "#ffffff";
	}
	
	//Make our drop point active on rollover
	function makeHitPoint() {
		document.getElementById('drop').style.backgroundPosition = "-135px 0";
		document.getElementById('drop').style.color = "#ffffff";
	}
	
	//Get rid of our active rollover
	function removeHitPoint(dropId) {
		var droptext = document.getElementById(dropId).innerHTML;
		makeDropPoint(dropId);
	}
	
	//Restore our drop point
	function removeDropPoint() {
		//document.getElementById('drop').style.background = "url(../images/phone/mid_pan_1.png)";
		//$('#drop').text("正在前往");
		document.getElementById('drop').style.color = "#fff";
	}
	
	//Find the x position of an object
	function findPosX(obj) {
		var curleft = 0;
		if (obj.offsetParent) {
			while(1) {
				curleft += obj.offsetLeft;
			  
				if(!obj.offsetParent) {
					break;
				}
			
				obj = obj.offsetParent;
			}
		} else if (obj.x) {
			curleft += obj.x;
		}
		
		return curleft;
	  }
	
	//Find the y coordinate of an object
	function findPosY(obj) {
		var curtop = 0;
		if(obj.offsetParent) {
			while(1) {
				curtop += obj.offsetTop;
				
				if(!obj.offsetParent) {
					break;
				}
				
				obj = obj.offsetParent;
			}
		} else if (obj.y) {
			curtop += obj.y;
		}
		
		return curtop;
	}
	
	//Reset the original position of an object
	function setOriginal (obj) {
		
		//Initialize the rest of the objects.
		initObject("lg_hot");
		initObject("lg_it");
		initObject("lg_nba");
		initObject("lg_de");
		initObject("lg_sp");
		initObject("lg_en");
	}
	
	//Initialize the object
	function initObject (obj) {
		
		document.getElementById(obj).setAttribute("style","left: "+findPosX(document.getElementById(obj))+"px; top: "+findPosY(document.getElementById(obj))+"px");
	}

});