// global variables for calendar. 

//contains the dates of the available activities
var dateArray;

var currDay;
var currMonth;
var currYear;

var selected;

var prevDate;

var prevDocid;

var prevDocList;

/*******************
  UTILITY FUNCTIONS
********************/

function activityOnDay(theDay,theMonth,theYear) {
 
  for(var i=0; i<dateArray.length ; i++){
  	var activity = dateArray[i];
  	var date = activity[0].split("/");
  	if ( theDay == parseInt(date[0]) ){
      if ( theMonth == parseInt(date[1]-1) ){      	
      	if ( theYear-2000 == parseInt(date[2]) ){return true;}
	  }
	}	      
  }  
    return false;
}

// day of week of month's first day
function getFirstDay(theYear, theMonth){
    var firstDate = new Date(theYear,theMonth,1);
    if(firstDate.getDay() == 0){
    	return 7;
    }else{
    	return firstDate.getDay();
    }


}
// number of days in the month
function getMonthLen(theYear, theMonth) {
    var nextMonth = new Date(theYear, theMonth + 1, 1);
    nextMonth.setHours(nextMonth.getHours() - 3);
    return nextMonth.getDate();
}

/************************
  DRAW CALENDAR CONTENTS
*************************/
// clear and re-populate table based on form's selections
function populateTable() {

    if(document.getElementById('calendar') != null){

    // initialize date-dependent variables
    var theMonth = currMonth;
    var theYear = currYear;
   
    var firstDay = getFirstDay(theYear, theMonth);
    var howMany = getMonthLen(theYear, theMonth);
    var today = new Date();

    // fill in month/year in table header
    if ( document.getElementById("monthAndYear") != null )
      document.getElementById("monthAndYear").innerHTML = document.forms['chooseDate'].chooseMonth.options[theMonth].text + " " + theYear;
      
    // initialize vars for table creation
    var dayCounter = 1;
    var TBody = document.getElementById("tableBody");
    // clear any existing rows
    while (TBody.rows.length > 0) {
        TBody.deleteRow(0);
    }
    var newR, newC, dateNum;
    var done=false;
    while (!done) {
        // create new row at end
        newR = TBody.insertRow(TBody.rows.length);
        if (newR) {
            for (var i = 1; i <= 7; i++) {
            
                // create new cell at end of row
                newC = newR.insertCell(newR.cells.length);
                newC.align = "center";
                
                if (TBody.rows.length == 1 && i < firstDay) {
                    // empty boxes before first day
                    var dayvalue;
                    if (theMonth == 0)
                      dayvalue = getMonthLen(theYear-1,11) + i - (firstDay-1);
                    else
                      dayvalue = getMonthLen(theYear,theMonth-1) + i - (firstDay-1);
                      
                    newC.innerHTML = dayvalue;
                    newC.className = "hidden"
                    continue;
                }
                if (dayCounter == howMany) {
                    // no more rows after this one
                    done = true;
                }
                // plug in link/date (or empty for boxes after last day)
                if (dayCounter <= howMany) {

                   if (today.getFullYear() == theYear &&
                        today.getMonth() == theMonth &&
                        today.getDate() == dayCounter) {
                        classType = "today";
                    }
                    else
                        classType = "day";
                        
                    //alert("We controleren als er een activiteit doorgaat op " + dayCounter + "," + theMonth + "," + theYear + " met als resultaat: " + activityOnDay(dayCounter,theMonth,theYear));    

                   	if ( activityOnDay(dayCounter,theMonth,theYear) )
	                    classType += "act";
  
                  	newC.innerHTML = "<a class='" + classType + "'>" + dayCounter + "</a>";
                  	//We zetten de datum op het attribuut id
                    newC.id = dayCounter+"/"+addZeroes(theMonth)+"/"+theYear;                                                                               
                                        
                    newC.onclick = function() { click(this); };
                    newC.onmouseover = function() { mouseOver(this) };
                    newC.onmouseout = function() { mouseOut(this) };
                    
                    newC.className = "cell";
                    if ( selected != null ) {
                      if ( selected == newC.name ) {
                        newC.className = "cellselected";
                      }
                    }
                    
                    dayCounter++;

              }
              else {
                var dayvalue;
                if (theMonth == 11)
                  dayvalue = i - getFirstDay(theYear+1,0) + 1;
                else
                  dayvalue = i - getFirstDay(theYear,theMonth+1) + 1;
              
                newC.innerHTML = dayvalue;
                newC.className = "hidden"
                newC.align = "center";

                }
            }
        } else {
            done = true;
        }
    }
  }
}


