function scrollmap(x,y)
    {
        var mapContainerForm = document.getElementById("mapContainerForm");
        mapContainerForm.scrollTop = y - 100;
        mapContainerForm.scrollLeft = x - 200;
    }
    
    function markEntity(linestroke, bdrawpoints, pointstroke, pictureContainer)
    {
        var hdnMarkTrek = document.getElementById("ctl00_pag_hdnMarkTrek");
        if(hdnMarkTrek != null)
        {
            if(hdnMarkTrek.value == "true")
            {
                marktreks(linestroke, bdrawpoints, pointstroke, pictureContainer);
            }
            else if(hdnMarkTrek.value == "false")
            {
                markpoint(pointstroke);
            }
        }
        
        // Set the values of the screen width and height to the values of some hidden fields, to be used in the adds control.
        setscreendim();
        
        // Set the height value for IE6 browsers that do not support position:fixed.
        var mapContainerBox = document.getElementById("boxB");        
        var hdnScrollTop = document.getElementById("hdnScrollTop");
        hdnScrollTop.value = mapContainerBox.clientHeight;

        
        // Set the height of the map container with respect to the screen resolution.
        SetMapHeightResolutionDependent();
    }
    
    function markpoint(pointstroke)
    {
        modifyMapWidthHeight();
        var hdnCoordsX = document.getElementById("ctl00_pag_hdnCoordsX");
        var pointsCoordX = hdnCoordsX.value;
        var a_all_coordx = new Array();
        a_all_coordx = pointsCoordX.split(",");
        
        var hdnCoordsY = document.getElementById("ctl00_pag_hdnCoordsY");
        var pointsCoordY = hdnCoordsY.value;
        var a_all_coordY = new Array();
        a_all_coordy = pointsCoordY.split(",");        
        
        var hdnPointColors = document.getElementById("ctl00_pag_hdnPointColors");
        var pointColors = hdnPointColors.value;        
        
        var bottomMapSpace = document.getElementById("bottomMapSpace");
        if(bottomMapSpace != null)
        {
            var mapContainerBox = document.getElementById("boxB");
            var mapHeight = mapContainerBox.clientHeight;
            bottomMapSpace.style.paddingTop = (mapHeight+60) + "px";            
        }
        
        var hdnPointDimm = document.getElementById("ctl00_pag_hdnPointDimm");
        var fontDimm = parseInt(hdnPointDimm.value);
        
        var hdnPointsNames = document.getElementById("ctl00_pag_hdnPointsNames");
        var pointsNames = hdnPointsNames.value;
        var a_all_pointsnames = pointsNames.split(",");
        
        var focusx = 0;
        var focusy = 0;
        for(var i=0; i< a_all_coordx.length; i++)
        {
            focusx = parseInt(a_all_coordx[i]);
            focusy = parseInt(a_all_coordy[i]);
            jg.setColor("#" + pointColors);
            jg.fillEllipse(parseInt(a_all_coordx[i]) - (fontDimm),parseInt(a_all_coordy[i])- (fontDimm),pointstroke*3,pointstroke*3);
            jg.paint();
        }
        
        for(var i=0; i< a_all_coordx.length; i++)
        {
            jg.setColor("#FF0080");
            jg.setFont("tahoma",fontDimm + "px",Font.BOLD);
            var pointName = "";
            pointName = a_all_pointsnames[i];
            jg.drawString(pointName, parseInt(a_all_coordx[i]) + (fontDimm*1.5),parseInt(a_all_coordy[i]) - (fontDimm/4));
            jg.paint();
        }
        
        if(focusx != null || focusy != null)
        {
            var mapContainerForm = document.getElementById("mapContainerForm");
            mapContainerForm.scrollTop = focusy - 100;
            mapContainerForm.scrollLeft = focusx - 200;
        }
        
        var legend = document.getElementById("legend");
        legend.className = "display_none";
    }
    
    function marktreks(linestroke, bdrawpoints, pointstroke, pictureContainer)
    {
        modifyMapWidthHeight();
    
        var hdnCoordsX = document.getElementById("ctl00_pag_hdnCoordsX");
        var pathsCoordX = hdnCoordsX.value;
        var a_all_coordx = new Array();
        a_all_coordx = pathsCoordX.split("+");
        
        var hdnCoordsY = document.getElementById("ctl00_pag_hdnCoordsY");
        var pathsCoordY = hdnCoordsY.value;
        var a_all_coordy = new Array();
        a_all_coordy = pathsCoordY.split("+");
        
        var hdnLineColors = document.getElementById("ctl00_pag_hdnLineColors");
        var lineColors = hdnLineColors.value;
        var a_lineColors = new Array();
        a_lineColors = lineColors.split(",");
        
        var hdnPointColors = document.getElementById("ctl00_pag_hdnPointColors");
        var pointColors = hdnPointColors.value;
                
        var bottomMapSpace = document.getElementById("bottomMapSpace");
        if(bottomMapSpace != null)
        {
            var mapContainerBox = document.getElementById("boxB");
            var mapHeight = mapContainerBox.clientHeight;
            bottomMapSpace.style.paddingTop = (mapHeight+60) + "px";            
        }
        
        for(var i=0; i<a_all_coordx.length;i++)
        {
            markportions(linestroke, a_lineColors[i], bdrawpoints, pointstroke, pointColors, a_all_coordx[i], a_all_coordy[i]);
            
            // Used to focus the map on the first point on the firs trek that has valid coordinates.
            var focusx = 0;
            var focusy = 0;
            var focusCoordinatesx = a_all_coordx[i];
                
            var a_focusCoordintes = new Array();
            a_focusCoordintesx = focusCoordinatesx.split(",");
            focusx = parseInt(a_focusCoordintesx[i]);
            focusx = focusx - 200;
            
            var focusCoordinatesy = a_all_coordy[i]
            var a_focusCoordinatesy = focusCoordinatesy.split(",");
            var focusy = parseInt(a_focusCoordinatesy[i]);
            focusy = focusy - 30;
            
            if(focusx != null || focusy != null)
            {
                var mapContainerForm = document.getElementById("mapContainerForm");
                mapContainerForm.scrollTop = focusy;
                mapContainerForm.scrollLeft = focusx;
            }
        }
        
        writepoints();
    }
    
    function markportions(linestroke, linecolor, bdrawpoints, pointsstroke, pointscolor, allcoordx, allcoordy)
    {
        var pathsCoordX = allcoordx;
        var a_all_coordx = new Array();
        a_all_coordx = pathsCoordX.split("|");
        
        var pathsCoordY = allcoordy;
        var a_all_coordy = new Array();
        a_all_coordy = pathsCoordY.split("|");
        
        for(var i=0;i<a_all_coordx.length;i++)
        {
            markpaths(linestroke, linecolor, bdrawpoints, pointsstroke, pointscolor, a_all_coordx[i], a_all_coordy[i]);
        }
    }
    
    function markpaths(linestroke, linecolor, bdrawpoints, pointsstroke, pointscolor, coordx, coordy)
    {
      // Remove the last comma if it exists in the string.
      var endscomma_x =/,$/.test(coordx)
      var endscomma_y =/,$/.test(coordy)      
      if(endscomma_x){
        coordx = coordx.replace(/,$/,"");
      }      
      if(endscomma_y){
        coordy = coordy.replace(/,$/,"");
      }
      
      // Create string arrays of coordinates.
      var a_coordx = new Array();
      a_coordx = coordx.split(",");
      
      var a_coordy = new Array();
      a_coordy = coordy.split(",");
      
      // Parse from string to int.
      var a_coordx_int = new Array();
      for(var i=0; i<a_coordx.length; i++)
      {
        a_coordx_int.push(parseInt(a_coordx[i]));
      }
      var a_coordy_int = new Array();
      for(var i=0; i<a_coordy.length; i++)
      {
        a_coordy_int.push(parseInt(a_coordy[i]));        
      }
      
      // Set the stroke and the color for the lines.
      jg.setStroke(parseInt(linestroke));
      jg.setColor("#" + linecolor);
            
      // Draw the polyline.
      jg.drawPolyline(a_coordx_int,a_coordy_int);
      jg.paint();
      
      // Draw the point.
      drawPoint(a_coordx_int, a_coordy_int, pointsstroke, pointscolor, false);
      drawPoint(a_coordx_int, a_coordy_int, pointsstroke, pointscolor, true);
      
      jg.paint();
    }
    
    function drawPoint(a_coordx_int, a_coordy_int, pointdiameter, pointscolor, drawArr)
    {
        var pointindex = 0;
        if(drawArr == true)
        {
            pointindex = a_coordx_int.length - 1;
        }
        else
        {
            pointindex = 0;
        }
    
        var pointadjustmentfactor = pointdiameter * 0.35
        var pointcoordx = parseInt(a_coordx_int[pointindex])-pointadjustmentfactor;
        var pointcoordy = parseInt(a_coordy_int[pointindex])-pointadjustmentfactor;
        // Set the the color for the points.
        
        jg.setColor("#" + pointscolor);
        jg.fillEllipse(pointcoordx,pointcoordy,pointdiameter,pointdiameter);
        jg.paint();
    }
    
    function writepoints()
    {   
        var hdnPointDimm = document.getElementById("ctl00_pag_hdnPointDimm");
        var fontDimm = parseInt(hdnPointDimm.value);
        
        var hdnPointsNames = document.getElementById("ctl00_pag_hdnPointsNames");
        var allPointNames = hdnPointsNames.value;
        
        var a_allPointNames = new Array();
        a_allPointNames = allPointNames.split("+");
        
        for(var t=0; t<a_allPointNames.length;t++)
        {
            var portionPointsNames = a_allPointNames[t];
            var portionPointNameDetails = new Array();
            portionPointNameDetails = portionPointsNames.split("|");
            
            for(var u=0; u<portionPointNameDetails.length;u++)
            {                
                var portionPointsNameProperties = portionPointNameDetails[u];
                var portionPointsNameDetProperties = new Array();
                portionPointsNameDetProperties = portionPointsNameProperties.split(",");
                
                for(var v=0; v< portionPointsNameDetProperties.length;v++)
                {
                    var finalPointNames = portionPointsNameDetProperties[v];
                    var finalPointPointsDet = new Array();
                    finalPointPointsDet = finalPointNames.split(":");
                    
                    var pointNameHtml = "<wp>" +  finalPointPointsDet[0] + "</wp>";
                    jg.setColor("#000000");
                    jg.setFont("tahoma",fontDimm + "px",Font.BOLD);
                    jg.drawString(pointNameHtml,parseInt(finalPointPointsDet[1]) + (fontDimm/2), parseInt(finalPointPointsDet[2]) - (fontDimm/4));
                }
            }
        }
        jg.paint();
    }
    
    var jg = new jsGraphics("anotherCanvas");
    
    function modifyMapWidthHeight()
    {
        var myCanvas = document.getElementById("myCanvas");
        var hdnPointWidth = document.getElementById("ctl00_pag_hdnPointWidth");
        var hdnPointHeight = document.getElementById("ctl00_pag_hdnPointHeight");
        
        myCanvas.style.width = hdnPointWidth.value;
        myCanvas.style.height = hdnPointHeight.value;
    }
    
