var left_dif;        
var outframe_pos;  

var mapin;        
var mapout;     

var src;

var left2;

var image_width = 874; 
var image_height = 156; 

var image_left_offset = 0;  
var image_top_offset  = 0;  

var mapout_width;
var mapin_height;

var timerID = 0; 

function smoothMoveEnd() {
    return false;
}

function RMove() {
	scroll3 =document.getElementById('rightbtn');
    removeListener(document, 'mousemove', moveElem, false);
	clearInterval(timerID);
	timerID=setInterval('rightMove()',15);
    removeListener(document, 'mousemove', moveElem, false);
    count_t=0;
	var tid = setTimeout('smoothMoveEnd()', 7000);
    return false;
}

function LMove() {
	scroll2 =document.getElementById('leftbtn');
    removeListener(document, 'mousemove', moveElem, false);
	clearInterval(timerID);
	timerID=setInterval('leftMove()',15);
    removeListener(document, 'mousemove', moveElem, false);
    count_t=0;
	var tid = setTimeout('smoothMoveEnd()', 7000);
    return false;
}


function rightMove() {
	var left2 = parseInt(mapin.style.left);
	var left3 = parseInt(left2) - 2;

	count_t+=1;
	if(count_t>100)
	{
		clearInterval(timerID);
	}
	if(left2>-170)
	{
		mapin.style.left=left3 + "px";	
	}else
	{
		clearInterval(timerID);
	}
	return false;
}	

function leftMove() {
	var left2 = parseInt(mapin.style.left);
	var left3 = parseInt(left2) + 2 ;

	count_t+=1;
	if(count_t>100)
	{
		clearInterval(timerID);
	}
	if(left2<0)
	{
		mapin.style.left=left3 + "px";	
	}else
	{
		clearInterval(timerID);
	}
	return false;
}	


function stopDefaultAndPropagation(e) {
    if(e.stopPropagation) {
        e.stopPropagation();
    }
    if(window.event) {
        window.event.cancelBubble = true;
    }
    if(e.preventDefault) {
        e.preventDefault();
    }
    if(window.event) {
        window.event.returnValue = false;
    }
	if( navigator.userAgent.match( "Safari" ) ){
		window.event.returnValue = false;
	} 
}

function dragStart(e) {
    outframe_pos = getElemPos(mapout);
    var pos = getElemPos(mapin);
    left_dif = e.clientX - pos.x;

    addListener(document, 'mousemove', moveElem, false);
  	addListener(document, 'mouseup', dragEnd, false);
    stopDefaultAndPropagation(e);
    return false;
}

function getMouseY(e){
  if(window.opera)   
          return e.clientY
  else if(document.all)   
		  return window.scrollY+e.clientY;
//          return event.clientY
  else if(document.layers||document.getElementById)
          return e.pageY
}


function dragEnd(e) {
    if(e.preventDefault) e.preventDefault();
    removeListener(document, 'mousemove', moveElem, false);
    removeListener(document, 'mouseup', dragEnd, false);
    dragging = false;
    stopDefaultAndPropagation(e);
    return false;
}

function moveElem(e) {
var img = document.getElementById('img');
    if(
        (navigator.appName == 'Netscape' && navigator.userAgent.indexOf("Safari") < 0 ) ||
        navigator.userAgent.indexOf("Opera") >= 0
    ) {
        if(
            e.clientX >= window.innerWidth - 20 || e.clientX <= 10 ||
            e.clientY >= window.innerHeight - 30 || e.clientY <= 10
        ) {
            dragEnd(e);
            return false;
        }
    }


    left2 = e.clientX - outframe_pos.x - left_dif;

	if(left2 >= 0){
		left2=0;
	}
	if(left2<-170)
	{
		left2=-170;
	}


    mapin.style.left = left2 + 'px';
	
    stopDefaultAndPropagation(e);
    return false;
}

function getElemPos(elem) {
    var obj = new Object();
    obj.x = elem.offsetLeft;
    obj.y = elem.offsetTop;
    while(elem.offsetParent) {
       elem = elem.offsetParent;
       obj.x += elem.offsetLeft;
       obj.y += elem.offsetTop;
    }
    return obj;
}




function setSRC() {
	src = '../img/kr/jidai_map.jpg';
	addListener(window, 'load', setListeners, false);
    return false;
}

function setListeners(e) {
    mapout = document.getElementById('mapout');
    mapin = document.getElementById('mapin');
    var img = document.createElement('img');
    img.id = 'img';

	img.useMap='#Age';
	img.border=0
	
	img.src =src;
	img.galleryimg='no';
    mapin.appendChild(img);
    img.width = image_width;
    img.height = image_height;
    mapin.style.left = image_left_offset + 'px';
    mapin.style.top  = image_top_offset  + 'px';

    addListener(mapout, 'mousedown', dragStart, false);
}


function removeListener(elem, eventType, func, cap) {
    if(elem.removeEventListener) {
        elem.removeEventListener(eventType, func, cap);
    } else if(elem.detachEvent) {
        elem.detachEvent('on' + eventType, func);
    }
}



function addListener(elem, eventType, func, cap) {
    if(elem.addEventListener) {
        elem.addEventListener(eventType, func, cap);
    } else if(elem.attachEvent) {
        elem.attachEvent('on' + eventType, func);
    } else {
        alert('Not support this browser!');
        return false;
    }
}