<!-- Progress Bar -->
<?php echo $this->progressBar;?>

<!-- Cart Summary -->
<?php echo $this->cartSummary;?>

<?php if(isset($this->bundling) && $this->bundling == 1 && $this->allowSelfManage) {?>
<style type="text/css">
    span.invalid { color: red; padding-left: 10px;}
</style>
<script type="text/javascript" src="javascript/jquery.validate.min.js"></script>    
<?php } ?>

<script type="text/javascript" src="javascript/jquery.watermark.js"></script>
<script type="text/javascript">

// Callback function for ExtJS delete popup
function searchDomain(name, tld, searchType, animate) {

	// Don't do anything if we're submitting yourdomain or his translation
	if(name == '<?php echo $this->lang("yourdomain");?>') { return false; }
    
    // Handle the searching animation
    if(animate) {
    	$('#domainSearchResults').html('<table class="ts2" border="0" cellspacing="0"> <tr> <td colspan="6" style="font-size:16px; font-weight:bold; color:#090;" id="textAvailable"><?php echo $this->lang('Searching');?><span id="dots">.</span></td> </tr> </table>');
    	animateSearch();
    }
    
    // Callback for the ajax request
    var received = function (response) {
        // Populate the html
        $('#domainSearchResults').html(response.responseText)
    }
    // Query the domain
    Ext.Ajax.request({
       url: 'order.php?step=search',
       success: received,
       failure: received,
       params: { name: name, tld: tld, product:<?php echo $this->product['id'];?>, bundling:<?php echo $this->bundling;?> <?php if ( isset($this->hosting_product) ) { ?>,hosting_product: <?php echo $this->hosting_product; } ?>, searchType: searchType }
    });
}

// Function to trigger the search of a domain
function triggerSearch(name, tld) {

    // Update the form fields
    document.getElementById('registerName').value = name;
    document.getElementById('registerTld').value=tld;
    
    // Do the search
    searchDomain(name, tld, 'register', true);
}

// Function to animiate the searching
function animateSearch() {
    var dotspan = document.getElementById('dots');
    window.setInterval(function(){
        if(dotspan.innerHTML == '....'){
           dotspan.innerHTML = '.';
        } else {
           dotspan.innerHTML += '.';
        }
     }, 1000);
}

$(document).ready( function() {

	// Add water marks to input boxes
	<?php if(@!$this->triggerSearch) { ?>
		watermark('input#registerName', '<?php echo $this->lang("yourdomain");?>', '#ccc', '#000');
	<?php } ?>
	watermark('input#transferName', '<?php echo $this->lang("yourdomain");?>', '#ccc', '#000');
	//watermark('input#manageName', '<?php echo $this->lang("yourdomain");?>.com', '#ccc', '#000');
	watermark('input#subDomain', '<?php echo $this->lang("subdomain");?>', '#ccc', '#000');
	
	// Detect a change of radio button
	$("input[name$='domainAction']").click(function(){
	 
	 	// Clear any residual results in the div below
	 	$('#domainSearchResults').html('')
 
 		// Get the radio value
  		var radio_value = $(this).val();
 
 		// Handle the work
  		if(radio_value=='register') {
    		$("#domainRegister").show();
     		$("#domainTransfer").hide();
     		$("#domainSubdomain").hide();
     		$("#domainManage").hide();
  		} else if(radio_value=='transfer') {
    		$("#domainRegister").hide();
     		$("#domainTransfer").show();
     		$("#domainSubdomain").hide();
     		$("#domainManage").hide();
   		} else if(radio_value=='subdomain') {
    		$("#domainRegister").hide();
     		$("#domainTransfer").hide();
     		$("#domainSubdomain").show();
     		$("#domainManage").hide();
   		} else if(radio_value=='manage') {
   			searchDomain('1','1', 'selfmanage', false);
    		$("#domainRegister").hide();
     		$("#domainTransfer").hide();
     		$("#domainSubdomain").hide();
     		$("#domainManage").show();
   		}
  	});
 
 	// Hide the other options initially
 	$("#domainManage").hide();
	$("#domainTransfer").hide();
	$("#domainSubdomain").hide();
	
	// Add some keyup events to trigger search functions
	$("#registerName").keyup(function(event){ if(event.keyCode == 13){ $("#buttonRegisterCheck").click(); } });
	$("#transferName").keyup(function(event){ if(event.keyCode == 13){ $("#buttonTransferCheck").click(); } });
    
    <?php if(isset($this->bundling) && $this->bundling == 1 && $this->allowSelfManage) {?>    
    jQuery.validator.addMethod("domain", function(value, element) { 
        return this.optional(element) || /^([-0-9A-Z]+\.)+([0-9A-Z]){2,4}$/i.test(value); 
    }, '<?php echo $this->lang("Please provide a valid domain name."); ?>');

    $("#domainForm").validate({
        errorClass: "invalid",
        errorElement: "span",
        rules: {
            manageName: {
                required: true,
                domain: true
            }
        }
    });
    function doSubmitForm() {
        jQuery('#domainForm').unbind('submit').submit();
        return false;
    } 
    <?php } ?>
});


