﻿// JScript File

var _pointA =null;
var _pointB =null;
var map;
var _pointName =null;
var _route =null;
var _pointS

Sys.Application.add_load(Global);
function AddPointA(PointName)
{
        // chech if map is null because it called again in call backs
      if(map == null)
      return;
    map.getGeometry(ESRI.ADF.Graphics.ShapeType.Point, DrawPoint, null, null, null, 'pointer', true);
    _pointName =PointName;    
}
function DrawPoint(geometry, eventArgs)
{    
    var graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(geometry, adfMarkerSymbol, null);
     var xCoord = geometry.get_x();
    var yCoord = geometry.get_y();
    if(_pointName == 'A')
    {
         var adfMarkerSymbol = new ESRI.ADF.Graphics.MarkerSymbol("../ar/images/start.gif", 12, 12, "hand"); 
         adfMarkerSymbol.set_centerX(20);
         adfMarkerSymbol.set_centerY(23);
         graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(geometry, adfMarkerSymbol, null);
         map.addGraphic(graphicFeature); 
         if(_route!=null)
         {
            map.removeGraphic(_route); 
         }
        if(_pointA != null)
        {
            map.removeGraphic(_pointA); 
            
        }
        _pointA =  graphicFeature;
        document.getElementById("DrivingDirection1_txtHPointA").value = xCoord + ";" + yCoord;
        document.getElementById("DrivingDirection1_txtStartPoint").value = "نقطة أ";
        
    }
    
    if(_pointName == 'B')
    {

         var adfMarkerSymbol = new ESRI.ADF.Graphics.MarkerSymbol("../ar/images/end.gif", 12, 12, "hand");
         adfMarkerSymbol.set_centerX(20);
         adfMarkerSymbol.set_centerY(23);
         graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(geometry, adfMarkerSymbol, null); 
         map.addGraphic(graphicFeature);
         if(_route!=null)
         {
            map.removeGraphic(_route); 
         }
        if(_pointB != null)
        {
            map.removeGraphic(_pointB); 
        }
        _pointB =  graphicFeature;
        document.getElementById("DrivingDirection1_txtHPointB").value = xCoord + ";" + yCoord;
        document.getElementById("DrivingDirection1_txtEndPoint").value = "نقطة ب";
        switchControl("DD");
    }
    if(_pointName == 'S')//service point
    {
     var adfMarkerSymbol = new ESRI.ADF.Graphics.MarkerSymbol("../ar/images/service.GIF", 12, 12, "hand");
         adfMarkerSymbol.set_centerX(10);
         adfMarkerSymbol.set_centerY(25);
         graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(geometry, adfMarkerSymbol, null); 
         map.addGraphic(graphicFeature);
        if(_pointS != null)
        {
            map.removeGraphic(_pointS); 
        }
        _pointS =  graphicFeature;
        document.getElementById("fpAddService_AddNewService1_txtHpointService").value = xCoord + ";" + yCoord;
        //alert(document.getElementById("fpAddService_AddNewService1_txtHpointService").value);
    }
    
}

