var CalUI = {
  min: new Date(),
  max: new Date(),
  selected: new Date(),
  today: new Date(),
  table: function(date) {
    var html = [];

    html.push('<table border="0" cellspacing="0" cellpadding="1"><thead><tr>');

    // Create row for days of week
    for (var i = 0; i < 7; i++) {
      html.push('<th>' + Dates.days[i].charAt(0) + '</th>');
    }

    html.push('</tr></thead><tbody><tr>');

    // Pad to correct day-of-week for 1st of month
    var monthStart = Dates.monthStart(date);
    for (var i = 0; i < monthStart.getDay(); i++) {
      html.push('<td>&nbsp;</td>');
    }

    var monthEnd = Dates.monthEnd(date);
    var current = monthStart;
    for ( ; Dates.day(current) <= Dates.day(monthEnd); current.setDate(current.getDate()+1) ) {
      var week_day = current.getDay();
      // Get the Day No.
      // Start new table row if Sunday
      if (week_day == 0) { html.push('<tr>'); }
      // TODO: change 'today' to minday
      if ( Dates.inRange(current, this.min, this.max) != 0 ) {
        var classes = this.cellClass(current) || [];
        html.push('<td class="' + classes.join(' ') + '">' + current.getDate() + '</td>');
      } else {
        // Normal Day
        var classes = this.cellClass(current) || [];
        html.push('<td class="' + classes.join(' ') + '">');
        html.push('<a href="javascript:CalUI.select(' + current.getTime() + ')">' + current.getDate() + '</a>');
        html.push('</td>');
      }
      // End Row if Saturday
      if (week_day == 6) {
        html.push('</tr>');
      }
    }

    // Fill to end of calendar table
    for ( ; current.getDay() != 0; current.setDate(current.getDate()+1) ) {
      html.push('<td>&nbsp;</td>');
    }

    html.push('</tbody></table>');
    return html.join('\n');
  },
  cellClass: function(date) {
    var classes = [];
    var day = date.getDay();
    classes.push((day == 0 || day == 6) ? 'weekend' : 'weekday');
    if (Dates.day(date) == Dates.day(this.selected)) { classes.push('selected') }
    if (Dates.day(date) == Dates.day(CalUI.today)) { classes.push('today') }
    return classes;
  },
  select: function(date) {
    // hide calendar once user chooses date
    HideLayer()

    // convert to date
    date = Dates.date(date);

    // Set field value
    $('calendar_day').value = date.getDate();
    $('calendar_month_year').value = (date.getMonth() + 1) + '/' + date.getFullYear();

    // Hide the Layer
    DynamicUpdate('calendar_day','change')
  },
  monthOptions: function(date) {
    var diff = Dates.diff(this.min, this.max, 2) + 1;

    var selectedMonth = Dates.monthStart(date);

    var options = [];
    for (var current = Dates.monthStart(this.min); Dates.day(current) < Dates.day(this.max); current.setMonth(current.getMonth() + 1)) {
      var selected = (Dates.diff(current, selectedMonth) == 0) ? ' selected=selected ' : '';
      options.push('<option ' + selected + ' value="' + current.getTime() + '">' + Dates.monthName(current) + ' ' + current.getFullYear() + '</option>');
    }
    return options.join('\n');
  },
  create: function(date) {
    date = Dates.date(date);

    var html = [];

    var visible = (Dates.diff(this.min, date, 2) > 0) ? 'visible' : 'hidden';
    html.push('<a id="CalPrevious" class="previous" href="javascript:CalUI.previous()" style="visibility: ' + visible + '">previous month</a>');
    html.push('<select id="CalMonth" onchange="CalUI.update(parseInt(this.value))" name="MonthSel" class="months">' + this.monthOptions(date) + '</select>');
    visible = (Dates.diff(date, this.max, 2) > 0) ? 'visible' : 'hidden';
    html.push('<a id="CalNext" class="next" href="javascript:CalUI.next()" style="visibility: ' + visible + '">next month</a>');

    // Add Calendar Table
    html.push('<div id="CalDates">');
    html.push(this.table(date));
    html.push('</div>');

    // Add Close link
    html.push('<a class="close" href="javascript:HideLayer()">Close</a></div>');

    // Output HTML to Layer
    var container = CalendarContainer();
    container.innerHTML = unescape(html.join(''));
    Overlay.resize(container);
  },
  next: function() {
    var date = Dates.date(parseInt($F('CalMonth')));
    date.setMonth(date.getMonth() + 1);
    $('CalMonth').value = date.getTime();
    this.update(date);
  },
  previous: function() {
    var date = Dates.date(parseInt($F('CalMonth')));
    date.setMonth(date.getMonth() - 1);
    $('CalMonth').value = date.getTime();
    this.update(date);
  },
  update: function(date) {
    date = Dates.date(date);
    $('CalPrevious').style.visibility = (Dates.diff(this.min, date, 2) > 0) ? 'visible' : 'hidden';
    $('CalNext').style.visibility = (Dates.diff(date, this.max, 2) > 0) ? 'visible' : 'hidden';

    // Replace Calendar Table
    $('CalDates').innerHTML = this.table(date);
    Overlay.resize(CalendarContainer());
  }
}

