//Globals
var prevAddressPart = ""; //origin text
var map;                  //google map object
var direction;            //google directions object
var ew;                   //EWindow (custom marker info) object
var RESULTS_PER_PAGE = 2; //change this if you modify number of results returned on a page

// to override the default direction icons we need to set this flag and reload the api (default is a, b, c icons, we want G_START_ICON etc)
// took this out because the directions polyline and small map control stopped appearing
//_mF[32] = false;
//GLoadMapsScript();



function initMap() {      
  if (GBrowserIsCompatible()) {        
    map = new GMap2(document.getElementById("map_canvas"));
    var formObj = document.getElementById("searchForm");
    if (formObj == null) {
      formObj = document.getElementById("directionsForm");
    }
    if (formObj.point.value == "") {
      //Initial view is of entire country
      map.setCenter(new GLatLng(-36.8576, 174.7595), 10);

    } else {
      if (typeof map_zoom == 'undefined') {
        //user must have pressed "back" button on browser, reset to defaults
        map.setCenter(new GLatLng(-36.8576, 174.7595), 10);
        formObj.origin.value = "";
        formObj.point.value = "";
        formObj.postcode.value = "";
        formObj.page.value = "1";
      } else {
        //Set map center to the search origin           
        map.setCenter(new GLatLng.fromUrlValue(formObj.point.value), map_zoom);           
      }
    }

    map.addControl(new GLargeMapControl3D());   
    map.addControl(new GMapTypeControl());
    map.addControl(new GScaleControl());	
	map.enableScrollWheelZoom();
	
    //map.addControl(new GSmallMapControl());    
    //var scaleControl = new GScaleControl();
    //map.enableScrollWheelZoom();
    //var bottomLeft = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
    //map.addControl(scaleControl, bottomLeft);

    

    //set up the base icon properties to apply to all number and letter icons
    var baseIcon = new GIcon();
    //baseIcon.shadow = "http://www.reece.com.au/new/images/storefinder/marker_shadow.png";
    baseIcon.iconSize = new GSize(29, 29); 
    //baseIcon.shadowSize = new GSize(45, 26);   
    baseIcon.iconAnchor = new GPoint(15, 15);   //
    baseIcon.infoWindowAnchor = new GPoint(18, 1);  //

    var baseIconNW = new GIcon();
    //baseIconNW.shadow = "http://www.reece.com.au/new/images/storefinder/marker_nw_shadow.png";
    baseIconNW.iconSize = new GSize(29, 36);
    //baseIconNW.shadowSize = new GSize(45, 26);
    baseIconNW.iconAnchor = new GPoint(30, 37);
    baseIconNW.infoWindowAnchor = new GPoint(18, 1);
    //baseIconNW.infoShadowAnchor = new GPoint(18, 25);

    var baseIconNE = new GIcon();
    //baseIconNE.shadow = "http://www.reece.com.au/new/images/storefinder/marker_ne_shadow.png";
    baseIconNE.iconSize = new GSize(29, 36);
    //baseIconNE.shadowSize = new GSize(45, 26);
    baseIconNE.iconAnchor = new GPoint(-1, 37);
    baseIconNE.infoWindowAnchor = new GPoint(18, 1);
    //baseIconNE.infoShadowAnchor = new GPoint(18, 25);

    var baseIconSW = new GIcon();
    //baseIconSW.shadow = "http://www.reece.com.au/new/images/storefinder/marker_sw_shadow.png";
    baseIconSW.iconSize = new GSize(29, 36);
    //baseIconSW.shadowSize = new GSize(45, 26);
    baseIconSW.iconAnchor = new GPoint(30, -1);
    baseIconSW.infoWindowAnchor = new GPoint(24, 12);
    //baseIconSW.infoShadowAnchor = new GPoint(18, 25);

    var baseIconSE = new GIcon();
    //baseIconSE.shadow = "http://www.reece.com.au/new/images/storefinder/marker_se_shadow.png";
    baseIconSE.iconSize = new GSize(29, 36);
    //baseIconSE.shadowSize = new GSize(45, 26);
    baseIconSE.iconAnchor = new GPoint(-1, -1);
    baseIconSE.infoWindowAnchor = new GPoint(24, 10);
    //baseIconSE.infoShadowAnchor = new GPoint(18, 25);
    

    
    
    if (typeof latList != 'undefined') {
      //set up the pop-up info window
      var agent = navigator.userAgent.toLowerCase();
      if (agent.indexOf("msie") > -1 && (agent.indexOf("opera") < 1)){
        reeceEStyle = new EStyle("http://www.reece.com.au/new/images/storefinder/infostem.png", new GSize(25,28),  "infoWindow", new GPoint(10,11));
      }else{
        reeceEStyle = new EStyle("http://www.reece.com.au/new/images/storefinder/infostem.png", new GSize(25,28),  "infoWindow", new GPoint(10,9));
      }
      
      ew = new EWindow(map, reeceEStyle);
      map.addOverlay(ew);
      var markers = [];
      for (var i = 0; i < latList.length; i++) {
        var details = latList[i].split("#");
        var point = new GLatLng(details[2], details[3]);
        // create the html snippet for the info window
        var storeType;
        switch (details[0]) {
          case "P": 
            storeType = "Plumbing Centre";
            break;
          case "B": 
            storeType = "bathroom life";
            break;
          case "I": 
            storeType = "Irrigation";
            break;
          case "H": 
            storeType = "HVAC-R";
            break;
          case "R": 
            storeType = "Refrigeration";
            break;
          case "C": 
            storeType = "Civil";
            break;
          case "J": 
            storeType = "Projects";
            break;
          case "O": 
            storeType = "Onsite";
            break;
        }
        
        var markerPointInfo = "<div class=\"marker\">";
        markerPointInfo += "<span class=\"storeType_" + details[0] + "\" style=\"font-weight:bold;margin-right:5px;\">" + storeType + "</span> <b>"+ details[1]+"</b>";
        markerPointInfo += "<div style=\"margin-top:5px;\">" + details[4];
        markerPointInfo += "</div></div>";
        
        // set up a numbered icon using the base properties
        var numberedIcon = new GIcon(baseIcon);
        numberedIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_base.png";
        // supply gif version of the icon so that different browsers can print them 
        numberedIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_base.gif";
        numberedIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_base.gif";
        // add the marker
        var myMarker = new Object();
        myMarker.markerObj = createMarker(point, markerPointInfo, numberedIcon, i+1);
        var anchorPoint = map.fromLatLngToContainerPixel(point);
        myMarker.point = point;
        myMarker.minX = anchorPoint.x - numberedIcon.iconAnchor.x;
        myMarker.minY = anchorPoint.y - numberedIcon.iconAnchor.y;
        myMarker.maxX = myMarker.minX + numberedIcon.iconSize.width;
        myMarker.maxY = myMarker.minY + numberedIcon.iconSize.height;
        myMarker.markerInfo = markerPointInfo;
        myMarker.moved = false;
        
        for (var j = 0; j < markers.length; j++) {
          var percentageOverlap = getOverlap(markers[j], myMarker);
          if (percentageOverlap > 0.5) {
            // if the overlapped marker has already been moved, leave it where it is
            if (markers[j].moved == false) {
              // move the overlapped marker
              var currentWorstForPosition = 0;
              var currentBestOverall = 0;
              var compareMarkers = [];
              // go through each of the 4 marker positions for the first marker, find the position with lowest overlap (choose automatically if 0)
              for (var position = 1; position <= 4; position++) {
                var compareIcon;
                var compareMarker = new Object();
                switch (position) {
                  case 1:
                    compareIcon = new GIcon(baseIconNE);
                    compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_NE.png";
                    compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NE.gif";
                    compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NE.gif";
                    break;
                  case 2:
                    compareIcon = new GIcon(baseIconSW);
                    compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_SW.png";
                    compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SW.gif";
                    compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SW.gif";
                    break;
                  case 3:
                    compareIcon = new GIcon(baseIconNW);
                    compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_NW.png";
                    compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NW.gif";
                    compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NW.gif";
                    break;
                  case 4:
                    compareIcon = new GIcon(baseIconSE);
                    compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_SE.png";
                    compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SE.gif";
                    compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SE.gif";
                    break;
                }
                var compPoint = markers[j].markerObj.getLatLng();
                compareMarker.markerObj = createMarker(compPoint, markers[j].markerInfo, compareIcon, j+1);
                compareMarker.point = compPoint;
                var compAnchorPoint = map.fromLatLngToContainerPixel(compPoint);
                compareMarker.minX = compAnchorPoint.x - compareIcon.iconAnchor.x;
                compareMarker.minY = compAnchorPoint.y - compareIcon.iconAnchor.y;
                compareMarker.maxX = compareMarker.minX + compareIcon.iconSize.width;
                compareMarker.maxY = compareMarker.minY + compareIcon.iconSize.height;
                compareMarker.moved = false;
                compareMarkers[position] = compareMarker;
                for (var k = 0; k < markers.length; k++) {
                  // don't check for overlap with itself!
                  if (k != j) {
                    var compareOverlap = getOverlap(markers[k], compareMarker);
                    if (compareOverlap > currentWorstForPosition) {
                      currentWorstForPosition = compareOverlap;
                    }
                  }
                }
                if (currentWorstForPosition == 0) {
                  //no overlaps, choose this position
                  currentBestOverall = 0;
                  currentBestPosition = position;
                  break;
                }
                if (currentBestOverall == 0 || currentWorstForPosition < currentBestOverall) {
                  currentBestOverall = currentWorstForPosition;
                  //currentBestPosition = position;
                  currentBestPosition = 4;
                }
              }
              if (currentBestOverall > percentageOverlap) {
                // can only cause a worse overlap, leave it alone and mark as moved to avoid trying again later
                markers[j].moved = true;
              } else {
                // move to new position
                markers[j] = compareMarkers[currentBestPosition];
                markers[j].moved = true;
              }
            }
            // now move the second (new) marker
            var currentWorstForPosition;
            var currentBestOverall = 0;
            var compareMarkers = [];
            // go through each of the positions for the new marker, find the position with lowest overlap (choose automatically if 0)
            for (var position = 1; position <= 4; position++) {
              var compareIcon;
              var compareMarker = new Object();
              switch (position) {
                case 1:
                  compareIcon = new GIcon(baseIconNE);
                  compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_NE.png";
                  compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NE.gif";
                  compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NE.gif";
                  break;
                case 2:
                  compareIcon = new GIcon(baseIconSW);
                  compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_SW.png";
                  compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SW.gif";
                  compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SW.gif";
                  break;
                case 3:
                  compareIcon = new GIcon(baseIconNW);
                  compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_NW.png";
                  compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NW.gif";
                  compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_NW.gif";
                  break;
                case 4:
                  compareIcon = new GIcon(baseIconSE);
                  compareIcon.image = "http://www.reece.co.nz/new/images/storefinder/marker_SE.png";
                  compareIcon.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SE.gif";
                  compareIcon.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_SE.gif";
                  break;
              }
              compareMarker.markerObj = createMarker(point, markerPointInfo, compareIcon, i+1);
              compareMarker.point = point;
              compareMarker.minX = anchorPoint.x - compareIcon.iconAnchor.x;
              compareMarker.minY = anchorPoint.y - compareIcon.iconAnchor.y;
              compareMarker.maxX = compareMarker.minX + compareIcon.iconSize.width;
              compareMarker.maxY = compareMarker.minY + compareIcon.iconSize.height;
              compareMarker.moved = false;
              compareMarkers[position] = compareMarker;
              currentWorstForPosition = 0;
              for (var k = 0; k < markers.length; k++) {
                var compareOverlap = getOverlap(markers[k], compareMarker);
                if (compareOverlap > currentWorstForPosition) {
                  currentWorstForPosition = compareOverlap;
                }
              }
              if (currentWorstForPosition == 0) {
                //no overlaps, choose this position
                currentBestOverall = 0;
                currentBestPosition = position;
                break;
              }
              if (currentBestOverall == 0 || currentWorstForPosition < currentBestOverall) {
                currentBestOverall = currentWorstForPosition;
                currentBestPosition = position;
              }
            }
            if (currentBestOverall > percentageOverlap) {
              // can only cause a worse overlap, leave it alone and mark as moved to avoid trying again later
              myMarker.moved = true;
            } else {
              // move to new position
              myMarker = compareMarkers[currentBestPosition];
              myMarker.moved = true;
            }
          }
        }
        markers.push(myMarker);
        

      }
      //alert(markers.length);
      for (var i = 0; i < markers.length; i++) {
        map.addOverlay(markers[i].markerObj);
      }
      //check that all the markers appear in the window, if not zoom out until they do
      var markersInFrame = false;
      while (markersInFrame == false) {
        var zoomOut = false;
        var bounds = map.getBounds()
        var northEast = bounds.getNorthEast();
        var southWest = bounds.getSouthWest();
        var temp = northEast.lng();

        //get bounds for northEast sometimes bugs out. hack to fix error.
        if (temp < 0) {       
        temp = 360 + northEast.lng();
        //alert(temp);

        }
        for (var i = 0; i < markers.length; i++) {
          //alert ('NE: ' + northEast.lng() + ', ' + northEast.lat() + ' SW: ' + southWest.lng() + ', ' + southWest.lat() + ' Marker: '  + markers[i].point.lng() + ', ' + markers[i].point.lat());
          if (markers[i].point.lng() > temp || markers[i].point.lat() > northEast.lat() || markers[i].point.lng() < southWest.lng() || markers[i].point.lat() < southWest.lat()) {
            zoomOut = true;
          }
        }
        if (zoomOut == true) {
          // go out to the next zoom level
          //alert("zoom out");
          map.zoomOut();
          //markersInFrame = false;
        
        } else {
          markersInFrame = true;
        }
      }
    }
  }
}

