var mapImage = document.getElementById('ctl00_ZHPlanDesign_ZHPlanTabControl_MapImage_imgBtnMap');
    var readyPan = false;

    function setPanHeight()
    {
        if (document.getElementById('Pan2_0'))
        {
            mapHeight = (screenHeight() + 3);
            document.getElementById('Pan2_0').style.height = ((mapHeight / 4) * 2) + 'px';
            document.getElementById('Pan2_1').style.height = ((mapHeight / 4) * 2) + 'px';
            document.getElementById('Pan1_0').style.height = (mapHeight / 4) + 'px';
            document.getElementById('Pan1_2').style.height = (mapHeight / 4) + 'px';
            document.getElementById('Pan3_0').style.height = (mapHeight / 4) + 'px';
            document.getElementById('Pan3_1').style.height = (mapHeight / 4) + 'px';
        }
    }

    function highlight(col, evt) 
    {
        var evt = (evt) ? evt : ((window.event) ? event : null);
        var mouseOverColor = '#DDD7D7';
                
        if (col.id == 'Pan0_0' || col.id == 'Pan0_1' || col.id == 'Pan1_0')
        {
            document.getElementById('Pan0_0').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan0_1').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan1_0').style.backgroundColor = mouseOverColor;
        }
        else if (col.id == 'Pan0_3' || col.id == 'Pan0_4' || col.id == 'Pan1_2')
        {
            document.getElementById('Pan0_3').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan0_4').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan1_2').style.backgroundColor = mouseOverColor;
        }
        else if (col.id == 'Pan3_0' || col.id == 'Pan4_0' || col.id == 'Pan4_1')
        {
            document.getElementById('Pan3_0').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan4_0').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan4_1').style.backgroundColor = mouseOverColor;
        }
        else if (col.id == 'Pan3_1' || col.id == 'Pan4_4' || col.id == 'Pan4_3')
        {
            document.getElementById('Pan3_1').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan4_4').style.backgroundColor = mouseOverColor;
            document.getElementById('Pan4_3').style.backgroundColor = mouseOverColor;
        }
        else
            col.style.backgroundColor = mouseOverColor;
    }

    function delight(col, evt) 
    {
        var evt = (evt) ? evt : ((window.event) ? event : null);
        var mouseOutColor = '#FFFFFF';

        if (col.id == 'Pan0_0' || col.id == 'Pan0_1' || col.id == 'Pan1_0')
        {
            document.getElementById('Pan0_0').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan0_1').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan1_0').style.backgroundColor = mouseOutColor;
        }
        else if (col.id == 'Pan0_3' || col.id == 'Pan0_4' || col.id == 'Pan1_2')
        {
            document.getElementById('Pan0_3').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan0_4').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan1_2').style.backgroundColor = mouseOutColor;
        }
        else if (col.id == 'Pan3_0' || col.id == 'Pan4_0' || col.id == 'Pan4_1')
        {
            document.getElementById('Pan3_0').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan4_0').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan4_1').style.backgroundColor = mouseOutColor;
        }
        else if (col.id == 'Pan3_1' || col.id == 'Pan4_4' || col.id == 'Pan4_3')
        {
            document.getElementById('Pan3_1').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan4_4').style.backgroundColor = mouseOutColor;
            document.getElementById('Pan4_3').style.backgroundColor = mouseOutColor;
        }
        else
            col.style.backgroundColor = mouseOutColor;
        
        if (terminate == false)
            terminateTimer(evt);
          
    }
    
    var timerID = null;
    var terminate = false;
    var started = false;
    var topAction = '';
    var leftAction = '';
    var top = 0;
    var left = 0;
    var step = 10;                  //Der Schritt in Pixel
    var leftClickSpeed = 400;       //Mausklick dauer bis zum dynamischen verschieben
    var panSpeed = 50;              //Dauer des durchganges(um Step verschieben)
    var speed = panSpeed;
    var i;
    var mapWidth = 0;               //Sprung bei klick(wir initialisiert in initialiseTimer(col))
    var mapHeight = 0;              //Sprung bei klick(wir initialisiert in initialiseTimer(col))
    var mapImageShiftX = document.getElementById ('ctl00_ZHPlanDesign_ZHPlanTabControl_MapImage_PanImageShiftX');
    var mapImageShiftY = document.getElementById ('ctl00_ZHPlanDesign_ZHPlanTabControl_MapImage_PanImageShiftY');
    
    function initialiseTimer(col, evt) {
        var evt = (evt) ? evt : ((window.event) ? event : null);
        
        i = 0;
        mapWidth = parseInt(screenWidth() / 3);
        mapHeight = parseInt(screenHeight() / 3);
        started = true;

        if (terminate == false && eventAvailable == true)
        {        
            if (col.id == 'Pan0_0' || col.id == 'Pan0_1' || col.id == 'Pan1_0')
                timerID = window.setTimeout('panTopLeft()',0);
            else if (col.id == 'Pan0_2')
                timerID = window.setTimeout('panTop()',0);
            else if (col.id == 'Pan0_3' || col.id == 'Pan0_4' || col.id == 'Pan1_2')
                timerID = window.setTimeout('panTopRight()',0);
            else if (col.id == 'Pan2_0')
                timerID = window.setTimeout('panLeft()',0);
            else if (col.id == 'Pan2_1')
                timerID = window.setTimeout('panRight()',0);
            else if (col.id == 'Pan3_0' || col.id == 'Pan4_0' || col.id == 'Pan4_1')
                timerID = window.setTimeout('panBottomLeft()',0);
            else if (col.id == 'Pan4_2')
                timerID = window.setTimeout('panBottom()',0);
            else if (col.id == 'Pan3_1' || col.id == 'Pan4_4' || col.id == 'Pan4_3')
                timerID = window.setTimeout('panBottomRight()',0);
        }
    }

    function terminateTimer(evt) {
        var evt = (evt) ? evt : ((window.event) ? event : null);
                
        if (started == true)
        {
            terminate = true;
        
            if (i == 1)
            {
                if (leftAction == '-')
                    mapImageShiftX.value = '-' + mapWidth;
                else if (leftAction == '+')
                     mapImageShiftX.value = mapWidth;
                else if (leftAction == '=')
                     mapImageShiftX.value = 0;
            }
            else
                mapImageShiftX.value = left;

            if (i == 1)
            {
                if (topAction == '-')
                    mapImageShiftY.value = '-' + mapHeight;
                else if (topAction == '+')
                    mapImageShiftY.value = mapHeight;
                else if (topAction == '=')
                    mapImageShiftY.value = 0;
            }
            else
                mapImageShiftY.value = top;

            theForm.__IMAGEMAP_TYPE.value = "pan";
            showSplashImage();
            //abfangen ie firefox
            if (document.all && document.documentElement && !window.opera)       
                mapImage.click();
            else
                makeMozClick(evt); 
            
            window.clearTimeout(timerID);
        }
    }
             
    function panTopLeft() {
        if (i > 0)
        {
            speed = panSpeed;
            left = left + step;
            top = top + step;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '+';
            topAction = '+';
        }
        
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        
        i++;
        
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px'; 
        }
        shiftRubLayers (left, top);
        
        timerID = window.setTimeout('panTopLeft()',speed);
    }
    
    function panTopRight() {
        if (i > 0)
        {
            speed = panSpeed;
            left = left - step;
            top = top + step;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '-';
            topAction = '+';
        }
        
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);

        timerID = window.setTimeout('panTopRight()',speed);
    }
    
    function panBottomLeft() {
        if (i > 0)
        {
            speed = panSpeed;
            left = left + step;
            top = top - step;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '+';
            topAction = '-';
        }
            
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);

        timerID = window.setTimeout('panBottomLeft()',speed);
    }
    
    function panBottomRight() {
        if (i > 0)
        {
            speed = panSpeed;
            left = left - step;
            top = top - step;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '-';
            topAction = '-';
        }
            
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);

        timerID = window.setTimeout('panBottomRight()',speed);
    }
    
    function panTop() {
        if (i > 0)
        {
            speed = panSpeed;
            left = left + 0;
            top = top + step;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '=';
            topAction = '+';
        }
            
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);

        timerID = window.setTimeout('panTop()',speed);
    }
    
    function panBottom() {
        if (i > 0)
        {
            speed = panSpeed;
            left = left + 0;
            top = top - step;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '=';
            topAction = '-';
        }
            
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);

        timerID = window.setTimeout('panBottom()',speed);
    }
    
    function panLeft () {
        if (i > 0)
        {
            speed = panSpeed;
            left = left + step;
            top = top + 0;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '+';
            topAction = '=';
        }
            
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);
            
        timerID = window.setTimeout('panLeft()',speed);
    }
    
        function panRight () {
        if (i > 0)
        {
            speed = panSpeed;
            left = left - step;
            top = top + 0;
        }
        else
        {
            speed = leftClickSpeed;
            leftAction = '-';
            topAction = '=';
        }
            
        mapImage.style.left = left + 'px';
        mapImage.style.top = top + 'px';
        i++;
        if (poiFrameVisible == true) 
        {
            document.getElementById('POIDisplay').style.left = poiFrameInitialX + left + 'px';
            document.getElementById('POIDisplay').style.top = poiFrameInitialY + top + 'px';
        }
        shiftRubLayers (left, top);

        timerID = window.setTimeout('panRight()',speed);
    }