// -----------------------------------------------------------------------------------------
//  Initializes a new Yahoo UI! DataTable Based on Data Within a HTML table structure
//	divName - Name of div containing the table of data
//	columnLables - An array of column label names
// -----------------------------------------------------------------------------------------

var gridTable = new Object;

function initDataGrid(divName, columnLabels) {
	YAHOO.util.Event.addListener(window, "load", function() {
	    YAHOO.example.EnhanceFromMarkup = new function() {
	    	var myColumnDefs = new Array();
	    	var fieldsArray = new Array();
	    	
	    	var Dom = YAHOO.util.Dom, 
		        Event = YAHOO.util.Event, 
		        ddRow = null, 
		        overLi = null, 
		        selectedRow = null, 
		        thisStatus = Dom.get('status'); 
	    
	    	for (i=0; i<columnLabels.length; i++) {		
	    		if (columnLabels[i] == 'pk') { 
	        		myColumnDefs[i] = {key:divName+'_row_'+i,label:columnLabels[i],sortable:'true',hidden:true};
	        	} else {
	        		myColumnDefs[i] = {key:divName+'_row_'+i,label:columnLabels[i],sortable:'true'};
	        	}
	        }
	        
	        this.myDataSource = new YAHOO.util.DataSource(YAHOO.util.Dom.get(divName));
	        this.myDataSource.responseType = YAHOO.util.DataSource.TYPE_HTMLTABLE;
			
			var table = document.getElementById(divName);
			gridTable = table;
			var row = table.rows[2];
			
			for (i=0; i<columnLabels.length; i++) {	
				var dataType = "text";
				var cell = row.cells[i];
				var content = cell.firstChild.nodeValue;
				if (isNumeric(content) == 'true') dataType = "number";
				
	        	fieldsArray[i] = {key:divName+'_row_'+i, parser: dataType};
	        }
	        this.myDataSource.responseSchema = { 'fields': fieldsArray };
	        
	        this.myDataTable = new YAHOO.widget.DataTable("markup", myColumnDefs, this.myDataSource,
	                {caption:"",
	                sortedBy:{key: divName+'_row_0',dir:"desc"}}
	        );
	        
	      	//alert("Pause.....");
	      	pause(500);
	      	        
	        // Subscribe to events for row selection 
	        this.myDataTable.subscribe("rowMouseoverEvent", this.myDataTable.onEventHighlightRow); 
	        this.myDataTable.subscribe("rowMouseoutEvent", this.myDataTable.onEventUnhighlightRow); 
	        //this.myDataTable.subscribe("rowClickEvent", this.myDataTable.onEventSelectRow); 
	        this.myDataTable.subscribe("rowClickEvent", function (oArgs) {
	        		Event.preventDefault(oArgs.event);
				    var elCheckbox = oArgs.target;
				    var record = this.getRecord(elCheckbox);
					var column = this.getColumn(elCheckbox);
					
					var recordIndex = this.getRecordIndex(record);
					var recordKey = record.getData("pk");
					
					alert("You Seleted Index: " + recordIndex);		
									
					selectRow(divName, recordIndex);
			});  
	 
	        // Programmatically select the first row 
	        //this.myDataTable.selectRow(this.myDataTable.getTrEl(0)); 
	        // Programmatically bring focus to the instance so arrow selection works immediately 
	        this.myDataTable.focus(); 
	         
	        this.singleSelectDataTable = new YAHOO.widget.DataTable("single", 
	                myColumnDefs, this.myDataSource, { 
	                    caption:"Single-Row Selection with Modifier Keys Disabled", 
	                    selectionMode:"single" 
	                }); 
	                 
	        // Subscribe to events for row selection 
	        this.singleSelectDataTable.subscribe("rowMouseoverEvent", this.singleSelectDataTable.onEventHighlightRow); 
	        this.singleSelectDataTable.subscribe("rowMouseoutEvent", this.singleSelectDataTable.onEventUnhighlightRow); 

		 };
	});
}

// ---------------------------------------------------------------------------
// Selects a row from the DataTable and calls a custom function with the data
// and returns the "row" table information
// ---------------------------------------------------------------------------
function selectRow(divName, selectedIndex) {
	//alert(gridTable);
	var row = gridTable.rows[selectedIndex+1];
	var cell = row.cells[1];
	var content = cell.firstChild.nodeValue;
	
	var mytable = document.getElementById("RoomsTable");
	var newrow=mytable.insertRow(-1);
	
	// Display the Friendly Name
	var nameCell=newrow.insertCell(0)
	nameCell.innerHTML = 'Room ' + content + ' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:removeRow(\'' + content + '\');" class="link_xsmall_blk">Remove</a> <a href="javascript:noLink();" class="link_xsmall_blk">View Details</a>';
	
	javascript:openPopUpCentered('Message_PopUpWindow','Confirm Reservation', 'You have selected room: ' + content + '<br><br>');
}

