var stopLineAnimation = false;
var tps;
var listLines = Array (Array ('line01',  0, 208, 46, 'X'),
					   Array ('line02', 46, 208, 18, 'Y'),
					   Array ('line03', 46, 226, 65, 'X'),
					   Array ('line04', 110, 226, 18, 'Y', -1),
					   Array ('line05', 110, 208, 207, 'X'));

function ClearLines (lines) {
	for (var i=0; i<lines.length; ++i) {
		document.getElementById (lines[i][0]).style.left = '0px';
		document.getElementById (lines[i][0]).style.top = '0px';
		document.getElementById (lines[i][0]).style.width = '1px';
		document.getElementById (lines[i][0]).style.height = '1px';
	}
}

function HideLines (lines) {
	for (var i=0; i<lines.length; ++i)
		document.getElementById (lines[i][0]).style.visibility = 'hidden';
}

function ShowLines (lines) {
	for (var i=0; i<lines.length; ++i)
		document.getElementById (lines[i][0]).style.visibility = 'visible';
}
		
function InitMenuLines (left, top, widthText, heightText) {
	window.clearInterval (tps);
	
	ClearLines (listLines);
	ShowLines (listLines);
	
	document.getElementById ('menu-lines').style.left = left + 'px';
	document.getElementById ('menu-lines').style.top = top + 'px';
	
	listLines = Array (Array ('line01',  0, 0, 46, 'X'),
					   Array ('line02', 46, 0, heightText, 'Y'),
					   Array ('line03', 46, 0+heightText, widthText, 'X'),
					   Array ('line04', 46+widthText, 0+heightText, heightText, 'Y', -1),
					   Array ('line05', 46+widthText, 0, 320-(46+widthText), 'X'));
	
	document.getElementById ('line01').style.left = listLines[0][1] + 'px';
	document.getElementById ('line01').style.top = listLines[0][2] + 'px';
	tps = window.setInterval ('DrawLines (listLines, 0)', 20);
}

function DrawLines (lines, current_id) {
	if (stopLineAnimation)
		return;
		
	var line = lines[current_id];
		
	var obj = document.getElementById (line[0]);
	var current = parseInt ((line[4] == 'X' ? obj.style.width : obj.style.height));

	if (current <= line[3]) {
		if (line[4] == 'X') {
			obj.style.width = current + 10 + 'px';
			
			if (line[5] == -1)
				obj.style.left = parseInt (obj.style.left) - 10 + 'px';
		}
		else {
			obj.style.height = current + 10 + 'px';
			
			if (line[5] == -1)
				obj.style.top = parseInt (obj.style.top) - 10 + 'px';
		}
	}
	else {
		if (line[4] == 'X')
			obj.style.width = line[3] + 'px';
		else {
			obj.style.height = line[3] + 'px';
			if (line[5] == -1)
				obj.style.top = line[2]-line[3] + 'px';
		}
			
		window.clearInterval (tps);
		if (current_id < lines.length-1) {
			++current_id;
			
			document.getElementById (lines[current_id][0]).style.left = lines[current_id][1] + 'px';
			document.getElementById (lines[current_id][0]).style.top = lines[current_id][2] + 'px';
			tps = window.setInterval ('DrawLines (listLines, '+current_id+')', 20);
		}
	}
}