var logger = new Log(Log.DEBUG, Log.popupLogger);

var timeoutID, timeoutID2;
var intervalAnimation = null;

var containerDiv = null;
var scrollingDiv = null;

var scrollingHeight = 1; //pixel
var scrollingSpeed = 25; //ms

/**
 * @author Jman (http://snipplr.com/users/Jman/)
 * fix for IE8 and older, 
 * adds getComputedStyle method for the object window 
 * and getPropertyCSSValue method for the object, which returns getComputedStyle
 * 
 * EXAMPLE 
window.onload = function() {
var compStyle = window.getComputedStyle(document.getElementById('test'), "");
 
alert(compStyle.getPropertyValue("color"));
alert(compStyle.getPropertyValue("float"));
alert(compStyle.getPropertyValue("background-color"));
}
 */
function compatibility() {
    if (!window.getComputedStyle) {
        window.getComputedStyle = function(el, pseudo) {
            this.el = el;
            this.getPropertyCSSValue = function(prop) {
                var re = /(\-([a-z]){1})/g;
                if (prop == 'float') prop = 'styleFloat';
                if (re.test(prop)) {
                    prop = prop.replace(re, function () {
                    return arguments[2].toUpperCase();
                    });
                }
                return el.currentStyle[prop] ? el.currentStyle[prop] : null;
            }
            return this;
        }
    }
}

$(document).ready(
    function() {
        logger = new Log(Log.DEBUG, Log.popupLogger);
        compatibility();
//        containerDiv = document.getElementById('column_right');
//        containerDiv = document.getElementById('scrollingContainer');
//        scrollingDiv = document.getElementById('jobs');
        containerDiv = $('#scrollingContainer');
        scrollingDiv = $('#jobs');
        scrollingDiv.mouseover(function() {
            if (timeoutID) {
                window.clearTimeout(timeoutID);
            }
            if (intervalAnimation) {
                window.clearInterval(intervalAnimation);                
            }
        });
        scrollingDiv.mouseout(function() {
            animateData();
        });
        timeoutID = window.setTimeout(function() {
            initPositionData();
            clearTimeout(timeoutID);
        }, 5000);
//        $('a.hideFull').click(function() {
//            /*
//             * doesn't work, yet the one below does...
//             * the link is somehow ignored
//             */
////            logger.debug('ok');
//        });
        $('a.displayFull').click(function() {
            if (intervalAnimation) {
                window.clearInterval(intervalAnimation);                
            }
            $('body').addClass('freeze');
            $clone = $(this).parent().parent().clone();
            var i = 0;
            $children = $clone.children();
            var max = $children.length;
            for(i; i < max; i++) {
                /*
                 * cannot call those jquery methods on $children[i],
                 * error: method does not exist
                 */
//                $children[i].toggleClass('hidden');
//                $children[i].toggleClass('displayed');
                if ($children[i].className.indexOf('hidden') > -1) {
                    $children[i].className = $children[i].className.replace('hidden', 'displayed');
                } else if ($children[i].className.indexOf('displayed') > -1) {
                    $children[i].className = $children[i].className.replace('displayed', 'hidden');
                }
            }
            $('#fullJob').empty();
            $clone.appendTo('#fullJob');
            $('#popup').removeClass('hidden');
        });
//        timeoutID = window.setTimeout(function() {
//            updateStackOrder();
//            $('.slidingTop').animate({top: 0}, 'slow');
//        }, 2000);
//        timeoutID2 = window.setTimeout(function() {
//            window.clearTimeout(timeoutID);
//            $('.slidingTop').animate({top: '-10em'}, 'slow', '', function() {
//                updateStackOrder(true);
//            })
//        }, 10000);
//        $('.slidingTop').hover(
//            function() {
//                window.clearTimeout(timeoutID);
//                window.clearTimeout(timeoutID2);
//                updateStackOrder();
//                $(this).animate({top: 0}, 'slow');
//            },
//            function() {
//                window.clearTimeout(timeoutID);
//                window.clearTimeout(timeoutID2);
//                $(this).animate({top: '-10em'}, 'slow', '', function() {
//                    updateStackOrder(true);
//                });
//                //updateStackOrder(true);
//            }
//        );
//        $('.closeButton').click(
//            function() {
//                window.clearTimeout(timeoutID);
//                window.clearTimeout(timeoutID2);
//                $('.slidingTop').animate({top: '-10em'}, 'slow', '', function() {
//                    updateStackOrder(true);
//                })
//            })
    }
);
    
function hidePopup() {
//    alert('ok');
    $('#popup').addClass('hidden');
    $('body').removeClass('freeze');
}

/**
 * Switch z-index of 'anim'.
 */
function updateStackOrder(up) {
    var elements = getElementsByClassname('anim');
    if (up) {
        up = '1';
    } else {
        up = '-1';
    }
    elements[0].style.zIndex = up;
    return null;
}

/**
 * Returns table of elements matching classname inside specified node.
 * If node not specified, starts at body element.
 * @param classname String
 * @param node Node
 * @return Array
 */
function getElementsByClassname(classname, node) {
    var htmlElementsMatchingClassName = [];
    var regex = new RegExp('\\b' + classname + '\\b');
    var childElementsOfNode;
    var i;
    var max;
    if (!node) {
        node = document.getElementsByTagName('body')[0];
    }
    childElementsOfNode = node.getElementsByTagName('*');
    max = childElementsOfNode.length;
    for (i = 0; i < max; i++) {
        if (regex.test(childElementsOfNode[i].className)) {
            htmlElementsMatchingClassName.push(childElementsOfNode[i]);
        }
    }
    //logger.debug(htmlElementsMatchingClassName.toString());
    return htmlElementsMatchingClassName;
}

/**
 * Switches hidden classes with displayed classes and vice-versa.
 * @param elementCalling Element
 * @return bool
 */
//function displayOffer(elementCalling) {
//    var mainBox = elementCalling.parentNode.parentNode;
//    var mainBoxChilds = mainBox.childNodes;
//    var i = 0;
//    var max = mainBoxChilds.length;
//    for (i; i < max; i++) {
//        if (mainBoxChilds[i].className) {
//            if (mainBoxChilds[i].className.indexOf('hidden') > -1) {
//                mainBoxChilds[i].className = mainBoxChilds[i].className.replace('hidden', 'displayed');
//            } else if (mainBoxChilds[i].className.indexOf('displayed') > -1) {
//                mainBoxChilds[i].className = mainBoxChilds[i].className.replace('displayed', 'hidden');
//            }
//        }
//    }
//    return false;
//}

function initPositionData(offset, isStartingAtBottom) {
    if (!offset) {
        offset = 0;
    }
    if (isStartingAtBottom) {
        scrollingDiv.css('top', containerDiv.height() + 'px');
    } else {
        scrollingDiv.css('top', '0px');
    }
    animateData();
}

function animateData() {
    intervalAnimation = window.setInterval(animation, scrollingSpeed);
}

function animation() {
    if ($('#popup').hasClass('hidden')) {
    var scrollingDivRelativePosition = scrollingDiv.position();
    var scrollingDivHeight = scrollingDiv.height();
    if (scrollingDivRelativePosition.top + scrollingDivHeight < 0) {
        window.clearInterval(intervalAnimation);
        initPositionData(0, true);
    } else {
        scrollingDiv.css('top', '-=' + scrollingHeight);
    }
    }
}