function scrollMapIE6()
{
    var browserName = navigator.appName;
    var browserVer = parseInt(navigator.appVersion);
//    
//    alert(browserName);
//    alert(browserVer);
    
    if(browserName == 'MicrosoftInternetExplorer' && browserVer < 4)
    {
        var y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
        var boxB = document.getElementById("boxB");
        var hdnScrollTop = document.getElementById("hdnScrollTop");
        var adjustementVertical = parseInt(hdnScrollTop.value);
        //y = parseInt(y/1.1);
        var top = y - adjustementVertical + 120;
        var boxbTop = parseInt(boxB.style.top);
        boxB.style.top= top;
    }
}

function SetMapHeightResolutionDependent()
{
    // Set the height of the map container with respect to the screen resolution.
        var mapContainerForm = document.getElementById("mapContainerForm");
        
        var resolution = screen.height;
        var resolutions = new Array();
        resolutions.push(1024);
        resolutions.push(960);
        resolutions.push(864);
        resolutions.push(768);
        resolutions.push(720);
        resolutions.push(600);
        
        var currentResolution = 0;
        
        for(var i=0; i< resolutions.length; i++)
        {
            if(resolutions[i] == resolution)
            {
                currentResolution = resolutions[i];
            }
        }
        
        mapContainerForm.className = mapContainerForm.className + " " + mapContainerForm.className + currentResolution;
}