// Fullscreen Class
function FullScreen() {
    this.on = false;
    this.trigger = $('#btn_full_screen');
    this.target = $('div.center');
    this.btn_up = $('#btn_page_up');

    this.toggle = function (b) {
        _self = this;

        if (this.on == true) {
            _self.target.stop().animate({
                'width': '990px'
            }, b ? 1500 : 0, 'swing', function () {
                _self.trigger.next().find('.bold').text('OFF');
                _self.btn_up.show();
            });
            $.cookie("isFullScreen", null, {
                path: '/'
            })
            this.on = false;

        } else {

            _self.target.stop().animate({
                'width': '90%'
            }, b ? 1500 : 0, 'swing', function () {
                _self.trigger.next().find('.bold').text('ON')
            });
            $.cookie("isFullScreen", 'on', {
                expires: 70,
                path: '/'
            });
            this.on = true;
            this.btn_up.hide();
        }
    }
}

// Ajax Class
function Ajax() {
    this._type = 'GET';
    this._cache = false;
    this._dataType = 'json';
    this._url = '/includes/templates/ajax-gateway.php';
    _main = this;

    this.global = function () {
        $('#ajaxStatus').bind('ajaxStart', function () {
            $(this).fadeIn('fast');
        }).bind('ajaxStop', function () {
            $(this).fadeOut('fast');
        }).bind('ajaxComplete', function () {
            $(this).fadeOut('fast')
        })

        $.ajaxSetup({
            cache: this._cache,
            dataType: this._dataType,
            error: function (xhr, status, error) {
                _main.failure('An error occured: ' + error)
            },
            timeout: 30000,
            type: this._type,
            url: this._url
        })
    }

    this.call = function (url, params, method, onSuccessFunction) {
        if (!params) var params = new Object();
        if (!method) var method = this._type;
        if (!url) var url = this._url;

        $.ajax({
            url: url,
            type: method,
            data: params,
            success: onSuccessFunction
        });
    }

    this.failure = function (message) {
        alert(message)
    }

    this.success = function () {
        _ajaxResponse = $("#ajaxResponse");
        if (_ajaxResponse) _ajaxResponse.fadeIn(1200, function () {
            _ajaxResponse.delay(1000).fadeOut(1200)
        })
    }
}

