var projectDirectoryList;
var specialDirectoryList;
var imageList;

var currentProjectIndex;
var currentImageIndex;
var currentSpecialIndex;

var isInfoVisible;

var special;

function initWork(node) {

        clearAll();

        activeNavItem = node;

        isInfoVisible = false;

        getDirectoryList("work", projectsHandler);

        }

var firstInit = true;
var tooltip;

function addTooltip() {

        fullscreenNode.onmouseover = tooltipOverHandler;
        fullscreenNode.onmousemove = tooltipMoveHandler;

        fullscreenNode.onmouseout = function(event) {

        if(!event) event = window.event;

        if(tooltip != null) {

           document.body.removeChild(tooltip);
           tooltip = null;

           }

          }

        }

function tooltipOverHandler(event) {

        if(!event) event = window.event;

        if(tooltip == null) {

        tooltip = document.createElement('img');
        tooltip.src = "images/tooltip.png";
        addAttribute(tooltip, "id", "tooltip");

        document.body.appendChild(tooltip);

        tooltip.style.top =  event.clientY + 10 + "px";
        tooltip.style.left = event.clientX - 15 + "px";

        }

}

function tooltipMoveHandler(event) {

         if(!event) event = window.event;

         if(tooltip != null) {

            tooltip.style.top =  event.clientY + 10 + "px";
            tooltip.style.left = event.clientX - 15 +  "px";

         } else {
            tooltipOverHandler(null);
            }
			
}

function removeTooltip() {

        fullscreenNode.onmousemove = null;
        fullscreenNode.onmouseout  = null;
        fullscreenNode.onmouseover = null;

        try {document.body.removeChild(tooltip);}
        catch(e) {};

        }

function projectsHandler(projects) {
        projectDirectoryList = projects;
        createWorkSubnavigation(projectDirectoryList);
        }

function imagesHandler(images) {

        imageList = images;

         var decimalPlaceCount = 1 + Math.floor(Math.log(imageList.length) / Math.LN10);
        initPageBox(decimalPlaceCount);

        numPagesBox.setAttribute("value", "/ " + imageList.length);

        setPage(0);

        }


function setCurrentProject() {

        if(firstInit) {
           firstInit = false;
           addTooltip();
           }

        currentProjectIndex = getCurrentProjectIndex();

        if(!isInfoVisible)        hideInfo();
        else                      showInfo();

        getFileList(projectDirectoryList[currentProjectIndex] + "/images/", imagesHandler);

        }

function setSpecials() {

        if(!isInfoVisible)        hideInfo();
        else                      showInfo();
		
		getDirectoryList("special", specialsHandler);

        }

function  specialsHandler(specials) {

         specialDirectoryList = specials;

         var decimalPlaceCount = 1 + Math.floor(Math.log(specialDirectoryList.length) / Math.LN10);
        initPageBox(decimalPlaceCount);

        numPagesBox.setAttribute("value", "/ " + specialDirectoryList.length);
        setPage(specialDirectoryList.length - 1);

        }

function setSpecial() {
        getFileList(specialDirectoryList[currentImageIndex] + "/", specialHandler);
        }

function specialHandler(files) {
        for(var i = 0; i < files.length; i++) {
                if(getSuffix(files[i]) == "jpg" || getSuffix(files[i]) == "png") {
                        addCenteredImage(files[i]);
                        }
                else if(getSuffix(files[i]) == "txt") {
                        addCenteredContent(files[i]);
                        }
                }
        }

function getCurrentProjectIndex() {

         var subNavItems = subNavigation.getElementsByTagName("a");

         for(var i = 0; i < subNavItems.length; i++) {
           if(subNavItems[i] == activeSubNavItem){
                           return i;
                   }
         }
         return 0;
}

function createWorkSubnavigation(projectDirectoryList) {

        subNavigation = document.createElement('div');

        var i;
        var  bar;

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

                if(i % 5 == 0) bar = createNewSubNavigationBar(subNavigation);

                var name = document.createElement('span');

                getProjectName(name, projectDirectoryList[i] + "/german.txt");

                addSubNavigationItem(name, setCurrentProject, bar);

                }

                // add special node
				// &forall;&there4;&Yuml;&bull;&cap;&asymp;&Pi;

                var name = document.createElement('span');
                name.innerHTML = "&amp;";
                if(i % 5 == 0) bar = createNewSubNavigationBar(subNavigation);
                special = addSubNavigationItem(name, setSpecials, bar);

                // ---

                subNavigationNode.appendChild(subNavigation);

        }




function getProjectName(node, url) {

        var myAjax = new Ajax();

        myAjax.url=(url);
        myAjax.onSuccess = function(txt, xml) {
                txt = txt.split("<br>");
                node.innerHTML += txt[0];
                }

        myAjax.doRequest();

        }

function easteregg() {

        imageNode.innerHTML = "";
        textNode.innerHTML = "";
        addFullscreenImage("images/easteregg.jpg");

        }

