$(document).ready (function (){
	$("#berriz-hasi-botoia").click (function () {
		hasieratu ();
	});
	
	function hasieratu () {
		$('#ondo').hide ();
		
		zuzenak = 0;
		
		// Vaciamos las columnas
		$('#zutabea-elementuak').html ('');
		$('#zutabea-taldeak').html ('');
		
		// Randomize
		elementuak.sort (function () { return Math.random () - .5 });
		taldeak.sort (function () { return Math.random () - .5 });
		
		// Creamos la columna de elementos
		for (var i = 0; i < elementuak.length; i++) {
			$('<div></div>').attr ('id', 'irudia'+(i+1)).appendTo ('#zutabea-elementuak').append (
				$('<div class="draggable">' + elementuak[i].irudia + '</div>').data ('id', elementuak[i].id).draggable ({
					containment: '#jolasa',
					stack: '#zutabea-elementuak div',
					revert: true
				})
			);
		}
		
		// Creamos la columna de grupos
		for (var i = 0; i < taldeak.length; i++) {
			$('<div class="droppable">' + taldeak[i].irudia + '</div>').appendTo ('#zutabea-taldeak').data ('id', taldeak[i].id).droppable ({
				accept: '#zutabea-elementuak div',
				hoverClass: 'hovered',
				drop: handle_drop
			});
		}
	}
	
	hasieratu ();
	
	soundManager_setup ();
});

function handle_drop (event, ui) {
	if ($(this).data ('id') == ui.draggable.data ('id')){
		ui.draggable.draggable ('disable');
		ui.draggable.position ({ of: $(this), my: 'left top', at: 'left top' });
		ui.draggable.draggable ('option', 'revert', false);
		ui.draggable.css ('visibility', 'hidden');
		
		zuzenak++;
		
		soundManager.play ('erantzun_zuzena');
	}
	
	if (zuzenak == 11){
		$('#ondo').show ();
		
		soundManager.play ('amaiera');
	}
}

function soundManager_setup (){
	soundManager.setup ({
		url: 'https://www.durango-ezagutu.eus/swf/',
		flashVersion: 9, // optional: shiny features (default = 8)
		useFlashBlock: false, // optionally, enable when you're ready to dive in
		/**
		  * read up on HTML5 audio support, if you're feeling adventurous.
		  * iPad/iPhone and devices without flash installed will always attempt to use it.
		  */
		onready: function () {
			// Ready to use; soundManager.createSound() etc. can now be called.
			var zuzena = soundManager.createSound ({
				id: 'erantzun_zuzena',
				url: 'https://www.durango-ezagutu.eus/swf/soinuak/zuzen.mp3'
			});
			
			var txaloak = soundManager.createSound ({
				id: 'amaiera',
				url: 'https://www.durango-ezagutu.eus/swf/soinuak/txalo.mp3'
			});
		}
	});
}

var zuzenak = 0;
var elementuak = [];
var taldeak = [];

elementuak.push ({
	id: 16,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/logo-irudienea.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela2014.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela1973.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela2007.jpg" alt="" />'
});
elementuak.push ({
	id: 16,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/azoka.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela1990.jpg" alt="" />'
});
elementuak.push ({
	id: 16,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/tinta2b.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela1965.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela1986.jpg" alt="" />'
});
elementuak.push ({
	id: 16,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/gerediaga-logo.jpg" alt="" />'
});
elementuak.push ({
	id: 17,
	irudia: '<img src="https://www.durango-ezagutu.eus/fitxategiak/irudiak/jolasak/dad/kartela2004.jpg" alt="" />'
});

taldeak.push ({
	id: 17,
	irudia: '<p>Azokako kartelak</p>'
});
taldeak.push ({
	id: 16,
	irudia: '<p>Beste elementu batzuk</p>'
});