function click(element){
  //decode string
  array = element.id.split("/");//in id zit de datum 
  selectDate(parseInt(array[0]), parseInt(removeZeroes(array[1])), parseInt(array[2]));
}

function mouseOver(element){
  element.className += "over";
}

function mouseOut(element){  
  if (selected == element.id ) {
    element.className = "cellselected";
  }
  else {
    element.className = "cell";
  }
}


/*******************
  INITIALIZATIONS
********************/

function initCalendar(dates, dropDown, arrows) {

  //Adhv start en stop alle data afzonderlijk in dateArray steken
  dateArray = new Array();  
  var tellerDateArray = 0;
  
  for(var i = 0 ; i < dates.length ; i++){  
  	//We vormen dit hier om naar een Array van Arrays van de vorm [date, docid] waarbij date een datum is waarop de activiteit doorgaat
  	var activiteit = dates[i];
  	var startArray = activiteit[0].split("/");
  	var stopArray = activiteit[1].split("/");
  	var id = activiteit[2];
  	startYear = "20" + startArray[2]; //jaar 2007 stond als 07 dus hier nog even aanpassen
  	stopYear = "20" + stopArray[2]; //jaar 2007 stond als 07 dus hier nog even aanpassen  	
  	var startDate = new Date(parseInt(startYear),parseInt(startArray[1]-1),parseInt(startArray[0]));
  	var stopDate = new Date(parseInt(stopYear),parseInt(stopArray[1]-1),parseInt(stopArray[0]));
  	var workDate = new Date();
  	workDate = startDate;//We zetten de workDate op de startDate
   	
  	while (workDate.getTime()<=stopDate.getTime()){
  			//workDate terug omzetten naar string van de vorm D/MM/YY
  			var workDateMonthString = workDate.getMonth() + 1;
  			var workDateYearString = workDate.getFullYear()-2000;  		
  			var workDateStringValue = workDate.getDate() + "/" + workDateMonthString + "/" + workDateYearString; 
  			var dag_docid = new Array();
  			dag_docid[0] = workDateStringValue;
  			dag_docid[1] = id;
  			dateArray[tellerDateArray] = dag_docid; //[date,docid] met date van de vorm "D/MM/YY"
			tellerDateArray++;
	 		workDate.setDate(workDate.getDate()+1);//bij workdate een dag bijtellen	
  	}  	
  }
   
  
  
  //opbouwen structuur kalender, nog niet de inhoud 

  if(document.getElementById('calendar') != null) {  
      var calendarHTML = "<table id='calendarTable'>" + 
      "<tr><td id='calendarHeader' colspan='7' align='center' nowrap='true'>" +
      "<table cellspacing='0' width='100%'><tr>";
      
      if (arrows)
        calendarHTML += "<th onclick='monthChanged(-1)' width='20px' class='arrow'><a>&lt;</a></th>";
      else
        calendarHTML += "<th/>";
      
      if (dropDown) {
        calendarHTML += "<th colspan='5'><p>";
      }
      else {
        calendarHTML += "<th colspan='5'><p id='monthAndYear'/><div style='display:none'>";
      }
      
        calendarHTML += "<form name='chooseDate' id='chooseDate'>" +
        "<select name='chooseMonth' onchange='selectChanged()'><option>Januari</option><option>Februari</option><option>Maart</option><option>April</option><option>Mei</option><option>Juni</option><option>Juli</option><option>Augustus</option><option>September</option><option>Oktober</option><option>November</option><option>December</option></select>" +
        "<select name='chooseYear' onchange='selectChanged()'/>" +
        "</form></div></th>";
      
      if (arrows)
        calendarHTML += "<th onclick='monthChanged(1)' width='20px' class='arrow'><a>&gt;</a></th>";
      else
        calendarHTML += "<th/>";
      
      calendarHTML +=
      "</tr></table></td></tr>" +
      "<tr id='daysofweek'><th>Ma</th><th>Di</th><th>Wo</th><th>Do</th><th>Vr</th><th>Za</th><th>Zo</th></tr>" +
      "<tbody id='tableBody' />" +       
      "</table>";
            
      document.getElementById('calendar').innerHTML = calendarHTML;
  }
  
}