function CalendarContainer() {
  var e = $('divcalendar');
  if (!e) {
    var div = document.createElement('div');
    div.id = 'divcalendar';
    div.className = 'calendar';
    e = document.body.appendChild(div, null);
  }
  return e;
}
// Main Function
function PopupDate(nextTo, min, max) {
  if (!PageLoad) {
    if ($F('productType') == '0') {
      alert("Please select your holiday type from the first drop down box before you start your search");
      return;
    }
  }

  var min = Dates.date(min);
  var max = Dates.date(max);

  // Set current selected Date
  var selected = Dates.date($F('calendar_day') + '/' + $F('calendar_month_year'));
  if (selected == null) {
    var today = new Date();
    // set to tomorrow
    selected = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1);
  }


  var triState = Dates.inRange(selected, min, max);
  if (triState < 0) selected = min;
  else if (triState > 0) selected = max;

  // Update HTML and layer
  CalUI.min = min;
  CalUI.max = max;
  CalUI.selected = selected;

  CalUI.create(Dates.monthStart(selected).getTime())

  //Move DIV
  var container = CalendarContainer();
  // First stage: get layout, but invisible
  container.style.visibility = 'hidden';
  container.style.display = 'block';

  nextTo = $(nextTo);

  if (nextTo) {
    // find position relative to body
    var n = nextTo;
    var top = 0;
    var left = 0;
    while (n && n.offsetParent && !/^body$/i.test(String(n.nodeName))) {
      top += n.offsetTop;
      left += n.offsetLeft;
      n = n.offsetParent;
    }
    container.style.top = (top - 28) + 'px';
    container.style.left = (left + nextTo.offsetWidth - container.offsetWidth) + 'px';
  } else if (document.body.clientWidth > 300) {
    // Identify if in a frameset
    if (window.frompage == 'ALTSEARCH') {
      container.style.top = '310px'
      container.style.left = (((document.body.clientWidth - 780)/2) + 55) + 'px'
    } else {
      container.style.top = '130px'
      container.style.left = (((document.body.clientWidth - 780)/2) + 15) + 'px'
    }
  }

  Overlay.show(container);
}

// Hide the Layer
function HideLayer() {
  Overlay.hide($('divcalendar'));
}

var Overlay = {
  resize: Object,
  underlay: Object,
  hide: function(element) { element.style.visibility = 'hidden';  element.style.display = 'none' },
  show: function(element) { element.style.visibility = 'visible'; element.style.display = 'block' }
}
if (document.documentElement.currentStyle) {
  if (document.documentElement.currentStyle.writingMode) {
    // IE5.5+
    Overlay = {
      underlay: function(overlay) {
        if (!overlay.underlay) {
          overlay.insertAdjacentHTML('afterEnd', '<iframe ' +
          'style="display: none; position: absolute; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);" ' +
          'src="javascript:\'\';" frameborder="0" scrolling="no"></iframe>');
          overlay.underlay = overlay.nextSibling;
        }
        Overlay.resize(overlay);
      },
      resize: function(overlay) {
        function offset(element) {
          var top = 0, left = 0;
          do {
            top  += element.offsetTop  || 0;
            left += element.offsetLeft || 0;
            element = element.offsetParent;
          } while (element);
          return { left: left, top: top};
        }
        var underlay = overlay.underlay;
        if (underlay) {
          var offsets = offset(overlay);
          underlay.style.top    = offsets.top + 'px';
          underlay.style.left   = offsets.left + 'px';
          underlay.style.width  = overlay.offsetWidth + 'px';
          underlay.style.height = overlay.offsetHeight + 'px';
          underlay.style.zIndex = overlay.currentStyle.zIndex - 1;
          underlay.style.display = '';
        }
      },
      hide: function(element) {
        element.style.visibility = 'hidden';
        element.style.display = 'none';
        if (element.underlay) element.underlay.style.display = 'none'
      },
      show: function(element) {
        Overlay.underlay(element);
        element.style.visibility = 'visible';
        element.style.display = 'block'
      }
    };
  } else {
    // IE5.01
    Overlay = {
      resize: function(element) { ShowDropDown(0, element); },
      underlay: Object,
      show: function(element) {
        element.style.display = 'block';
        ShowDropDown(0, element);
        element.style.visibility = 'visible'
      },
      hide: function(element) {
        element.style.visibility = 'hidden';
        ShowDropDown(1, element)
        element.style.display = 'none';
      }
    }
  }
}
// IE5.01 - hide <select> elements
// show: 0 = hide, 1 = show
var lastHidden = [];
function ShowDropDown(show, container) {
  // quickly run through redisplaying all previously hidden selects;
  for (var i = 0; i < lastHidden.length; i++) {
    lastHidden[i].style.visibility = '';
  }
  lastHidden.length = 0;
  if (show) {
    return;
  }
  var rect = container.getBoundingClientRect();

  var selects = document.all.tags('SELECT');
  for (var i = 0; i < selects.length; i++) {
    var select = selects[i];
    if (!select || !select.offsetParent || select.id == 'CalMonth' || select.style.visibility == 'hidden') continue;
    var rect2 = select.getBoundingClientRect();
    // check if rectangles intersect
    if (!(rect2.top > rect.bottom || rect2.bottom < rect.top || rect2.left > rect.right || rect2.right < rect.left)) {
      lastHidden.push(select);
    }
  }
  for (var i = 0; i < lastHidden.length; i++) {
    lastHidden[i].style.visibility = 'hidden';
  }
}