var onIE = /explorer/i.test(navigator.appName);
var pidettavat = [];

// Ikkunan onScroll-tapahtumankäsittelijä. Siirtää paikallaan pidettävät
// (fixed) elementit ikkunan yläreunaan. Sivusuunnassa elementit
// scrollaavat mukana, koska sivuttainen uudelleensijoittelu olisi
// hankalaa, kun elementtien sivuttaissijainnit ovat suhteessa ikkunan
// leveyteen (prosenttiluvut).
function pidaPaikallaan(e) {
  for (var i=0; i<pidettavat.length; i++) {
    pidettavat[i].style.top = document.documentElement.scrollTop+'px';
  }
  // Poista kommenttimerkit seuraavalta riviltä, niin näet statuspalkissa
  // ikkunan vasemmassa yläkulmassa olevan dokumenttipisteen koordinaatit
  //status = document.documentElement.scrollLeft+','+document.documentElement.scrollTop;
}

// Funktio tunnistaa IE:n ja kerää fixed-elementit taulukkoon "pidettavat"
// ja asentaa onscroll- ja onResize-tapahtumankäsittelijän. Valikkopalkin
// paikallaan pitäminen vaatii toimenpiteitä juuri näissä tilanteissa sekä
// myös dokumenttia ladattaessa. Näissä tilanteissa valikko saattaa muuten
// jäädä väärään kohtaan.
function alustaPidettavat() {
  pidettavat.push(elem('palkki'));
  pidettavat.push(elem('herate'));
  for (var i=0; i<vLkm; i++) {
    pidettavat.push(elem('valikko'+i));
  }
  for (var i=0; i<pidettavat.length; i++) {
    pidettavat[i].style.position = 'absolute';
  }
  window.onscroll = pidaPaikallaan;
  window.onresize = pidaPaikallaan;
  pidaPaikallaan();
}

// Kaikissa selaimissa tarvittavat toiminnot
// =========================================

  var heratteenVari = '#aca';
  var heratteenKorkeus = '0.6ex';
  var juurenVari = '#dee';
  var juurenKorostus = '#aca';
  var linkinVari = 'white';
  var linkinKorostus = 'yellow';
  var rivinKorkeus = '2.6ex';
  
var vLkm;
var vPit = [];
var valittu = [-1,-1];    // Muutettu versiossa 03-1

// Kirjoittamisvaivoja vähentävä apufunktio.
function elem(id) {
  return document.getElementById(id);
}

// Funktio tekee tarvittaessa IE:n vaatimat alustustoimet sekä laskee ja
// asettaa valikoiden leveydet ja sivusuuntaiset paikat.
function alusta() {
  if (onIE) alustaPidettavat();
  var x = elem('herate').style;
  x.backgroundColor = heratteenVari;
  x.height = heratteenKorkeus;
  x = elem('palkki').style;
  x.backgroundColor = juurenVari;
  x.height = rivinKorkeus;
  var vLev = Math.round(100/vLkm);
    for (var i=0; i<vLkm; i++) {
    var lev = i<vLkm-1 ? vLev : 100-(vLkm-1)*vLev;
    x = elem('valikko'+i).style;
    x.width = lev+'%';
    x.left = i*vLev + '%';
    x = elem('juuri'+i).style;
    x.height = rivinKorkeus;
    x.backgroundColor = juurenVari;
    for (j=0; j<vPit[i]; j++) {
      x = elem('linkki'+i+j).style;
      x.backgroundColor = linkinVari;
      x.height = rivinKorkeus;
    }
  }
}

// Valikko onClick-käsittelijässä kutsuttava funktio.
function mene(v,uri) {
  katkeValikko(v);
  if (uri != undefined) location.href = uri;
}

// Funktio ottaa esille valikkopalkin.
function naytaValikkopalkki() {
  clearTimeout(kvp);
  elem('palkki').style.visibility = 'visible';
  for (var i=0; i<vLkm; i++) {
    var valikko = elem('valikko'+i);
    elem('juuri'+i).style.backgroundColor = juurenVari;
    elem('valikko'+i).style.visibility = 'visible';
  }
}

