// dag.js - door Andree Hollander
// created: 2007-10-14
// modified: 2010-07-08; 
// 2010-10-11: vorige dag in huidige jaar laten, niet op volgend jaar zetten
// - bevat aanroep van een script dat het css-bestand alleen_bij_js.css inschakelt
// dat alleen in actie komt als javascript actief is; dit css-bestand verbergt
// onderdelen die later via js getoond kunnen worden, zoals het antwoord op de quizvraag.
//
// - bevat verder de scripts bij de dag-pagina's van de Vandaag-site,
// zoals de berekening van het weeknummer 
// en het tonen/verbergen van het antwoord op de quizvraag


// This is the anonymous function running in its own scope, preventing clashes 
// with other variable names. Just change the path to the CSS file to whatever
// suits you.
// http://www.robertnyman.com/2008/05/13/how-to-hide-and-show-initial-content-depending-on-whether-javascript-support-is-available/
//
// in dit stijlblad worden onder meer alle elementen van de class 'verberg' verborgen
//
(function () 
{ // schakelt stijlblad dag_alleen_bij_js.css in 
  // in dit stijlblad worden onder meer alle elementen van de class 'verberg' verborgen
  var head = document.getElementsByTagName("head")[0];
  if (head) 
  {
    var scriptStyles = document.createElement("link");
    scriptStyles.rel = "stylesheet";
    scriptStyles.type = "text/css";
    scriptStyles.href = "../dag_alleen_bij_js.css";
    head.appendChild(scriptStyles);
  }
}());


window.onload=function()
{ // we have to wait until the DOM has loaded before we can hook into it. 
  //
  kalendergegevens(); // actuele kalendergegevens tonen
  //
  if (document.getElementById('quizantwoordkop') )
  {
    document.getElementById('quizantwoordkop').onclick = function() 
    { // maak antwoord op quizvraag klikbaar
      toggle('quizantwoord');
    };
  };
  if (document.getElementById('raadseloplossingkop') )
  {
    document.getElementById('raadseloplossingkop').onclick = function()
    {  // maak oplossing van raadsel klikbaar
      toggle('raadseloplossing');
    };
  }
  //
  // ga alle dt-elements langs en geef ze een event-handler 
  var dt=document.getElementsByTagName("dt"); 
  for ( var i = 0; i < dt.length; i++ ) 
  { // laat bij een onclick de functie hideShowDD() uitvoeren
    dt[i].onclick = function() 
    { 
      hideShowDD(this)
    }
  };
  // als laatste het sitemeter-script uitvoeren
  // hoe?
};


//////////////////////////////////////////////////////////////////////////
function kalendergegevens()
{
  // De alinea met id kalendergegevens bevat de gegevens die getoond worden zonder JavaScript.
  // Met JavaScript ingeschakeld wordt de tekst vervangen door gegevens van de komende keer.
  // De h2 kop krijgt dag in de week en jaartal erbij, bijvoorbeeld Donderdag 14 januari 2010
  // Week 37 van 2010  
  // Dag 254 in 2010  
  // 70% van het jaar voorbij  
  // Nog 111 dagen over in 2010  
  // Ligt 123 dagen van (werkelijke datum)  
  // Dag 1234 in de 21ste eeuw
  //
  // haal dag en maand uit h1; er is slechts 1 h1, dus gebruik array-element 0
  // eerste child van h1 is de tekst , haal daarvan de nodevalue op
  var koptekst = document.getElementsByTagName('h1')[0].firstChild.nodeValue;
  koptekst = koptekst.split(" "); // splits in woorden 
  var dagnr = koptekst[0]; // eerste woord is dagnr, bv 29
  var maandnaam = koptekst[1]; // tweede woord is maandnaam, bv maart
  var maandnamen = ["januari", "februari", "maart", "april", "mei", "juni",
    "juli" ,"augustus", "september", "oktober", "november", "december"];
  var js_maandnr = bepaal_js_maandnr(maandnaam,maandnamen); // 0 - 11
  var huidigeDatum = new Date(); // dit is inclusief de tijd
  var huidigJaar = huidigeDatum.getFullYear(); // jaartal van vandaag
  // om te kunnen vergelijken met andere datums de tijd eraf halen
  huidigeDatum = new Date(huidigJaar,huidigeDatum.getMonth(),huidigeDatum.getDate());  
  var paginaDatum = bepaalPaginaDatum(dagnr,js_maandnr,huidigeDatum);
  var paginaJaar = paginaDatum.getFullYear(); // jaartal van de pagina
  //
  // kopregel invullen (dag beginnen met een hoofdletter)
  var dagnamenKapitaal = ["Zon", "Maan", "Dins", "Woens", "Donder", "Vrij", "Zater"];
  document.getElementById('paginadatum').firstChild.nodeValue =
    dagnamenKapitaal[paginaDatum.getDay()] + 
    "dag " +  dagnr  + " " + maandnaam + " " + paginaJaar;
  //
  // kalendergegevens vervaardigen
  // nieuwe regel niet mogelijk met \n of met <br>, daarom 
  // na elk onderdeel via appendChild een object br toevoegen
  var lineBreak = document.createElement("br");
  //
  // dagnummer in het jaar
  var dec31 = new Date(paginaJaar-1,11,31); // laatste dag vorig jaar
  var dagnummer = "Dag " + hoeveelDagen(paginaDatum,dec31) + " in " + paginaJaar;
  document.getElementById('kalendergegevens').firstChild.nodeValue = dagnummer;
  var kg = document.getElementById('kalendergegevens');
  // 
  // NOG TE DOEN xx % van het jaar voorbij
  //
  // nog over in het jaar
  dec31 = new Date(paginaJaar,11,31); // laatste dag dit jaar
  var dagenOver = hoeveelDagen(paginaDatum,dec31);
  var dagDagen = "dag";
  if (dagenOver != 1) {dagDagen = "dagen";}
  tekst = "Nog " + dagenOver + " " + dagDagen + " over in " + paginaJaar;
  kg.appendChild(document.createElement("br"));
  kg.appendChild(document.createTextNode(tekst) );
  // 
  // NOG TE DOEN weeknummer van jaar
  //
  // NOG TE DOEN dagnummer in de 21e eeuw
  // 
  // dagen verwijderd van huidige datum (indien ongelijk)
  var dagenVerschil = hoeveelDagen(paginaDatum,huidigeDatum);
  if (dagenVerschil > 1)
  {
    var dagnamen = ["zon", "maan", "dins", "woens", "donder", "vrij", "zater"];
    tekst = "Vandaag, " + dagnamen[huidigeDatum.getDay()] + "dag " + 
      huidigeDatum.getDate() + " " + maandnamen[huidigeDatum.getMonth()] + " " +
      huidigeDatum.getFullYear() + ", ligt " + dagenVerschil  + " dagen van "  + 
      dagnr + " " + maandnaam + " " + paginaJaar;
    kg.appendChild(document.createElement("br"));
    kg.appendChild(document.createElement("br"));
    kg.appendChild(document.createTextNode(tekst) );
  }

}



