var scrollableAreas;

function drawMapImages() {
    scrollableAreas = new Array()

    var maps = document.getElementsByTagName("map");

    if (maps.length > 0) {
                if ($("mainForm:centerPanelScrollArea").onscroll == null) {
                     $("mainForm:centerPanelScrollArea").onscroll = scrollMapAreas;
                }
        for (var i = 0; i < maps.length; i++) {
            var map = maps[i];
                scrollableAreas[scrollableAreas.length] = map.parentNode.parentNode;
            }
    }
}

function selectElement(elementId) {
    if (!borderEffect) {
        borderEffect = new Array();
    }

    var elements = document.getElementsByTagName("textarea");
    for (var i = 0; i < elements.length; i++) {
        if (elements[i].className == elementId) {
            if (!elements[i].disabled) {
            elements[i].focus();
            }
            
            var index = borderEffect.length;
            borderEffect[borderEffect.length] = new BorderEffect(elements[i], index);
            break;
        }
    }

    elements = document.getElementsByTagName("input");
    for (i = 0; i < elements.length; i++) {
        if (elements[i].className == elementId) {
            elements[i].style.display = "";
            elements[i].focus();
            elements[i].style.display = "none";
        }
    }

    elements = document.getElementsByTagName("table");
    for (i = 0; i < elements.length; i++) {
        if (elements[i].className == elementId) {
            //            if (effectHandler!=null) effectHandler.close();

            index = borderEffect.length;
            borderEffect[borderEffect.length] = new BorderEffect(elements[i], index);
        }
    }
}


function scrollMapAreas(){
    if (!$("mainForm:centerPanelScrollArea")) {
        return;
    }

    var scrollTop = $("mainForm:centerPanelScrollArea").scrollTop;

    for (var i = 0; i < scrollableAreas.length; i++) {
        var imageHeight = scrollableAreas[i].clientHeight;
        var areaHeight = scrollableAreas[i].parentNode.parentNode.clientHeight;

        var totalHeight = 0;
        for (var j = 0; j < i; j++) {
            totalHeight += scrollableAreas[j].parentNode.parentNode.clientHeight;
        }

        if (scrollTop - totalHeight + imageHeight < areaHeight) {
            var newY = scrollTop - totalHeight;

            if (newY < 0) {
                newY = 0;
            } else {
            }

            scrollableAreas[i].style.top = newY + "px"
        }
    }
}

var borderEffect;

function BorderEffect(el, index) {
    this.index = index;
    this.effectElement = el;
    this.effectOn = false;
    this.maxEffectCount = 10;

    this.oldState1 = this.effectElement.style.borderStyle;
    this.oldState2 = this.effectElement.style.borderColor;

    this.effectHandler = setInterval("showEffect(" + this.index + ")", 100)

    this.on = function() {
        this.effectElement.style.borderStyle = "dotted";
        this.effectElement.style.borderColor = "black";
        this.effectOn = false;
    }
    this.off = function () {
        this.effectElement.style.borderStyle = "solid";
        this.effectElement.style.borderColor = "black";
        this.effectOn = true;
    }

    this.change = function () {
        if (this.effectOn) {
            this.on();
        } else {
            this.off();
        }
        this.maxEffectCount--;

        if (this.maxEffectCount < 0) {
            this.restore();
            clearInterval(this.effectHandler);
        }
    }

    this.restore = function () {
        this.effectElement.style.borderStyle = this.oldState1;
        this.effectElement.style.borderColor = this.oldState2;
    }
}

function showEffect(index) {
    borderEffect[index].change();
}