function removeRow(rowID) {
	javascript:openPopUpCentered('Message_PopUpWindow','Confirm Remove Room', 'Are you sure you want to remove room: ' + rowID + '<br><br>');
}

// -----------------------------------------------------------
// Display's an Absolute DIV Layer Based on X,Y Coordinates
// 	x - x coordinate
//  y - y corrdinate
//  divName - The absoluet div/layer to be displayed
// -----------------------------------------------------------
function displayDivFloating(x, y, divName) {
	$("#" + divName).css("top", y);
	$("#" + divName).css("left", x);
	$("#" + divName).show();
}

// -----------------------------------------------------------
// Check's to See if a String is Numeric or Str (true|false)
// 	elem - A String to be evaluated
// -----------------------------------------------------------
function isNumeric(elem){
	var numericExpression = /^[0-9]+$/;
	if(elem.match(numericExpression)){
		return true;
	}else{
		return false;
	}
}

// -------------------------------------------------------------------------
// Display a Yahoo! UI Calendar Component Based on A Clicked Calendar Image
// 		formElem - The Image That Obtains a ClickEvent to display the Cal
// -------------------------------------------------------------------------
function toggleDisplayCal(formElemA, formElemB, calImgId) {
	var display = $("#cal1Container").css('display');
	
	if (display == 'none') {
		initCalPopUp('cal1Container', formElemA, formElemB);
		
		var x = $("#" + calImgId).offset().left;
		var y = $("#" + calImgId).offset().top;
		
		displayDivFloating(x+14, y, 'cal1Container');
	} else {
		$("#cal1Container").hide();
	}
}

