var nCurrentYear = 0;
var nCurrentMonth = 0;
// these are labels for the days of the week
cal_days_labels = ['T2', 'T3', 'T4', 'T5', 'T6', 'T7', 'CN'];

// these are human-readable month name labels, in order
cal_months_labels = ['Tháng 1', 'Tháng 2', 'Tháng 3', 'Tháng 4',
                     'Tháng 5', 'Tháng 6', 'Tháng 7', 'Tháng 8', 'Tháng 9',
                     'Tháng 10', 'Tháng 11', 'Tháng 12'];

// these are the days of the week for each month, in order
cal_days_in_month = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

// this is the current date
cal_current_date = new Date(); 

function Calendar(month, year) 
{
  nCurrentYear = year;
  nCurrentMonth = month;
  
  this.month = (isNaN(month) || month == null) ? cal_current_date.getMonth() : month;
  this.year  = (isNaN(year) || year == null) ? cal_current_date.getFullYear() : year;
  this.html = '';
}

Calendar.prototype.generateHTML = function(){

  // get first day of month
  var firstDay = new Date(this.year, this.month, 1);
  var startingDay = firstDay.getDay();
  //alert(startingDay);
  if(startingDay >= 1)
  	startingDay--;
  else
  	startingDay = 6;

  // find number of days in month
  var monthLength = cal_days_in_month[this.month];
  
  // compensate for leap year
  if (this.month == 1) { // February only!
    if((this.year % 4 == 0 && this.year % 100 != 0) || this.year % 400 == 0){
      monthLength = 29;
    }
  }
  
  // do the header
  var monthName = cal_months_labels[this.month]
  var html = '<table class="calendar-table">';
  
  	html += "<tr height='20px'><td class='calendar_header' valign=\"top\" colspan='7'>\n";
	html += "\n";
	html += "<table width='100%' border='0' align='center' cols=7>\n";
	html += "<tr>\n";
	html += "<td align='left' width='10%'>\n";
	html += "<a href=\"javascript:prevYear();\" style=\"text-decoration:none\"><font color='red' size=-2>&lt;&lt;</font></a>";
	html += "&nbsp;&nbsp;<a href=\"javascript:prevMonth();\" style=\"text-decoration:none\"><font color='red' size=-2>&lt;</font></a>";	
	html += "</td>\n";
	html += "</td>\n";
	
	html += "<td align='center' width='70%'>" + monthName + "&nbsp;&nbsp;&nbsp;" + this.year + "</td>\n";
	html += "<td align='right' width='10%'>\n";
	html += "<a href=\"javascript:nextMonth();\" style=\"text-decoration:none\"><font color='red' size=-2>&gt;</font></a>";
	html += "&nbsp;&nbsp;<a href=\"javascript:nextYear();\" style=\"text-decoration:none\"><font color='red' size=-2>&gt;&gt;</font></a>";	
	html += "</td>\n";
	html += "</tr>\n";
	html += "</table>\n";
	html += "</td></tr>\n";

  html += '<tr class="calendar-header">';
  for(var i = 0; i <= 6; i++ ){
    html += '<td class="calendar-header-day">';
    html += cal_days_labels[i];
    html += '</td>';
  }
  html += '</tr><tr>';

  // fill in the days
  var currDate = new Date();
  var day = 1;
  // this loop is for is weeks (rows)
  for (var i = 0; i < 9; i++) {
    // this loop is for weekdays (cells)
    for (var j = 0; j <= 6; j++) 
	{ 
      
      if (day <= monthLength && (i > 0 || j >= startingDay)) 
	  {
		var date = new Date(nCurrentYear, nCurrentMonth, day);
		
		if( currDate.getYear() == date.getYear() && currDate.getMonth() == date.getMonth() && currDate.getDate() == date.getDate() )
		{
			html += '<td class="calendar_current_date">';
		}
		else if (date.getDay() == 0 || date.getDay() == 6)
			html += '<td class="calendar_weekend_date">';
		else		
			html += '<td class="calendar_normal_date">';
       	html += day;
        day++;
      }
	  else
	  	html += '<td>';
      html += '</td>';
    }
    // stop making rows if we've run out of days
    if (day > monthLength) {
      break;
    } else {
      html += '</tr><tr>';
    }
  }
  html += '</tr></table>';

  this.html = html;
}

Calendar.prototype.getHTML = function() {
  return this.html;
}

function prevMonth()
{
  	nCurrentMonth --;
    if(nCurrentMonth == -1)
	{
		nCurrentYear --;
		nCurrentMonth = 11;		
	}
	var cal = new Calendar(nCurrentMonth, nCurrentYear);
    cal.generateHTML();
    document.getElementById('div_calendar').innerHTML = cal.getHTML();
}
function nextMonth()
{
  	nCurrentMonth ++;
    if(nCurrentMonth == 12)
	{
		nCurrentYear ++;
		nCurrentMonth = 0;		
	}
	var cal = new Calendar(nCurrentMonth, nCurrentYear);
    cal.generateHTML();
    document.getElementById('div_calendar').innerHTML = cal.getHTML();
}
function prevYear()
{
  	nCurrentYear --;    
	var cal = new Calendar(nCurrentMonth, nCurrentYear);
    cal.generateHTML();
    document.getElementById('div_calendar').innerHTML = cal.getHTML();
}
function nextYear()
{
  	nCurrentYear ++;    
	var cal = new Calendar(nCurrentMonth, nCurrentYear);
    cal.generateHTML();
    document.getElementById('div_calendar').innerHTML = cal.getHTML();
}
function renderCalendar(calendar_id)
{
	var date = new Date();
    nCurrentYear = date.getFullYear();
	nCurrentMonth = date.getMonth();
	
	//nCurrentMonth = 5;
	
	var cal = new Calendar(nCurrentMonth, nCurrentYear);
    cal.generateHTML();
	document.getElementById(calendar_id).innerHTML = cal.getHTML();
}// JavaScript Document