/*=======================================
// jcMoveLayer
// 
// 작성일 : 2009-02-03
// 수정일 : 
// 공대여자는 이쁘다를 나타내야만 쓸 수 있습니다.
// 이 파일은 수정해서 재배포 할 수 없습니다!
// 내가 사용하지 못하도록한 사람,것,들은 사용할 수 없습니다.
// 만든이 : mins,공대여자 
// 홈페이지  : www.mins01.com


# 간단 설명 
레이어(div)를 이동할 수 있게 한다.
클래스화, 이벤트 제거 가능

#히스토리 
jfMoveLayer.js => jcMoveLayer.js 




# 사용법 & 예제
동봉 HTML 참고


# 설정
	targetC.jcMoveLayer.config = {
		 'moveable' : true	//이동가능
		,'toggle' : false	//토글로 제어
		,'stopArea' : false	//영역밖으로 나갈 시 멈춤
		,'onStartMove':null //시작 이벤트
		,'onFinishMove':null //끝 이벤트
		,'onDuringMove':null //이동중 이벤트
		,'auto' : false		//자동으로 이벤트 등록
	}
# 시작이벤트 예제
	targetC.jcMoveLayer.config.onStartMove = function(e){
		document.title = e.clientX
	}
	
# 메소드
	없음

# 주의
	config 설정잘못해서 질문하면 당신의 발바닥에 메테오스트라이크~


# 제한사항
#사용제한
1. "공대여자는 이쁘다"를 나타내야 사용할 수 있습니다.
2. 제작자정보 수정하면 안됩니다.
3. 다른 곳(파일)에 복사해서 사용할 수 있지만, 제작정보를 가져가야하고 사용제한을 지켜야합니다.
4. 수정해서 사용할 수 있지만 제작정보를 보존하고 사용제한을 지켜야합니다.
5. 내가 사용하지 못하도록 한 사람/것 등 은 사용 못합니다.

# 연계파일
	없음

# 브라우저 실험결과
IE6 : OK
IE7 : OK
FF2 : OK
FF3 : OK
Opera9 : OK
Sfari3(WIN),Chrome : OK



//=======================================*/


