// JavaScript Document
$(document).ready(function(){
	$('#btnClickToCall').click(function(){			
		$.createModalBox({
			title: 'Please enter name and phone', 
			height: 'auto', 
			width:400,  
			autoOpen:true, 
			modal:true,
			resizable: false,
			buttons: {
				"Call Now" : function(){							
						var name=$('#txtCallName').val();
						var phone=$('#txtCallPhone').val();
						if(name==""){
							alert("Please enter name");
							return false;
						}
						if(name.length>30){
							alert("Name should be in 30 characters");
							return false;
						}
						if(phone==""){
							alert("Please enter phone");
							return false;
						}
						if(!ClickPhoneCheck(phone)){
							return false;
						}
						
						$.createModalBox({
						title: 'Please enter name and phone', 
						height: 'auto', 
						width:400,  
						autoOpen:true, 
						modal:true,
						resizable: false});							
						
						$('#mydialog').html('<p align="center" style="padding-top:10px;"><img src="images/loading.gif" border="0"><br>Calling, Please wait...</p>');					
													
						$.post('clickacall.aspx','Phone='+phone+'&name='+name,function(data){
						
							$.createModalBox({
								title: 'Please enter name and phone', 
								height: 'auto', 
								width:400,  
								autoOpen:true, 
								modal:true,
								resizable: false,
								buttons: {
									"Ok" : function(){
										$(this).dialog('close');
										$(this).remove();
									}
								}
							});	
						
							$('#mydialog').html('<p align="center" style="padding-top:20px;color:#FF0000;">Someone will call you back as soon as possible. Thank you!</p>');											
							
						});
						
						
					}
				}
		});

		$('#mydialog').html('<p style="padding-bottom:0px;"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>Name:</td><td><input type="text" name="txtCallName" id="txtCallName" style="width:250px" /></td></tr><tr><td colspan="2" height="5"></td></tr><tr><td>Phone:</td><td><input type="text" name="txtCallPhone" id="txtCallPhone" style="width:250px"/></td></tr></table></p>');
		$('#mydialog').dialog({position:'center'});															
	});

});

$.createModalBox = function(options){
	if ($("#mydialog").length > 0){
		$("#mydialog").remove();
	}
	$('body').eq(0).append('<div id="mydialog"></div>');
	$('#mydialog').dialog(options);
}

function ClickPhoneCheck(strPhone){  	  		  	  		
	strPhone=strPhone.replace(/[^0-9]/g, ''); 
	//if(strPhone.length
	if(strPhone.length<10 || strPhone.length>11){
		alert("Invalid Phone Number");
		return false;
	}
	return true;	  	  	
}
