var mapa_selec= 0;
var mapa_selec_folder= ["mapes2/", "mapes3/"];
var startrow, startcol
var startrow_fija, startcol_fija

function MouseCoords(ev)
{
	if(ev==null) ev= window.event
	if(ev.pageX || ev.pageY) return {x:ev.pageX, y:ev.pageY};
	
	// IE
	return {x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
		y:ev.clientY + document.body.scrollTop  - document.body.clientTop};
}

function insideVista(pos)
{
	return (pos.x>vista_pos.x && pos.x<(vista_pos.x+vista_width) && pos.y>vista_pos.y && pos.y<(vista_pos.y+vista_height))
}
	
function OnMouseDown(ev)
{
	var ev_pos
	ev_pos= MouseCoords(ev)
		
	// IE is retarded and doesn't pass the event object 
	if (ev == null) ev = window.event; 
		
	// IE uses srcElement, others use target 
	var target = ev.target != null ? ev.target : ev.srcElement;
		
	// for IE, left click == 1 // for Firefox, left click == 0 
	if (((ev.button == 1 && window.event != null) || ev.button == 0) && target.className == 'clipMapa') 
	{
		if(insideVista(ev_pos))
		{
			dragging = true;
			drag_pos = ev_pos
		}
			
		// cancel out any text selections 
		document.body.focus(); 
			
		// prevent text selection in IE 
		document.onselectstart = function () { return false; };
		
		// IE ev.cancelBubble = true;
			
		// Firefox if(ev.stopPropagation) e.stopPropagation();
	
		return false;
	}
	else if(ev.button==2)
	{
		return false;
	}
	
}
	
function OnMouseUp(ev)
{
	var ev_pos
	ev_pos= MouseCoords(ev)
		
	dragging = false;
	position(mapa_pos.x, mapa_pos.y, true);
	if(ev.button==2)
	{
		return false;
	}
}
	
function OnMouseOver(ev)
{
	var ev_pos= MouseCoords(ev)
	// var label= document.getElementById("label");  
		
	if (insideVista(ev_pos))
	{
		if (dragging)
		{
			mapa_pos.x += -(ev_pos.x - drag_pos.x);
			mapa_pos.y += -(ev_pos.y - drag_pos.y);
			if ( mapa_pos.x < -margenmapa )  mapa_pos.x = -margenmapa;
		    if ( mapa_pos.y < -margenmapa )  mapa_pos.y = -margenmapa;
			if (mapa_pos.y > limit_rows[mapa_selec]) mapa_pos.y= limit_rows[mapa_selec];
			if (mapa_pos.x > limit_cols[mapa_selec]) mapa_pos.x= limit_cols[mapa_selec];
			// label.innerHTML= "pos="+mapa_pos.x+", "+mapa_pos.y+" Ev="+ev_pos.x+", "+ev_pos.y
		    position(mapa_pos.x, mapa_pos.y, false);
		}
		drag_pos = ev_pos
	}
	else
	{
		//var tg = (window.event) ? "" : ev.target;
		//label.innerHTML= "source="+tg
	}
}

function disableContextMenu()
{
	return false;
}

function InitDragDrop() 
{ 
	document.onmousedown = OnMouseDown; 
	document.onmouseup = OnMouseUp;
	document.onmouseover= OnMouseOver;
	
	window.onmousedown= disableContextMenu;
	window.onmouseup= disableContextMenu;
	
	// IE
	document.oncontextmenu= disableContextMenu;
	
	// firefox
	window.oncontextmenu= disableContextMenu;
}

function inici()
{
		window.status = "Mapa que pots desplaçar"
};
	
function findPos(obj) 
{
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) 
		{
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return {x:curleft,y:curtop};
}

function position(x, y, fijar)
{
	startcol = Math.floor( x / width );
	startrow = Math.floor( y / height );

	offsetx = Math.abs( x - ( startcol * width ) ) * -1;
	offsety = Math.abs( y - ( startrow * height ) ) * -1;

	// var label2= document.getElementById("label2");
	// label2.innerHTML='start='+startcol+', '+startrow
	  
	var left, top, imagen, st, orig
	var remainderx, remaindery, remx, remy
	var clip_top, clip_left, clip_right, clip_bottom, str_clip
	var origimgs= mapimgs[mapa_selec]
	
    for( var row = 0; row < scrollrows + 1; row++)
	{
		for( var col = 0; col < scrollcols + 1; col++)
		{
			mapa_col= startcol+col
			mapa_row= startrow+row
			imagen= imgs[col][row]
			st= imagen.style
			
			if(mapa_col<0 || mapa_row<0 || mapa_col>=maxcols[mapa_selec] || mapa_row>=maxrows[mapa_selec])
			{
				orig= "imgnull.jpg"
			}
			else
			{
				orig= origimgs[mapa_col][mapa_row]
			}
	
			if(fijar) imagen.src = mapa_selec_folder[mapa_selec]+orig
			else
			{
				if(mapa_row >= startrow_fija && mapa_row<= (startrow_fija+scrollrows) && mapa_col >= startcol_fija && mapa_col<= (startcol_fija+scrollcols))
				{
					imagen.src = mapa_selec_folder[mapa_selec]+orig
				}
				else imagen.src= mapa_selec_folder[mapa_selec]+"imgnull.jpg"
			}
			
			left = offsetx + ( col * width );
			top = offsety + ( row * height );
	
			remainderx = viewwidth - ( left + width );
			remaindery = viewheight - ( top + height );
			remx= left; 
			remy= top;
		
			if(remx>=0) remx= 0;
			if(top>0) remy= 0;
			if(remx<-width) remx= -width;
			if(top<-height) remy= -height;
				
			if ( remainderx > width ) remainderx = width;
		    if ( remainderx < 0 ) remainderx = 0;
		    if ( remaindery > height ) remaindery = height;
		    if ( remaindery < 0 ) remaindery = 0;

			if(remy==0) clip_top="auto "; else clip_top=(-remy)+"px ";
			if(remx==0) clip_left="auto "; else clip_left=(-remx)+"px ";
			if(remainderx==width) clip_right="auto "; else clip_right=remainderx+"px ";
			if(remaindery==height) clip_bottom="auto "; else clip_bottom=remaindery+"px ";
				
			str_clip= "rect("+clip_top+clip_right+clip_bottom+clip_left+")"
			st.clip = str_clip;
			st.left = left+"px";
			st.top = top+"px";
		}
	}
	if(fijar)
	{
		startcol_fija= startcol
		startrow_fija= startrow
		sliderX.setValue(x)
		sliderY.setValue(sliderY.getMaximum()-y)
	}
	
}
	
function goto_llimiana()
{
	llim=[[3,3],[4,1]];
	mapa_pos.x= llim[mapa_selec][0]*width
	mapa_pos.y= llim[mapa_selec][1]*height
	position(mapa_pos.x, mapa_pos.y, true);
}

function cambiar_mapa(m)
{
	mapa_selec= m
	sliderX.setMinimum(-margenmapa)
	sliderX.setMaximum(limit_cols[mapa_selec])
	sliderY.setMinimum(-margenmapa)
	sliderY.setMaximum(limit_rows[mapa_selec])
	goto_llimiana()
}