//Create pointer image of tooltip
imgPointer=document.createElement("img");

//Create empty tooltip div element 
tipDiv= document.createElement("div");

//Create div which holds content of tooltip
content = document.createElement("div");

//Create paragraph element
para=document.createElement("p");

function startUp(){
  imgPointer.className="noprint";
  imgPointer.style.visibility="hidden";
  imgPointer.style.zIndex=40;
  imgPointer.style.position="absolute";
  document.body.appendChild(imgPointer);
  tipDiv.className="noprint";
  tipDiv.style.position = "absolute";
  tipDiv.style.visibility = "hidden";
  tipDiv.style.zIndex=41;
  tipDiv.style.width="305px";
  content.className="noprint";
  content.style.width ="285px";
  content.style.left="4px";// gives position relative to its container, tipDiv
  content.style.visibility = "hidden";
  content.style.position = "relative";
  para.style.fontSize="9pt";
  para.className="noprint";
  para.style.position="relative";
  para.style.left="0px";

  //For some reason, the paragraph offset differs between browsers and web pages. We use id="specialCase" to locate the table in walk.html which houses navigation buttons.
  //First check if we have a special case
  var tablElems=document.getElementsByTagName("table");
  var lenTables = tablElems.length;
  var specCase=false;
  for(var i=0; i<lenTables;i++){
  if(tablElems[i].getAttribute("id")=="specialCase"){
  specCase=true;
  i=lenTables;
  } //end if
  } //end for

  var corxn=0;//first set 0 for all browsers
  if((!document.all)&&(!specCase)){//Opera,Mozilla,Firefox not on walks.html
  var corxn = -12;
  }
  if((document.documentMode==8)&&(!specCase)){//IE8 not on walks.html
  var corxn= -12;
  }
  para.style.top=corxn +"px"; 
  content.style.top="5px"; // gives position relative to its container, tipDiv
  tipText="";
  if(!document.createTextNode) return false;
  tipNode = document.createTextNode(tipText);
  tipTxt = new Array();
  hRef = new Array();
  linkElems= new Array();

  //Get elements 'a' with class-name "hasTip" using function in global.js
  linkElems=getElemsByClassName("hasTip","a");
  lenLinks=linkElems.length;
  
  
  
  for(var i=0; i<lenLinks;i++){
  var fullHref=linkElems[i].href;

  //Split the full href into its various sections, (separated by "/") and keep the last section.
  var bitsHref=fullHref.split("/");
  hRef[i]=bitsHref[bitsHref.length-1];

  // Get message to display in tooltip
  if(hRef[i] == "index.html"){tipTxt[i]="A brief list of latest updates. Lnks to 'Contents' page, survey form and to local weather forecasts.";
  }else if(hRef[i] == "intro.html"){tipTxt[i]="Reasons to join Ramblers. Penrith Group's catchment area. Brief info on web site content.";
  }else if(hRef[i] == "walk.html"){tipTxt[i]="Latest walks' programme, maps showing a walk's location, plan of OS map/s to use, printing facility."; 
  }else if(hRef[i] == "update.html"){tipTxt[i]="Updates to forthcoming walks. Info for group's members. Adverts of interest to ramblers.";
  }else if(hRef[i] == "guide.html"){tipTxt[i]="Walk Grades. Countryside code. Tips for leaders. Advice on dogs, accidents, obstructions, etc.";
  }else if(hRef[i] == "contacts.html"){tipTxt[i]="Where to meet. Contacting secretaries, walk co-ordinators and leaders. Joining 'Ramblers'.";
  }else if(hRef[i] == "news.html"){tipTxt[i]="Read the latest Penrith Ramblers newsletter, which is provided in both HTML and PDF formats.";
  }else if(hRef[i] == "thumbpg.html"){tipTxt[i]="Sets of photographs provided by members of Penrith ramblers. View singly or as slide shows.";
  }else if(hRef[i] == "dales.html"){tipTxt[i]="Yorkshire Dales - its location, a brief account of its topography and tourist facilities with photos.";
  }else if(hRef[i] == "eden.html"){tipTxt[i]="The Eden Valley - its location, topography and info on its many tourist facilities plus photos.";
  }else if(hRef[i] == "howgill.html"){tipTxt[i]="The Howgills - its location with a description of its geology and topography with photographs.";
  }else if(hRef[i] == "lake.html"){tipTxt[i]="The Lake District - a diagram with lists of lakes, mountains and tourist facilities plus photos";
  }else if(hRef[i] == "pennine.html"){tipTxt[i]="The western Pennines - a brief account of the topography and tourist facilities with photos";
  }else if(hRef[i] == "gear.html"){tipTxt[i]="Advice on basic walking gear plus suggested extras for serious fell walking in cold and ice.";
  }else if(hRef[i] == "compass.html"){tipTxt[i]="Ordnance Survey grid references. How to use a compass. An insight into GPS use.";
  }else if(hRef[i] == "medical.html"){tipTxt[i]="Recognising, strokes, cardiac arrest and heart attacks. Preventing aches and Lyme disease.";
  }else if(hRef[i] == "site.html"){tipTxt[i]="Info. on facilities on web site with javascript ON. Aims of site. Diary. Web host. Web master, etc.";
  }else if(hRef[i] == "photoHelp.html"){tipTxt[i]="Introduction, submitting photos, help viewing photos, printing photos, corrupted photos.";
  }else{tipTxt[i]="";
  } //end else
  } //end for

  divhasTip=new Array();
  idTxt=new Array();

  //Get elements 'div' with class-name "hasTip" using function in global.js This is for tooltips to do with facilities on Walks' Programme page
  divhasTip=getElemsByClassName("hasTip","div");
  lenDivhasTip= divhasTip.length;
  for(var i=0; i<lenDivhasTip;i++){
  idTxt[i]=divhasTip[i].id;
  if(idTxt[i]=="printButton"){tipTxt[i+lenLinks]="The print facility enables the printing of a choice of monthly programmes of walks, selected using a check box. (No navigation bars should appear.) Included are instructions on setting up your printer dialogue box to prevent wasted output.";
  }else if(idTxt[i]=="WalkPlaceButton"){tipTxt[i+lenLinks]="This facility adds a column labelled M to the tables. Clicking M in the row of a walk plots the region of the walk on one of four maps. A second button, 'OS maps for walks' appears, which if clicked shows the OS maps for that region.";
  }else if(idTxt[i]=="gradeLegend"){tipTxt[i+lenLinks]="Grd = Grades of rising difficulty from L (Leisurely),  M (Moderate) , S (Strenuous) to Ch (Challenging). WP = Walk parties (on Wednesdays), when there are 4. At times the B party can opt for M or S grade walks. See 'Guide Lines to walks' for more info.";
  }else{tipTxt[i]="";
  }// end if
  } //end for
  return[hRef],[idTxt];
  } //eof startUp