//////////////////////////////////////////////////////////////////////////
function hoeveelDagen(datum1,datum2)
{
  var EEN_DAG = 1000 * 60 * 60 * 24; // aantal milliseconden in een dag
  var datum1_ms = datum1.getTime(); // datum1 omgezet in milliseconden
  var datum2_ms = datum2.getTime(); // datum2 omgezet in milliseconden
  var verschil_ms = Math.abs(datum1_ms - datum2_ms); // verschil in ms
  var aantalDagen = Math.round(verschil_ms/EEN_DAG); // terugrekenen naar dagen
  return aantalDagen; 
}


//////////////////////////////////////////////////////////////////////////
function bepaal_js_maandnr(maandnaam,maandnamen)
{
  for (m = 0; m<=11; m=m+1)
  {
    if (maandnaam == maandnamen[m])
    {
       return m; // geef nr 0 - 11 terug
    }
  }
  // indien hier aangekomen is de naam niet gevonden
  // dit zou niet mogen voorkomen
  return -1; // geef waarde 'mislukt' terug
}


//////////////////////////////////////////////////////////////////////////
function bepaalPaginaDatum (dagnr,js_maandnr,huidigeDatum)
{ // bepaal de datum die gebruikt wordt op de pagina
  // kan gelijk zijn aan de huidige datum of een datum in de toekomst zijn
  // speciaal geval is 29 februari; daarbij kan het jaar bijna 4 jaar verder liggen
  var huidigJaar = huidigeDatum.getFullYear();
  // bij 29 feb: jaar moet deelbaar zijn door 4
    if (dagnr == 29 && js_maandnr == 1) // februari heeft nummer 1
    {
      while (huidigJaar % 4 != 0)
      {
        huidigJaar = huidigJaar + 1;
      } 
    }
  // probeer de datum in het huidige jaar
  var paginaDatum = new Date(huidigJaar,js_maandnr,dagnr);
  // als de paginadatum meer dan een dag voor de huidige datum ligt,
  // dan de datum van een jaar verder nemen.
  // alert((paginaDatum.getTime() + 86400000)  + " " +  huidigeDatum.getTime() ); // DEBUG
  // vorige dag nog in huidige jaar laten, daarom 86400000 optellen
  if ((paginaDatum.getTime() + 86400000) < huidigeDatum.getTime())
  {
    var paginajaar = huidigJaar+1;
    if (dagnr == 29 && js_maandnr == 1) // februari heeft nummer 1
    {
      while (paginajaar % 4 != 0)
      {
        paginajaar = paginajaar + 1;
      } 
    }
     paginaDatum = new Date(paginajaar,js_maandnr,dagnr);
  }
  return paginaDatum;
}




//////////////////////////////////////////////////////////////////////////
function toggle(obj) 
{
  var el = document.getElementById(obj);
  // alleen verder gaan als het object is gevonden;
  if (el != null)
  {
    if ( el.style.display != 'block' ) 
    {
      el.style.display = 'block';
    }
    else 
    {
      el.style.display = 'none';
    }
  }
    return false;
}





//////////////////////////////////////////////////////////////////////////
function hideShowDD(obj)
// er is geklikt op een dt; 
// verberg alle dd's en maak de bijbehorende dd zichtbaar
{
  var el = obj.nextSibling; 
  // we zoeken het volgende object, niet een tekstonderdeel (nodeType = 1)
  while (el.nodeType != 1 ) { el = el.nextSibling; }
  if ( el.style.display == 'block' ) 
  { // is nu getoond: daarom verbergen
    el.style.display = 'none';
   }
  else 
  { // alle dd's verbergen
    var dd=document.getElementsByTagName("dd"); 
    for ( var i = 0; i < dd.length; i++ ) 
    {
      dd[i].style.display = 'none';
    }
    // alle dd's zijn verborgen nu de dd bij de aangeklikte dt tonen
    el.style.display = 'block';
  }
}