(function() {

    /**
    * IntervalCalendar is an extension of the CalendarGroup designed specifically
    * for the selection of an interval of dates.
    *
    * @namespace YAHOO.example.calendar
    * @module calendar
    * @since 2.5.2
    * @requires yahoo, dom, event, calendar
    */

    /**
    * IntervalCalendar is an extension of the CalendarGroup designed specifically
    * for the selection of an interval of dates, as opposed to a single date or
    * an arbitrary collection of dates.
    * <p>
    * <b>Note:</b> When using IntervalCalendar, dates should not be selected or
    * deselected using the 'selected' configuration property or any of the
    * CalendarGroup select/deselect methods. Doing so will corrupt the internal
    * state of the control. Instead, use the provided methods setInterval and
    * resetInterval.
    * </p>
    * <p>
    * Similarly, when handling select/deselect/etc. events, do not use the
    * dates passed in the arguments to attempt to keep track of the currently
    * selected interval. Instead, use getInterval.
    * </p>
    *
    * @namespace YAHOO.example.calendar
    * @class IntervalCalendar
    * @extends YAHOO.widget.CalendarGroup
    * @constructor
    * @param {String | HTMLElement} container The id of, or reference to, an HTML DIV element which will contain the control.
    * @param {Object} cfg optional The initial configuration options for the control.
    */
    function IntervalCalendar(container, cfg) {
        /**
        * The interval state, which counts the number of interval endpoints that have
        * been selected (0 to 2).
        * 
        * @private
        * @type Number
        */
        this._iState = 0;

        // Must be a multi-select CalendarGroup
        cfg = cfg || {};
        cfg.multi_select = true;

        // Call parent constructor
        IntervalCalendar.superclass.constructor.call(this, container, cfg);

        // Subscribe internal event handlers
        this.beforeSelectEvent.subscribe(this._intervalOnBeforeSelect, this, true);
        this.selectEvent.subscribe(this._intervalOnSelect, this, true);
        this.beforeDeselectEvent.subscribe(this._intervalOnBeforeDeselect, this, true);
        this.deselectEvent.subscribe(this._intervalOnDeselect, this, true);
    }

    /**
    * Default configuration parameters.
    * 
    * @property IntervalCalendar._DEFAULT_CONFIG
    * @final
    * @static
    * @private
    * @type Object
    */
    IntervalCalendar._DEFAULT_CONFIG = YAHOO.widget.CalendarGroup._DEFAULT_CONFIG;

    YAHOO.lang.extend(IntervalCalendar, YAHOO.widget.CalendarGroup, {

        /**
        * Returns a string representation of a date which takes into account
        * relevant localization settings and is suitable for use with
        * YAHOO.widget.CalendarGroup and YAHOO.widget.Calendar methods.
        * 
        * @method _dateString
        * @private
        * @param {Date} d The JavaScript Date object of which to obtain a string representation.
        * @return {String} The string representation of the JavaScript Date object.
        */
        _dateString : function(d) {
            var a = [];
            a[this.cfg.getProperty(IntervalCalendar._DEFAULT_CONFIG.MDY_MONTH_POSITION.key)-1] = (d.getMonth() + 1);
            a[this.cfg.getProperty(IntervalCalendar._DEFAULT_CONFIG.MDY_DAY_POSITION.key)-1] = d.getDate();
            a[this.cfg.getProperty(IntervalCalendar._DEFAULT_CONFIG.MDY_YEAR_POSITION.key)-1] = d.getFullYear();
            var s = this.cfg.getProperty(IntervalCalendar._DEFAULT_CONFIG.DATE_FIELD_DELIMITER.key);
            return a.join(s);
        },

        /**
        * Given a lower and upper date, returns a string representing the interval
        * of dates between and including them, which takes into account relevant
        * localization settings and is suitable for use with
        * YAHOO.widget.CalendarGroup and YAHOO.widget.Calendar methods.
        * <p>
        * <b>Note:</b> No internal checking is done to ensure that the lower date
        * is in fact less than or equal to the upper date.
        * </p>
        * 
        * @method _dateIntervalString
        * @private
        * @param {Date} l The lower date of the interval, as a JavaScript Date object.
        * @param {Date} u The upper date of the interval, as a JavaScript Date object.
        * @return {String} The string representing the interval of dates between and
        *                   including the lower and upper dates.
        */
        _dateIntervalString : function(l, u) {
            var s = this.cfg.getProperty(IntervalCalendar._DEFAULT_CONFIG.DATE_RANGE_DELIMITER.key);
            return (this._dateString(l)
                    + s + this._dateString(u));
        },

        /**
        * Returns the lower and upper dates of the currently selected interval, if an
        * interval is selected.
        * 
        * @method getInterval
        * @return {Array} An empty array if no interval is selected; otherwise an array
        *                 consisting of two JavaScript Date objects, the first being the
        *                 lower date of the interval and the second being the upper date.
        */
        getInterval : function() {
            // Get selected dates
            var dates = this.getSelectedDates();
            if(dates.length > 0) {
                // Return lower and upper date in array
                var l = dates[0];
                var u = dates[dates.length - 1];
                return [l, u];
            }
            else {
                // No dates selected, return empty array
                return [];
            }
        },

        /**
        * Sets the currently selected interval by specifying the lower and upper
        * dates of the interval (in either order).
        * <p>
        * <b>Note:</b> The render method must be called after setting the interval
        * for any changes to be seen.
        * </p>
        * 
        * @method setInterval
        * @param {Date} d1 A JavaScript Date object.
        * @param {Date} d2 A JavaScript Date object.
        */
        setInterval : function(d1, d2) {
            // Determine lower and upper dates
            var b = (d1 <= d2);
            var l = b ? d1 : d2;
            var u = b ? d2 : d1;
            // Update configuration
            this.cfg.setProperty('selected', this._dateIntervalString(l, u), false);
            this._iState = 2;
        },

        /**
        * Resets the currently selected interval.
        * <p>
        * <b>Note:</b> The render method must be called after resetting the interval
        * for any changes to be seen.
        * </p>
        * 
        * @method resetInterval
        */
        resetInterval : function() {
            // Update configuration
            this.cfg.setProperty('selected', [], false);
            this._iState = 0;
        },

        /**
        * Handles beforeSelect event.
        * 
        * @method _intervalOnBeforeSelect
        * @private
        */
        _intervalOnBeforeSelect : function(t,a,o) {
            // Update interval state
            this._iState = (this._iState + 1) % 3;
            if(this._iState == 0) {
                // If starting over with upcoming selection, first deselect all
                this.deselectAll();
                this._iState++;
            }
        },

        /**
        * Handles selectEvent event.
        * 
        * @method _intervalOnSelect
        * @private
        */
        _intervalOnSelect : function(t,a,o) {
            // Get selected dates
            var dates = this.getSelectedDates();
            if(dates.length > 1) {
                /* If more than one date is selected, ensure that the entire interval
                    between and including them is selected */
                var l = dates[0];
                var u = dates[dates.length - 1];
                this.cfg.setProperty('selected', this._dateIntervalString(l, u), false);
            }
            // Render changes
            this.render();
        },

        /**
        * Handles beforeDeselect event.
        * 
        * @method _intervalOnBeforeDeselect
        * @private
        */
        _intervalOnBeforeDeselect : function(t,a,o) {
            if(this._iState != 0) {
                /* If part of an interval is already selected, then swallow up
                    this event because it is superfluous (see _intervalOnDeselect) */
                return false;
            }
        },

        /**
        * Handles deselectEvent event.
        *
        * @method _intervalOnDeselect
        * @private
        */
        _intervalOnDeselect : function(t,a,o) {
            if(this._iState != 0) {
                // If part of an interval is already selected, then first deselect all
                this._iState = 0;
                this.deselectAll();

                // Get individual date deselected and page containing it
                var d = a[0][0];
                var date = YAHOO.widget.DateMath.getDate(d[0], d[1] - 1, d[2]);
                var page = this.getCalendarPage(date);
                if(page) {
                    // Now (re)select the individual date
                    page.beforeSelectEvent.fire();
                    this.cfg.setProperty('selected', this._dateString(date), false);
                    page.selectEvent.fire([d]);
                }
                // Swallow up since we called deselectAll above
                return false;
            }
        }
    });

    YAHOO.namespace("example.calendar");
    YAHOO.example.calendar.IntervalCalendar = IntervalCalendar;
})();