function DrawRout(points,xmax,ymax,xmin,ymin)
    {
       
        var pointColl = new ESRI.ADF.Geometries.CoordinateCollection();
        var Arr = points.split(';');
        for (p=0; p < Arr.length ;p++)
        {
            var po = Arr[p].split(',');
            pointColl.add(po);    
        }
        
       var route = new ESRI.ADF.Geometries.Polyline(pointColl,map.get_spatialReference());
        var adfMarkerSymbol = new ESRI.ADF.Graphics.LineSymbol("RED",6);
        adfMarkerSymbol.set_opacity(0.5);
//        var id = "55"
//        var graphicFeature = $create(ESRI.ADF.Graphics.GraphicFeature,{"id":id,"geometry":route,"symbol":adfMarkerSymbol});
         var graphicFeature =new ESRI.ADF.Graphics.GraphicFeature(route, adfMarkerSymbol, null);
         if(_route !=null)
         {
             map.removeGraphic(_route); 
         }
         map.addGraphic(graphicFeature);
        _route = graphicFeature;
//               
           //var env = graphicFeature.getEnvelope();
  
        var env = new ESRI.ADF.Geometries.Envelope(xmin,ymin,xmax,ymax);
         map.zoomToBox(env,false);
         
         //to return to toolbar1
         var tbObject = $find('Toolbar1');                    
			        if (tbObject!=null) {
                       var handler = tbObject.get_events().getHandler('onToolSelected');
                       if(handler) 
                            handler(tbObject,{"name": "Toolbar1MapZoomIn1", "tool": document.getElementById("Toolbar1MapZoomIn1")});
                            }
        
    }
    
  function  newRoute()
  {
    if(_route !=null)
        {
          map.removeGraphic(_route); 
        }
    if(_pointB != null)
        {
         map.removeGraphic(_pointB); 
        }
    if(_pointA != null)
        {
         map.removeGraphic(_pointA); 
        }
        
         document.getElementById("DrivingDirection1_txtHPointA").value = "";
         document.getElementById("DrivingDirection1_txtHPointB").value = "";
         
  }
function DrawDDPoints()
{
    
        //point A
        var geometry = new  ESRI.ADF.Geometries.Point(); 
        var arr = document.getElementById("DrivingDirection1_txtHPointA").value.split(";")
        geometry.set_x(parseFloat(arr[0]));
        geometry.set_y(parseFloat(arr[1]));
        
         var adfMarkerSymbol = new ESRI.ADF.Graphics.MarkerSymbol("../ar/images/start.gif", 12, 12, "hand"); 
             adfMarkerSymbol.set_centerX(20);
             adfMarkerSymbol.set_centerY(23);
             graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(geometry, adfMarkerSymbol, null);
             map.addGraphic(graphicFeature); 
             if(_pointA)
             map.removeGraphic(_pointA); 
            _pointA =  graphicFeature;

              //point B
             geometry = new  ESRI.ADF.Geometries.Point();
             var arr2 = document.getElementById("DrivingDirection1_txtHPointB").value.split(";")
             geometry.set_x(parseFloat(arr2[0]));
             geometry.set_y(parseFloat(arr2[1]));
                
             adfMarkerSymbol = new ESRI.ADF.Graphics.MarkerSymbol("../ar/images/end.gif", 12, 12, "hand");
             adfMarkerSymbol.set_centerX(20);
             adfMarkerSymbol.set_centerY(23);
             graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(geometry, adfMarkerSymbol, null); 
             map.addGraphic(graphicFeature);
             if(_pointB)
             map.removeGraphic(_pointB); 
            _pointB =  graphicFeature; 
        
}
function Global()
{
    if(map == null)
    {
        
        map = $find('Map1');
        //map.checkMapsize(true);
   }
   //this part to help in closing Messure
        var toolbar = $find("Toolbar1");
		if (toolbar!=null)
		{
		    toolbar.add_onToolSelected(OnToolSelectHandler);
		}
   
}