function verifySearch(formId) {
  if (currentSelection > -1) {
    //Enter was pressed in the result box - we don't want to submit the request yet
    currentSelection = -1;
    return;
  }
  var formObj = document.getElementById(formId);
  //check address meets criteria
  var address = formObj.origin.value;
  if (address.length == 4 && isNumeric(address)){
    formObj.postcode.value = address;
  } else if (isNumeric(address.substring(address.length - 4, address.length))) {
    formObj.postcode.value = address.substring(address.length - 4, address.length);
  } else {
    formObj.postcode.value = "";
  }
  //geocode address
  geocodeLocation(formObj.origin.value);
}

function geocodeLocation(address) {
  var geocoder = new GClientGeocoder();
  //notify user that we will be waiting for a response here if slow response times make this necessary
  //send address to geocoder, define processAddress as callback function
  geocoder.setBaseCountryCode('NZ');
  geocoder.getLocations(address, processAddress);
}

function processAddress(response) {

  if (!response || response.Status.code != 200) {
    alert("Please enter a valid street and or suburb. (E.g. 60 Queen St,Auckland)");
  } else {
    place = response.Placemark[0];
    if (place.AddressDetails.Country.CountryNameCode != 'NZ') {
      // if google can't find any results for new zealand it will sometimes return results from elsewhere 
      alert("Please enter a valid street and or suburb. (E.g. 60 Queen St,Auckland)");
    } else {
      //put the co-ordinates into a hidden field and submit the form
      var formObj = document.getElementById('searchForm');
      formObj.point.value = place.Point.coordinates[1] + ', ' + place.Point.coordinates[0];
      // Reset to first page for new search
      formObj.page.value = 1;
      formObj.submit();
    }
  }
}