/** 레이어 이동
*/
var jcMoveLayer = function(targetC,targetM,config){
	if(!targetM){
		targetM = targetC;
	}
	//대상에 클래스 붙임
	targetC.jcMoveLayer = this;
	//제어
	this.targetC = targetC;
	//제어대상
	this.targetM = targetM;
	//설정
	this.config = {
		 'moveable' : true
		,'toggle' : false
		,'stopArea' : false
		,'onStartMove':null //시작 이벤트
		,'onFinishMove':null //끝 이벤트
		,'onDuringMove':null //이동중 이벤트
		,'auto' : true		//자동으로 이벤트 등록
	}
	//변수값
	this.left = 0;
	this.top = 0;
	this.drag = false;
	
	//--- 설정값 시작시 설정
	if(config){
		for(var x in this.config){
			if(config[x]!= null){
				this.config[x] = config[x]
			}
		}
	}
	
	//========================================== 이벤트 관련
	
	//이벤트 캔슬
	this.cancelEvent = function(e){
		var evt = e || window.event
		if(evt.stopPropagation){
			e.cancelBubble = true;
			e.stopPropagation(); 
			e.preventDefault();
			e.initEvent;   
		}else{
			window.event.keyCode = 0; 
			window.event.cancelBubble = true;
			window.event.returnValue = true; 			
		}
		return false;	
	}	
	
	// 마우스 다운 이벤트
	this.onMouseDown = function(thisC){
		return function(e){
			if(!thisC.config.moveable){return;}		
			var evt = e || window.event;
			thisC.left =  evt.clientX;
			thisC.top =  evt.clientY;
			
			if(thisC.config.toggle){
				thisC.drag = !thisC.drag
			}else{
				thisC.drag = true;
			}
			if(thisC.drag){
				if(thisC.config.onStartMove){
					thisC.config.onStartMove(evt);
				}
			}else{
				if(thisC.config.onFinishMove){
					thisC.config.onFinishMove(e);
				}
			}
			return thisC.cancelEvent(e);
		}
	}(this);
	
	//마우스 이동중.
	this.onMouseMove = function(thisC){
		return function(e){
  			if(!thisC.config.moveable){return;}
			if(thisC.drag){
				var evt = e || window.event;
				var left = evt.clientX - thisC.left;
				var top = evt.clientY - thisC.top;
				var tl = isNaN(parseInt(thisC.targetM.style.left))?0:parseInt(thisC.targetM.style.left);
				var tt = isNaN(parseInt(thisC.targetM.style.top))?0:parseInt(thisC.targetM.style.top);			
				thisC.targetM.style.left = (tl + left)+'px';
				thisC.targetM.style.top = (tt + top)+'px';		
				thisC.left = evt.clientX;
				thisC.top = evt.clientY;
				if(thisC.config.onDuringMove){
					thisC.config.onDuringMove(e);
				}
				return thisC.cancelEvent(e);
			}
		}
	}(this);
	
	//마우스 업.
	this.onMouseUp = function(thisC){
		return function(e){
			if(!thisC.config.moveable){return;}
			var evt = e || window.event;
			if(!thisC.config.toggle){
				if(thisC.drag){
					if(thisC.config.onFinishMove){
						thisC.config.onFinishMove(e);
					}
				}		
				thisC.drag = false;
			}
		}
	}(this);
	//마우스 아웃
	this.onMouseOut = function(thisC){
		return function(e){
			if(!thisC.config.moveable){return;}
			else if(!thisC.config.stopArea){return;}
			var evt = e || window.event;
			if(thisC.drag){
				if(thisC.config.onFinishMove){
					thisC.config.onFinishMove(e);
				}
			}
			thisC.drag = false;
			return thisC.cancelEvent(e);
		}
	}(this);
	//이벤트 등록
	this.addEvent = function(thisC){
		return function(){
			if(document.addEventListener){ //IE외
				thisC.targetC.addEventListener("mousedown", thisC.onMouseDown , false);
				document.addEventListener("mousemove", thisC.onMouseMove , false);
				document.addEventListener("mouseup", thisC.onMouseUp , false);
				document.addEventListener("mouseout", thisC.onMouseOut , false);
				thisC.targetC.style.MozUserInput='disabled';
				thisC.targetC.style.MozUserSelect='none';		
			}else if(document.attachEvent){ //IE
				thisC.targetC.attachEvent("onmousedown", thisC.onMouseDown );
				document.attachEvent("onmousemove", thisC.onMouseMove );
				document.attachEvent("onmouseup", thisC.onMouseUp );
				document.attachEvent("onmouseout", thisC.onMouseOut );
			}
		}
	}(this);
	this.removeEvent = function(thisC){
		return function(){
			if(document.addEventListener){ //IE외
				thisC.targetC.removeEventListener("mousedown", thisC.onMouseDown , false);
				document.removeEventListener("mousemove", thisC.onMouseMove , false);
				document.removeEventListener("mouseup", thisC.onMouseUp , false);
				document.removeEventListener("mouseout", thisC.onMouseOut , false);
				thisC.targetC.style.MozUserInput='';
				thisC.targetC.style.MozUserSelect='';		
			}else if(document.attachEvent){ //IE
				thisC.targetC.detachEvent("onmousedown", thisC.onMouseDown );
				document.detachEvent("onmousemove", thisC.onMouseMove );
				document.detachEvent("onmouseup", thisC.onMouseUp );
				document.detachEvent("onmouseout", thisC.onMouseOut );
			}
			
		}
	}(this);
	
	//========================================== 최종처리
	if(this.config.auto){
		this.addEvent();
	}
}