var maxColumHeight = 300;
var singleItemHeight = 34;

var linksContainer;

function initLinks(node) {
	
		clearAll();
 
        activeNavItem = node;
		
		linksContainer = document.createElement('div');
		subNavigation = document.createElement('div');
		
		addAttribute(linksContainer, "id", "linkContainer");
		infoNode.appendChild(linksContainer);
		
        var bar = createNewSubNavigationBar(subNavigation);

        var friends = document.createElement('span');
        friends .innerHTML = "friends";

        addSubNavigationItem(friends, function() {showLinks("friends");}, bar);

        var guys = document.createElement('span');
        guys.innerHTML = "amazing guys I don't know personally yet";
        addSubNavigationItem(guys, function() {showLinks("amazingguys");}, bar);
		
		subNavigationNode.appendChild(subNavigation);

        }



function rollOver(index, node, text, thumbnailSrc) {
		
		var linkgroup = node.parentNode;
		
        var infoBox = document.getElementById('linkRollOverBox');
		
		infoBox.innerHTML = "";
		
        infoBox.style.visibility = "visible";

        infoBox.style.top  = linkgroup.offsetTop + node.getElementsByTagName('div')[0].offsetHeight * index + "px";
		infoBox.style.left = linkgroup.offsetLeft + linkgroup.offsetWidth + 1 + "px";
	
		if(text != "") {
			var textNode = document.createElement('div');
			addAttribute(textNode, "id", "linkRollOverText");
			textNode.innerHTML = text;
			infoBox.appendChild(textNode);
		}
		
		var thumbnailNode = document.createElement('div');
		addAttribute(thumbnailNode, "id", "linkRollOverImage");
		var thumbnail = document.createElement("img");
		thumbnail.src = thumbnailSrc;
		addAttribute(thumbnail, 'class', 'thumbnail');
		thumbnailNode.appendChild(thumbnail);
		infoBox.appendChild(thumbnailNode);

        }

function rollOut() {
        var infoBox = document.getElementById('linkRollOverBox');
        infoBox.style.visibility = "hidden";
        }
		

var groupPaths;

function showLinks(directory) {
        linksContainer.innerHTML = "";
        linksContainer.innerHTML = "<div id='linkRollOverBox'></div>";

        getDirectoryList("links/" + directory, getGroupsHandler);
        }

function getGroupsHandler(list) {
        groupPaths = list;
        for(var i = 0; i < groupPaths.length; i++) {
                createFriendsGroup(groupPaths[i]);
                }
        }

function createFriendsGroup(groupPath) {

        var group = document.createElement('div');

        addAttribute(group, "name", "linkGroup");
        addAttribute(group, "class", "linkGroup");

        linksContainer.appendChild(group);

        getDirectoryList(groupPath, function(friendsList) {
                fillLinkGroup(group, friendsList);
                sortGroups();
        });

        }
		
function sortGroups() {

        var groups = linksContainer.childNodes;
	
        var x = 0;
        var y = 0;

        for(var i = 1; i < groups.length; i++) {

                groups[i].style.top = y + "px";
                groups[i].style.left = x + "px";

                var children = groups[i].getElementsByTagName('div');


                y += (children.length) * children[0].offsetHeight;

                if(y > maxColumHeight) {
					
                        x = groups[i].offsetLeft + groups[i]. offsetWidth + 1;
                        y = 0;
						
                        }

                else y += 1;
				
                }
				
        }

function fillLinkGroup(friendsGroup, friendsList) {

        for(var i = 0; i < friendsList.length; i++) {

                var a       = document.createElement('a');

                a.href = "#";
                a.target = "_blank";

				friendsGroup.appendChild(a);

                setLinkFromFile(a, friendsList[i], i);

                }

        }


function setLinkFromFile(linkNode, linkFile, index) {


	   var div = document.createElement("div");
	   
	   addAttribute(div, "class", "linkListBlock");
	   
	   linkNode.appendChild(div);

        var myAjax = new Ajax();

        myAjax.url=(linkFile + "/info.txt");
        myAjax.onSuccess = function(txt, xml) {

                div.innerHTML =  txt.split('\n')[0];
				
				var img = document.createElement("img");
		
				img.src = "images/link.png";
				addAttribute(img, "id", "linkArrow");
		
				div.appendChild(img);
				
				img.style.visibility = "hidden";
				
                linkNode.href =  txt.split('\n')[1];

                linkNode.onmouseover = function() { 
					var text ="";
					if(txt.split('\n').length > 2) text = txt.split('\n')[2];
					rollOver(index, linkNode, text, linkFile + "/thumbnail.jpg");
					img.style.visibility = "visible";
					img.style.top  = linkNode.getElementsByTagName('div')[0].offsetHeight * index + 10 + "px";
					};
                linkNode.onmouseout  = function() {
					rollOut(); 
					img.style.visibility = "hidden";
					};

                }

        myAjax.doRequest();

        }