// Copyright 2005-2008 Socializr, Inc.
// Author: Jonathan Abrams

// Why are you reading this?
// If you are a great programmer, email your resume to jobs@socializr.com

var daysOfWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var dayPostfix = ["st", "nd", "rd", "th", "th"];

function showDatePicker(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, iframeID, changeDayOfWeek) {
  var datePicker = document.getElementById(pickerID);
  var pickerIcon = document.getElementById(iconID);
    
  var month = document.getElementById(monthFieldID).value;
  var date = document.getElementById(dateFieldID).value;
  var year = document.getElementById(yearFieldID).value;
  
  var date = new Date(year, month, date);

  // need to handle Firefox
  var top = getPosition(pickerIcon).top;
  var left = getPosition(pickerIcon).left;
  datePicker.style.top = String(top - 70) + "px";
  datePicker.style.left = String(left + 32  ) + "px";
  datePicker.style.display = "block";
  
  clearPickerTable(tableID);
  buildPickerTable(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, date, changeDayOfWeek);

  if (iframeID === null || iframeID === undefined) {
    iframeID = "pickeriframe";
  }
  
  var iframe = document.getElementById(iframeID);
  iframe.style.top = String(top - 70) + "px";
  iframe.style.left = String(left + 32  ) + "px";
  iframe.style.width = datePicker.offsetWidth;
  iframe.style.height = datePicker.offsetHeight;
  iframe.style.display = "block";
}

function hideDatePicker(pickerID, iframeID) {
  var datePicker = document.getElementById(pickerID);
  datePicker.style.display = "none";
  
  if (iframeID === null || iframeID === undefined) {
    iframeID = "pickeriframe";
  }
  
  var iframe = document.getElementById(iframeID);
  iframe.style.display = "none";
}

function clearPickerTable(tableID) {
  var table = document.getElementById(tableID);
  
  while(table.hasChildNodes()) {
    table.removeChild(table.firstChild);
  }
}