function createMarker(point, pointInfo, icon, resultNumber) {
  var marker;
  marker = new GMarker(point, icon);
  
  $(".hover").click(function(){
    var markerClicked = $(this).attr('alt');
    if (markerClicked == resultNumber){
      map.panTo(point);
      ew.openOnMarker(marker, pointInfo);
    }
  });
  
  GEvent.addListener(marker, "mouseover", function() {
    //marker.openInfoWindowHtml(pointInfo);
    // open the custom info window
    ew.openOnMarker(marker, pointInfo);
    
    //if required, recenter the map to show the entire window
    var mapObj = document.getElementById("map_canvas");
    var panX = 0;
    var panY = 0;
    if (ew.top > 0) {
      panY = ew.top + 5;
    }
    if (ew.right > mapObj.offsetWidth) {
      panX = ew.right - mapObj.offsetWidth + 5;
    }
    if (panX != 0 || panY != 0) {
      map.panBy(new GSize(-panX, panY));
      // re-open the marker so that top, right etc are re-calculated
      ew.openOnMarker(marker, pointInfo);
    }

  });
  GEvent.addListener(marker, "click", function() {
    $("#demo").accordion('activate', resultNumber);
  });
  GEvent.addListener(marker, "mouseout", function() {
    ew.hide();
  });
  
  return marker;
}