//**********DrawBAllons*******Search services**************************
var _oldpoints = [];
function DrawBallons(pointsData,httpPath)
{
   // alert(pointsData);
//	alert(httpPath);
	 map = $find('Map1');
    RemoveBallons();
     try
    {
       arr= pointsData.split(";")
       for(var z=0;z<arr.length-7;z=z+7)
        {  
    
             
 var TitleContent = "<font color='#000000' style='font-size:10px;font-weight:normal;font-family:Tahoma;'>"+arr[z+3]+" </font>";
             
             var DescContent ="";
             if(arr[z+6]!="") // if no image dont concatenate image tag
             {    
                 DescContent = DescContent + " <div align=center><img src='" + httpPath + arr[z+6] +"' style='border: solid 1px gray;padding:3px;width:120px;height:80px;padding-top:2px'></div>";
             }
              DescContent = DescContent + "<div dir='rtl' style='padding:3px;text-align:justify' align=right><font color='#444444' style='font-size:10px;font-weight:bold;font-family:Tahoma;'>"+arr[z+3]+"</font><br>";
              if(arr[z+4]!="") // if no phone 
             { 
               DescContent = DescContent + "<font color='#444444' style='font-size:10px;font-weight:;font-family:Tahoma;'><b> هاتف : </b>" +arr[z+4] + "</font>";
               
             }
		


            DescContent = DescContent + "<br><font color='#444444' style='font-size:10px;font-weight:;font-family:Tahoma;'>"+arr[z+5]+"</font></div> " ;
   
         
      
		 var point = new ESRI.ADF.Geometries.Point(arr[z+1],arr[z+2],map.get_spatialReference());
 
		   
		var imagUrl = "images/Flages/0.png";
         
		if(arr[z] <= 50)
         {
            imagUrl = "images/Flages/" + arr[z] +".png"
         }
        
		 var adfMarkerSymbol = new ESRI.ADF.Graphics.MarkerSymbol(imagUrl, 12, 12, "hand");


         //adfMarkerSymbol.set_centerX(20); // need to set to djust ballon
        // adfMarkerSymbol.set_centerY(23);
	
          var attributes = new Object;
          attributes.title= TitleContent;
          attributes.content = DescContent;
          attributes.id=z;
		
          graphicFeature = new ESRI.ADF.Graphics.GraphicFeature(point, adfMarkerSymbol, attributes); 
          //graphicFeature.id = z;
          
         map.addGraphic(graphicFeature);

         _oldpoints[_oldpoints.length]= graphicFeature;
         graphicFeature.add_mouseOver(graphicMouseOverHandler);
         graphicFeature.add_mouseOut(graphicMouseOutHandler);
        graphicFeature.add_click(graphicClickHandler);
             
        } 
    }
    catch(ee)
    {
        //alert(arr[i])
    }
 
    
}
function RemoveBallons()
{
    if(_oldpoints!=null || _oldpoints.length > 0)
    {
        for(var x=0;x<_oldpoints.length;x++)
        {
            map.removeGraphic(_oldpoints[x]);
        }
    }
}