function setPage(index) {

                fullscreenNode.innerHTML = "";
                imageNode.innerHTML = "";
                textNode.innerHTML = "";

                if(activeSubNavItem == special) {

                        if(index < 0) index = specialDirectoryList.length - 1;
                        if(index >=   specialDirectoryList.length) index = 0;

                        currentImageIndex = index;

                        setSpecial();
                        }

                else {

                        if(index < 0) index = imageList.length - 1;
                        if(index >=   imageList.length) index = 0;

                        currentImageIndex = index;

                        if(getSuffix(imageList[currentImageIndex]) == "txt") {
                                addCenteredContent(imageList[currentImageIndex]);
                                addFullscreenImage("images/black.png");
                                }


                        else {
                                addFullscreenImage(imageList[currentImageIndex]);
                        }

                }

        pageInputBox.value = currentImageIndex + 1;

        }

function setPageBackward() {
        setPage(currentImageIndex - 1);
        }

function setPageForward() {
        setPage(currentImageIndex + 1);
        }

function showInfo() {

        infoNode.innerHTML = "";

        var buttonContainer        = document.createElement('span');
        var a                      = document.createElement('a');
        var button                 = document.createElement('img');
        var box                    = document.createElement('span');
        var german                 = document.createElement('div');
        var english                = document.createElement('div');

        box.appendChild(english);
        box.appendChild(german);

        a.appendChild(button);
                buttonContainer.appendChild(a);

        infoNode.appendChild(buttonContainer);
        infoNode.appendChild(box);

        a.href = "#";
        a.onclick = hideInfo;

        button.src = "images/button_close.png";
        addAttribute(button, "id", "infoButton");

        addAttribute(box, "id", "infoCluster");

        addAttribute(german, "class", "textBox infoBox");
        addAttribute(english, "class", "textBox infoBox");

        if(activeSubNavItem == special) {

           setText(german,  "special/german.txt");
           setText(english, "special/english.txt");

          }

        else {

           loadTextAndDo(projectDirectoryList[currentProjectIndex] + "/german.txt", function (txt, xml) {
          
		   		german.innerHTML = txt;

             	var clientHeight = document.body.clientHeight;

			   	if(clientHeight - german.offsetHeight * 2 <  200) {
	
				  german.style.position = "absolute";
				  german.style.left = "301px";
				  german.style.top = "0px";
				  
				  english.style.position = "absolute";
				  english.style.height = german.offsetHeight - 24 + "px";		
				  
				  }

           });

           loadTextAndDo(projectDirectoryList[currentProjectIndex] + "/english.txt", function (txt, xml) {
          
		   		english.innerHTML = txt;

          		var clientHeight = document.body.clientHeight;

			   	if(clientHeight - english.offsetHeight * 2 <  200) {
	
				  german.style.position = "absolute";
				  german.style.left = "301px";
				  german.style.top = "0px";
				  
				  english.style.position = "absolute";
				  english.style.height = german.offsetHeight - 24 + "px";
	
				  }

           });

           }


        isInfoVisible = true;

        }



function hideInfo() {

        infoNode.innerHTML = "";

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

        a.appendChild(button);
        infoNode.appendChild(a);

        a.href = "#";
        a.onclick = showInfo;

        button.src = "images/button_open.png";
        addAttribute(button, "id", "infoButton");

        isInfoVisible = false;

        }


var pageInputBox;
var numPagesBox;

function initPageBox(numChars) {

        pageNode.innerHTML = "";

        pageInputBox                     = document.createElement('input');
        numPagesBox                      = document.createElement('input');

        var container                    = document.createElement('span');

        var last                         = document.createElement('a');
        var lastButton                   = document.createElement('img');
        var next                         = document.createElement('a');
        var nextButton                   = document.createElement('img');

        next.appendChild(nextButton);
        last.appendChild(lastButton);

        container.appendChild(pageInputBox);
        container.appendChild(numPagesBox);

        pageNode.appendChild(last);
        pageNode.appendChild(container);
        pageNode.appendChild(next);

        last.href = "#";
        next.href = "#";

        addAttribute(lastButton, "id", "backButton");
        lastButton.src = "images/backButton.png";
        lastButton.onclick = setPageBackward;
        lastButton.onmouseover = function() { changeImage(lastButton, "images/backButton_over.png"); };
        lastButton.onmouseout  = function() { changeImage(lastButton, "images/backButton.png"); };

        addAttribute(pageInputBox, "type", "text");
        addAttribute(pageInputBox, "id", "currentPage");
        addAttribute(pageInputBox, "size", "5");
        addAttribute(pageInputBox, "maxlength", "" + numChars);

        pageInputBox.style.width = 14 + 10 * numChars + "px";

        pageInputBox.value = "1";
        pageInputBox.onchange = function() {
                        if(pageInputBox.value == "^^") easteregg();
                        else setPage(pageInputBox.value - 1);
                };

        addAttribute(numPagesBox, "type", "text");
        addAttribute(numPagesBox, "id", "currentPage");
        addAttribute(numPagesBox, "size", "5");
        addAttribute(numPagesBox, "value", "/ ");
        addAttribute(numPagesBox, "maxlength", "" + numChars + 1);
        addAttribute(numPagesBox, "readonly", "1");

        numPagesBox.style.width = 14 + 10 * numChars + "px";

        addAttribute(nextButton, "id", "forwardButton");
        nextButton.src = "images/forwardButton.png";
        nextButton.onclick = setPageForward;
        nextButton.onmouseover = function() { changeImage(nextButton, "images/forwardButton_over.png"); };
        nextButton.onmouseout  = function() { changeImage(nextButton, "images/forwardButton.png"); };


        }