function initCalPopUp(divName, formElemA, formElemB) {
	var inTxt = YAHOO.util.Dom.get(formElemA),
    outTxt = YAHOO.util.Dom.get(formElemB),
    inDate, outDate, interval;

	//inTxt.value = "";
	//outTxt.value = "";
	
	var cal = new YAHOO.example.calendar.IntervalCalendar(divName, { pages:2,
																	 title: "Select Dates",
																	 close: true });
	
	cal.selectEvent.subscribe(function() {
	    interval = this.getInterval();
	
	    if (interval.length == 2) {
	        inDate = interval[0];
	        inTxt.value = (inDate.getMonth() + 1) + "/" + inDate.getDate() + "/" + inDate.getFullYear();
	
	        if (interval[0].getTime() != interval[1].getTime()) {
	            outDate = interval[1];
	            outTxt.value = (outDate.getMonth() + 1) + "/" + outDate.getDate() + "/" + outDate.getFullYear();
	            
	            // close the calendar
	            $("#cal1Container").hide();
	        } else {
	            outTxt.value = "";
	        }
	        
	        try {
	        	// call optional function
	        	calEndEvent(interval);
	        } catch(e) {}
	    }
	}, cal, true);
	
	cal.render();

}

// -----------------------------------------------------------------------------------------
// Initializes and Yahoo UI! Calander Component
//	divName - The div of the calander object (were to be placed)
//	formElem - The name of the form input field that will contain the clicked date results
// -----------------------------------------------------------------------------------------
function initCalPopUpOld(divName, formElem) {
	YAHOO.namespace("example.calendar");

	YAHOO.example.calendar.init = function() {

		function handleSelect(type,args,obj) {
			var dates = args[0]; 
			var date = dates[0];
			var date2 = dates[1];
			//console.log("day:" + date2[2]);
			
			var year = date[0], month = date[1], day = date[2];
			
			var txtDate1 = document.getElementById(formElem);
			//alert(txtDate1.value);
			txtDate1.value = month + "/" + day + "/" + year;

			
			//document.getElementById(divName).style.display = "none";
			
			validateCalanderResults();
		}

		function updateCal() {
			var txtDate1 = document.getElementById(formElem);

			if (txtDate1.value != "") {
				YAHOO.example.calendar.cal1.select(txtDate1.value);
				var selectedDates = YAHOO.example.calendar.cal1.getSelectedDates();
				if (selectedDates.length > 0) {
					var firstDate = selectedDates[0];
					var secondDate = selectDates[1];
					//console.log(firstDate + ":" + secondDate);
					YAHOO.example.calendar.cal1.cfg.setProperty("pagedate", (firstDate.getMonth()+1) + "/" + firstDate.getFullYear());
					YAHOO.example.calendar.cal1.render();
				} else {
					alert("Cannot select a date before 1/1/2006 or after 12/31/2012");
				}
				
			}
		}

		// For this example page, stop the Form from being submitted, and update the cal instead
		function handleSubmit(e) {
			updateCal();
			YAHOO.util.Event.preventDefault(e);
		}
		
		YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1",divName, 
																	{ mindate:"1/1/2006",
																	  maxdate:"12/31/2012",
																	  title: "Choose Your Stay Dates",
																	  close: true,
																	  MULTI_SELECT: true });
		
		YAHOO.example.calendar.cal1.selectEvent.subscribe(handleSelect, YAHOO.example.calendar.cal1, true);
		YAHOO.example.calendar.cal1.render();

		YAHOO.util.Event.addListener("update", "click", updateCal);
		YAHOO.util.Event.addListener("dates", "submit", handleSubmit);
	}

	YAHOO.util.Event.onDOMReady(YAHOO.example.calendar.init);
}