/*

	Thiago Vitorino

	Esse script utiliza o arquivo vdrag.js,
	um opensource para tornar elementos "draggable"
	
	Basta colocar a classe "vresize" na textearea 
	para ativar as bordas arrastáveis


*/


function initDragObjects(){
	
	//	As textareas:
	var txtboxes		= document.getElementsByTagName("textarea");
	
	//	Para cada uma que tenha a classe vresize:
	for(i = 0; i < txtboxes.length; i++)
	{
		
		textBox		= txtboxes[i];
		
		//	checa se tem classe
		if(textBox.attributes["class"])
		{
			//	checa a classe
			if(textBox.attributes["class"].value == "vresize")
			{
				
				//	criando todos os elementos que acompanham a textarea
				//	o resultado deve ficar como abaixo para cada uma delas:
				/*
				
					<span id="textDiv" class="drag_container" >
					
						<textarea name="textarea" cols="20" rows="20" id="textBox" ></textarea>
						
						<span id="handleRight" class="drag_right" style="left:210px;" ></span>
						
						<span id="handleCorner" class="drag_corner" style="left:210px; top:150px;" ></span>
						
						<span id="handleBottom" class="drag_bottom" style="top:150px;" ></span>
						
					</span>
				
				
				*/
				var textDiv					= document.createElement("span");
				textDiv.setAttribute("id", "textDiv"+i);
				textDiv.setAttribute("class", "drag_container");
				
				
				//	O parent do textbox
				var pNode 				= textBox.parentNode;
	
				//	Coloca o span antes da txtarea
				pNode.insertBefore(textDiv, textBox);
				
				var handleRight				= document.createElement("span");
				var handleCorner			= document.createElement("span");
				var handleBottom			= document.createElement("span");
				
				handleRight.setAttribute("id", "handleRight"+i);
				handleCorner.setAttribute("id", "handleCorner"+i);
				handleBottom.setAttribute("id", "handleBottom"+i);
				
				//	Troca o id da textarea e checa se tem 
				//	Algum label linkado, para trocar o For
				lbs							= document.getElementsByTagName("label");
				
				//	para cada uma das labels
				for(z = 0; z<lbs.length; z++)
				{
					//	se tem atributo FOR
					if(lbs[z].attributes["for"])
					{
						//	se o atributo FOR é para o ID da txt area
						if(lbs[z].attributes["for"].value == textBox.id)
						{
							
							//	troca o for para o próximo id da textarea
							lbs[z].attributes["for"].value =	"textBox"+i;
							
						}
						
					}
					
				}
				textBox.setAttribute("id", "textBox"+i);
				
				handleRight.setAttribute("class", "drag_right");
				handleCorner.setAttribute("class", "drag_corner");
				handleBottom.setAttribute("class", "drag_bottom");
				
				handleRight.setAttribute("style", "left:210px; top:0px;");
				handleCorner.setAttribute("style", "left:210px; top:150px;");
				handleBottom.setAttribute("style", "top:150px; left:0px;");
				
				//	Organiza os elementos dentro do span
				textDiv.appendChild(textBox);
				textDiv.appendChild(handleRight);
				textDiv.appendChild(handleBottom);
				textDiv.appendChild(handleCorner);
				
				
				//	Inicia a aplicação para cada txtarea:
							
				new dragObject(
							   "handleRight"+i, 
							   null,
							   new Position(15, 0), 
							   new Position(300, 0), 
							   null, 
							   RightMove, 
							   null, 
							   false
							   );
			
				new dragObject(
							   "handleBottom"+i, 
							   null, 
							   new Position(0, 15), 
							   new Position(0, 1500), 
							   null, 
							   BottomMove, 
							   null, 
							   false
							   );
				
				new dragObject(
							   "handleCorner"+i,
							   null,
							   new Position(15, 15),
							   new Position(300, 1500),
							   null, 
							   CornerMove, 
							   null, 
							   false
							   );
				
				
				
				function DoHeight(y, element)
				{	
					
					//
					//
					//
					//
					//
					// até 9 txtareas	
					//
					//
					//
					//
					//
					i = element.id.charAt(element.id.length-1);
					
					document.getElementById("textDiv"+i).style.height = (y + 5) + 'px';
					
					if(element != document.getElementById("handleCorner"+i))
						document.getElementById("handleCorner"+i).style.top = y + 'px';
					
					document.getElementById("handleRight"+i).style.height = y + 'px';
					
					if(element != document.getElementById("handleBottom"+i))
						document.getElementById("handleBottom"+i).style.top = y + 'px';
					
					document.getElementById("textBox"+i).style.height = (y - 2) + 'px';
					
				}
				
				function DoWidth(x, element)
				{
					
					//
					//
					//
					//
					//
					// até 9 txtareas	
					//
					//
					//
					//
					//
					i = element.id.charAt(element.id.length-1);
					
					document.getElementById("textDiv"+i).style.width =  (x + 5) + 'px';
					
					if(element != document.getElementById("handleCorner"+i))
						document.getElementById("handleCorner"+i).style.left = x + 'px';
					
					if(element != document.getElementById("handleRight"))
						document.getElementById("handleRight"+i).style.left = x + 'px';
					
					document.getElementById("handleBottom"+i).style.width = x + 'px';
					
					document.getElementById("textBox"+i).style.width = (x - 8) + 'px';
					
				}
				
				//	Inicia o posicionamento para evitar os
				//	Problemas do position:absolute entre tags
				
				DoHeight(200, textBox);
				
			}
			
		}
		
	}
	
		
	function BottomMove(newPos, element)
	{
		DoHeight(newPos.Y, element);
	}
	
	function RightMove(newPos, element)
	{
		DoWidth(newPos.X, element);
	}
	
	function CornerMove(newPos, element)
	{
		DoHeight(newPos.Y, element);
		DoWidth(newPos.X, element);
	}
	
	
}


//	Inicia ao carregar a página
addLoadEvent(initDragObjects);