function addressLookup(addressPart) {

  if (addressPart.length < 4) {
    //Don't initiate lookup for less than 4 characters
    //remove results box if necessary
    hideAddressResults();
    // remember the text
    prevAddressPart = addressPart;
    return;    
  }
  
  if (addressPart == prevAddressPart) {
    //text hasn't changed so exit
    return;
  }
  
  //Set up request object
  var xmlHttpReq;   
   
  // Determine which browser we are dealing with 
  if (window.XMLHttpRequest) {
    // non-IE browsers
    xmlHttpReq = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    // IE
    xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
  }
  
  var queryString = 'addressPart=' + addressPart;

  var lookupScript = '/new/storefinder/addresslookup.cgi';
      
  xmlHttpReq.open('POST', lookupScript, true);
  xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  // set the callback function
  xmlHttpReq.onreadystatechange = function() {
    if (xmlHttpReq.readyState == 4 && xmlHttpReq.status == 200) {
      if (xmlHttpReq.responseText) {
        showAddressResults(xmlHttpReq.responseText);
      }
    }
  };
  
  // remember the text
  prevAddressPart = addressPart;
  // post to script
  xmlHttpReq.send(queryString);
}

// global variables for resultBox code
var resultBox, currentSelection, previousSelection, listItems;
// define key code constants
var TAB = 9;
var ENTER = 13;
var ESC = 27;
var UP = 38; 
var DOWN = 40;

