function clearId(id)
	{
		var patt1=/-.+/;
		return patt1.exec(id);
		
	}
 
 
 
 
 
	$().ready(function(){
	
	
	
	
	
	
		$(".sortable").sortable({});
		$(".sortable").sortable("disable");
		
		$(".sortable").after("<a class='editorder' href='#'>Изменить порядок</a>");
		$(".sortable").after("<a class='saveorder' href='#'>Сохранить порядок</a>");
		$(".saveorder").hide();
		
		
		
		$(".editorder").unbind("click");
		$(".editorder").click(function(){ 
			//alert("editpictureorder"+$(this).attr("type"));
			$(this).siblings(".saveorder").show();
			$(this).hide();
			
			$(this).siblings(".sortable").sortable("enable");
			//alert("editpictureorder"+$(this).parents(".sortblock").attr("type"));
			
			/*
			
			$(this).siblings(".sortable").children().each(function(){
				$(this).append("<div class='dragger'></div>");
				$(this).css("position", "relative");
				$(this).children(".dragger").css("width", $(this).width()+"px");
				$(this).children(".dragger").css("height", $(this).height()+"px");
			
			});
			
			*/
			
			
			return false;
		});
		
		
		
		$(".saveorder").unbind("click");
		$(".saveorder").click(function(){ 
		
			var _str=$(this).siblings(".sortable").sortable("serialize");
			_str=_str.replace(/&/ig, ",");
			_str=_str.replace(/=/ig, ":");
			_str=_str.replace(/,?\D+?:/ig, ",");
			_str=_str.replace(/^,/ig, "");
			
			$(this).siblings(".editorder").show();
			$(this).hide();
			$(this).siblings(".sortable").sortable("disable");
			
			//alert(_str);
			//alert("_str: "+_str);
			
			$(".dragger").remove();
			
			
			$.ajax({ 
					url:"/aj/hgghgv45fySS23/song/sort/post/", 
					type: 'post', 
					data:"str="+_str, 
					success:function(msg){ 
								//alert(msg)
								return false;
							}
					});
			
			
			$(this).attr("href", "/aj/sort/?str="+_str);
			return false;
		});
		
		

	


	
	
	
	
	
	
	
	
	
	
	
	
	$('#clickme').unbind("click");
	$('#clickme2').unbind("click");
	$('#clickme3').unbind("click");
	
	
	
	
				$('#clickme').click(function() {
				
			//$('#clickme').hide();
			$('#clickme2').show();
			
			  $('#songwithchords em').css("display", "block");

			  $('#songwithchords em').animate({
				height: 15
			  }, 500);
			  
			  $('#songwithchords span').animate({
				paddingTop: 0, backgroundPositionY: -50
			  }, 500, onComplete);
			  
			  $('#clickme').addClass("active");
			  $('#clickme2').removeClass("active");
			  $('#clickme3').removeClass("active");
			  
			  return false;
			});
	
	
	
	
	
			$('#clickme2').click(function() {
			//$('#clickme2').hide();
			$('#clickme').show();
			
			
			  $('#songwithchords em').css("display", "block");
			initChords();
			
			
			
			  $('#songwithchords em').animate({
				height: 48
			  }, 500);
			  
			
			
			  $('#songwithchords span').animate({
				paddingTop: 34, backgroundPositionY: 5
			  }, 500);
			  
			  $('#clickme2').addClass("active");
			  
			  $('#clickme').removeClass("active");
			  $('#clickme3').removeClass("active");
			  
			  return false;
			});
			
			
			
			
			
			
			
			
			
	
	
	
			$('#clickme3').click(function() {
				//initChords();
			
			  $('#songwithchords em').animate({
				height: 0
			  }, 500, onComplete3);
			  
			  $('#clickme3').addClass("active");
			  $('#clickme2').removeClass("active");
			  $('#clickme').removeClass("active");
			  
			  
			  return false;
			});
			
			
			
			
			
			
			
	function onComplete3()
	{
	
	  $('#songwithchords em').css("display", "none");
	}	
			
	function onComplete()
	{
	  //$('#songwithchords span').addClass("hidden");
	  $('#songwithchords span').css("background-image", "none");
	//  $('#songwithchords span').removeClass("chrd");
	

	}		
			

	function initChords()
	{
				$('#songwithchords span').each(function(){
		
					$(this).css("background-image", "url('/chordpix/"+$(this).attr("chord")+".gif')");
								
				});	
				
				

	}

	
	
	
	 initChords();
	
	
	
	
 listPlace("alb");
				//listSort("alb");
 /*
		$('.list a').each(function(){
			$(this).unbind("click");
			$(this).click(function(){
				alert(clearId($(this).attr("id")));
				return false;
			});
		});
 */
		$('#albbtn').each(function(){
			$(this).unbind("click");
			$(this).click(function(){
				//alb();
				
				$('.btn').each(function(){
					$(this).removeClass("active");
				});
				
				
		 
				$(this).addClass("active");
				//dif();
				
				listSort("alb");
				return false;
			});
		});
 
 
		$('#alfbtn').each(function(){
			$(this).unbind("click");
			$(this).click(function(){
				//alert("alfavit");
				$('.btn').each(function(){
					$(this).removeClass("active");
				});
				
				
		 
				$(this).addClass("active");
				//dif();
				
				//alf();
				listSort("alf");
				
				return false;
			});
		});
 
 
 
 	
 
 
		$('#difbtn').each(function(){
			$(this).unbind("click");
			$(this).click(function(){
			
			
						
				$('.btn').each(function(){
					$(this).removeClass("active");
				});
				
				
		 
				$(this).addClass("active");
				//dif();
				listSort("dif");
				return false;
			});
		});
 
 
 
 	
 
 
 
	});
	
	
	
	
	
	
	function listSort(listId)
	{
		var _str="";
		
		if (listId!="alb")
		{
			$(".albums").animate({ 
  									  opacity: 0
 									 }, 1500 );
		}
		else
		{
			$(".albums").animate({ 
  									  opacity: 100
 									 }, 1500 );
		
		}
		
					$('#thelist a').css("position", "absolute");
					$('#thelist a').each(function(){
					var id=clearId($(this).attr("id"));
					_str+=id+"\n";
					
					var position = $('#'+listId+id).position();
					_str+=position.top+" : "+position.left+"\n";
							
					 	 $(this).animate({ 
  									  left: position.left+"px",
  									  top: position.top+"px"
 									 }, 1500 );
					});
					
					//alert(_str);
	}
	
	
 
	
	function listPlace(listId)
	{
		var _str="";
		
					$('#thelist a').css("position", "absolute");
					$('#thelist a').each(function(){
					var id=clearId($(this).attr("id"));
					_str+=id+"\n";
					
					var position = $('#'+listId+id).position();
					var position2 = $('#songlist').offset();
					//_str+=position.top+" : "+position.left-position2.left+"\n";
						//$(this).css("left", (position.left-position2.left)+"px");
						//$(this).css("top", (position.top-position2.top)+"px");
						$(this).css("left", (position.left)+"px");
						$(this).css("top", (position.top)+"px");	
						//$(this).css("left", (position.left)+"px");
						//$(this).css("top", (position.top)+"px");	
			
					});
					
					//alert(_str);
	}