function tip(thisLink){
  if(thisLink.getAttribute("className")){ //IE before IE8
  classText = thisLink.getAttribute("className");
  }else{classText = thisLink.getAttribute("class"); //Mozilla Firefox, Opera and IE8+
  }
  if (classText != "hasTip"){ return false; } // Return if the link  has no tooltip associated with it
  var posn=new Array();
  posn=findPos(thisLink);
  xTag=posn[0];
  yTag=posn[1];

  // switch off tooltips when mapping of walks is displayed and xTag not between 100 and 500 This removes all tooltips but 'gradeLegend'
  if((mapDisplay.on)&&((xTag<100)||(xTag>500))){ return false;} //mapDisplay is a global variable set in global.js used to link toggleMap.js and toolTips.js
  if((thisLink.href==undefined)&&(thisLink.id=="")){return false; }// return if function tip is activated without tags href or id present.
  var pointerX=0;// this will become the value of imgPointer.style.left
  var tooltipDivX=0; // this will become the value of tipDiv.style.left
  var pointerShiftY=0; //this is an extra shift in y co-ordinate of pointer depending on depths of tooltip
  var specialShiftY=0; // this is an extra shift in y co-ordinates of both pointer and tooltip for special cases

  //Consider tag href. This is involved with tooltips to links to other pages.
  if(thisLink.href!=undefined){ //if a
  var fullHref=thisLink.href;
  var hrefBits=fullHref.split("/");
  ourHref=hrefBits[hrefBits.length-1];
  for(i=0;i<lenLinks;i++){
  if(hRef[i]==ourHref){ //if b
  tipText=tipTxt[i];
  i=lenLinks;
  } //end ifb
  } // end for

  //Get horizontal position of tooltipDiv and imgPointer, depending on whether button is on L.H.S. or R.H.S. of page 
  if(xTag>500){ //tooltip on right hand side of page
  tooltipDivX=xTag-360+"px";
  pointerX=xTag-53+"px";
  imgPointer.setAttribute("src","images/pointer2.gif");
  tipDiv.className= "tooltipShadow2";
  }else{  //tooltip on lefthand side of page
  tooltipDivX=xTag+197 +"px"
  imgPointer.setAttribute("src","images/pointer1.gif");
  pointerX=xTag +145 +"px";
  tipDiv.className= "tooltipShadow1";
  } //end else

  //Set up depth and colour of border of tooltips for links to other pages
  tipDiv.style.height="52px";
  content.style.height="30px";
  tipDiv.style.backgroundColor = "#8f8";
  setupTip(tipText,"#000","#ffffdd");
  } //end if a

  //Consider tag id. This is involved with tooltips to facilities on same page, in particular the Walks Programme page
  if(thisLink.id!=""){ //if1
  pointShiftY= 22; //A deeper tooltip window means that the pointer needs to be lowered relative to it.
  var idee=thisLink.id;
  for(i=0;i<lenDivhasTip;i++){
  if( idee==idTxt[i]){ //if2
  tipText=tipTxt[i+lenLinks];
  i=lenDivhasTip;
  } //end if2
  } //end for

  //Get horizontal position of tipDiv and imgPointer, depending on whether 'facility' button is on L.H.S. or R.H.S. of page 
  if(xTag>500){ // if3, tooltip on right hand side of page
  tooltipDivX=xTag-357+"px"; //x co-ord of tipDiv
  imgPointer.setAttribute("src","images/pointer2.gif");
  pointerX=xTag-50 +"px";// x co-ord of pointer
  tipDiv.className= "tooltipShadow2";
  } //end if3
  else{ //tooltip on left hand side of page
  tooltipDivX=xTag+270 +"px";// value of tipDiv.style.left
  pointerX=xTag +218 +"px";
  imgPointer.setAttribute("src","images/pointer1.gif");
  tipDiv.className= "tooltipShadow1";

  //Special case for'Meaning' tooltip
  if(xTag>100){ //if4
  tooltipDivX=xTag+125 +"px";
  pointerX=xTag +73 +"px";
  specialShiftY=-24;
  }//end if4
  }//end else

  //Set up depth and colour of border of tooltips for facilities on same page. These are deeper than tooltips for links to other pages.
  tipDiv.style.height="94px";
  content.style.height="72px";
  tipDiv.style.backgroundColor = "#f88";
  setupTip(tipText,"#000","#ddffdd");
  pointerShiftY=22; //shift pointer down for deeper tooltip
  } //end if1

  content.className = "tooltipContent2";

  // Set style.left for tipDiv and imgPointer
  tipDiv.style.left=tooltipDivX;
  imgPointer.style.left =pointerX;

  //Set style.top for tipDiv and imgPointer. Setting depends on browser
  if(document.all){ //for I.E.
  tipDiv.style.top=yTag -16+specialShiftY +"px"; 
  imgPointer.style.top=yTag+pointerShiftY - 6 +specialShiftY +"px";
  }else{ // For non I.E.
  tipDiv.style.top=yTag -22 +specialShiftY +"px"; 
  imgPointer.style.top=yTag-12+ pointerShiftY+specialShiftY +"px";
  }  //end elde

  tipDiv.style.visibility = "visible";
  content.style.visibility="visible";
  content.appendChild(para);
  tipDiv.appendChild(content);
  document.body.appendChild(tipDiv);
  imgPointer.style.visibility="visible";
  } //eof tip

function setupTip(tipText,col, bgCol){
  content.style.backgroundColor=bgCol;
  content.style.color=col;
  
 
  //Remove any existing nodes, which the element para may have. 
  //This can occur if a navigation button is clicked on and then the page containing the navigation button is returned to via the back button.
 if(para.hasChildNodes()){
 while(para.childNodes.length>=1){
 para.removeChild(para.firstChild);
 }
 }
  
  
  tipNode=document.createTextNode(tipText);
  para.appendChild(tipNode);
  } //eof setupTip


function hide(thisLink){
  //Cancel action if para.firstChild does not exist, because 'Print Notice' or mapping of walk is on display.
  if(para.firstChild!=tipNode){return false;}
  para.removeChild(tipNode);
  tipDiv.style.visibility = "hidden";
  content.style.visibility="hidden";
  imgPointer.style.visibility="hidden";
  return;
  } //eof hide
 
 
function findPos(obj){
  var topCoor=leftCoor=0;
  while(obj!=null)
  {topCoor+=obj.offsetTop;
  leftCoor+=obj.offsetLeft;
  obj=obj.offsetParent;}
  return [leftCoor,topCoor] ; //return left and top co-ordinates in an array.
  } //eof findPos

addLoadEvent(startUp);