function showAddressResults(results) {

  var formObj = document.getElementById("searchForm");
  var origin = document.getElementById("origin");
  resultBox = document.getElementById("selectBox");
  var resultLines = results.split('\n');
  var resultsHTML = "<ul id=\"selectList\">";
  
  for (i=0;i<resultLines.length;i++) {
    resultsHTML += "<li class=\"selectItem\">" + resultLines[i] + "</li>";
  }
  resultsHTML += "</ul>\n";

  //set up the result box
  var body = document.getElementsByTagName("body")[0];

  if (!resultBox) {
    resultBox = document.createElement("div");
    resultBox.id = "selectBox";
    resultBox.style.zIndex = 51;
    resultBox.style.position = 'absolute';
    resultBox.style.display = 'none';
    resultBox.style.width = 'auto';
    body.appendChild(resultBox);
  }
  // Some form elements show through the dynamically generated div on IE 6 and earlier.
  // An IFrame sitting just under the div blocks these elements - this section gives an example if required
  // resultBoxIFrame = document.getElementById("selectBoxIFrame");
  // if (!resultBoxIFrame) {
    // resultBoxIFrame = document.createElement("iframe");
    // resultBoxIFrame.id = "selectBoxIFrame";
    // resultBoxIFrame.style.zIndex = 50;
    // resultBoxIFrame.setAttribute('scrolling', 'no');
    // resultBoxIFrame.setAttribute('frameborder', '0');
    // resultBoxIFrame.style.position = "absolute";
    // resultBoxIFrame.style.display = "none";
    // body.appendChild(resultBoxIFrame);
  // }
  
  if (resultBox.innerHTML != resultsHTML) {
    resultBox.innerHTML = resultsHTML;
    
    var list = getAddressList();
    listItems = list.childNodes.length;
    
    if (listItems > 0) {
      // assign mouse event handlers
      for (var i=0; i < list.childNodes.length; i++) {
        li = list.childNodes[i];
        li.onmousedown = rbMouseDown;
        li.onmouseover = rbMouseOver;
        li.onmouseout = rbMouseOut;
      }
    }
    
    var x = findPosX(origin);
    var y = findPosY(origin) + origin.offsetHeight + 1;

    resultBox.style.top = y + 'px';
    resultBox.style.left = x + 'px';
    resultBox.style.width = origin.offsetWidth;

    resultBox.style.display = 'inline';
    
    currentSelection = -1;
    previousSelection = -1;
  }
}

function isNumeric(value) {
  // checks for numeric value (note: not negatives or decimals since we're using this for postcodes)
  if (value == null || !value.toString().match(/^\d*$/)) return false;
  return true;
}

function keyPressed(event) {
  // get the key code from the event
  var code;
  if (!event) var event = window.event;
  if (event.keyCode) {
    code = event.keyCode;
  } else if (event.which) {
    code = event.which;
  }
  //process the key
  switch (code) {
    case UP:
      currentSelection = currentSelection - 1;
      if (currentSelection < 0) {
        currentSelection = 0;
      }
      selectItem(currentSelection);
      break;
    case DOWN:
      currentSelection++;
      if (currentSelection >= listItems) {
        currentSelection = listItems-1;
      }
      selectItem(currentSelection);
      break;
    case ENTER:
      if (listItems > 0 && currentSelection >= 0){
        setOrigin(currentSelection);
        hideAddressResults();
      }
      break;
    case ESC:
      hideAddressResults();
      break;
    case TAB:
      if (currentSelection >= 0 && currentSelection < listItems) {
        setOrigin(currentSelection);
      }
    default:
  }
}

