window.addEvent('domready', function() {
	
	var element = $('b');
	function sort(){
		var mySortables = new Sortables('#a, #b, #c', {
			 handle:'.drag',
		    clone: true,
			 opacity:0.5,
			 revert:true
		});
	}
	var i=0;
	i++;
	$('m_o').addEvent('click', function(){
		var mySlide = new Fx.Slide('menu',{mode:'horizontal'}).toggle();
	});

	
	$('ul_menu').getElements('li').getElement('a').addEvent('click', function(){
		i++;
		var box  = new Element('div', {class:'drag_box',id : 'box_'+i});
		var drag = new Element('div', {class:'drag',id : 'drag_'+i});
		var inner = new Element('div', {class:'inn',id : 'inn_'+i});

		element.adopt(box);
		$('box_'+i).adopt(drag);
		$('box_'+i).adopt(inner);
		$('drag_'+i).innerHTML=this.getParent().get('text')+"<span onclick='this.getParent().getParent().style.display=\"none\";' style='cursor:pointer;'>X</span>";
		

		//$('box_'+i).morph('.drag_box');
		//$('drag_'+i).morph('.drag');

		var req = new Request.HTML({url:'data.php?url='+this.getProperty('title'), 
			onRequest: function() {
				$('inn_'+i).innerHTML='<img src="loading.gif" alt="ładowanie"/>';
			},
			onSuccess: function(html) {
				$('inn_'+i).set('text', '');
				$('inn_'+i).adopt(html);
			},
			onFailure: function() {
				$('inn_'+i).set('text', 'The request failed.');
			}
		});
		req.send();
		sort();
	});
	sort();
});