var root = {
	
	// Globals
	USER_ID : 0,
	USER_EMAIL : '',
	USER_TYPE : '',
	
	// Message Panels
	msgBoxSuccess : null,
	msgBoxFailure : null,
	msgBoxInfo : null,
	
		
	isClient : function()
	{
		return 	root.USER_TYPE == 4;	
	},
	
	isAdmin : function()
	{
		return 	root.USER_TYPE == 1;
	},
	
	isRoomManager : function()
	{
		return root.USER_TYPE == 2 || root.USER_TYPE == 3;
	},
	
    room_page: 
	{
		$catalogHolder :  null,
		aBookingPanels : null,
		
		btnFilter : null,
		btnReset : null,
		
		frmFilter : null,
		frmBatch : null,
		
		oLoader : null,
		
		init : function()
		{
			root.room_page.$catalogHolder = $('#roomCatalogHolder');;
			root.room_page.aBookingPanels = root.room_page.$catalogHolder.find("[data-element='booking']");
			root.room_page.btnFilter = $('#btnFilter');
			root.room_page.btnReset = $('#btnResetFilter');
			
			root.room_page.frmFilter = $("#frmFilter");
			root.room_page.frmBatch = $("#frmBatchBooking");
			
			// AJAX LOADER
			root.room_page.oLoader = new Ajax();
			root.room_page.oLoader.global();
			
			// PRELOAD THE AUTOCOMPLETE OPTIONS
			root.room_page.oLoader.call(false, {
				func: "rooms"
			}, false, function (data) {
				if (data[0].success) {
					var aData = []
					$.each(data, function (index, element) {
						if (index > 0) {
							aData.push({
								value: element.id,
								name: element.name
							})
						}
					})
					root.room_page.frmBatch.find("input.autocomplete").autoSuggest(aData, {
						asHtmlID: 'roomlist',
						startText: "",
						selectedValuesProp: "value",
						selectedItemProp: "name",
						searchObjProps: "name"
					});
				}
			});
			
			// INITIALIZE TABULATOR
			root.room_page.$catalogHolder.tabulator({
				first: true
			}).find('.skin_flex_body').hide();
			
			// SET DATE PICKERS FOR EACH ROOM			
			var _picker = null;
			var _minDate = 0;
			root.room_page.aBookingPanels.find('.date_picker').each(function (index) {
				_picker = $(this);
			
				if (!_picker.next("input[data-element='show-today']").val()) _minDate = +1;
			
				_picker.datepicker({
					dateFormat: "yy-mm-dd",
					minDate: _minDate
				})
			})
			
			// SET DATE PICKER FOR BATCH FORM
			root.room_page.frmBatch.find("input.date_picker").datepicker({
				dateFormat: "yy-mm-dd",
				minDate: _minDate
			})
			
			// ATTACH HANDLERS
			root.room_page.attachHandlers();
			},
			
			attachHandlers: function () {
				root.room_page.frmBatch.find("input[type='submit']").bind('click', root.room_page.onBatchClick);
				root.room_page.$catalogHolder.find('input.btn_book').bind('click', root.room_page.onBookClick).end().find('tr.datagrid-record a.extra').bind('click', root.room_page.onExtraClick)
				root.room_page.btnFilter.bind('click', root.room_page.filterGrid);
				root.room_page.btnReset.bind('click', root.room_page.resetFilterGrid);
			},
			
			onBatchClick: function (ev) {
				var _frm = root.room_page.frmBatch;
				var _frmData = {};
				var _ajaxData = {};
				var _found = true;
			
				_ajaxData['func'] = 'batchBooking';
			
				_frm.validate({
					submitHandler: function (form) {
						_frm.bind('submit', function () {
							return false;
						})
			
						_frmData = _frm.serializeArray();
			
						for (var i = 0; i < _frmData.length; i++) {
							if (_frmData[i].value.substr(1) != "" && _frmData[i].value != null) {
			
								if (_frmData[i].name == 'roomlist') {
									var _values = _frmData[i].value.substr(1).split(",")
									_values.pop();
									_ajaxData["request_room"] = eliminateDuplicates(_values);
			
								} else {
									_ajaxData[_frmData[i].name] = _frmData[i].value;
								}
							} else {
								_found = false;
							}
						}
						if (_found) {
							var message = "";
			
							root.room_page.oLoader.call(false, _ajaxData, false, function (data) {
								$.each(data, function (index, element) {
									message += element.message + "<br />";
								})
			
								if (data[0].success) {
									root.msgBoxSuccess.show({
										title: "System Notification",
										message: message
									})
								} else {
									root.msgBoxInfo.show({
										title: "System Notification",
										message: message
									})
								}
			
							});
						} else {
							root.msgBoxInfo.show({
								title: "System Notification",
								message: "Please fill out all fields !"
							})
						}
					},
					rules: {
						request_for: {
							required: true
						},
						request_reason: {
							required: true,
							minlength: 5
						},
						request_client: {
							required: true
						},
						request_creator: {
							required: true
						}
					}
				})
			},
			
			onExtraClick: function (ev) {
				var _this = $(this);
				var _record = _this.parents('.datagrid-record');
				var _content = _record.next('.datagrid-content');
				var _body = _content.find('.skin_flex_body');
			
				if (_body.is(":hidden")) {
					_body.slideDown('slow', function () {
						_record.addClass('active');
						root.services.animation.movePageTo(_content.offset().top, -100, 400)
					});
			
				} else {
					_body.slideUp('slow', function () {
						_record.removeClass('active');
					});
				}
				return false;
			},
			
			onBookClick: function (ev) {
				var _this = $(this);
				var _frm = _this.parents('.frm_booking');
				var _frmData = {};
				var _ajaxData = {};
				var _found = false;
			
				_ajaxData['func'] = 'createRequest';
			
				_frm.validate({
					submitHandler: function (form) {
						_frm.bind('submit', function () {
							return false;
						})
						_frmData = _frm.serializeArray();
			
						for (var i = 0; i < _frmData.length; i++) {
							if (_frmData[i].value != "" && _frmData[i].value != null) {
								_found = true;
								_ajaxData[_frmData[i].name] = _frmData[i].value;
							}
						}
						if (_found) {
							root.room_page.oLoader.call(false, _ajaxData, false, function (data) {
								if (data[0].success) {
									root.msgBoxSuccess.show({
										title: "System Notification",
										message: data[0].message
									})
									//_frm[0].reset();
								} else {
									root.msgBoxInfo.show({
										title: "System Notification",
										message: data[0].message
									})
								}
							});
						}
			
					},
					rules: {
						request_for: {
							required: true
						},
						request_reason: {
							required: true,
							minlength: 5
						},
						request_client: {
							required: true,
							number: true
						},
						request_creator: {
							required: true,
							number: true
						}
					}
				})
			
			},
			
			filterGrid: function () {
				var _frm = root.room_page.frmFilter;
				var _found = false;
				var _frmData = {};
				var _ajaxData = {};
			
				_ajaxData['func'] = 'rooms';
			
				_frm.validate({
					submitHandler: function (form) {
						_frm.bind('submit', function () {
							return false;
						})
						_frmData = _frm.serializeArray();
			
						for (var i = 0; i < _frmData.length; i++) {
							if (_frmData[i].value != "" && _frmData[i].value != null) {
								_found = true;
								_ajaxData[_frmData[i].name] = _frmData[i].value;
							}
						}
						if (_found) root.room_page.oLoader.call(false, _ajaxData, false, root.room_page.getRooms);
			
					},
					rules: {
						id: {
							number: true,
							minlength: 1
						}
					}
				})
			},
			
			resetFilterGrid: function () {
				root.room_page.$catalogHolder.find("tr.datagrid-record").show().removeClass('active').next("tr.datagrid-content").find('.skin_flex_body').hide();
			
				root.services.animation.movePageTo(0, -50);
			},
			
			getRooms: function (data) {
				var _element = null;
			
				if (data[0].success) {
					root.room_page.$catalogHolder.find("tr.datagrid-record").hide().next("tr.datagrid-content").find('.skin_flex_body').hide();
			
					$.each(data, function (index) {
						if (index > 0) {
							_element = root.room_page.$catalogHolder.find("[data-id='" + data[index].id + "']").filter(function (index) {
								return $(this).hasClass('datagrid-record')
							}).removeClass('active')
			
							if (_element.length) {
								_element.show()
							}
						}
					});
			
				} else {
					root.msgBoxFailure.show({
						title: "System Notification",
						message: data[0].message
					})
				}
			}				
    },
	
	login : 
	{		
		init: function()
		{
					
			var oAjax = new Ajax();
			oAjax.global()
			
			$loginHolder = $('#login_holder');		
			$loginHolder.tabulator({first:true, duration:1000});	
			
			$frmLogin = $('#frmLogin');
			$frmRetrieval = $('#frmRetrieval');
			$frmRegistration = $('#frmRegistration');			
						
			$txtProgress = $loginHolder.find('p.login_progress');			
			
			function loginSubmit(ev)
			{					
				var _form = $frmLogin;
						
				_form.validate({
				  submitHandler: function (form) 
				  {									
					_form.bind('submit', function(){return false;})
					 
					 $txtProgress.text("Processing Request...");
					 
					 var oData = {};
					 oData['func'] = 'login';
					 
					 var _data = _form.serializeArray();
					 
					 $.each(_data, function(index, element){
						  
						  oData[element.name] = element.value; 						 
					 })	
					 
					  $txtProgress.text("Accessing Server...");			
															 
					oAjax.call(null,oData,null, function(data)
					{				
						if(data[0].success)
						{
							 $txtProgress.text("Login Sucesfull...");							
							 root.common.navigate('/room/',1500);			
						} else {
							 $txtProgress.text("");	
							 root.msgBoxFailure.show({title:"Account Notification", message:data[0].message})						
						}					
					})	   	         
	  
				  },
				  rules: {
					  email: {							  
						  email: true,
						  required: true
					  },
					  password : {required: true}
				  }				
			  })       
			}
			
			function retrievalSubmit(ev)
			{	
				var _form = $frmRetrieval;
				
				_form.validate({
				  submitHandler: function (form) 
				  {									
					 _form.bind('submit', function(){return false;}) 
					   
					 var oData = {};
					 oData['func'] = 'lostPassword';
					 
					 var _data = _form.serializeArray();
					 
					 $.each(_data, function(index, element){
						  
						  oData[element.name] = element.value; 				  					 
					 })
					 
					 oAjax.call(null,oData,null, function(data)
					 { 
					 	if(data[0].success)
						{
							root.msgBoxSuccess.show({title:"Account Notification", message:data[0].message})
							_form[0].reset();
							
						} else{
							root.msgBoxFailure.show({title:"Account Notification", message:data[0].message})
						}	
				
					 });				 
	  
				  },
				  rules: {
					  email: {							  
						  email: true,
						  required: true
					  }
				  }				
			  })       
			}
			
			function registrationSubmit(ev)
			{
				var _form = $frmRegistration;
				
				_form.validate({
				  submitHandler: function (form) 
				  {									
					 _form.bind('submit', function(){return false;})   
					 
					 var _data = decodeURIComponent(_form.serialize());	
					 			 					 					   					   
					 oAjax.call(false, {"func": 'addUser','data': _data}, false, function(data)
					 { 					
						if(data[0].success)
						{							
							_form[0].reset();
							root.msgBoxSuccess.show({title:"Account Notification", message:data[0].message})
							
						} else {
							root.msgBoxInfo.show({title:"Account Notification", message:data[0].message})
						}										 
					 });
						  
				  },
				  rules: {
					  user_email: {	email: true, required: true },
					  user_fname : {required: true},
					  user_lname : {required: true},
					  user_password : {required: true},
					  user_security_answer: {required: true},
					  user_security_question: {required: true}
				  }				
			  })
			}			
			
			$frmLogin.find("input[type='submit']").bind('click', loginSubmit);
			$frmRetrieval.find("input[type='submit']").bind('click', retrievalSubmit);
			$frmRegistration.find("input[type='submit']").bind('click', registrationSubmit);
							
		}			
	},
	
	olap :
	{
		init : function()
		{
			var oAjax = new Ajax();
			oAjax.global()
						
			var chart;			
									
			$graphHolder = $('#graphHolder');
			$frmOlap = $('#frmOlap');
			$cbYear = $frmOlap.find("select[name='year']")
			$cbMonth = $frmOlap.find("select[name='month']")			
			$cbStyle = $frmOlap.find("select[name='style']")
			$cbRoom =  $frmOlap.find("select[name='room']")		
			$btnSubmit = $frmOlap.find("input[type='submit']")	
			
			
			var aYear = []	
			var aMonth = 
				[
					{month:"Jan", days:31, no:'1'},
					{month:"Feb", days:28,no:'2'},
					{month:"Mar", days:31,no:'3'},
					{month:"Apr", days:30,no:'4'},
					{month:"May", days:31,no:'5'},
					{month:"Jun", days:30,no:'6'},
					{month:"July", days:31,no:'7'},
					{month:"Aug", days:31,no:'8'},
					{month:"Sept", days:30,no:'9'},
					{month:"Oct", days:31,no:'10'},
					{month:"Nov", days:30,no:'11'},
					{month:"Dec", days:31,no:'12'}
				]
				
			 var graphOptions = {
				chart: {
					renderTo: 'graphHolder',
					defaultSeriesType: 'column'
				},
				title: {
					text: 'Room Utilization'
				},
				xAxis: {
					categories: []
				},
				yAxis: {
					title: {
						text: 'Usage Index'
					}
				},
				series: []
			};
			
			// PREFIL THE ROOM SELECTOR
			oAjax.call(false, {func:"rooms"}, false, function(data)
			 {			
				if(data[0].success)
				{
					var aData = []
					data.splice(0,1)				
					$.each(data, function(index,element){aData.push({value:element.id, name:element.name})})
					$frmOlap.find("input.autocomplete").autoSuggest(aData, 
						 {
							asHtmlID: 'roomlist',
							startText: "",
							selectedValuesProp : "value",
							selectedItemProp: "name", 
							searchObjProps: "name"
							//preFill: aData.slice(0,1) // prefill with the first room							
						  }
					);						
					//getGraphData()
					$frmOlap.find('.autocomplete').focus();	
				}				 
			 });						
					
			function onSubmitClick()
			{
				$frmOlap.unbind('submit').bind('submit', function(){ return false;})
				getGraphData()								
			}
			
			function getGraphData()
			{
				var _data = $frmOlap.serializeArray();
				var oData = {}
				var bFound = false;
				oData['func'] = 'olap';
				oData['type'] = 'annual';
				
				if($cbMonth.val() != 'all')
				{
					oData['type'] = 'monthly';
				}				
				
				for (var i = 0; i < _data.length; i++) {
			  		if(_data[i].name == 'roomlist')
					  {							
						  var _values = _data[i].value.substr(1).split(",")								
						  _values.pop();																										
						  oData["room"] = eliminateDuplicates(_values);
						  if(_values.length > bFound) bFound = true				 										
													  
					  } else {
						  oData[_data[i].name] = _data[i].value;	
					  }	
			     }	
				 if(bFound)
				 {
					oAjax.call(null,oData,null,renderGraph)	 
				 } else {				
					root.msgBoxInfo.show({title:"System Notification", message:"Please select at least one room to base a graph on."})
				 }
			}	
			
			function renderGraph(data)
			{
				if(data[0].success)
				{
					if(data.length > 1)
					{								
						data.splice(0,1);
											
						var aRooms = [];
						var aaSeries = [];
						
						// reset and reload
						graphOptions.xAxis.categories = []	
						graphOptions.chart.defaultSeriesType = $cbStyle.val();	
						
						$.each(data, function(index, element)
						{						
							aRooms[element.olap_room] = {id: element.olap_room, name:element.olap_room_name};															
						})			
																		
												
						if($cbMonth.val() == 'all')
						{
							var z = 0;							
							graphOptions.title.text = "Annual Room Utilization";
							
							for(var item in aRooms)
							{
								aaSeries.push({name: aRooms[item].name, data:[]})
								
								for(var i = 0; i<aMonth.length; i++)
								{
									graphOptions.xAxis.categories.push(String(aMonth[i].month));						
									
									var result = in_array(data, Number(aMonth[i].no), aRooms[item].id);
									if(result)
									{
										aaSeries[z].data.push(Number(result.olap_total))
									} else {
										aaSeries[z].data.push(Number(0))		
									}		
								}								
								z++;																	
							}
							z = 0;													
						} else {
							
							var oMonth = getMonthByName($cbMonth.val());
														
							// GRAPH TITLE
							graphOptions.title.text = "Monthly Room Utilization" + " -- " + oMonth.month;
							
							z = 0;
							for(var item in aRooms)
							{
								
								aaSeries.push({name: aRooms[item].name, data:[]})
								
								for(var i = 0; i<oMonth.days; i++)
								{
									// populate categories	
									graphOptions.xAxis.categories.push(String(i + 1));
									
									var result = in_array(data, Number(i + 1), aRooms[item].id);
									if(result)
									{
										aaSeries[z].data.push(Number(result.olap_total))
									} else {
										aaSeries[z].data.push(Number(0))		
									}																		
								}							
								z ++						
							}
							z = 0;						
						}					
						graphOptions.series = aaSeries;
						chart = new Highcharts.Chart(graphOptions);
					}				
										
				} else {					
					root.msgBoxInfo.show({title:"OLAP Notification", message:"No Data Available For The Selected Room(s)"})	
				}
			}	
			
			function in_array(source, date, room)
			{				
				for(var i = 0; i<source.length; i++)
				{
					if(Number(source[i].olap_date) == date && Number(source[i].olap_room) == room) return source[i]								
				}
				return false;
			}
			
			function getMonthByName(month)
			{						
				for(var i = 0; i<aMonth.length; i++)
				{
					if(Number(aMonth[i].no) == month) return aMonth[i]									
				}
				return false;
			}
							
			// attach handlers			
			$btnSubmit.bind('click', onSubmitClick)							
		}			
	},
	
	approval_page:
	{
		init : function()
		{
			// IMPORT MODULES
		   var oAjax = new Ajax();	 
		   oAjax.global();
		   var oFilter = {};
		   var oDataStorage = {}
		   var oSelectedRow  = null;
		   var oTemplate = $('#template-approval');	   
		   
		   var oPagination = new Pagination({target:'#paginationHolder', show:10, onChange: function(ev){
				
				  oFilter['start'] = oPagination.getStart();
			  	  getApprovals()  			   
			}});		 
		   
		   	  // Declare Variables	
		  $datagridHolder = $("#datagridHolder");
		  $btnDetail  = $datagridHolder.find('table.datagrid a.extra');						
		  $btnFilter = $('#btnFilter');	
		  $frmFilter = $("#frmFilter");	
		  $btnCancelFilter = $('#btnResetFilter');
		  
		  resetFilter();	  
		  
		  // set data pickers for the filter
		  $frmFilter.find("input.date_picker").datepicker({
			  dateFormat: "yy-mm-dd"
		  })		  		  
		  
		   function resetFilter()
		   {
			  oFilter = {}
			  oFilter['func'] = 'approvals';
			  oFilter['start'] = oPagination.getStart();
			  oFilter['offset'] = oPagination.getOffset();	
			  
			  if(root.isRoomManager())
			  {
				   oFilter['approval_admin'] = root.USER_ID;
			  }		  	 
		   }
		   
		   function getApprovals()
			{
				oAjax.call(false, oFilter, false, displayApprovals);  
			}
			
			function cancelFilterGrid()
			{
				 oPagination.reset();
				 resetFilter();
				 oAjax.call(false, oFilter, false, displayApprovals); 		  
			}	
			
			function filterGrid()
			{																				 
				$frmFilter.validate({
					submitHandler: function (form) 
					{									
					   $frmFilter.bind('submit', function(){return false;})
						oPagination.reset();
						resetFilter();					  
					   
						var _data = $frmFilter.serializeArray();						
						for (var i = 0; i < _data.length; i++) 
						{							
							oFilter[_data[i].name] = _data[i].value;													 					  					
						}
																			
					   getApprovals()	   		   	         
		
					},
					rules: {
						approval_id: {	
							number: true,
							minlength: 1
						}
					}				
				})            
			}
			
			function displayApprovals(data)
			{
				if(data[0].success)
				  {						  		
					oPagination.setTotal(Number(data[0].actualRows))
					 
					 var number = oPagination.getStart();	
					
					  var _html = "";
													  
					  $.each(data, function(index, element)
					  {											
						  if(index > 0)
						  {
							 if(index % 2 == 0)
							 {
								_class = "odd"; 
							 } else {
								_class = "even";  
							 }						
							  
							 // ROW
							 _html += "<tr data-id='" + element.id + "' class='datagrid-record " + _class + "'>"   
							  
								 _html += "<td>" + (number + index) + "</td>"
								 _html += "<td>" + element.id + "</td>"	
								 _html += "<td>" + element.request_id + "</td>"						 
								 _html += "<td>" + element.approval_deadline_format + "</td>"														 
								 _html += "<td class='approval_status'>" + element.approval_status + "</td>"											  
								 _html += "<td class='options'><a class='extra' title='Click to see more' href='#'></a></td>"					 
																						  
							  _html += "</tr>"; // end of row
											  
							  // CONTENT
							  _html += "<tr class='datagrid-content' data-id='" + element.id + "'>";
								  _html += "<td colspan='9'>";
									  
								  _html += "</td>";							
							  _html += "</tr>";							  
							  
							  // STORE DATA IN AN OBJECT
							  oDataStorage[element.id] = {details:[], properties:element}									
							  for(var item in element)
							  {									
								  oDataStorage[element.id].details.push({label: item, data: element[item]})  		  		  				  						
							  }			  
					  
						  }							
					  })	
					  $datagridHolder.find('table.datagrid tbody').html(_html);	
					  
					  if(oSelectedRow != null)
					  {		
					  	 var _row = $datagridHolder.find('.datagrid-record').filter(function(){ return Number($(this).attr('data-id')) == oSelectedRow})
					  		  		 
						  _row.find('a.extra').trigger('click');
						  oSelectedRow = null;				  	
					  }
					  
					  						
				  } else {
					  
					  root.msgBoxInfo.show({title:"Server Notification", message:data[0].message})								  
				  }
			}
			
			function onExtraClick(ev)
			{				
				var _this = $(this);
				var _record = _this.parents('.datagrid-record');
				var _content = _record.next('.datagrid-content');
				var clone = oTemplate.clone(true, true);		
				var destination = _content.find('td');
				var aDetails = oDataStorage[_record.attr('data-id')].details;	
				var oProperties = oDataStorage[_record.attr('data-id')].properties;
											
								
				if(!destination.html())
				{ 
					destination.html(clone.html())
							   .find('.date_picker').datepicker({
									dateFormat: "yy-mm-dd"
            					}).end().find('.skin_flex_body').hide();					
										
					// REFORCE TABULATOR
					_content.tabulator({first:true});								
									
					if(aDetails.length)
					{												
						var aElements = destination.find("div[data-element='detail'] textarea, input,div")
											
						for(var i = 0; i<aDetails.length;i++)
						{
							var oElement = aElements.filter(function(){ return $(this).attr('name') == aDetails[i].label ||  $(this).attr('data-name') == aDetails[i].label })							  
							
							if(oElement.length > 0)
							{													
								var nodeName = String(oElement[0].nodeName).toLowerCase();
								
								if(nodeName == 'textarea' || nodeName == 'input') // go for VAL()
								{
									// EXCEPTIONS									
									if(oElement.attr('type') != 'submit')
									{
										oElement.val(aDetails[i].data)
									}																							
									
									if(String(oProperties.approval_status).toLowerCase() != 'pending')
									{								
										if(oElement.attr('type') == 'submit')
										{
											oElement.css('opacity', 0.25)
											oElement.attr('disabled', 'disabled')
										}
										
									}	
									
								} else if(nodeName == 'div') // go for HTML() or TEXT()
								{
									
								}
							}																		
						}					
					}							
				}
								
				var _skinBody = destination.children('.skin_flex_body');			
				if(_skinBody.is(":hidden"))
				{
					_skinBody.slideDown(function(){_record.addClass('active'); root.services.animation.movePageTo(_content.offset().top,-100,400)});			
						
				} else {
					_skinBody.slideUp(function(){_record.removeClass('active');});				
				}												
				return false;
			}
			
			function approvalUpdateHandler(ev)
			{
				var _this = $(ev.target);
					var _form = _this.parents('form.frmApproval')
					var _parentContent = _form.parents('.datagrid-content');
					var _approvalId = _parentContent.attr('data-id') * 1;
								
					_form.validate({
						submitHandler: function (form) 
						{									
						   _form.bind('submit', function(){return false;})										   
						   var _data = decodeURIComponent(_form.serialize());						   			  		   
																												   
						  oAjax.call(false, {"func": 'editApproval','data': _data, 'id':_approvalId}, false, function(data)
						  {
							  if(data[0].success)
							  {
								root.msgBoxSuccess.show({title:"System Notification", message:data[0].message}) 
								
								// Reload the datagrid
								oSelectedRow = _approvalId;								
								getApprovals()
								 
							  } else {
								root.msgBoxFailure.show({title:"System Notification", message:data[0].message})
							  }						  
						  });				   				
						}
					})
			}	
			
			function onCommentSubmitHandler(ev)
			{
				var _this = $(ev.target);
				var _form = _this.parents('form.frmComment')
				var _parentRow = _form.parents('.datagrid-content');
				var _approvalId = _parentRow.attr('data-id') * 1;
						
				_form.validate({
					submitHandler: function (form) 
					{									
					   _form.bind('submit', function(){return false;})
					   
					    var _data = _form.serializeArray();
						var oData = {};
						oData['func'] = 'requestFeedback';
						oData['rf_approval'] = oDataStorage[_approvalId].properties.id;
						oData['rf_author'] = root.USER_ID;
												
						$.each(_data, function(index, element)
						{										
							oData[_data[index].name] = _data[index].value;						
						})
						
						oAjax.call(null, oData, null, function(data){
							
							if(data[0].success)
							{
								root.msgBoxSuccess.show({title:'System Notification', message:data[0].message})	
							} else {
								root.msgBoxInfo.show({title:'System Notification', message:data[0].message})		
							}
							
							_form[0].reset();	
											
						})								   				
					}, 					
					rules :
					{
						rf_message : {required:true}				
					}
				})			
			}			
			
			// Attach Handlers
			$btnFilter.bind('click', filterGrid);
		    $btnCancelFilter.live('click',cancelFilterGrid);
		    $btnDetail.live('click', onExtraClick)	
			$datagridHolder.find("form.frmApproval input[type='submit']").live('click', approvalUpdateHandler);	
			$datagridHolder.find("form.frmComment input[type='submit']").live('click', onCommentSubmitHandler);			
			
		    // fire off
		    getApprovals()			
		}	
	},		
	
	request_page :
	{		
	  init : function()
	  {
		  // IMPORT MODULES
		  var oAjax = new Ajax();	
		  oAjax.global();		
		  var oFilter = {};
		  var oDataStorage = {}
		  
		  // TEMPLATES
		  var tplTransaction = $('#tpl-transaction');	  
		  var tplFeedbackComment = $("#tpl-transaction-feedback-comment");		  
		  
		  var oPagination = new Pagination(
		  {
			  target:'#paginationHolder', 
			  show:15, 
			  onChange: function(ev)
			  {	
				resetFilter();
				getTransactions()
			  }
			});
		 	 				
  		  // Declare Variables	
		  $datagridHolder = $("#datagridHolder");
		  $btnUserDetail  = $datagridHolder.find('table.datagrid a.extra');						
		  $btnFilter = $('#btnFilter');	
		  $frmFilter = $("#frmFilter");	
		  $btnCancelFilter = $('#btnResetFilter');
		  $userId = $frmFilter.find("input[name='request_client']").val()	  
		 		 		 
		  resetFilter();	    	
		  
		  // set data pickers for the filter
		 $frmFilter.find("input.date_picker").datepicker({
			  dateFormat: "yy-mm-dd"
		 })			
		  
		  function resetFilter()
		  {
			  oFilter = {}
			  oFilter['func'] = 'transaction';
			  oFilter['start'] = oPagination.getStart();
			  oFilter['offset'] = oPagination.getOffset();	
			  oFilter['request_client'] = $userId;			  
			  
			  if(root.isClient())
			  {
				  oFilter['request_client'] = root.USER_ID;
			  }
			  
		  }
		  
		  function getTransactions()
		  {
			  oAjax.call(false, oFilter, false, displayTransactions);  
		  }
		  
		  function cancelFilterGrid()
		  {
			   oPagination.reset();
			   resetFilter();
			   oAjax.call(false, oFilter, false, displayTransactions); 		  
		  }	
		  
		  function filterGrid()
		  {																				 
			  $frmFilter.validate({
				  submitHandler: function (form) 
				  {									
					 $frmFilter.bind('submit', function(){return false;})
					  oPagination.reset();
					  resetFilter();					  
					 
					  var _data = $frmFilter.serializeArray();						
					  for (var i = 0; i < _data.length; i++) 
					  {							
						  oFilter[_data[i].name] = _data[i].value;			 					  					
					  }		
					  
					  								  
					getTransactions()	   		   	         
	  
				  },
				  rules: {
					  id: {	
						  number: true,
						  minlength: 1
					  }
				  }				
			  })            
		  }
			  
		  function displayTransactions(data)
		  {						
			  if(data[0].success)
			  {						  		
				oPagination.setTotal(Number(data[0].actualRows))
				 
				 var number = oPagination.getStart();	
			  	
				  var _html = "";
				 								  
				  $.each(data, function(index, element)
				  {											
					  if(index > 0)
					  {
						 if(index % 2 == 0)
						 {
							_class = "odd"; 
						 } else {
							_class = "even";  
						 }						
						  
					  	 // ROW
					 	 _html += "<tr data-id='" + element.id + "' data-feedback='false' class='datagrid-record " + _class + "'>"   
						  
							 _html += "<td>" + (number + index) + "</td>"
							 _html += "<td>" + element.id + "</td>"	
							 _html += "<td>" + element.request_room + "</td>"
							 _html += "<td>" + element.request_for_format + "</td>"
							 _html += "<td>" + element.request_made_format + "</td>"						 
							 if(!root.isClient()){ _html += "<td>" + element.request_client + "</td>" }							 
							 _html += "<td class='request_status'>" + element.request_status + "</td>"											  
							 _html += "<td class='options'><a class='extra tooltip' title='Click to expand the panel' href='#'></a>"
							 							 
							 if(element.request_status == "pending")
							 {
								_html += " <a class='cancel tooltip' title='Click to to cancel the request' href='#'></a>"
							 }	
							 _html += "</td>";
																					  
						  _html += "</tr>"; // end of row
										  
						  // CONTENT
						  _html += "<tr class='datagrid-content' data-id='" + element.id + "'>";
							  _html += "<td colspan='9'>";
								  
							  _html += "</td>";							
						  _html += "</tr>";							  
						  
						  // STORE DATA IN AN OBJECT
						  oDataStorage[element.id] = {details:[], properties:element}									
						  for(var item in element)
						  {									
							  oDataStorage[element.id].details.push({label: item, data: element[item]})  		  		  				  						
						  }			  
				  
					  }							
				  })	
				  $datagridHolder.find('table.datagrid tbody').html(_html);							
			  } else {				
				root.msgBoxInfo.show
				({
					title:"System Notification", 
					message:data[0].message
				})								  
			  }
		  } 
		  
		  function onExtraClick(ev)
		   {
				var _this = $(this);
				var _record = _this.parents('.datagrid-record');
				var _content = _record.next('.datagrid-content');
				var clone = tplTransaction.clone(true, true);		
				var destination = _content.find('td');
				var aDetails = oDataStorage[_record.attr('data-id')].details;	
				var oProperties = oDataStorage[_record.attr('data-id')].properties;
											
								
				if(!destination.html())
				{ 
					destination.html(clone.html())
							   .find('.date_picker').datepicker({
									dateFormat: "yy-mm-dd"
            					})	
					destination.children('.skin_flex_body').hide();
										
					// REFORCE TABULATOR
					_content.tabulator({
						first:true, 
						callback : function(ev)
						{
							if(String(ev.element).toLowerCase() == 'feedback')
							{
								if(String(_record.attr('data-feedback')) == 'false')
								{
									_record.attr('data-feedback', 'true');							
									var oData = {};
									oData['func'] = 'getRequestFeedback';
									oData['request'] = Number(oProperties.id);
																	
									oAjax.call(null,oData, null, function(data)
									{						
										if(data[0].success)
										{
											var _html = []
											
											data.splice(0,1);
											ev.block.html('')											
											$.each(data, function(index, element){
												
												var _comment = tplFeedbackComment.clone(true,true);
												_comment.find('.feedback-comment-author').html("<span class='blue_highlight'>Posted By: </span>" + element.user_type + ", " + element.user_title + " " +  element.user_fname + " " + element.user_lname);
												_comment.find('.feedback-comment-date').text(element.rf_created_format);
												_comment.find('.feedback-comment-message').text(element.rf_message);													
												_html.push(_comment.html());																						
											})
											ev.block.html(_html.join(''));									
										}									
									})									
								}
							}
						}					
					});								
									
					if(aDetails.length)
					{												
						var aElements = destination.find("div[data-element='detail'] textarea, input,div")
											
						for(var i = 0; i<aDetails.length;i++)
						{
							var oElement = aElements.filter(function(){ return $(this).attr('name') == aDetails[i].label ||  $(this).attr('data-name') == aDetails[i].label })							  
							
							if(oElement.length > 0)
							{													
								var nodeName = String(oElement[0].nodeName).toLowerCase();
								
								if(nodeName == 'textarea' || nodeName == 'input') // go for VAL()
								{
									// EXCEPTIONS									
									if(oElement.attr('type') != 'submit')
									{
										oElement.val(aDetails[i].data)
									}																					
									
									if(Number(oProperties.request_permission_level) == Number(oProperties.request_pending_total) || (Number(oProperties.request_permission_level) == 2 && Number(oProperties.request_pending_total) > 0 ) || oProperties.request_status != 'pending')
									{
										oElement.attr('disabled', 'disabled')
										if(oElement.attr('type') == 'submit')
										{
											oElement.css('opacity',0.25);
										}
									}	
									
								} else if(nodeName == 'div') // go for HTML() or TEXT()
								{
									
								}
							}																		
						}					
					}							
				}
								
				var _skinBody = destination.children('.skin_flex_body');			
				if(_skinBody.is(":hidden"))
				{
					_skinBody.slideDown(function(){_record.addClass('active'); root.services.animation.movePageTo(_content.offset().top,-100,400)});			
						
				} else {
					_skinBody.slideUp(function(){_record.removeClass('active');});				
				}												
				return false;	
			}
			
			function requestUpdateHandler(ev)
			{
				var _this = $(ev.target);
				var _form = _this.parents('form.frmReason')
				var _parentRow = _form.parents('.datagrid-content');
				var _requestId = _parentRow.attr('data-id') * 1;
							
				_form.validate({
					submitHandler: function (form) 
					{									
					   _form.bind('submit', function(){return false;})										   
					   var _data = decodeURIComponent(_form.serialize());							 					   					   
					   oAjax.call(false, {"func": 'editRequest','data': _data, 'id':_requestId}, false, function(data)
					   {
						   if(data[0].success)
						   {
							  root.msgBoxSuccess.show({title:"System Notification", message:data[0].message})   
						   } else {
							  root.msgBoxInfo.show({title:"System Notification", message:data[0].message}) 
						   }						   
						});				   				
					},
					rules: {
						request_reason: {required: true,minlength: 3}
					}
				})	
			}		
			
			function requestCancelHandler(ev)
			{
				
				var result = confirm("Are you sure you wish to cancel the request ?");
				if(result)
				{
					var _this = $(ev.target);				
					var _parentRow = _this.parents('.datagrid-record');
					var _requestId = _parentRow.attr('data-id') * 1;				
					var _data = "request_status=cancelled";								  
					oAjax.call(false, {"func": 'editRequest','data': _data, 'id':_requestId}, false, function(data){
						
						if(data[0].success)
						{
							getTransactions();
							//root.msgBoxSuccess.show({title:"System Notification", message:"The request has been succesfully cancelled !"}) 
						}
							
					});	
				}						
				return false;				
			}			
				 		    
		  $btnFilter.bind('click', filterGrid);
		  $btnCancelFilter.live('click',cancelFilterGrid);
		  $btnUserDetail.live('click', onExtraClick)		  
		  $btnRequestUpdate =  $datagridHolder.find("form.frmReason input[type='submit']").live('click', requestUpdateHandler);	
		  $btnRequestCancel =  $datagridHolder.find(".datagrid-record .cancel").live('click', requestCancelHandler);	 		
		  
		  // fire off
		  getTransactions()		  
		  	
	  }		
	},
		
	profile_page :
	{
		init : function()
		{
			var oAjax = new Ajax();	
			oAjax.global();
			
			$frmPersonal = $('#frmPersonal');
			$frmPassword = $('#frmPassword');
			$frmSecurity = $('#frmSecurity');
			
					
			$('#profile_holder').tabulator({first:true});										
			
			function updatePersonal(ev)
			{	
				_form = $frmPersonal;					
						
				_form.validate({
					submitHandler: function (form) 
					{									
					   _form.bind('submit', function(){return false;})										   
					   var _data = decodeURIComponent(_form.serialize());							 					   					   
					   oAjax.call(false, {"func": 'editUser','data': _data, 'id':root.USER_ID}, false, function(data)
					   { 
					 	   if(data[0].success)
						   {
							  root.msgBoxSuccess.show({title:"System Notification", message:data[0].message})   
						   } else {
							  root.msgBoxSuccess.show({title:"System Notification", message:data[0].message}) 
						   }					   
					   });		   
						
					},
					rules: {
						user_fname: {required: true,minlength: 3},
						user_lname: {required: true,minlength: 3}	
					}
				})				
			}	
			
			function updatePassword(ev)
			{
				_form = $frmPassword;					
						
				_form.validate({
					submitHandler: function (form) 
					{									
					   _form.bind('submit', function(){return false;})										   
					   var _data = _form.serializeArray();
					   var oData = [];
					 				   					   
					   $.each(_data, function(index, element){oData[element.name] = element.value })
						
						if(oData['confirm_password'] === oData['new_password'])
						{
							
							if(oData['new_password'] === oData['old_password'])
							{							
								root.msgBoxInfo.show({title:"System Notification",message:"Old Password cant be the same as the new one. "})								
								return false;
							}
							oAjax.call(false, {'func': 'editUserPassword', 'old': oData['old_password'], 'new': oData['new_password'], 'id': root.USER_ID}, false, 
									function(data){
										
										if(data[0].success)
										{
											_form[0].reset();
											_form.blur();
											root.msgBoxSuccess.show({title:"System Notification",message:"Your password has been succesfully updated !"})
											
										} else {
											root.msgBoxFailure.show({title:"System Notification",message:data[0].message})
											
										}
								
								 }); 
						} else {
							root.msgBoxInfo.show({title:"System Notification",message:"Please make sure that the passwords match. "})	
						}		  
						
					},
					rules: {
						old_password: {required: true,minlength: 5},
						new_password: {required: true,minlength: 5},	
						confirm_password: {required: true,minlength: 5}
					}
				})		
			}
			
			function updateSecurity(ev)
			{
				_form = $frmSecurity;
				_form.validate({
					submitHandler: function (form) 
					{									
					   _form.bind('submit', function(){return false;})										   
					   var _data = decodeURIComponent(_form.serialize());							 					   					   
					   oAjax.call(false, {"func": 'editUser','data': _data, 'id':root.USER_ID}, false, function(data)
					   { 
					   	   if(data[0].success)
						   {
							  root.msgBoxSuccess.show({title:"System Notification", message:data[0].message})   
						   } else {
							  root.msgBoxInfo.show({title:"System Notification", message:data[0].message}) 
						   }				   
					   });		   
						
					},
					rules: {
						user_fname: {required: true,minlength: 3},
						user_lname: {required: true,minlength: 3}	
					}
				})				
					
			}
			
			// Attach Handlers
			$frmPersonal.find("input[type=submit]").bind('click', updatePersonal);
			$frmPassword.find("input[type=submit]").bind('click', updatePassword);	
			$frmSecurity.find("input[type=submit]").bind('click', updateSecurity)		
		}
		
	},
	
    user_page: {
		
		init: function () 
			 {			
				// IMPORT MODULES
				var oAjax = new Ajax();	
				oAjax.global();
							
				var oFilter = {};
				var oData = {}
				var oTemplateUser = $('#template-user');
				
				var myPag = new Pagination({target:'#paginationHolder', show:10, onChange : function(ev){ 
						
						oFilter['start'] = myPag.getStart();
						getUsers()
						
				}});			
				
				resetFilter()									
				
				// VIEW
				$datagridHolder = $("#datagridHolder");
				$btnUserDetail  = $datagridHolder.find('table.datagrid a.extra');
				$btnUserUpdate =  $datagridHolder.find('table.datagrid input.update');	
				$btnFilter = $('#btnFilter');	
				$frmFilter = $("#frmFilter");	
				$btnCancelFilter = $('#btnResetFilter');
					
				// ADD
				$frmAddUser = $("#frmAddUser");
				$btnAdd = $frmAddUser.find("input[type='submit']");	
										
				
				function addUser(ev)
				{
					var _form = $frmAddUser;
																										   
					_form.validate({
						submitHandler: function (form) 
						{									
						   _form.bind('submit', function(){return false;})	
						   
							var _data = decodeURIComponent(_form.serialize());	
											
								 					   					   
						    oAjax.call(false, {"func": 'addUser','data': _data}, false, function(data)
							{
								alert(data[0].message)
														
							   if(data[0].success)
							   {
								 // root.msgBoxSuccess.show({title:"System Notification", message:data[0].message}) 
								  _form[0].reset();
								    
							   } else {
								 // root.msgBoxInfo.show({title:"System Notification", message:data[0].message}) 
							   }							
							});			
						},
						rules: {
							user_fname: {required: true,minlength: 3},
							user_lname: {required: true,minlength: 3},
							user_email: {required: true, email:true},
							user_security_question: {required: true,minlength: 3},
							user_security_answer: {required: true,minlength: 3}	
						}				
					})
				}
				
				function resetFilter()
				{
					oFilter = {}
					oFilter['func'] = 'users';
					oFilter['start'] = myPag.getStart();
					oFilter['offset'] = myPag.getOffset();							
				}
				
				function updateUser(ev)
				{
						_this = $(ev.currentTarget);			
					_form = _this.parents('form.frmEdit');
					_id = _form.parents('tr.datagrid-content').attr('data-id');
					_form.validate({
						submitHandler: function (form) 
						{									
						   _form.bind('submit', function(){return false;})
						   
							var _data = decodeURIComponent(_form.serialize());														 						   
						  						   			 					   					   
						   oAjax.call(false, {"func": 'editUser','data': _data, 'id':_id}, false, function(data)
						   {					   		
							   if(data[0].success)
							   {
								  root.msgBoxSuccess.show({title:"System Notification", message:data[0].message})   
							   } else {
								  root.msgBoxInfo.show({title:"System Notification", message:data[0].message}) 
							   }
						   
						    });		   
							
						},
						rules: {
							user_fname: {required: true,minlength: 3},
							user_lname: {required: true,minlength: 3},
							user_email: {required: true, email:true},
							user_security_question: {required: true,minlength: 3},
							user_security_answer: {required: true,minlength: 3}		
						}
					})
				}
							
				function getUsers()
				{
					oAjax.call(false, oFilter, false, displayUsers);	
				}
				
				function displayUsers(data)
				{
					if(data[0].success)
					{										
						myPag.setTotal(Number(data[0].actualRows))
															
						var number = myPag.getStart();							
						var _html = "";			
						var _class = ""			
						$.each(data, function (index, element) 
						{	
							if (this == '[object Object]' && index > 0) {							
												
								 if(index % 2 == 0)
								 {
									_class = "odd"; 
								 } else {
									_class = "even";  
								 }					
								 // ROW
								_html += "<tr data-id='" + data[index].user_id + "' class='datagrid-record " + _class + "'>"
									
									_html += "<td>" + (number + index) + "</td>"
									_html += "<td>" + data[index].user_id + "</td>"
									_html += "<td>" + data[index].user_title + "</td>";
									_html += "<td>" + data[index].user_fname + "</td>";
									_html += "<td>" + data[index].user_lname + "</td>";
									_html += "<td>" + data[index].user_email + "</td>";
									_html += "<td>" + data[index].us_name + "</td>";									
								    _html += "<td class='options'><a class='extra' title='Click to open' href='#'></a>"
																
								_html += "</tr>";
								
								oData[data[index].user_id] = {details:[]}
									
								for(var item in element)
								{									
									oData[data[index].user_id].details.push({label: item, data: element[item]})						
								}		
								
								// CONTENT
								_html += "<tr class='datagrid-content' data-id='" + data[index].user_id + "'>";
									_html += "<td colspan='8'>";
										
									_html += "</td>";							
								_html += "</tr>";	
							}						
							$datagridHolder.find('table.datagrid tbody').html(_html);
								
						});								
					} else {					
						root.msgBoxFailure.show({title:"System Notification", message: data[0].message})
					}
				}
				
				function cancelFilterGrid()
				{
					 myPag.reset();
					 resetFilter();
					 getUsers();	
				}
				
				function filterGrid() 
				{
					_form = $frmFilter;																					   
					_form.validate({
						submitHandler: function (form) 
						{									
						   _form.bind('submit', function(){return false;})
							myPag.reset();
						   resetFilter();					  
						   
							var _data = _form.serializeArray();						
							for (var i = 0; i < _data.length; i++) 
							{							
								oFilter[_data[i].name] = _data[i].value;									
							}
							
							getUsers();	   		   	         
			
						},
						rules: {
							id: {number: true, minlength: 1},							
							user_email :{ email : true}
						}				
					})					
				}	
			   
			   function onExtraClick(ev)
			   {
					var _this = $(this);
					var _record = _this.parents('.datagrid-record');
					var _content = _record.next('.datagrid-content');
					var clone = oTemplateUser.clone(true, true);				
					var destination = _content.find('td');							
									
					if(!destination.html()){ 
						destination.html(clone.html());
						destination.children('.skin_flex_body').hide();
						
						// populate details
						var aDetails = oData[_record.attr('data-id')].details;
						if(aDetails.length)
						{
							for(var i = 0; i<aDetails.length;i++)
							{
								destination.find("div[data-element='details'] [name='" + aDetails[i].label +"']").val(aDetails[i].data);												
							}					
						}			
						// Activate Tabulator
						destination.tabulator({first:true,duration:0});
					}				
					var _skinBody = destination.children('.skin_flex_body');			
					if(_skinBody.is(":hidden"))
					{
						_skinBody.slideDown(function()
						{
							_this.attr('title','Click to close');
							_record.addClass('active'); 
							root.services.animation.movePageTo(_content.offset().top,-100,400)								
						});			
							
					} else {
						_skinBody.slideUp(function(){
							_record.removeClass('active');
							_this.attr('title','Click to open');
						});				
					}												
					return false;	
			   }
			   
			   function onEmailSubmitHandler(ev)
			   {				
			   		alert("To be implemented after receiving a blessing from the client");
					return false;		   
			   }		   
				
				// Attach Handlers
				$btnUserDetail.live('click', onExtraClick);
				$btnFilter.bind('click', filterGrid);
				$btnCancelFilter.live('click',cancelFilterGrid);
				$btnUserUpdate.live('click', updateUser);				
				$btnAdd.bind('click', addUser);	
				$datagridHolder.find("form.frmEmail input[type='submit']").live('click', onEmailSubmitHandler)
				
				// Fire it off		
				getUsers()
			}		       
    },
    common: {
        navigate: function (url, timeout) {
            if (url == null || url == "") {
                return false
            }
            if (timeout) {
                setTimeout(function () {
                    window.location = url
                }, timeout);
            } else {

                window.location = url;			
            }
        },
		
		addressbook : 
		{
			$target : null,
			$addressBook : null,
			$addressOverlay : null,
			nScrollTop : 0,
			
			focusTarget : function(element)
			{
				element.focus().blur().stop().animate({'background-color':'#77ff54'},1100,'easeInQuad', function()
				{						
					element.animate({'background-color':'#fff'},1300,'easeInOutQuad');										
				});
			},
			
			setTarget : function(element)
			{
				if(element.length == 1)
				{
					root.common.addressbook.$target = element;	
				}	
			},			
						
			hide : function(b)
			{
				var _addressBook = root.common.addressbook.$addressBook;
				var _addressOverlay = root.common.addressbook.$addressOverlay;
				
				if(_addressBook.length > 0)
				{
					// HIDE BOOK
					_addressBook.stop().animate({"opacity":0}, (b == null || b == false) ? 400 : 0, 'swing', function(){
						
						_addressBook.css('visibility','hidden').hide();	
						_addressOverlay.css('visibility','hidden').hide();					
					})
					
					// HIDE OVERLAY
					_addressOverlay.stop().animate({"opacity":0}, (b == null || b == false) ? 400 : 0, 'swing');
				}
			},
			
			show : function()
			{
				var _addressBook = root.common.addressbook.$addressBook;
				var _addressOverlay = root.common.addressbook.$addressOverlay;
				
				if(_addressBook.length > 0)
				{
					root.common.addressbook.nScrollTop = $(window).scrollTop();					
					root.services.animation.movePageTo(0,0,500);					
					_addressBook.show().css({'visibility':'visible', 'opacity':0}).stop().animate({"opacity":1}, 400, 'swing')
					_addressOverlay.show().css({'visibility':'visible', 'opacity':0}).stop().animate({"opacity":0.65}, 400, 'swing')
				}	
			},			
			
			init : function()
			{	
				var _addressBook = $('#addressBook');				
				
				if(_addressBook.length > 0)
				{
					// HIDE ADDRESS BOOK
					root.common.addressbook.$addressBook = _addressBook;
					root.common.addressbook.$addressOverlay = $('#addressBookOverlay');
					root.common.addressbook.hide(true);											
					
					// Import Ajax Module
					var oAjax = new Ajax();
					oAjax.global();
					
					
					var oTemplateAddressUser = $('#template-address-user');
					var oFilter = {};
					var oData = {}			
					
					var oAddressPagination = new Pagination({target:'#addressPaginationHolder', show:5, onChange : function(ev){ 
						
						oFilter['start'] = oAddressPagination.getStart();
						oAjax.call(false, oFilter, false, displayUsers);
						root.services.animation.movePageTo(0,0,1);
						
					}});	
					
					// Set Variables
					var frmAddress = _addressBook.find('#frmAddressFilter');
					var dataGridHolder = _addressBook.find('#addressDataGridHolder');
					var pagination = _addressBook.find('#addressPaginationHolder');					
									
					// initialize tabulator					
					_addressBook.tabulator({first:true})
					
					function resetFilter()
					{
						oFilter = {}
						oFilter['func'] = 'users';
						oFilter['start'] = oAddressPagination.getStart();
						oFilter['offset'] = oAddressPagination.getOffset();		
					}
					
					function frmSubmitHandler(ev)
					{
						var _form = frmAddress;
						_form.validate({
							submitHandler: function (form) 
							{
								_form.bind('submit', function(){return false;})	
								
								oAddressPagination.reset();
						  		resetFilter();
								
								var _data = _form.serializeArray();						
								for (var i = 0; i < _data.length; i++) 
								{							
									oFilter[_data[i].name] = _data[i].value;			
								}
																					
								oAjax.call(false, oFilter, false, displayUsers);				   
								
							},
							rules: {
								user_id: {number: true}	
							}
						})								
					}
					
					function displayUsers(data)
					{					
						if(data[0].success)
						{	
							oAddressPagination.setTotal(Number(data[0].actualRows))
							
							var number = oAddressPagination.getStart();						
							var _html = "";			
							var _class = ""			
							$.each(data, function (index, element) 
							{	
								if (this == '[object Object]' && index > 0) {							
													
									 if(index % 2 == 0)
									 {
										_class = "odd"; 
									 } else {
										_class = "even";  
									 }					
									 // ROW
									_html += "<tr data-id='" + data[index].user_id + "' class='datagrid-record " + _class + "'>"
										
										_html += "<td>" + (number + index) + "</td>"
										_html += "<td>" + data[index].user_id + "</td>"
										_html += "<td>" + data[index].user_title + "</td>";
										_html += "<td>" + data[index].user_fname + "</td>";
										_html += "<td>" + data[index].user_lname + "</td>";
										_html += "<td>" + data[index].user_email + "</td>";
										_html += "<td>" + data[index].us_name + "</td>";									
										_html += "<td class='options'><a class='extra' title='See user details' href='#'></a><a class='address-user' title='Add User ID' href='#'></a>"																	
									_html += "</tr>";
									
									oData[data[index].user_id] = {details:[]}
										
									for(var item in element)
									{									
										oData[data[index].user_id].details.push({label: item, data: element[item]})						
									}							
									
									// CONTENT
									_html += "<tr class='datagrid-content' data-id='" + data[index].user_id + "'>";
										_html += "<td colspan='8'>";
														
										_html += "</td>";							
									_html += "</tr>";	
								}						
								dataGridHolder.find('table.datagrid tbody').html(_html);
									
							});								
						} else {
												
							root.msgBoxInfo.show({title:"System Notification", message: "No Records Matching your search criteria were found"})
						}
					}	
					
					function onExtraClick(ev)
					{						
					 	var _this = $(this);
						var _record = _this.parents('.datagrid-record');
						var _content = _record.next('.datagrid-content');
						var clone = oTemplateAddressUser.clone(true, true);				
						var destination = _content.find('td');									
										
						if(!destination.html()){ 
							destination.html(clone.html());
							destination.children('.skin_flex_body').hide();
							
							// populate details
							var aDetails = oData[_record.attr('data-id')].details;
							if(aDetails.length)
							{
								for(var i = 0; i<aDetails.length;i++)
								{
									destination.find("div[data-element='details'] [name='" + aDetails[i].label +"']").val(aDetails[i].data);												
								}					
							}			
							// Activate Tabulator
							destination.tabulator({first:true,duration:0});
						}			
										
						var _skinBody = destination.children('.skin_flex_body');			
						if(_skinBody.is(":hidden"))
						{
							_skinBody.slideDown(function(){_record.addClass('active'); root.services.animation.movePageTo(_content.offset().top,-100,400)});			
								
						} else {
							_skinBody.slideUp(function(){_record.removeClass('active');});				
						}												
						return false;		
					}							
					
					function addressBookCloseHandler()
					{
						root.common.addressbook.hide();						
						var destination = root.common.addressbook.$target;						
						if(destination.length > 0)
						{
							root.services.animation.movePageTo(root.common.addressbook.nScrollTop,0,1);			
						}
					}	
					
					function submitUserClickHandler(ev)
					{
						var _this = $(this);	
						var _content = _this.parents('.datagrid-content')
						var _record = _content.prev('.datagrid-record');
												
						if(_record.length) assignId(_record);
						
						return false;
					}
					
					function addressUserClickHandler(ev)
					{
						var _this = $(this);	
						var _record = _this.parents('.datagrid-record');	
										
						if(_record.length) assignId(_record);
						return false;
					}
					
					function assignId(record)
					{				
						var _record = record
						var _skinBody = _record.next('.datagrid-content').find('.skin_flex_body');
						var _extraLink = _record.find('a.extra')																	
						if(_record.hasClass("active")) _extraLink.trigger("click");						
												
						var _id = Number(_record.attr('data-id'));
						
						if(_id)
						{
							var destination = root.common.addressbook.$target;
							if(String(destination[0].nodeName).toLowerCase() == 'input') // FOR INPUT ELEMENT
							{
								destination.val(_id);
								root.common.addressbook.setTarget($([]));
								root.common.addressbook.focusTarget(destination);						
							}
							
							root.services.animation.movePageTo(root.common.addressbook.nScrollTop,0,1);
							root.common.addressbook.hide();
							//root.msgBoxSuccess.show({title:"System Notification", message:"User ID Succesfully Assigned. Carry on with your work as usual !"})
						}
						return false;					
					}			
													
					
					// Attach Handlers
					 frmAddress.find("input[type='submit']").bind('click', frmSubmitHandler)		
					_addressBook.find("a.extra").live('click', onExtraClick)
					_addressBook.find("a.address-user").live('click', addressUserClickHandler);
					_addressBook.find(".frmAddressUser input[type='submit']").live('click', submitUserClickHandler)										
					_addressBook.find(".skin_flex_close").live('click', function(){ addressBookCloseHandler()});
																
				}				
			}
		},

        init: function () 
		{	
			// INITIALIZE MESSAGE BOXES			
			root.msgBoxSuccess = new InfoPanel({skin:"success"});
			root.msgBoxInfo = new InfoPanel({skin:'info'});
			root.msgBoxFailure = new InfoPanel({skin:"failure"});	
							
			
			// USER INFO			
			_userInfo = $('#user_info');			
			if(_userInfo.length > 0)
			{
				root.USER_EMAIL = _userInfo.find("input[name='user_info_email']").val();	
				root.USER_ID = _userInfo.find("input[name='user_info_id']").val();	
				root.USER_TYPE = _userInfo.find("input[name='user_info_type']").val();
			}				
					
			// FULLSCREEN
			_fullScreen = new FullScreen();
            _btn_fullscreen = $('#btn_full_screen');
            _splash = $("#splash");
            
			// ADDRESS BOOK
			root.common.addressbook.init()
			
			// TOOLTIP
			$('.tooltip').tooltip({top:25})
			
			// LOOKUP ID
			var aBookPanels = $('div.address-book-panel');
			if(aBookPanels.length > 0)
			{
				aBookPanels.find('a').bind('click', function()
				{ 	
					var _this = $(this);
					var destination = _this.parent('div.address-book-panel').prev('input.client-id');
					
					if(_this.hasClass('address-book-lookup'))
					{
						root.common.addressbook.setTarget(destination);								
						root.common.addressbook.show();
						root.services.animation.movePageTo(0,0,1)
					} else {
										
						destination.val(_this.attr('data-value'))
						root.common.addressbook.focusTarget(destination);													
					}			
					return false;
				})	
			}		
						
			// FULL SCREEN SITE	 -----------------------------------------------------------------------------------------
            if ($.cookie("isFullScreen")) {
                if ($.cookie("isFullScreen") == 'on') {
                    _fullScreen.on = false;
                    _fullScreen.toggle();
                } else {
                    _fullScreen.toggle();
                }
            }

            _fullScreen.trigger.click(function () {

                _fullScreen.toggle(true);
            })

            // MAIN NAVIGATION	 -----------------------------------------------------------------------------------------																			
            $('#site_navigation a').click(function () {

                if ($(this).next('ul').length) {
                    if ($(this).next('ul').is(':hidden')) {
                        $(this).addClass('open').next('ul').slideDown('medium')
                    } else {

                        $(this).removeClass('open').next('ul').slideUp('slow')
                    }
                    return false;
                }
            })

            // SKIN FLEX HIDE/SHOW FUNCTIONALITY  --------------------------------------------------------------------------	
            $('div.skin_flex_opener').click(function () {

                $this = $(this).parent();
                $next = $this.next();

                if ($next.is(':hidden')) {
                    $next.slideDown(1000, function () {
                        $this.find('div').addClass('skin_flex_open')
                    });
                } else {
                    $next.slideUp(1000, function () {
                        $this.find('div').removeClass('skin_flex_open')
                    });
                }
            })

            // SPLASH SCREEN  -----------------------------------------------------------------------------------------------
            if (_splash) {
                _splash.delay(500).fadeOut(2000)
            };   
			
			$(window).bind('resize', function(ev){
				
				root.msgBoxFailure.resize();
				root.msgBoxInfo.resize();
				root.msgBoxSuccess.resize();
									
			}).bind('scroll', function(){
				if(root.msgBoxFailure.IE6)
				{
					root.msgBoxInfo.resize();
					root.msgBoxFailure.resize();
					root.msgBoxSuccess.resize();		
				}
			})
			  	
			
        }
    },
    services: {
        animation: {
            movePageTo: function (top, offset, speed) {
                if (top == null) return false;
                if (offset == false || offset == null) {
                    offset = 0;
                }
                if (speed == false || speed == null) {
                    speed = 1000;
                }

                $("html,body").stop().animate({
                    scrollTop: top + offset
                }, speed, 'easeInQuad');
            }
        }
    }
}