function buildPickerTable(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, date, changeDayOfWeek) {
  var month = date.getMonth();
  date.setDate(1); // set to start of month  
  var today = new Date();
  
  var nextMonth = month + 1;
  var nextYear = date.getFullYear();
  if (nextMonth > 11) {
    nextMonth = nextMonth - 12;
    nextYear = nextYear + 1;
  }

  var previousMonth = month - 1;
  var previousYear = date.getFullYear();
  if (previousMonth < 0) {
    previousMonth = previousMonth + 12;
    previousYear = previousYear - 1;
  }
  
  var table = document.getElementById(tableID);
  var body = document.createElement("tbody");
  
  // header row
  var headerRow = document.createElement("tr");  
  var headerColumn = document.createElement("th");
  headerColumn.className = "header";
  headerColumn.colSpan = 7;
  var previousLink = document.createElement("a");
  previousLink.href = "#previous";
  previousLink.onclick = createChangeDateHandler(monthFieldID, dateFieldID, yearFieldID, pickerID,
    tableID, iconID, previousMonth, 1, previousYear, changeDayOfWeek);
  var previousIcon = document.createElement("img");
  previousIcon.border = 0;
  previousIcon.title = "Previous";
  previousIcon.src = "http://static.socializr.com/icons/arrow_left.gif";
  previousLink.appendChild(previousIcon);
  headerColumn.appendChild(previousLink);
  var headerDate = getMonthName(date.getMonth()) + " " + date.getFullYear();
  headerColumn.appendChild(document.createTextNode("\u00a0 " + headerDate + " \u00a0"));
  var nextLink = document.createElement("a");
  nextLink.href = "#next";
  nextLink.onclick = createChangeDateHandler(monthFieldID, dateFieldID, yearFieldID, pickerID,
    tableID, iconID, nextMonth, 1, nextYear, changeDayOfWeek);
  var nextIcon = document.createElement("img");
  nextIcon.border = 0;
  nextIcon.title = "Next";
  nextIcon.src = "http://static.socializr.com/icons/arrow_right.gif";
  nextLink.appendChild(nextIcon);  
  headerColumn.appendChild(nextLink);
  headerRow.appendChild(headerColumn);  
  body.appendChild(headerRow);
  
  // day row
  var dayRow = document.createElement("tr");
  addTextHeader(dayRow, "dayofweek", "Sun");
  addTextHeader(dayRow, "dayofweek", "Mon");
  addTextHeader(dayRow, "dayofweek", "Tue");
  addTextHeader(dayRow, "dayofweek", "Wed");
  addTextHeader(dayRow, "dayofweek", "Thu");
  addTextHeader(dayRow, "dayofweek", "Fri");
  addTextHeader(dayRow, "dayofweek", "Sat");
  body.appendChild(dayRow);
  
  var row = document.createElement("tr");
  
  // date.getDay()returns a value 0-6 representing day of the week, but Sunday=0, Saturday=6, 
  // whereas our date picker has Monday=0, Sunday=6. So we have to adjust the offset value below
  
  //<<<<This will need to change depending on the start day of the week preference that
  // <<<<<later be added.
  //  var offset = date.getDay() - 1; 
  
  var offset = date.getDay(); // week starts on sunday

  if (offset < 0) {
    offset = offset + 7; // handle sunday
  }
  
  for (i = 0; i < offset; i++) {
    addTextColumn(row, "othermonth", "");
  }
  
  var i = 1;
  var week = 1;
  
  while (date.getMonth() == month) {
    date.setDate(i);
    
    var dayOfWeek = ((i + offset - 1) % 7);
    
    if ((i > 1) && (date.getMonth() == month) && (dayOfWeek == 0)) {
      body.appendChild(row);
      row = document.createElement("tr");
      week++;
    }

    if (date.getMonth() == month) {
      var className = "";
      if ( (today.getMonth() == month) && (today.getDate() == i) ) {
        className = "today";
      }
      else {
        className = "date";
      }
      
      var onclick = createPickerClickHandler(pickerID, month , i, date.getFullYear(), 
         monthFieldID, dateFieldID, yearFieldID, changeDayOfWeek);
      addLinkColumn(row, className, "#" + i, onclick, i);
    }
    
    i++;
  }

  //  var offset2 = 8 - date.getDay();  // week starts on monday
  var offset2 = 7 - date.getDay();  // week starts on sunday
  if (offset2 >= 7) {
    offset2 = offset2 - 7; // handle monday and sunday
  }
    
  for (i = 0; i < offset2; i++) {
    addTextColumn(row, "othermonth", "");
  }
  
  body.appendChild(row);
  table.appendChild(body);
}

function changePickerDate(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, month, dateValue, year, changeDayOfWeek) {   
  var date = new Date(year, month, dateValue);
  clearPickerTable(tableID);
  buildPickerTable(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, date, changeDayOfWeek);  
}

function setDateFromPicker(pickerID, month, date, year, monthFieldID, dateFieldID, yearFieldID, changeDayOfWeek) {  
  var monthField = document.getElementById(monthFieldID);
  var dateField = document.getElementById(dateFieldID);
  var yearField = document.getElementById(yearFieldID);
    
  monthField.value = month;
  dateField.value = date;
  yearField.value = year;
  
  if (changeDayOfWeek) {
    changeRecurrence(monthFieldID, dateFieldID, yearFieldID);
  }
  
  hideDatePicker(pickerID);
}

function createPickerClickHandler(pickerID, month, date, year, monthFieldID, dateFieldID, yearFieldID, changeDayOfWeek) { 
  return function() {
    setDateFromPicker(pickerID, month , date, year, monthFieldID, dateFieldID, yearFieldID, changeDayOfWeek);
  }
}

function createChangeDateHandler(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, month, date, year, changeDayOfWeek) {
  return function() {
    changePickerDate(monthFieldID, dateFieldID, yearFieldID, pickerID, tableID, iconID, month, date, year, changeDayOfWeek);
  }
}

function showRecurring() {
  var weeklyRecurrenceArea = document.getElementById("weeklyRecurrenceArea");
  weeklyRecurrenceArea.style.display = "";
  
  var simpleMonthlyRecurrenceArea = document.getElementById("simpleMonthlyRecurrenceArea");
  simpleMonthlyRecurrenceArea.style.display = "";
  
  var weekBasedMonthlyRecurrenceArea = document.getElementById("weekBasedMonthlyRecurrenceArea");
  weekBasedMonthlyRecurrenceArea.style.display = "";
  
  var endDateArea = document.getElementById("endDateArea");
  endDateArea.style.display = "";
  
  var endDateNote = document.getElementById("endDateNote");
  endDateNote.style.display = "";
  
  var numDaysBeforeInviteArea = document.getElementById("numDaysBeforeInviteArea");
  numDaysBeforeInviteArea.style.display = "";
}