function graphicMouseOverHandler(sender, eventArgs)
{


  //   hideAllCallouts();//ADDED BY ZIZO TO REMOVE ANY CALLOUT FROM BALLONS
   
    m_oldCursor = map.get_cursor();
    
    // If a pointer cursor is not currently in use, set the cursor style to pointer.  Note that the
    // current cursor style is saved in m_oldCursor so it can be reverted to.
    if (m_oldCursor != 'pointer')
        map.set_cursor('pointer');
    
    // Get the custom attributes from the graphic feature that intiated the event.  The object returned
    // is the attributes object that was passed into the feature graphic's constructor in the AddPoint function
    var graphicFeatureAttributes = sender.get_attributes();
    
    //===Create HTML elements specifying the content and format of the callout===
    
    // Create a table cell and assign it text specifying the location of the graphic point that initiated
    // the event
    var tableCell = document.createElement('td');
    tableCell.innerHTML = graphicFeatureAttributes.title;
    // Specify the style attribute needed to prevent text wrapping
    tableCell.style.whiteSpace = 'nowrap';
    
    //image cell
    var tableCell2 = document.createElement('td');
    tableCell2.innerHTML = "<img src='images/up_arrow.gif'>";
    // Specify the style attribute needed to prevent text wrapping
    tableCell2.style.whiteSpace = 'nowrap';
    
    // Create a table row and table body to encapsulate the table cell
    var tableRow = document.createElement('tr');
    tableRow.appendChild(tableCell);
    
     tableRow.appendChild(tableCell2);
    
        
    var tableBody = document.createElement('tbody');
    tableBody.appendChild(tableRow);
    
    
    // Create a table element and use its style properties to format the callout as desired
    var table = document.createElement('table');
    table.appendChild(tableBody);
    table.style.backgroundColor = 'white';
    table.style.borderStyle = 'solid';
    table.style.borderColor = '#F45B0D';
    table.style.borderWidth = '1px'; 
    table.style.fontFamily = 'Arial';
    table.style.fontSize = '10pt';
    table.style.fontWeight = 'bold';
    table.style.cellPadding = '1px';
    table.style.direction = "rtl"

    // declare a variable that will be used to store a reference to the Web ADF JavaScript Callout object                    
    var callout;
    
    // Get the HTML div containing the map object.  Note that to do this, we simply use the global AJAX
    // shortcut function $get, as opposed to $find.
    var mapDiv = $get('Map1');
    
    // Check whether a callout has already been created for the graphic feature.  If so, a callout property
    // will exist on the graphic feature's custom attributes object.
    if (!graphicFeatureAttributes.callout)
    {
        // Create a new Web ADF JavaScript Callout object, specifying the map's div as the callout's parent                
        callout = new ESRI.ADF.UI.Callout(mapDiv);
        
        // The callout will not function without calling initalize
        callout.initialize();
        
        // Set the amount of time the callout will remain visible after the mouse cursor is over neither
        // the graphic point nor the callout.  This is specified in milliseconds.
        callout.set_hideDelayTime(1000);
        
        // Set whether or not the callout will automatically disappear when the mouse cursor leaves the
        // graphic point and the callout.  If true, the callout will first remain visible for the amount
        // of time specified in a call to set_hideDelayTime.
        callout.set_autoHide(true);
        
        //set calout arrow image 
        //callout.set_arrowImageUrl("../ar/images/00.png");
       var url = callout.get_arrowImageUrl();
        // Set which corner of the callout will be used as the anchor point.  To have the callout appear
        // up and to the right of the point, we specify an anchor point value of BottomLeft.
        callout.set_anchorPoint(ESRI.ADF.UI.AnchorPoint.BottomLeft);
        
        // Specify whether the callout will fade in and out.
        callout.set_animate(true);
        
        // Specify an event handler for when the callout is clicked.  The handler specified here will expand
        // the callout, displaying the time the point was created in addition to the point's location.
        callout.add_click(calloutClickHandler);
        
        
        // Add a property to the graphics feature's custom attributes object storing a reference to the callout
        graphicFeatureAttributes.callout = callout;
   
        // Add a custom property to the callout storing a reference to the graphics feature
        callout.attributes = graphicFeatureAttributes;
        
        // Display the callout
        callout.show();
   
    }
    else if (graphicFeatureAttributes.callout.get_isOpen())
    {
        // The callout is already open, so no further processing need be done.  This avoids the possibility
        // that an expanded callout would be reformatted to its smaller version while the callout is visible.
        return;
    } 
    else
    {
        // Since the callout has already been created, we can skip the creation code in the first branch
        // of the if block
        graphicFeatureAttributes.callout.show();
        callout = graphicFeatureAttributes.callout;
    }    
    
    // Specify the content of the callout.  This is done via the callout object's setContent method,
    // which pulls the content from a property named "content" on the passed-in object.
    var content = new Object;
    content.content = table.outerHTML;
    callout.setContent(content);
    
    // Get the geometry of the graphic feature
    var adfPoint = sender.get_geometry();

    // Convert the feature geometry to screen coordinates.  Note that these screen coordinates are relative
    // to the map object - they do not account for the distance between the map and the top and left of the
    // browser window
    var screenPoint = map.toScreenPoint(adfPoint);

    // Use the findElementPostion utility function to retrieve the offset of the map from the top and left
    // of the browser window.  Note that this function operates on HTML elements, so we pass it the map's
    // div, rather than the map object.
    var mapPosition = findElementPosition(mapDiv);                    
    
    // Set the position of the object by summing the screen coordinates of the click geometry and the
    // offset of the map div.        
    callout.setPosition(screenPoint.offsetX + mapPosition[0], screenPoint.offsetY + mapPosition[1]);    
}