// Funktio kätkee valikkopalkin n. 0,7 sekunnin viiveellä.
// Jos viiveen aikana kutsutaan funktiota naytaValikkopalkki,
// ajastus keskeytyy ja palkkia ei kätketä lainkaan.
var kvp;
function katkeValikkopalkki() {
  clearTimeout(kvp);
  kvp = setTimeout('kv()',700);
}
function kv() {
  for (var i=0; i<vLkm; i++) {
    elem('valikko'+i).style.visibility = 'hidden';
  }
  elem('palkki').style.visibility = 'hidden';
}

// Funktio näyttää valikon ja korostaa valikon juurielementin.
// Funktiota käytetään, kun osoitin siirtyy valikon juurielementin
// tai valikon muun osan päälle.
function naytaValikko(v) {
  naytaValikkopalkki(vLkm);
  elem('juuri'+v).style.backgroundColor = juurenKorostus;
  for (var i=0; i<vPit[v]; i++) {
    var linkki = elem('linkki'+v+i);
    linkki.style.backgroundColor = linkinVari;
    linkki.style.visibility = 'visible';
  }
  if (valittu[0] == v) {     // Ehtoa muutettu versiossa 03-1
    elem('linkki'+v+valittu[1]).style.backgroundColor = linkinKorostus;
  }
}

// Funktio kätkee valikon ja poistaa sen juurielementin korostuksen.
// Funktiota käytetään, kun osoitin siirtyy valikon juurielementin
// tai valikon muun osan päältä.
function katkeValikko(v) {
  for (var i=0; i<vPit[v]; i++) {
    var linkki = elem('linkki'+v+i);
    linkki.style.visibility = 'hidden';
  }  
  elem('juuri'+v).style.backgroundColor = juurenVari;
  katkeValikkopalkki(vLkm);
}

// Funktio korostaa valikkolinkin merkitsemällä sen valituksi ja
// näyttämällä valikon uudelleen. Käyttö: valikkolinkkien onMouseOver-
// käsittelijät.
function korosta(v,i) {
  valittu = [v,i];
  naytaValikko(v);
}

// Funktio poistaa valikkolinkin korostuksen ja kätkee koko 
// valikkopalkin. Käyttö: valikkolinkkien onMouseOut-käsittelijät.
function poistaKorostus(v) {
  for (var j=0; j<vPit[v]; j++) {
    var linkki = elem('linkki'+v+j);
    linkki.style.backgroundColor = linkinVari;
    linkki.style.visibility = 'hidden';
  }
  valittu = [-1,-1];            // Muutettu versiossa 03-1
  katkeValikkopalkki(vLkm);
}

function teeValikkoElementit() {
  document.writeln(
    '<div id="herate" onMouseOver="naytaValikkopalkki();"></div>');
  document.writeln(
    '<div id="palkki"></div>');
  vLkm = valikko.length;
  for (var i=0; i<vLkm; i++) {
    vPit[i] = valikko[i].length - 1;
    document.writeln(
      '<div class="valikko" id="valikko'+i+'">');
    document.writeln(
      '<div class="juuri" id="juuri'+i+'"');
    document.writeln(
      'onMouseOver="naytaValikko('+i+');"');
    document.writeln(
      'onMouseOut="katkeValikko('+i+');">'+valikko[i][0]+'</div>');
    for (var j=1; j<=vPit[i]; j++) {
      document.writeln(
	'<div class="linkki" id="linkki'+i+(j-1)+'"');
      document.writeln(
	'onMouseOver="korosta('+i+','+(j-1)+');" '+
	'onMouseOut="poistaKorostus('+i+');"');
      document.writeln(
	'onClick="mene('+i+',\''+valikko[i][j][1]+'\');">'+
	valikko[i][j][0]+'</div>');
    }
    document.writeln('</div>');
  }
  alusta();
}