/**
* 
* Ui.js
* 
* Most methods return the <option> list
* associated with a dropdown.  The outer <select> element
* should be defined in the page and filled via these functions.
* It is not a requirement that all functions in this module only 
* return a string of <option> tags.

* Remember to update version history with any new methods or changes.
* 
*******************************************************************************
*  DEPENDANCIES:
*  - jquery.js
*  - jquery.ui.js - for modal window
*  - Many dropdown methods require the HTML files in "/inc/dropdown-options/".
*  
*******************************************************************************
*  DEPENDANTS:
*  - Pretty much all event registration forms use this for the State and 
*    Year/Month functions.  Specifically, the payment-info.shtml and billing-info.shtml 
*    includes (or in many cases, the billing info is written into the index.shtml).
* 
*******************************************************************************
*  VERION HISTORY:
* 		v.1.0.2 - Changed the displayMessage functions to return the message html if no message div is found or if a flag is set.
*      v1.0.1 - Added PrintTodaysDate() method to the datetime module.
*             - Added getDropdownHTML() and changed dropdown functions to use it.
*      v1.0.0 - Initial Version.
*      
*/


var Ui = (function (parent) {

  var dayNames       = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
      monthListShort = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
      monthListLong  = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
      dataDirectory  = "/./inc/dropdown-options/",
      MODAL_DIV    = "modal";      

  /**
   * Retrieves html out of a static file located in
   * the dataDirectory.
   */
   getDropDownHTML = function(filename){
     var returnHTML;
     
      $.ajax({
      type: 'GET',
      url: dataDirectory + filename + '.html',
      dataType: 'html',
        async: false,
        success: function(html){         
          returnHTML = html;
        }
      });
         
      return returnHTML;    
   };
  
  parent.modalId = MODAL_DIV;
  
  parent.displayErrorMessage = function(msg, returnHTML) {
    var html = '<div class="error-message">' + msg + '</div>';
    
    if(returnHTML === true || document.getElementById('message') === null) {
    	return html;
    } else {
    	Ui.closeDialog();
    	document.getElementById('message').innerHTML = html;	
    }    
  };
  
  parent.displaySuccessMessage = function(msg, returnHTML) {
    var html = '<div class="success-message">' + msg + '</div>';
    
    if(returnHTML === true || document.getElementById('message') === null) {
    	return html;
    } else {
    	Ui.closeDialog();
    	document.getElementById('message').innerHTML = html;	
    }   
  };
  
  parent.displayInfoMessage = function(msg, returnHTML) {
    var html = '<div class="info-message">' + msg + '</div>';
    
    if(returnHTML === true || document.getElementById('message') === null) {
    	return html;
    } else {
    	Ui.closeDialog();
    	document.getElementById('message').innerHTML = html;	
    }   
  };
  
  parent.displayWarningMessage = function(msg, returnHTML) {
    var html = '<div class="warning-message">' + msg + '</div>';
    
    if(returnHTML === true || document.getElementById('message') === null) {
    	return html;
    } else {
    	Ui.closeDialog();
    	document.getElementById('message').innerHTML = html;	
    }      
  }; 
  
  /**
   * These functions return a string of <option> tags
   * to be placed into a <select>.
   */
  parent.States = function() {     
    return getDropDownHTML('states');
  };
  
  parent.Countries = function() {
    return getDropDownHTML('countries');  
  };
  
  parent.IUCampusList = function() {
    return getDropDownHTML('campuses');
  };
  
  parent.IUSchools = function() {
    return getDropDownHTML('schools');
  };
  
  parent.AffiliateGroups = function() {
    return getDropDownHTML('affiliates');
  };
    
  parent.Chapters = function() {
    return getDropDownHTML('chapters'); 
  };
  
  parent.DegreeTypes = function() {
    return getDropDownHTML('degree-types');
  };
    
  parent.NumberBox = function(firstNum, lastNum, title) {
    firstNum = (firstNum !== undefined) ? parseInt(firstNum) : 1;
    lastNum  = (lastNum !== undefined) ? parseInt(lastNum) : 10;
    
    var stepDirection = ((lastNum - firstNum) > 0) ? 1 : -1,
        numbers = '';     
          
    if(title !== undefined) {
      numbers = '<option value="">' + title + '</option>';
    }
    
    for (var i = firstNum; i != (lastNum + stepDirection); i += stepDirection) {
      numbers += '<option value="' + i + '">' + i + '</option>';
    }
    
    return numbers;
  };  
  
  parent.Days = function(numDays) {
    numDays = (numDays !== undefined) ? numDays : 31;
    
    return Ui.NumberBox(1, numDays, 'Day:');
  };
  
  parent.Months = function(listFormat) {
    var months = '<option value="">Month:</option>',
      list = (listFormat === 'long') ? monthListLong : monthListShort;
      
    for(var i = 1; i <= 12; i++) {
      months += '<option value="' + i + '">' + i + ' - ' + list[i-1] + '</option>';
    }
    
    return months;
  };

  parent.Years = function(firstYear, lastYear) {
    var d = new Date(),
        currentYear = parseInt(d.getFullYear());
    
    if(lastYear === undefined && firstYear === undefined) {
      firstYear = currentYear;
      lastYear  = currentYear - 100;
    } else if(lastYear === undefined) {
      lastYear  = currentYear + firstYear;
      firstYear = currentYear;
    }
    
    return Ui.NumberBox(firstYear, lastYear, 'Year:');
  };

  parent.printTodaysDate = function(listFormat) {
    var now = new Date(),
        monthList = (listFormat === 'long') ? monthListLong : monthListShort;
    return dayNames[now.getDay()] + ", " + monthList[now.getMonth()] + " " + now.getDate() + ", " + now.getFullYear();
  }
  
  parent.getAjaxLoaderSmall = function(id) {
	var loaderId = id || 'smallLoader';
	return '<img id="' + loaderId + '" src="/./img/ajax-loader.gif" alt="Loading" class="ajaxLoader" />';
  };
  
  parent.removeAjaxLoader = function(id) {
	if(id) {
		$('#' + id).remove();
	} else {
		$('.ajaxLoader').remove();
	}
  };
  
  /**
   * Only one modal dialog at a time.  Its id will
   * always be the same so it is easy to remove.
   */
  parent.showLoadingDialog = function(msg) {
    msg = msg || 'Loading...';
    
    // Check for jQuery.ui
    //if(jQuery.ui === undefined) {
    //  Helper.include('/./inc/js/jquery.ui.js');
    //}
    
    // Put dialog HTML on the page.
    var modal = $(document.createElement('div'));
    modal.html('<img id="lookup-loading-icon" src="/./img/main/ajax-loader-big.gif" alt="Looking" /><br /><br />' + msg);      
    modal.attr('id', MODAL_DIV);
    
    // Dialog it.
    modal.dialog({
      autoOpen: false,
      modal: true,
      draggable: false,
      resizable: false });
    
    modal.dialog('open');
    
    $('.ui-dialog-titlebar').remove();
  };
  
  /**
   * Hides the open modal dialog.
   */
  parent.closeDialog = function() {
    $('.ui-dialog-content').dialog('close');    
  };
    
  return parent; 
  
}(Ui || {}));