//------------------------------------------MAPA KLASEA----------------------------------------------//
//------------------------------------------MAPA KLASEA----------------------------------------------//
var mapa = new Class({
	vars: {
		pre_kursor_zindex:102,
		pre_kursor_kolor:'#FF3300'
    },
	initialize: function(zutabeak,lerroak,mapa_div_id,preview_id, img_izenak, php_izenak, nora_x, nora_y){
		var klasea = this;
		
		var browser = Browser.Engine.name;
		klasea.img_izenak = img_izenak;
		klasea.php_izenak = php_izenak;
		klasea.mapa_div_id = mapa_div_id;
		klasea.preview_id = preview_id;
		
		klasea.parent = $(mapa_div_id).getParent();
		klasea.position = klasea.parent.getPosition();
		
		
		for(i=0;i<lerroak;i++){
			for(j=0;j<zutabeak;j++){
				var mapatxo_id = 'mapatxo_'+i+"_"+j;
				var mapatxo = new Element('div', {
					'id': mapatxo_id,
					'class': 'mapatxo'
				});
				$(mapa_div_id).adopt(mapatxo);
				//ajax(mapatxo_id, "mapa/php/mapatxoak/" + php_izenak + (j+1) + "_"+(i+1)+".php");
				document.getElementById(mapatxo_id).style.background = 'url('+ img_izenak + (j + 1) + '_' + (i + 1) +'.jpg)';
			}
			var clear = new Element('div',{'class': 'clear'});
			$(mapa_div_id).adopt(clear);
		}
		klasea.mapatxo_zabal = mapatxo.getStyle('width').toInt();
		klasea.mapatxo_alt = mapatxo.getStyle('height').toInt();
		var mapa_zabal = klasea.mapatxo_zabal * zutabeak;
		$(mapa_div_id).setStyle('width', mapa_zabal);
		
		
		
		//-------------pantaila tamaina kalkulatu------------------//
		var window_zabal = getWidth();
		var window_alt = getHeight();
		
		//--------------------------------maparen limiteak kalkulatu--------------------------------//
		var div_zabal = $(mapa_div_id).getStyle('width').toInt();
		var div_alt = $(mapa_div_id).getStyle('height').toInt();
		var mapa_ikusi_zabal = mapatxo.getStyle('width').toInt();
		var mapa_ikusi_alt = mapatxo.getStyle('height').toInt();
		if (document.body)
		{
		var ancho = (document.body.clientWidth);
		var alto = (document.body.clientHeight);
		}
		else
		{
		var ancho = (window.innerWidth);
		var alto = (window.innerHeight);
		}
		var limitecalc = ancho-2500;
		
		limitea_x = [(limitecalc),(0)];
		$('limitex').value = limitea_x;
		limitea_y = [(mapa_ikusi_alt-div_alt),(0)];
		$('limitey').value = limitea_y;
		
		//---------------------------------drag and drog-------------------------------------------//
		if(browser!="trident"){
			$(mapa_div_id).setStyle('cursor','-moz-grab');
		}
		var myDrag = new drag_mugi($(mapa_div_id), {
			limit: {
				  x:limitea_x,
				  y:limitea_y
				},
			handle: $(mapa_div_id),
			onBeforeStart : function (el){
				if(browser!="trident"){
					$(mapa_div_id).setStyle('cursor','-moz-grabbing');
				}
			},
			onCancel : function (el){
				if(browser!="trident"){
					$(mapa_div_id).setStyle('cursor','-moz-grab');
				}
			},
			onComplete: function(el){
				if(browser!="trident"){
					$(mapa_div_id).setStyle('cursor','-moz-grab');
				}
			}	
		});
		klasea.preview_kursorea_marraztu();
		//---------------------------mapa eta previewaren arteko diferentzia--------//
		klasea.indize_x = ($(klasea.mapa_div_id).getStyle('width').toFloat())/($(klasea.preview_id+'_body').getStyle('width').toFloat());
		klasea.indize_y = ($(klasea.mapa_div_id).getStyle('height').toFloat())/($(klasea.preview_id+'_body').getStyle('height').toFloat());
		
		//-------------------------xaguaren posizio entzulea---------------------------//
		$(mapa_div_id).addEvent('mousemove', klasea.cursor_mugi.bindWithEvent(this));
		
		//------------------------Mapa hasieran nahi den mapatxoan zentratu------------//
		klasea.mapatxo_zentratu(nora_x,nora_y);
		
		//---------------------Preview-a drag&drop bihurtu--------------------//
		var x_max = window_zabal - $(klasea.preview_id).getStyle('width').toInt();
		var y_max = window_alt - $(klasea.preview_id).getStyle('height').toInt();
		
		drag_bihurtu(klasea.preview_id, klasea.preview_id+'_goiburua', 0, x_max, 0, y_max);
	},
	//------------------------------------xagua marraztu-----------------------------//
	preview_kursorea_marraztu: function(){
		var klasea = this;
		var cursor = new Element('div',{
			'styles' : {
				'position' : 'absolute',
				'background-color' : klasea.vars.pre_kursor_kolor,
				'z-index' : klasea.vars.pre_kursor_zindex
			},
			'id' : 'cursor'
		}).injectInside($(klasea.preview_id+'_body'));
		var str = '<img src="images/kursor.jpg"/>';
		$('cursor').innerHTML = str;
		
		//---------bista prebian klik entzulea------------//
		$(klasea.preview_id+'_body').addEvent('click', klasea.preview_klik.bindWithEvent(this));
	},
	//---------------bista prebian klikatzean zer egin-----------------//
	preview_klik:function(event){
		var klasea = this;
		var xagu_x = event.page.x - $(klasea.preview_id+'_body').getPosition().x;
		var xagu_y = event.page.y - $(klasea.preview_id+'_body').getPosition().y;
		var mapatxo_x = (xagu_x * klasea.indize_x / klasea.mapatxo_zabal).toInt();
		var mapatxo_y = (xagu_y * klasea.indize_y / klasea.mapatxo_alt).toInt();
		klasea.mapatxo_zentratu(mapatxo_x,mapatxo_y);

		$('cursor').setStyle('left', xagu_x);
		$('cursor').setStyle('top', xagu_y);
	},
	//---------------------edozein mapatxo zentratzeko funtzioa----------//
	mapatxo_zentratu : function (x,y){
		var klasea = this;
		var nora_x = -(x * klasea.mapatxo_zabal);
		var nora_y = -(y * klasea.mapatxo_alt);
		$(klasea.mapa_div_id).setStyle('left', nora_x);
		$(klasea.mapa_div_id).setStyle('top', nora_y);
	},
	//---------------preview-ko kursorea dagokion lekura mugitu-----------------//
	cursor_mugi: function(event){
		var klasea = this;
		var xagu_x = event.page.x;
		var xagu_y = event.page.y;
		var mapa_left = $(klasea.mapa_div_id).getStyle('left').toInt();
		var mapa_top = $(klasea.mapa_div_id).getStyle('top').toInt();
		var kursor_zabal = $('cursor').getStyle('width').toInt();
		var kursor_alt = $('cursor').getStyle('height').toInt();
		var nora_x = ((xagu_x - mapa_left - klasea.position.x)/klasea.indize_x)-kursor_zabal/2;
		var nora_y = ((xagu_y - mapa_top - klasea.position.y)/klasea.indize_y)-kursor_alt/2;
		
		
		var goiburua_alt = $(klasea.preview_id+'_goiburua').getSize().y;
		

		nora_y = nora_y + goiburua_alt;
		
		$('cursor').setStyle('left', nora_x);
		$('cursor').setStyle('top', nora_y);
	},
	//----------------previewan ikono desberdniak nahi den lekuan jartzeko. Hauentzat div bat esistitzen ez bada, automatikoki sortuko da--------->
	preview_ikono:function(x,y,ikono,alt){
		var id = 'preIkono_'+x+'_'+y;
		var img = '<img src="'+ikono+'" alt="'+alt+'" title="'+alt+'"/>';
		if($(id)){
			pantailaratu(id,img);
			div_agertu(id);
		}else{
			var pre_ikono = new Element('div', {
				'id': id,
				'class': 'pre_ikono'
			});
			$('preview_body').adopt(pre_ikono);
			pre_ikono.setStyle('left',x);
			pre_ikono.setStyle('top',y);
			pantailaratu(id,img);
		}
	},
	//------previewan jarritako ikonoak ezkutatu daitezke.--------//
	preview_ikono_ezkutatu:function(x,y){
		var id = 'preIkono_'+x+'_'+y;
		if($(id)){
			div_ezkutatu(id);
		}
	},
	mapa_kokatu:function(x,y){
		var klasea = this;
		$(klasea.mapa_div_id).setStyle('left',x);
		$(klasea.mapa_div_id).setStyle('top',y);
	}
});
//---------------------------MAPA HASIERATZEN DU-------------------//
function mapa_berria(zutabeak,lerroak,mapa_div_id,preview_id, img_izenak, php_izenak, nora_x, nora_y){
	nere_mapa = new mapa(zutabeak,lerroak,mapa_div_id,preview_id, img_izenak, php_izenak, nora_x, nora_y);
	
	//nere_mapa.preview_ikono(0,0,"perimetro-hoyo-1.png","mezua");
	//proba("proba","http://www.youtube.com/","");
	
}
function proba(div_id,url){
	file = "mapa/js/test.php";
	var myRequest = new Request({
		method: 'GET',
		url: file,
		data: url,
		onComplete:function(erantzuna){
			pantailaratu(div_id,erantzuna);
			
		}
	});
	myRequest.send();
}