// create dynamic list of year choices
function fillYears() {

    if(document.getElementById('calendar') != null){
        var today = new Date();
        var thisYear = today.getFullYear();
        
        var yearChooser = document.forms['chooseDate'].chooseYear;
        for (i = thisYear ; i < thisYear + 5; i++) {
            yearChooser.options[yearChooser.options.length] = new Option(i, i);
        }

		// set current month/year
		currMonth = today.getMonth();
		currYear = today.getFullYear();
		
		updateSelect();
		
		// mark today
		selectDate(today.getDate(), today.getMonth(), today.getFullYear());
    }
}

function updateSelect() {
  var today = new Date()
	document.forms['chooseDate'].chooseMonth.selectedIndex = currMonth;
	document.forms['chooseDate'].chooseYear.selectedIndex = currYear-today.getFullYear();
	populateTable();
}

function selectChanged() {
  currMonth = document.forms['chooseDate'].chooseMonth.selectedIndex;
  currYear = parseInt(document.forms['chooseDate'].chooseYear.options[document.forms['chooseDate'].chooseYear.selectedIndex].text);
  populateTable();  
}

function monthChanged(dir) {
	if (dir > 0)
		currMonth++;
	else if (dir < 0)
		currMonth--;
	
	if (currMonth==-1)
	{
		currMonth=11;
		currYear--;
	}
	if (currMonth==12)
	{
		currMonth=0;
		currYear++;
	}
	
  updateSelect();
	populateTable();
}


/*******************
   PROCESS CHOICE
********************/

