﻿ <!--
            
    var map = null; 
    var membersLayer = null;
    var memberShapeLastClickedOn = null;
    var memberShapeLastHoveredOver = null;
    var SearchPanelStateExpaneded = true;
    
    var lastImgID=null;
   
    function MemberOnClick(e)
    {
        if(e.elementID)
        {               
            var memberShape = map.GetShapeByID(e.elementID);

            if(memberShape != null)
            {
                //Resets the pushpin icon of the previously clicked on member.
                if(memberShapeLastClickedOn)
                    SetPushpinImage(memberShapeLastClickedOn); 

                //Set the pushpin icon of the newly selected member shape object to the selected icon.
                SetPushpinImage(memberShape, 2); 
                
                //Store a reference to the newly selected member shape object.
                memberShapeLastClickedOn = memberShape;
                memberShapeLastHoveredOver = null;
                
                ShowCustomInfoBox(memberShape);
            }
        }
    }
   
    function MemberOnMouseOver(e)
    {

        if(e.elementID)
        {        
            var memberShape = map.GetShapeByID(e.elementID);

            if(memberShape != null)
            {   

                //If the mouse is hovering over the member that was last clicked on then do nothing.
                if(memberShape != memberShapeLastClickedOn)
                {
                
                    //Reset the last member object to be hovered on back to blue.
                    if(memberShapeLastHoveredOver)
                        SetPushpinImage(memberShapeLastHoveredOver);

                    //Set the current hovered on member to red pin.
                    SetPushpinImage(memberShape, 1);
                                           
                    //Remember which member was hovered over last. 
                    memberShapeLastHoveredOver = memberShape;
                    
                    //ShowCustomInfoBoxPreview();
                }
              
            }
        }
        //Return true prevents the defaut infobox of the map appearing.
       return true;
    }
    
    function PostionCustomInfoBox()
    {
        if(map != null)
        {
            var CustomInfoBoxPreview = document.getElementById('CustomInfoBoxPreview');
            var dnnMap = document.getElementById('dnnMap');
            var mapWidth = dnnMap.style.width;                
            CustomInfoBoxPreview.style.top = map.GetTop() + 12 + 'px';
            CustomInfoBoxPreview.style.left = map.GetLeft() + (mapWidth.replace('px', '') - CustomInfoBoxPreview.style.width.replace('px', '') - 3) + 'px';
            CustomInfoBoxPreview.style.visibility = 'visible';
        }
    }
    
   function HideCustomInfoBox()
    {
        var CustomInfoBox = document.getElementById('CustomInfoBox');
        CustomInfoBox.style.visibility = 'hidden';
    }
               
    function ShowCustomInfoBox(memberShape)
    {
        if(memberShape != null)
        {
        
            var CustomInfoBoxTitleSection = document.getElementById('CustomInfoBoxTitleSection');
            CustomInfoBoxTitleSection.innerHTML = memberShape.GetTitle();
            
            var CustomInfoBoxDescriptionSection = document.getElementById('CustomInfoBoxDescriptionSection');
            CustomInfoBoxDescriptionSection.innerHTML = memberShape.GetDescription();
               
            var CustomInfoBox = document.getElementById('CustomInfoBox');             
            CustomInfoBox.style.visibility = 'visible';
        }
    }
                
    function ShowCustomInfoBoxPreview()
    {
        if(memberShapeLastHoveredOver != null)
        {
            var CustomInfoBoxPreviewTitleSection = document.getElementById('CustomInfoBoxPreviewTitleSection');
            CustomInfoBoxPreviewTitleSection.innerHTML = memberShapeLastHoveredOver.GetTitle();
            
            var CustomInfoBoxPreview = document.getElementById('CustomInfoBoxPreview');
            CustomInfoBoxPreview.style.visibility = 'visible';                
        }          
    }
                 
    function GetMap(clientToken)
    {        
        //Creates, setup and load map object 
        map = new VEMap('dnnMap');  
        map.SetDashboardSize(VEDashboardSize.Small);    
        map.SetClientToken(clientToken);   
        map.LoadMap();
        
        PostionCustomInfoBox();
        
        //Wire up an custom event handlers for map events
        map.AttachEvent("onmouseover", MemberOnMouseOver);
        map.AttachEvent("onclick", MemberOnClick);
        map.AttachEvent('ontokenexpire', HandleTokenExpire);
        map.AttachEvent('ontokenerror', HandleTokenError);
        
        //Centers the map on the north east of england.
        CenterMap();
    
        //Creates a layer for the member push pins.
        SetupMemberLayer();
        
        //Loads all of the member shapes for all the DNN member onto the map.  
		var lnk=querySt('inx');
		if(lnk>0 && lnk!="undefined") {
			LoadMembersFilteredByCategoryID(lnk, 0);
		} else {
			LoadMembersFilteredByCategoryID(0, 0);
		}
		
    }   
    
	//gets the query string 
	function querySt(param) {
		hu = window.location.search.substring(1);
		gy = hu.split("&");
		for (i=0;i<gy.length;i++) {
			ft = gy[i].split("=");
			if (ft[0] == param) {
				return ft[1];
			}
		}
	}
	
    function HandleTokenExpire()
    {
       //function is called when the client token expires
       map.ShowMessage('Your map session has expired please refresh the page (press F5) and try again.');
    }

    function HandleTokenError()
    {
       //function is called if a client token authentication error occurs
       map.ShowMessage('The map has a problem with the session please refresh the page (press F5) and try again.');
    }
    
    function CenterMap(){
        //Focus the starting point of the map on the North East of England.
        var VELatLongStart = new VELatLong(54.914514007665254, -1.669921874999988);
        map.SetCenterAndZoom(VELatLongStart, 8);       
    }
    
    function SetupMemberLayer()
    {
        //Creates a new VEShapeLayer for the members layer.
        membersLayer = new VEShapeLayer();
        
        //Adds the member layer to the map.
        map.AddShapeLayer(membersLayer);
        
        //Shows the layer making it visible on the map.
        membersLayer.Show();
    }

    function LoadMembersFilteredByCategoryID(selectedCategoryID)
    {
        //This calls a web service asynchronisouly back on the web server which retrieves all the members for a given category ID.  When
        //the web service return the call back calls the OnGetAllMembersByCategoryID function passing it the list of member objects.                              
        MemberService.GetAllMembersByCategoryID(selectedCategoryID, OnGetAllMembersByCategoryID); 
    } 


	/*============================================================
		RTC Altered
	============================================================*/
	
    function OnGetAllMembersByCategoryID(MemberList)    {
		
		//Resets the pointer to null as this shape (if set) doesn't exist anymore).
		HideCustomInfoBox();
		memberShapeLastClickedOn = null;
		memberShapeLastHoveredOver = null;
					   
		//Clears all of the previous member push pins from the layer.
		membersLayer.DeleteAllShapes();
		
		$("#mList .items").empty();
		var newLink="";
		
		$.each(MemberList,function(index,obj) {
			AddMember(obj);
			var name=obj.Name;
			if(name.length>35) {
			    name=obj.Name.substring(0,35)+"...";
			}
			newLink+='<div><a href="javascript:void(0)" title="'+obj.Name+'" onclick="MemberItemOnClick('+index+')">'+name+'</a></div>';
		});
		
		//Adds the items to the list
		$("#mList .items").append(newLink); 
		
		//api.reload().begin(0).setPage(0);
		
		//Center the map on the north east.
		CenterMap();
		
		$("#loader").hide();
		$("#allMap").show();

    }
	
	
    function MembersClick(Index)    {
		
        //Resets the pushpin icon of the previously clicked on member.
        if(memberShapeLastClickedOn)
            SetPushpinImage(memberShapeLastClickedOn, 0); 
    
            //Retrieves the VEShape object from the MemberLayer.
            //Note that the VEShapes where added in the same order to the layer as they where to the list box hence we can
            //use selectedMemberIndex as the index to the shape layer.                    
            var memberShape = membersLayer.GetShapeByIndex(Index);
            
            if(memberShape != null)  {
                SetPushpinImage(memberShape, 2);
                
                //Points is an array of VELongLat objects in this case since the VEShape is a pushpin the array only has one object in it at 
                //position 0.
                var MemberPointsArray = memberShape.GetPoints();
                       
                //Center the map on the member pushpin.       
                map.SetCenter(MemberPointsArray[0]);
                
                //Stores the a reference to the Members VEShape for use later.
                memberShapeLastClickedOn = memberShape;
                
                ShowCustomInfoBox(memberShape);
            }

    } 
	
	/*============================================================
		End of RTC Altered
	============================================================*/
	
    function AddMember(MemberObject)
    {
        
        //Creates a VELatLong object using the co-ordinates provided by the Member object.
        var MemberVELatLong = new VELatLong(MemberObject.Latitude, MemberObject.Longitude);
        
        //Creates the member shape ready to put on the layer.
        var memberShape = new VEShape(VEShapeType.Pushpin, MemberVELatLong);
        
        //Adds the extra info from the member object to the member shape object.
        memberShape.SetTitle(MemberObject.Name);
        memberShape.SetDescription(BuildDescription(MemberObject.LogoFileNameAndPath, MemberObject.MemberStatus, MemberObject.Categories, MemberObject.FaqLink));
        
        SetPushpinImage(memberShape);

        //Adds the member shape object to the members layer.
        membersLayer.AddShape(memberShape);

    } 
    
    function SetPushpinImage(memberShape,imgID)    {   
        //var icon = "<img src='./Images/MemberPinRed.gif' alt='Red' />";
		var icon = "<img src='./Images/default.gif' alt='Locator' />";
        var zIndex = 1000;
    
		switch(imgID) {
			case 1: //hover
					icon="<img src='./Images/defaultOn.gif' alt='Locator' />";	
				break;
			case 2: //selected
				icon="<img src='./Images/defaultSel.gif' alt='Selected' />";				
				break
			default:
				icon="<img src='./Images/default.gif' alt='Locator' />";
		}
	
        if(memberShape != null)        {                                    
            memberShape.SetCustomIcon(icon);
            memberShape.SetZIndex(zIndex);
        }
    }

	function BuildDescription(logoFileNameAndPath, memberStatus, categories, faqLink)    {
        var description = '';
        
        description = description + '<table id=\'ShowInfoTable\' width=\'240px\' cellspacing=\'3px\'>';
        description = description + '<tr>';
        description = description + '<td colspan=\'2\'><img style=\'padding: 5px 5px 5px 5px;\' alt=\'Logo\' src=\'' + logoFileNameAndPath +'\'/> </td>';
        description = description + '</tr>';
        description = description + '<tr>';
        description = description + '<td style=\'vertical-align: top;\'><span class=\'customInfoBox-headings\'>Categories:</span></td>';
        description = description + '<td><span class=\'customeInfoBox-values\'>' + categories + '</span></td>';
        description = description + '</tr>';
        description = description + '<tr>';
        description = description + '<td style=\'text-align: right; padding-right: 5px;\' colspan=\'2\'><a href=\'' + faqLink + '\' target=\'_top\' style=\'font-size: 12px; font-weight: bold;\'>view profile...</a></td>';
        description = description + '</tr>';
        description = description + '</table>'

        return description;
    }
          
 function SearchPanelExpandCollapse()
    {
                    
        var SplitterImage = document.getElementById('SplitterImageHolder');
        var MemberPanel = document.getElementById('MemberPanel');
        var MapPanel = document.getElementById('MapPanel');
        var dnnMap = document.getElementById('dnnMap');
        var SplitterDiv = document.getElementById('SplitterDiv');
   
        if(SearchPanelStateExpaneded)
        {
            //Collapsing
            MemberPanel.style.display = 'none';
            MemberPanel.style.visibility = 'hidden';
            MemberPanel.style.width = '0px';
            MapPanel.style.width = '785px';
            dnnMap.style.width = '785px';
            SplitterDiv.style.cursor = 'e-resize';
            map.Resize(785, 410);
            SearchPanelStateExpaneded = false;
        }
        else
        {
            //Expanding
            MemberPanel.style.display = '';
            MemberPanel.style.visibility = '';
            MemberPanel.style.width = '170px';
            MapPanel.style.width = '635px';
            dnnMap.style.width = '635px';
            SplitterDiv.style.cursor = 'w-resize';
            map.Resize(635, 410);
            SearchPanelStateExpaneded = true;
        }
    }
    
    function SplitterEnter()
    {
        var SplitterDiv = document.getElementById('SplitterDiv');
        SplitterDiv.style.backgroundColor = '#E5EDF5';
        var SplitterImage = document.getElementById('SplitterImageHolder');
        SplitterImage.style.top = '183px';
    }
    
    function SplitterLeave()
    {
        var SplitterDiv = document.getElementById('SplitterDiv');
        SplitterDiv.style.backgroundColor = 'White';
        var SplitterImage = document.getElementById('SplitterImageHolder');
        SplitterImage.style.top = '180px';
    }

        -->