function hideAddressResults() {
  if (resultBox != null) {
    resultBox.style.display = 'none';
    resultBox.innerHTML = "";
  }
}

function rbMouseOut(event) {
  currentSelection = -1;
  selectItem(-1);
}

function rbMouseDown(event) {
  var obj = event ? event.target : this;
  currentSelection = getItemIndex(obj);

  setOrigin(currentSelection);
  hideAddressResults();
}

function rbMouseOver(event) {
  var obj = event ? event.target : this;
  currentSelection = getItemIndex(obj);
  selectItem(currentSelection);
}

function selectItem(newItem) {
  var list = getAddressList();

  if (list.childNodes.length > 0) {
    if (previousSelection >= 0) {
      var prev = list.childNodes[previousSelection];
      prev.className = "selectItem";
    }

    if (newItem >= 0) {
      if (list.childNodes.length > 0) {
        var cur = list.childNodes[newItem];
        cur.className = "selectItemCurrent";
      }
      previousSelection = newItem;
    }
  }
}

function getAddressList() {
  var aList;
  for (var i=0; i < resultBox.childNodes.length; i++) {
    var node = resultBox.childNodes[i];
    if (node.nodeName == 'UL') {
      aList = node;
      break;
    }
  }
  return aList;
}

function setOrigin(newSelection) {
  var origin = document.getElementById("origin");
  if (newSelection < 0) {
    origin.value = "";
  } else if (listItems > 0) {
    var list = getAddressList();
    if (list == null || list.childNodes == null) {
      return;
    }
    var selected = list.childNodes[newSelection];
    if (selected.innerText != undefined) {
      origin.value = selected.innerText;
    }
    else {
      origin.value = selected.textContent;
    }
  }
}

function getItemIndex(elem) {
  var list = getAddressList();
  var retIndex = 0;
  for (var i = 0; i < list.childNodes.length; i++) {
    if (elem == list.childNodes[i]) {
      retIndex = i;
      break;
    }
  }
  return retIndex;
}

function findPosX(obj) {
  var curleft = 0;
  if (obj.offsetParent) {
    while (obj.offsetParent) {
      curleft += obj.offsetLeft;
      obj = obj.offsetParent;
    }
  } else if (obj.x) {
    curleft += obj.x;
  }
  return curleft;
}

function findPosY(obj) {
  var curtop = 0;
  if (obj.offsetParent) {
    while (obj.offsetParent) {
      curtop += obj.offsetTop;
      obj = obj.offsetParent;
    }
  } else if (obj.y) {
    curtop += obj.y;
  }
  return curtop;
}

function initDirections(address, marker, branch) {

  var formObj = document.getElementById("searchForm");
  formObj.dirAddress.value = address;
  formObj.directions.value = "true";
  formObj.dirBranch.value = branch;
  if (typeof latList != 'undefined') {
    formObj.dirMarker.value = latList[marker - 1];
  }
  if (typeof map_zoom != 'undefined') {
    formObj.dirZoom.value = map_zoom;
  }
  //alert(address + ", " + formObj.dirMarker.value + ", " + formObj.dirZoom.value);
  formObj.submit();
}