function selectDate(day, month, year) {
 
 
 //Hier moet ik aan de id's zien te geraken van de activiteiten voor die dag adhv dateArray
 
 var docids = new Array();//array voor het bewaren van de docids
 var tellerdocids = 0;
 
 //Data van de activiteiten in dateArray doorolopen en controleren als er een match is
 // indien ja, docid toevoegen aan array
 for(var j=0 ; j<dateArray.length ;j++){
 	var act = dateArray[j]; 	
 	var datedata = act[0].split("/");
 	if(parseInt(day) == parseInt(datedata[0])){
 		if(parseInt(month) == parseInt(datedata[1]-1)){
 			if((parseInt(year)-2000) == parseInt(datedata[2])){
 				docids[tellerdocids]=act[1]
 				tellerdocids++;
 			}
 		}	
 	}
 	
 }
  
 if (selected != null)deselect(selected); 	

 // date to right string format
 var date = day + "/" + addZeroes(month) + "/" + String(year).slice(2);
 var dateSelected = day + "/" + addZeroes(month) + "/" + year;
 
 var el = document.getElementById(dateSelected);
  if (el != null)el.className = "cellselectedover";
  selected = dateSelected;
  //alert("selected staat op " + dateSelected);
 
 //docids doorlopen en elementen aanzetten/afzettten 
 	//eerst alle getoonde spans afzetten via prevDocList 	
 	if (prevDocList != null){
 		for (var t=0 ; t<prevDocList.length ; t++){ 		
 		   var oldList = getElementsByName_fffix("span",prevDocList[t]);
		    for (i=0;i<oldList.length;i++){
		      oldList[i].style.display = "none";
		    }
		}
 	} 
 	
 	//alert("er werden " + docids.length + " documentid's gevonden");
 	
    //daarna docids doorlopen en spans aanzetten
    for(var d = 0 ; d<docids.length ; d++){
       	var docid = docids[d];	   	
	   	var el = getElementsByName_iefix("td",docid);
	  	if (el[0] != null)el[0].className = "cellselectedover";
	  	var list = getElementsByName_fffix("span", docid);
	  	
	  	for (i=0;i<list.length;i++){
	    	list[i].style.display = "block";
	  	}   	
	  	// empty element
	  	var empty = getElementsByName_fffix("div", "empty");
	  	var activiteitenlijst = getElementsByName_fffix("div", "activiteitgevonden");
	  	
	  	//alert("er werden " + list.length + " spans gevonden met id " + docid);
	  	
	  	if (empty[0] != null ) {
	    	if (list.length == 0) {
	      		empty[0].style.display = "block";
	    	}else {
		      	empty[0].style.display = "none";
	    	}
	  	}
	  	if (activiteitenlijst[0] != null ) {
	    	if (list.length == 0) {
	    		activiteitenlijst[0].style.display="none";
	    	}else {
		      	activiteitenlijst[0].style.display="block";
	    	}
	  	}
	 }
	 
	 //Geen resultaat(docid) gevonden -> melding geven (=empty activeren)
	 if(docids.length == 0){
	 	// empty element
	  	var empty = getElementsByName_fffix("div", "empty");
	 	if (empty[0] != null ) {	    	
	    	empty[0].style.display = "block";	    	
	  	}
	 }
	 
  //nieuwe waarden zijn oude waarden voor volgende keer
  prevDocList = docids;  
  
  // fill in the date where <span name="dateSelected"/>
  var dateElements = getElementsByName_fffix("span", "dateSelected");
  for (i=0;i<dateElements.length;i++){
  
  	selectedarray = selected.split("/");
  	
  	var maandwaarde = (parseInt(selectedarray[1], 10) + 1);    
    dateElements[i].innerHTML = selectedarray[0] + "/" + maandwaarde + "/" + selectedarray[2];//Hier misschien PROBLEMEN
  }  
    
}

function deselect(dateselected) {	
  var list = document.getElementById(dateselected);  
  if (list != null)list.className = "cell";
}


function update() {
  //decode string
  array = selected.split("/"); 
  selectDate(parseInt(array[0]), removeZeroes(array[1]), parseInt(array[2]) );
}

// gebuik dit wanneer je de tags in html aanmaakt !!
function getElementsByName_iefix(tag, name) {
     
     var elem = document.getElementsByTagName(tag);
     var arr = new Array();
     for(i = 0,iarr = 0; i < elem.length; i++) {
          //att = elem[i].getAttribute("name");
          att = elem[i].name;
          if(att == name) {
               arr[iarr] = elem[i];
               iarr++;
          }
     }
     return arr;
}

// gebruik dit wanneer je de tags via de DOM aanmaakt !!
function getElementsByName_fffix(tag, name) {

     var elem = document.getElementsByTagName(tag);
     var arr = new Array();
     for(i = 0,iarr = 0; i < elem.length; i++) {
          att = elem[i].getAttribute("name");
          //att = elem[i].name;
          if(att == name) {
               arr[iarr] = elem[i];
               iarr++;
          }
     }
     return arr;
}

function addZeroes(number) {
  if (number<10)
    return ("0" + number);
  else
    return number;
}

function removeZeroes(string) {
  if ( string.slice(0,1) == "0" )
    return (parseInt(string.slice(1,2)));
  else
    return (parseInt(string.slice(0,2)));
}