/*
 * $Id$
 * Copyright 2003,2004 WorldTicket A/S
 *
 * @version $Revision$ $Date$
 * @author Claus Brøndby Reimer (CBR) / 2M business applications a|s
 */


/**
 * The default layout for the <code>Calendar</code>.
 *
 * <p>This layout could be improved alot, by not redrawing every thing when
 * something changes, but for now it most be okay...</p>
 *
 * <p>If you want to alter the layout then just do it, but if you want more than
 * one then use this as a template, the only method which is called from the
 * Calendar is doLayout
 */
function CalendarLayout() {
    this.locale;

    this.locale = CalendarLocaleFactory.getLocale();
}


/**
 * Creates CalendarLayout
 *
 * @param selectedDate_Date the date to show as selected.
 * @param minimumDate_Date the first selectable date.
 * @param maximumDate_Date The last selectable date.
 */
CalendarLayout.prototype.doLayout = function(selectedDate, minimumDate, maximumDate, enabled) {
    var sb;

    if (!enabled) {
        return "";
    }

    sb = new StringBuilder();
    sb.push('<table cellspacing="0" border="0" width="200">');
    sb.push('   <tr>')
    sb.push('       <td>');
    this.createHeader(sb, selectedDate);
    sb.push('       </td>');
    sb.push('   </tr>');
    sb.push('   <tr>');
    sb.push('       <td>');
    sb.push('           <table cellpadding="0" cellspacing="0" width="100%">');
    this.createWeekHeader(sb);
    this.createDates(sb, selectedDate, minimumDate, maximumDate);
    sb.push('           </table>');
    sb.push('       </td>');
    sb.push('   </tr>');
    sb.push('</table>');

    return sb.toString();
}


/**
 * Creates the header HTML
 *
 * @param sb_StringBuilder A <code>StringBuilder</code> to add the HTML in.
 * @param selectedDate_Date The date to show as selected.
 */
CalendarLayout.prototype.createHeader = function(sb, selectedDate) {
    var months;
    var prev;
    var next;

    if (lang_monthnames.length < 12) {
    months = this.locale.getMonths();
    } else {
        months = lang_monthnames;
    }

    prev = 'CalendarElement.findObj(this).add(Calendar.MONTH, -1)';
    next = 'CalendarElement.findObj(this).add(Calendar.MONTH, 1)';

    sb.push('<table cellspacing="0" cellpadding="0" border="0" width="100%">');
    sb.push('   <tr>');
    sb.push('       <td bgcolor="white">');
    sb.push('           <font color="black" face="arial, verdana" size="2">');
    sb.push('                ' + months[selectedDate.getMonth()] + ' ' + selectedDate.getFullYear());
    sb.push('           </font>');
    sb.push('       </td>');
    sb.push('       <td bgcolor="white" align="right" valign="center">');
    sb.push('           <img onclick="' + prev + '" src="js/calendar/prev.gif" border="0" alt="previous month">');
    sb.push('           <img onclick="' + next + '" src="js/calendar/next.gif" border="0" alt="next month">');
    sb.push('       </td>');
    sb.push('   </tr>');
    sb.push('</table>');
}


/**
 * Creates the week day header.
 *
 * @param sb_StringBuilder The <code>StringBuilder</code> to add the HTML in.
 */
CalendarLayout.prototype.createWeekHeader = function(sb) {
    var weekDays;
    var weekStart;

    weekDays = this.locale.getWeekDays();
    weekStart = this.locale.getWeekStart();

    sb.push('<tr>');
    sb.push('   <td bgcolor="#999999"><img src="img/spacer.gif" width="1" height="0"></td>');
    for (var i = 0; i < 7; i++) {
        sb.push('<td bgcolor="#999999" align="center" style="border: 1px solid #999999;">');
        sb.push('  <font color="white" face="arial, verdana" size="2">');
        sb.push(        weekDays[(weekStart + i) % 7]);
        sb.push('   </font>');
        sb.push('</td>');
    }
    sb.push('</tr>');
}


/**
 * Creates the calendar dates table.
 *
 * @param sb_StringBuilder A <code>StringBuilder</code> to add the HTML in.
 * @param selectedDate_Date The date to show as selected.
 * @param minimumDate_Date The first selectable date.
 * @param maximumDate The last selectableDate.
 */
CalendarLayout.prototype.createDates = function(sb, selectedDate, minimumDate, maximumDate) {
    var loopingDate;
    var firstDay;
    var color;
    var textColor;
    var inCalendar
    var styleClass;
    var call;

    firstDay = new Date(selectedDate);
    firstDay.setDate(1);
    firstDay.setDate(1 - (7 + firstDay.getDay() - this.locale.getWeekStart())%7);
    loopingDate = new Date(firstDay);


    while (loopingDate.getMonth() == selectedDate.getMonth() || loopingDate.getMonth() == firstDay.getMonth()) {
        sb.push('<tr>');
        sb.push('   <td bgcolor="#999999"><img src="img/spacer.gif" width="1" height="0"></td>');

        for (var i = 0; i < 7; i++) {
            color = "";
            textColor = "";
            inCalendar = ((loopingDate >= minimumDate) && (loopingDate <= maximumDate) ? true : false);
            styleClass = "";

            if (loopingDate.getDate() == selectedDate.getDate() && loopingDate.getMonth() == selectedDate.getMonth()) {
                // Selected date
                color = '#FAD613';
                styleClass = 'selectedDay';
            } else if (loopingDate.getDay() == 0 || loopingDate.getDay() == 6) {
                // Weekend days
                color = '#f5f5f5';
                styleClass = 'weekend';
            } else {
                // Working days
                color = '#FFFFFF';
                styleClass = 'workday';
            }

            if (inCalendar) {
                call = 'CalendarElement.findObj(this).set(Calendar.DATE,' +  loopingDate.getDate() + ')';
                sb.push('   <td class="' + styleClass + '" bgcolor="' + color + '" align="center"');
                sb.push(' onClick="javascript:' + call + '; calendaroff(1); calendaroff(2);"');
                sb.push(' style="cursor: pointer; cursor: hand;border-bottom: 1px solid #999999; border-right: 1px solid #999999;padding: 3px 3px 3px 3px;"');
            } else {
                sb.push('   <td class="' + styleClass + '" bgcolor="' + color + '" align="center"');
                sb.push(' style="border-bottom: 1px solid #999999; border-right: 1px solid #999999; padding: 3px 3px 3px 3px;"');
            }

            sb.push('>');

            if (loopingDate.getMonth() == selectedDate.getMonth() && inCalendar) {
                // Selected month
                textColor = "black";
            } else {
                // Other months
                textColor = "#AAAAAA";
            }

            sb.push('<font color="' + textColor + '" face="arial, verdana" size="2">');
            sb.push(loopingDate.getDate() + '</font></td>');
            loopingDate.setDate(loopingDate.getDate() + 1);
        }
        sb.push('</tr>');
    }
}