//Support Module

function makepanel()
{
    panel = document.createElement("div"); 
    panel.id = "panel"
    panel.style.className = "VE_Panel_el";
    panel.style.position = "relative";
    panel.style.top = 0; //document.getElementById("myMap").offsetTop; 
    panel.style.left = document.getElementById("myMap").offsetWidth - 285; 
    panel.style.width = "285px";
    panel.style.height = "580px";
    //panel.style.border = "2px solid blue";
    //panel.style.background = "White";

    panelHead = "<table border=0 width='100%' class='VE_Panel_el'>" +
        "<tr><td bgcolor='#C0C0CF'><h3 align='center'>Meetings in Connecticut</h3></td></tr>" +
        "<tr><td bgcolor='#E0E0E0'><p align='center'>" +
        "<a href=\"javascript:showHelp();\">Help</a>" 
    panelHead += "</td></tr>";
      
    panelHelpContent = 
        "<tr valign='top'><td height='500px' align='left'> " +         
        "<a href='javascript:ZoomToAll();' class='Panel'>Back to Meetings</a> <br/>" +
        "<b>Searching for Meetings:</b><br/>" +
        " Select a City and a Day of the week in the form to the left and press the Search Button <br/><br/>" + 
        "       <b>To Move Around the map:</b>" +      
        "       <ul><li>After searching, you will see a list of nearby meetings in this panel.  Click a meeting to move the map to that location.<br/>       " +
        " <li>You can hover the mouse over a meeting location for a pop with more details " + 
        " <li>You can use the compass and slider at the top left of the map to move and zoom.       " + 
        " <li>Click and hold the map and drag it in the direction you want to move it.       " +
        " <li>Double-clicking on the map also zooms in on the location." +
        " <li>The mouse wheel also also zooms in and out." +
        "<br/></td></tr>" +
        "<tr><td> </td></tr>" +
        "<tr><td> </td></tr>";
      
    panelFoot = "<tr><td bgcolor='#E0E0E0'><p align='center'>" +
        "<a href='javascript:ZoomToAll();' class='Panel'>zoom to all</a>" +
        "</td></tr>" +
        "</table>";

        panel.innerHTML = panelHead + 
            panelHelpContent +
            panelFoot;
      
    map.AddControl(panel);
}
function showPanel(content){
        panel.innerHTML = panelHead + content + panelFoot;
}


function showHelp()
{    
    showPanel(panelHelpContent);
}

//A PanelPoint is the object definition for an individual meeting location
//      Its just a location because there might be more than one 
//      meeting time and type per location on any given day 
//      (like a morning and evening meeting at the same church),
//      and we only want to show it once on the map
PanelPoint = function(MeetingID, ListID, Place, Address, Address2, City, TimeTypeString, Precision, pt)
{
    this.MeetingID = MeetingID;
    this.ListID = ListID;
    this.Place = Place;
    this.Address = Address;
    this.Address2 = Address2;
    this.City = City;
    this.TimeTypeString = TimeTypeString;
    this.Precision = Precision;
    this.LatLong = pt;
}

function AddPoint(panelPoint)
{
    var details = '';
    var TimeTypeString = '';
    var ActionString = '';
    
    //Construct Details String
    if ((panelPoint.Address != null)&&(panelPoint.Address != '')) 
        {details += panelPoint.Address;}
    if ((panelPoint.Address2 != null)&&(panelPoint.Address2 != '')&&(panelPoint.Address2 != 'NULL')) 
        {details += '<br>' + panelPoint.Address2;}
    if ((panelPoint.City != null)&&(panelPoint.City != '')) 
        {details += '<br>' + panelPoint.City;}
        
    if (panelPoint.Precision != '')
        {
            details += '<br><br>';
            details += '<span class="alert">';
            details += '<b>Please Note:</b> We were unable to pinpoint this location on the map!<br>';
            if (panelPoint.Precision == '*') {details += 'The <u>street</u> was mapped instead.';}
            if (panelPoint.Precision == '**') {details += 'The <u>city center</u> was mapped instead.';}
            details += '</span>';
        }
    
    //Construct TypeTimeString (this is mostly done in the ConcatMeetingInfo SQL Function
    TimeTypeString = panelPoint.TimeTypeString
    
    //Construct ActionString
    ActionString = "<a href='javascript:MapSetCenterAndZoom(new VELatLong(";
    ActionString += panelPoint.LatLong.Latitude + "," + panelPoint.LatLong.Longitude;
    ActionString += "), 15);' class='Panel'>zoom to street</a>"
    ActionString += "&nbsp;|&nbsp;"
    ActionString += "<a href='javascript:ZoomToAll();' class='Panel'>zoom to all</a>"
    
    var pin = new VEPushpin(panelPoint.MeetingID, 
        panelPoint.LatLong, 
        null, 
        panelPoint.Place, 
        details + "<hr>" + TimeTypeString + "<hr>" + ActionString
        );
    map.AddPushpin(pin);
    pin = null;
}

function PointList()
{
    panelContent = '';
    for (var i=0;i<panelPoints.length;i++)
    {
        var pt = panelPoints[i];
        panelContent += "<li>"
        if (pt.Precision != '') 
        {
            var title = '';
            title += 'Please Note: We were unable to pinpoint this location on the map!  ';
            if (pt.Precision == '*') {title += 'The street was mapped instead.';}
            if (pt.Precision == '**') {title += 'The city centerwas mapped instead.';}
            
            panelContent += '<span class="alert" title="' + title + '" style="cursor: help;">' + pt.Precision + '</span> ';
        }
        panelContent += "<a href='javascript:MapSetCenterAndZoom(new VELatLong(";
        panelContent += pt.LatLong.Latitude + "," + pt.LatLong.Longitude;
        panelContent += "), 15);' class='Panel'>" + pt.Place + " (" + pt.City + ") "; 
        panelContent += "</a></li>";
        
        AddPoint(panelPoints[i]);
    }
    
    panelContent = "<tr><td height='500px'><div style='height:500px;overflow:auto'><ul class='MeetingList'>" +  panelContent + "</ul><div></td></tr>" +
      "<tr><td> </td></tr>" +
      "<tr><td> </td></tr>";
    
    showPanel(panelContent);
}

//array of PanelPoint objects
var panelPoints = new Array();
var footer = null;

//Main & Setup Functions
function drawMap()
{
    map = new VEMap('myMap');
    map.LoadMap(new VELatLong(lat, lon), zoom, "r", false);
    
    showPanel('');
}

function ZoomToAll()
{
    map.SetCenterAndZoom(new VELatLong(lat, lon), zoom);
    showPanel(panelContent);
}

function MapSetCenterAndZoom(d, b, c) {
    map.SetCenterAndZoom(d, b, c);
    return;
}