function loadDirections(storeCode) {
  
  G_START_ICON.image = "http://www.reece.co.nz/new/images/storefinder/marker_a.png";
  G_START_ICON.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_a.gif";
  G_START_ICON.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_a.gif";
  G_START_ICON.shadow = "http://www.reece.co.nz/new/images/storefinder/marker_shadow.png";
  G_START_ICON.iconSize = new GSize(29,29);
  G_START_ICON.shadowSize = new GSize(45,26);
  G_START_ICON.iconAnchor = new GPoint(15,15);

  G_END_ICON.image = "http://www.reece.co.nz/new/images/storefinder/marker_b.png";
  G_END_ICON.printImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_b.gif";
  G_END_ICON.mozPrintImage = "http://www.reece.co.nz/new/images/storefinder/print_markers/marker_b.gif";
  G_END_ICON.shadow = "http://www.reece.co.nz/new/images/storefinder/marker_shadow.png";
  G_END_ICON.iconSize = new GSize(29,29);
  G_END_ICON.shadowSize = new GSize(45,26);
  G_END_ICON.iconAnchor = new GPoint(15,15);
 
  directions = new GDirections(map);
  
  var fromField = document.getElementById('from_'+storeCode);
  
  if (fromField.value == "E.g. 60 Queen St, Auckland") {
    alert("Please enter a valid street name and suburb. Eg. Queen St, Auckland");
    return;
  }
  var toField = document.getElementById('destination_'+storeCode);

  // some store addresses eg "Cnr Abc Rd & Xyz Rd" aren't understood by google, so provide the lat/lon for the destination 
  var point = document.getElementById('point_'+storeCode);
  var destDetails = point.value.split(",");
  var routeStr = fromField.value + ",nz  to " + destDetails[0] + ", " + destDetails[1];
 
  //alert("Route: "+routeStr);
  directions.load(routeStr, {getSteps:true});
  
  GEvent.addListener(directions,"load", function() {
    // hide the form and show the text version
	
	var parentElement = 'demo';
	var url = window.location.pathname;
	var singleBranch = /\d/.test(url);
	if (singleBranch){
	  parentElement = 'singleBranchDetails';
	}

    var dirInput = document.getElementById(parentElement);	
    dirInput.style.display = "none";
    
    var fromSpan = document.getElementById('fromAddress');
    fromSpan.innerHTML = fromField.value ;
    var toSpan = document.getElementById('toAddress');
    toSpan.innerHTML = toField.value ;
    
    $('.dirList').hide();
    $('.dirdiv').hide();
	$('.branchDirections').hide();
	$('#dd_'+storeCode).show();
	$('#sfHead').hide();
	
  //  var dirh2 = document.getElementById('h2_'+storeCode);
  //  dirh2.style.display = "block";
  //  $('#h2_'+storeCode).show();
  //  $('#h2_'+storeCode).addClass('ui-state-active');
  //  $('#div_'+storeCode).show();

    $("#dirDisplay").show();


    //new results are appended to (rather than overwrite) the existing map, so clear it first
    map.clearOverlays();

    // ========== launch the custom Panel creator a millisecond after the GDirections finishes loading ==========
    // == The delay is required in case we rely on GDirections to perform the initial setCenter ==
    
    setTimeout('customPanel(map,"map",directions,document.getElementById("text_directions"))', 1);
  });
  GEvent.addListener(directions,"error", function() {
    // assume it's a bad address - if we need more sophistication check directions.getStatus().code against GGeoStatusCode in the Google API Reference
    alert("Please enter a valid street name and suburb. Eg. Queen St, Auckland");
  });
}

// ============ custom direction panel ===============
// This Javascript is based on code provided by the
// Blackpool Community Church Javascript Team
// http://www.commchurch.freeserve.co.uk/   
// http://econym.googlepages.com/index.htm
function customPanel(map,mapname,dirn,div) {
  var html = "";
  
  html += '<table id="directionsTable">'
  html += '  <thead>'
  html += '    <tr class="headfoot">'
  html += '      <td colspan="2">Direction</td>'
  html += '      <td>Distance</td>'
  html += '    </tr>'
  html += '  </thead>'
  html += '  <tbody>'
  // ===== local functions =====

  // === route distance ===
  function routeDistance(dist) {
    html += '<div style="text-align: right; padding-bottom: 0.3em;">' + dist + '</div>';
  }      

  // === step detail ===
  function detail(point, num, description, dist, marker) {
    var target = '"' + mapname+".showMapBlowup(new GLatLng("+point.toUrlValue(6)+"))"  +'"';
    if (num % 2 == 1) {
      html += '  <tr class="alternateStep" onclick='+target+'>';
    } else {
      html += '  <tr class="step" onclick='+target+'>';
    }
    html += '    <td class="stepNumber">';
    if (marker != "") {
      html += '      <img src="http://www.reece.com.au/new/images/storefinder/marker_' + marker + '.png">';
    } else {
      html += num;
    }
    html += '    </td>';
    html += '    <td>';
    if (marker == "a") {
      html += '      Start: ';
    } else if (marker == "b") {
      html += '      Stop: ';
    }
    html +=        description;
    html += '    </td>';
    html += '    <td class="stepDistance">';
    html += '      <a href="javascript:void(0)"> ' + dist + ' </a>';
    html += '    </td>';
    html += '  </tr>';
  }

  // === Copyright tag ===
  function copyright(text) {
    html += '<div class="copyright">' + text + "</div>";
  }
  
  // === get the route and read through the GSteps ===

  var route = dirn.getRoute(0);
  var geocode = route.getStartGeocode();
  var point = route.getStep(0).getLatLng();
  var marker = "a";

  for (var j=0; j<route.getNumSteps(); j++) {
    var step = route.getStep(j);
    if (j == (route.getNumSteps() - 1)) {
      // final step gets the endpoint marker
      marker = "b";
    }
    // === detail lines for each step ===
    detail(step.getLatLng(), j+1, step.getDescriptionHtml(), step.getDistance().html, marker);
    marker = "";

  }

  // Table footer with total distance
  html += '  </tbody>'
  html += '  <tfoot>'
  html += '    <tr class="headfoot">'
  html += '      <td colspan="2">Total</td>'
  html += '      <td class="stepDistance">' + route.getDistance().html + '</td>'
  html += '    </tr>'
  html += '  </tfoot>'
  html += '</table>'
           
  // === the copyright text ===
  copyright(dirn.getCopyrightsHtml());

  // === drop the whole thing into the target div
  div.innerHTML = html;

} // ============ end of customPanel function ===========