</script>

<!-- Main Page -->
<div style="margin-right:220px; margin-bottom:20px;">
<h3><?php echo $this->lang("Configure Product");?>: <?php echo $this->product['name'];?></h3>
<p class="pagedesc"><?php echo $this->product['description'];?></p>


<form action="order.php?step=3" method="POST" name="domainForm" id="domainForm">
    <input type="hidden" name="product" value="<?php echo $this->product['id'];?>">
    <input type="hidden" name="formId" value="domainReg">

<table class="ts2" cellspacing="0">
    <tr>
        <td><input name="domainAction" type="radio" value="register" checked /> <?php echo $this->lang("Register a new domain name");?></td>
    </tr>
    <tr id="domainRegister">
        <td style="background:#E9F2F7;">www. <input id="registerName" name="registerName" type="text" size="50" /> .
 
            <select name="registerTld" id="registerTld">
                <?php if(isset($this->tld) && is_array($this->tld)) { ?>
                	<?php foreach($this->tld AS $key) { ?>
                		<option name=""><?php echo $key['name'];?></option>
                	<?php } ?>
                <?php } ?>
            </select>
            &nbsp; <input id="buttonRegisterCheck" type="button" onclick="searchDomain(document.getElementById('registerName').value,document.getElementById('registerTld').options[document.getElementById('registerTld').selectedIndex].text, 'register', true)" value="<?php echo $this->lang("Check Availability");?>" style="padding:5px;" /></td>
    </tr>
    
 <?php if($this->allowTransfer) { ?>
    <tr>
        <td><input name="domainAction" type="radio" value="transfer" /> <?php echo $this->lang("Transfer an existing domain name");?></td>
    </tr>
    <tr id="domainTransfer">
        <td style="background:#E9F2F7;">www. <input id="transferName" name="transferName" type="text" size="50" /> .
 
            <select name="transferTld" id="transferTld">
                <?php if(isset($this->tld) && is_array($this->tld)) { ?>
                	<?php foreach($this->tld AS $key) { ?>
                		<option name=""><?php echo $key['name'];?></option>
                	<?php } ?>
                <?php } ?>
            </select>
            &nbsp; <input id="buttonTransferCheck" type="button" onclick="searchDomain(document.getElementById('transferName').value,document.getElementById('transferTld').options[document.getElementById('transferTld').selectedIndex].text, 'transfer', true)" value="<?php echo $this->lang("Check Availability");?>" style="padding:5px;" /></td>
    </tr>
<?php } ?>

<?php if(isset($this->subDomains)) { ?>
    <tr>
        <td><input name="domainAction" type="radio" value="subdomain" /> <?php echo $this->lang("Use a free Subdomain");?></td>
    </tr>
    <tr id="domainSubdomain">
        <td style="background:#E9F2F7;">www. <input id="subDomain" name="subDomain" type="text" size="50" /> .
 
            <select name="subDomainTld" id="subDomainTld">
                <?php foreach($this->subDomains AS $key) {?>
                <option name=""><?php echo $key['name'];?></option>
                <?php }?>
            </select>
            &nbsp; <input type="button" value="<?php echo $this->lang("Continue");?>" style="padding:5px;" onclick="document.forms['domainForm'].submit(); false;" /></td>
    </tr>
<?php } ?>

<?php if(isset($this->bundling) && $this->bundling == 1 && $this->allowSelfManage) {?>
    <tr>
        <td><input name="domainAction" type="radio" value="manage" /> <?php echo $this->lang("Manage a domain myself");?></td>
    </tr>
    <tr id="domainManage">
        <td style="background:#E9F2F7;">www. <input id="manageName" name="manageName" type="text" size="60" />
        &nbsp; <input type="submit" onclick="return doSubmitForm();" value="<?php echo $this->lang("Continue");?>" style="padding:5px;" /></td>
    </tr>
<?php } ?>
</table>
    <div id="domainSearchResults"></div>
</form>
</div>

<div class="clear"></div>

<?php if(@$this->triggerSearch) { ?>
<script type="text/javascript">
    triggerSearch('<?php echo $this->triggerDomain;?>', '<?php echo $this->triggerTld;?>');
</script>
<?php } ?>