function calloutClickHandler(sender, eventArgs)
{    
    // Call the function that expands the callout
    expandCallout(sender);
}
function expandCallout(callout)
{   
    // Get the custom attributes of the graphic feature point associated with the callout.  This is done
    // by accessing a custom property on the callout that was added when the callout was created in the
    // graphicMouseOverHandler function.
    var graphicFeatureAttributes = callout.attributes;
    // ===Create an HTML table specifying the content and format of the expanded callout===
    
    // Create the table cell that will hold the title of the callout.  Specify font properties
    // on the cell (rather than on the table) because we wish the body table cell to have a
    // different font
    var titleTableCell = document.createElement('td');
    titleTableCell.innerHTML = graphicFeatureAttributes.content;
    //titleTableCell.style.whiteSpace = 'nowrap';
    titleTableCell.style.fontFamily = 'Arial';
    titleTableCell.style.fontSize = '8pt';
    titleTableCell.style.fontWeight = 'normal';
    titleTableCell.style.width = '1000px';

    // Create a table row to hold the title table cell        
    var titleTableRow = document.createElement('tr');
    titleTableRow.appendChild(titleTableCell);
    
    // Create the table cell that will hold the body of the callout.  The body will display the
    // date and time the point was created at in a human-readable format
    var bodyTableCell = document.createElement('td');    
    // Create a table row to hold the body table cell
    var bodyTableRow = document.createElement('tr');
    bodyTableRow.appendChild(bodyTableCell);   

    // Create a table body element to hold the rows        
    var tableBody = document.createElement('tbody');
    tableBody.appendChild(titleTableRow);
    //tableBody.appendChild(bodyTableRow);                                     
    
    // Create a table element to hold the table body, and specify the table border and cell padding
    var table = document.createElement('table');
    table.appendChild(tableBody);
    table.style.backgroundColor = 'white';
    table.style.borderStyle = 'solid';
    table.style.borderColor = '#F45B0D';
    table.style.borderWidth = '1px'; 
    table.style.cellPadding = '1px';
    table.style.width = '180px';

    // Create a JavaScript object with a property called "content" to pass to the callout's setContent method
    var content = new Object;
    content.content = table.outerHTML;
    callout.setContent(content);
}

function findElementPosition(element) 
{
    // Variables to store the element position
    var left = 0;
    var top = 0;
    
    // Make sure the offsetParent property is supported
    if (element.offsetParent) 
    {
        // Traverse the elements on the Page's HTML DOM that comprise the current element's offset.
        // This is possible because we can access each element having an offset that is a parent to
        // the current element via the offset Parent property.
        do 
        {
            left += element.offsetLeft;
            top += element.offsetTop;
        } while (element = element.offsetParent);
    }
    return [left,top];
}

function graphicMouseOutHandler(sender, eventArgs)
{
    // Get the map and revert the cursor style to what it was before the mouse entered the area
    // of the graphic feature
    if (m_oldCursor != 'pointer')
        map.set_cursor(m_oldCursor);

    // Get the custom attributes from the graphics feature that initiated the event                        
    var graphicFeatureAttributes = sender.get_attributes();    
    // Check whether the graphic feature has a callout
    if (graphicFeatureAttributes.callout)
    {
        // If the graphic feature's callout is open, start the timer that will hide the callout
        // after the amount of time specified in Callout::set_hideDelayTime has elapsed
        if (graphicFeatureAttributes.callout.get_isOpen)
            graphicFeatureAttributes.callout.startHideTimer();
    }
}
function graphicClickHandler(sender, eventArgs)
{
    // Get the graphic feature's custom attributes and check whether it has a callout
    var graphicFeatureAttributes = sender.get_attributes();
    if (graphicFeatureAttributes.callout)
    {
        // Call the function that expands the graphic's callout
        expandCallout(graphicFeatureAttributes.callout);
    }                        
}

function hideAllCallouts()
{
    if(_oldpoints!=null || _oldpoints.length > 0)
    {
        var GraphicElement;
        for(var x=0;x<_oldpoints.length;x++)
        {
           GraphicElementAttributes = _oldpoints[x].get_attributes();
           if(GraphicElementAttributes.callout)
           {    
            GraphicElementAttributes.callout.hide();
           }
        }
    }
}