function hideRecurring() {
  var weeklyRecurrenceArea = document.getElementById("weeklyRecurrenceArea");
  weeklyRecurrenceArea.style.display = "none";
  
  var simpleMonthlyRecurrenceArea = document.getElementById("simpleMonthlyRecurrenceArea");
  simpleMonthlyRecurrenceArea.style.display = "none";
  
  var weekBasedMonthlyRecurrenceArea = document.getElementById("weekBasedMonthlyRecurrenceArea");
  weekBasedMonthlyRecurrenceArea.style.display = "none";
  
  var endDateArea = document.getElementById("endDateArea");
  endDateArea.style.display = "none";
  
  var endDateNote = document.getElementById("endDateNote");
  endDateNote.style.display = "none";
  
  var numDaysBeforeInviteArea = document.getElementById("numDaysBeforeInviteArea");
  numDaysBeforeInviteArea.style.display = "none";
}

function changeRecurrence(monthFieldID, dateFieldID, yearFieldID) {
  var monthField = document.getElementById(monthFieldID);
  var dateField = document.getElementById(dateFieldID);
  var yearField = document.getElementById(yearFieldID);
    
  var monthValue = new Number(monthField.value);
  var dateValue = new Number(dateField.value);
  var yearValue = new Number(yearField.value);
  
  var date = new Date(yearValue, monthValue, dateValue);  
  var dayOfWeek = date.getDay();
  
  var firstOfTheMonth = new Date(yearValue, monthValue, 1);
  var dayOfWeekOfFirstOfMonth = firstOfTheMonth.getDay();
  
  var week = Math.ceil((dateValue + dayOfWeekOfFirstOfMonth) / 7)-1;
  var weekInMonth = (dayOfWeek >= dayOfWeekOfFirstOfMonth ? week : week-1);
  
  //alert( "dateValue: " + dateValue + " dayOfWeek: " + dayOfWeek + " dayOfWeekOfFirstOfMonth: " + dayOfWeekOfFirstOfMonth
  //    + " week: " + week + " weekInMonth: " + weekInMonth);
      
  var recurrenceTypeElements = document.getElementsByName(recurrentTypeElements);
  var dayOfWeekString = daysOfWeek[dayOfWeek];
    
  for (var i = 0; i < recurrenceTypeElements.length; i++) {
    var recurrenceType = recurrenceTypeElements[i].value;
    if (recurrenceType == 0) {// weekly
      var weeklyDayOfWeekSelectElement = document.getElementById(weeklyDayOfWeekId);
      if (weeklyDayOfWeekSelectElement != null) {
        weeklyDayOfWeekSelectElement.selectedIndex = dayOfWeek;
      }
    }
    else if (recurrenceType == 1) { // simple monthly
      var simpleMonthlyDayOfMonth = document.getElementById(simpleMonthlyDayOfMonthId);
      if (simpleMonthlyDayOfMonth != null) {
        simpleMonthlyDayOfMonth.selectedIndex = (dateValue-1);
      }
    } 
    else if (recurrenceType == 2) { // week-based monthly
      var weekBasedMonthlyDayOfWeekSelectElement = document.getElementById(weekBasedMonthlyDayOfWeekId);
      if (weekBasedMonthlyDayOfWeekSelectElement != null) {
        weekBasedMonthlyDayOfWeekSelectElement.selectedIndex = dayOfWeek;
      }
      var weekBasedMonthlyWeekInMonthSelectElement = document.getElementById(weekBasedMonthlyWeekInMonthId);
      if (weekBasedMonthlyWeekInMonthSelectElement != null) {
        weekBasedMonthlyWeekInMonthSelectElement.selectedIndex = weekInMonth;
      }
    } 
  }
}

function changeRecurrenceDate() {
  var message = document.getElementById("eventDateMessage");
  message.style.display = "none";
  var eventDate = document.getElementById("eventDate");
  eventDate.style.display = "block";
}