//<![CDATA[
// Creates a marker at the given point with the given number label
function createMarker(point, number) {
  // Create our "tiny" marker icon
  var icon = new GIcon();
  icon.image = "images/mini-church.png";
  icon.iconSize = new GSize(99, 70);
  icon.iconAnchor = new GPoint(46, 48);
  icon.infoWindowAnchor = new GPoint(5, 1);
  var marker = new GMarker(point, icon);
  GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(number);
  });
  return marker;
}

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        var point = new GLatLng(53.347029, -1.500200);
        map.addControl(new GLargeMapControl());
        map.addControl(new GScaleControl());
        map.addControl(new GMapTypeControl());
        map.addControl(new GOverviewMapControl());
        map.setCenter(new GLatLng(53.347029, -1.500200), 13);
        map.addOverlay(createMarker(point, '<h3>Holy Trinity Church</h3><p>Millhouses, Grove Road, Sheffield. S7 2GY</p><form action="http://maps.google.co.uk/maps" target="vp"><input value="Sheffield, S7 2GY @53.347029,-1.500200" name="daddr" type="hidden"/><div class="label"><p>Enter your start address for directions</p></div><div><input class="inpt" id="iwdaddr" name="saddr" type="text" value=""/></div><div><input type="submit" value="Get Directions"/></div></form>'));
      }
    }
//]]>



function alterHTMLcontent(obj,HTMLcontent,mode){
 if (document.all){
  switch (mode){
   case 'p':
    obj.innerHTML=HTMLcontent+obj.innerHTML;
   break;
   case 'a':
    obj.innerHTML=obj.innerHTML+HTMLcontent;
   break;
   case 'r':
    obj.innerHTML=HTMLcontent;
   break;
  }
 }else if (document.getElementById){
  rng = document.createRange();
  el = obj;
  rng.setStartBefore(el);
  htmlFrag = rng.createContextualFragment(HTMLcontent);

  switch (mode){
   case 'p':
    newEl=el.lastChild;
    while (el.hasChildNodes()) el.removeChild(el.lastChild);
    //el.removeChild(el.lastChild)
    el.appendChild(htmlFrag);
    el.appendChild(newEl);
   break;
   case 'a':
    el.appendChild(htmlFrag);
   break;
   case 'r':
    while (el.hasChildNodes()) el.removeChild(el.lastChild);
    el.appendChild(htmlFrag);
   break;
  }

 }

}

function prependHTML(obj,HTMLcontent){
 alterHTMLcontent(obj,HTMLcontent,'p');
}
function appendHTML(obj,HTMLcontent){
 alterHTMLcontent(obj,HTMLcontent,'a');
}
function replaceHTML(obj,HTMLcontent){
 alterHTMLcontent(obj,HTMLcontent,'r');
}

//var imageArray=new Array("church-hall.jpg", "windows.jpg", "childrens-corner.jpg", "lecturn.jpg", "church-southside.jpg");
var numberOfImages=imageArray.length;
//var currentImageNumber;
var nextImageNumber=1;
var previousImageNumber=numberOfImages;

function nextImage() {
	switch (++currentImageNumber) {
	case numberOfImages:
	 currentImageNumber=0;
	 nextImageNumber=1;
	 previousImageNumber=numberOfImages-1;
	 break;
	case numberOfImages-1:
	 nextImageNumber=0;
	 previousImageNumber=currentImageNumber-1;
	 break;
	default:
	 nextImageNumber=currentImageNumber+1;
	 previousImageNumber=currentImageNumber-1; 
	}
	replaceHTML(document.getElementById('navImageNext'),'<a name="imageViewer" href="#imageViewer" onClick="javascript: nextImage();"><img src="images/holy-trinity-millhouses/'+imageArray[nextImageNumber]+'" width="100" height="100"><p>Next</p></a>');
	replaceHTML(document.getElementById('navImagePrevious'),'<a name="imageViewer" href="#imageViewer" onClick="javascript: previousImage();"><img src="images/holy-trinity-millhouses/'+imageArray[previousImageNumber]+'" width="100" height="100"><p>Previous</p></a>');
	replaceHTML(document.getElementById('mainImage'),'<img src="images/holy-trinity-millhouses/'+imageArray[currentImageNumber]+'"><br>'+imageArray[currentImageNumber]);
}
function previousImage() {
	switch (--currentImageNumber) {
	case -1:
	 currentImageNumber=numberOfImages-1;
	 nextImageNumber=0;
	 previousImageNumber=currentImageNumber-1;
	 break;
	case 0:
	 nextImageNumber=1;
	 previousImageNumber=numberOfImages-1;
	 break;
	default:
	 nextImageNumber=currentImageNumber+1;
	 previousImageNumber=currentImageNumber-1; 
	}
	replaceHTML(document.getElementById('navImageNext'),'<a name="imageViewer" href="#imageViewer" onClick="javascript: nextImage();"><img src="images/holy-trinity-millhouses/'+imageArray[nextImageNumber]+'" width="100" height="100"><p>Next</p></a>');
	replaceHTML(document.getElementById('navImagePrevious'),'<a name="imageViewer" href="#imageViewer" onClick="javascript: previousImage();"><img src="images/holy-trinity-millhouses/'+imageArray[previousImageNumber]+'" width="100" height="100"><p>Previous</p></a>');
	replaceHTML(document.getElementById('mainImage'),'<img src="images/holy-trinity-millhouses/'+imageArray[currentImageNumber]+'"><br>'+imageArray[currentImageNumber]);
}
function startUp() {
	load();
	nextImage();
}