<!-- hide

var thisPage=document.location.pathname; // used in drawHub, a reference to the current page without any querystring.

// /js-css4/hubs-preload.js
  
  /* This pre-loads the hub images and contains all the functions necessary to write the hub html on the page.
   to use, place where you want the hub:
   
   for a 3-node hub: 
   
   <script language="javascript">
   drawHub('nss_20_overview.html','nss_20_fb.html','nss_20_sp.html',2); //for 3 nodes send only 3 urls.
   </script>
  
   or for 4-node hub:
   
   <script language="javascript">
   drawHub('nss_20_overview.html','nss_20_fb.html','nss_20_sp.html','nss_20_op.html',2); // for 4 nodes, send 4 urls.
   </script>
  
  
   For other sites, use a logical naming sequence & alter the image urls in the image load loop.
   No need to specify the size of images - width & height attributes will be automatically generated.
  
   This script should be used to handle a standard hub for the entire site.
   The hub images are considered to be constant throughout the site.
   The hub images must not be altered once this file is linked to else existing pages will break.
   Same goes for the links to the images - leave alone!
   If you want to use some different images for your hub then see how drawHubOrdering() goes about this.
  
  
  */
  
function objHub(argOff,argOn, argAlt) //send image path for on & off images
{
  this.off = new Image();
  this.off.src = argOff;
  this.on = new Image();
  this.on.src = argOn;
  this.alt = argAlt;
  return this
}

var hubImgArray = new Array(); //an array of objHub objects
var altArray = new Array('Kuvaus','Ominaisuudet ja edut','Tekniset tiedot','Tuotevaihtoehdot'); //default alt text
//Create 4 new hub objects & populate hubImgArray()

  hubImgArray[0] = new objHub('/assets/hub-nav-ov_0.gif','/assets/hub-nav-ov_1.gif','Panoramica');
  hubImgArray[1] = new objHub('/assets/hub-nav-fb_0.gif','/assets/hub-nav-fb_1.gif','Vantaggi Principali');
  hubImgArray[2] = new objHub('/assets/hub-nav-sp_0.gif','/assets/hub-nav-sp_1.gif','Dettagli');
  hubImgArray[3] = new objHub('/assets/hub-nav-op_0.gif','/assets/hub-nav-op_1.gif','Ordinazione');
  


function CurrentHub(argInt)//argInt is 1-4 & represents the hub to be live.
{
//achieve this by making the 'current' hub 'off' image the same as the 'on' image.
//-1 means that no hub will be ON.
  if (argInt > -1)
    hubImgArray[argInt-1].off.src = hubImgArray[argInt-1].on.src;
}


//by default this function will use images corresponding to 'overview', 'features & benefits','Specifications' and 'Product Options'(Tuotevaihtoehdot).  
//to use 'Ordering info' (Tilaustiedot) as 4th node, do not call drawHub, instead call drawHubOrdering(...) with the same arguments.
function drawHub() //arg1,arg2,arg3[,arg4] are URL targets. Final argument will be is current hub (1,2,3 or 4)
{
  var hubCount = arguments.length -1; // 3 or 4 nodes
  //this will write the HTML out to the page for the 3 or 4 node hub.
  var thisHub = arguments[arguments.length - 1];
  CurrentHub(thisHub) //make off value the same as on value for current hub image. last argument will be 1-4
  var hubWidth = 0;
  for(i=0;i<4;i++) hubWidth += hubImgArray[i].off.width; 
  var hubStr =  '\n\n<!--THE HUB (dynamically written) -->\n<table border="0" cellspacing="0" cellpadding="0" width="420"><tr><td>';
  
  hubStr += ( (thisHub != 1 ) ? '<a href="' + arguments[0] + '" onMouseOver="document.images.hub' + 0 + '.src = \'' + hubImgArray[0].on.src + '\'" onMouseOut="document.images.hub' + 0 + '.src = \'' + hubImgArray[0].off.src + '\'">' : '') + '<img name="hub0" src="' + hubImgArray[0].off.src + '" width="79"  height = "25" alt="' + hubImgArray[0].alt + '" border="0">' + ( (thisHub != 1 ) ? '</a>' : '');
  hubStr += ( (thisHub != 2 ) ? '<a href="' + arguments[1] + '" onMouseOver="document.images.hub' + 1 + '.src = \'' + hubImgArray[1].on.src + '\'" onMouseOut="document.images.hub' + 1 + '.src = \'' + hubImgArray[1].off.src + '\'">' : '') + '<img name="hub1" src="' + hubImgArray[1].off.src + '" width="123" height = "25" alt="' + hubImgArray[1].alt + '" border="0">' + ( (thisHub != 2 ) ? '</a>' : '');
  hubStr += ( (thisHub != 3 ) ? '<a href="' + arguments[2] + '" onMouseOver="document.images.hub' + 2 + '.src = \'' + hubImgArray[2].on.src + '\'" onMouseOut="document.images.hub' + 2 + '.src = \'' + hubImgArray[2].off.src + '\'">' : '') + '<img name="hub2" src="' + hubImgArray[2].off.src + '" width="72" height = "25" alt="' + hubImgArray[2].alt + '" border="0">' + ( (thisHub != 3 ) ? '</a>' : '');
     
  if(hubCount == 3) // special case = 4th node is not active. Need to add the 4th node image only.
  {
    hubStr += '<img name="hub' + 4 + '" src="' + hubImgArray[3].off.src + '" width="83" height = "25" alt="' + hubImgArray[3].alt + '" border="0">';
	hubImgArray[3].on.src = hubImgArray[3].off.src;
  }
  else
    hubStr += ( (thisHub != 4 ) ? '<a href="' + arguments[3] + '" onMouseOver="document.images.hub' + 3 + '.src = \'' + hubImgArray[3].on.src + '\'" onMouseOut="document.images.hub' + 3 + '.src = \'' + hubImgArray[3].off.src + '\'">' : '') + '<img name="hub3" src="' + hubImgArray[3].off.src + '" width="83" height = "25" alt="' + hubImgArray[3].alt + '" border="0">' + ( (thisHub != 4 ) ? '</a>' : '');
  
  hubStr += '</td></tr></table>';
  document.writeln(hubStr); 
}  

function drawHubOrdering()
{
  hubImgArray[3].on.src  = '/assets/hub4_ordering_1.gif';
  hubImgArray[3].off.src = '/assets/hub4_ordering_0.gif';
  hubImgArray[3].alt     = 'Tilaustiedot'; //'ordering'
  if(arguments.length == 5)
    drawHub(arguments[0], arguments[1], arguments[2], arguments[3], arguments[4])
  else
    drawHub(arguments[0], arguments[1], arguments[2], arguments[3])
}
  
  
  

//-->