function newSearch() {
  //swap back to the input form
  var dirDisplay = document.getElementById('dirDisplay'); 
  dirDisplay.style.display = "none";
  $('#sfHead').show();
	
  var parentElement = 'demo';
  var url = window.location.pathname;
  var singleBranch = /\d/.test(url);
  if (singleBranch){
    parentElement = 'singleBranchDetails';
  }
  
  var dirInput = document.getElementById(parentElement);
  dirInput.style.display = "block";
  $(".hours").hide();
  $(".dir").hide();
  map.clearOverlays();
  initMap();  
}

function goResults() {
  var formObj = document.getElementById('directionsForm');
  var dirField = document.getElementById('directions');
  dirField.value = "false";
  formObj.submit();
}

function swapDesc(newDesc) {
  strDesc = newDesc + "_desc";
  var descObj = document.getElementById(strDesc);
  descObj.style.display = "block";
}

function clearDesc() {
  var arrDescriptions = getElementsByClassName(document.getElementById("storetypes"), "div", "storeDescription");
  if (arrDescriptions.length > 0) {
    for (i=0;i<arrDescriptions.length;i++) {
      arrDescriptions[i].style.display = "none";
    }
  }
}

function getElementsByClassName(oElm, strTagName, strClassName){
/*
  Written by Jonathan Snook, http://www.snook.ca/jonathan
  Add-ons by Robert Nyman, http://www.robertnyman.com
*/
  var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
  var arrReturnElements = new Array();
  strClassName = strClassName.replace(/\-/g, "\\-");
  var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
  var oElement;
  for(var i=0; i<arrElements.length; i++){
    oElement = arrElements[i];
    if(oRegExp.test(oElement.className)){
      arrReturnElements.push(oElement);
    }
  }
  return (arrReturnElements)
}

function printPage() {
  window.print();
}

function printStore(resultNumber) {
  // highlight the store (in the print css we can exclude non-highlighted stores)
  //highlightStore(resultNumber);
  window.print();
}

function getOverlap( marker1, marker2) {
  // get the percentage of marker 1's area that is overlapped by marker 2
  var overlap;
  
  if ( marker1.minX > marker2.maxX ) {
    overlap = 0;
  } else if ( marker1.maxX < marker2.minX ) {
    overlap = 0;
  } else if ( marker1.minY > marker2.maxY ) {
    overlap = 0;
  } else if ( marker1.maxY < marker2.minY ) {
    overlap = 0;
  } else {
    // calculate overlap area
    var x_overlap = Math.min( marker2.maxX, marker1.maxX ) - Math.max( marker2.minX, marker1.minX );
    var y_overlap = Math.min( marker2.maxY, marker1.maxY ) - Math.max( marker2.minY, marker1.minY );
    overlap = x_overlap * y_overlap;
  }
  // get marker 1's area
  var area1 = (marker1.maxX - marker1.minX) * (marker1.maxY - marker1.minY);
  // get the overlap percentage
  return overlap/area1;
}



