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

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

<script type="text/javascript">

// Callback function for ExtJS delete popup
function searchDomain(name, tld) {
    
    $('#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) {

        // Rather dirty method, but we want a submit button on the page at all times
        // So rather than messing around processing it after we get the HTML simply hide it and return.
        document.getElementById('submitButton').style.visibility = 'hidden';
        document.getElementById('submitButton').style.display = 'none';

        // 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;?> }
    });
}


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

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

// Function to animiate the searching
function animateSearch() {
    var dotspan = document.getElementById('dots');
    window.setInterval(function(){
        if(dotspan.innerHTML == '....'){
           dotspan.innerHTML = '.';
        }
        else{
           dotspan.innerHTML += '.';
        }
     }, 1000);
}
</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">
    <input type="hidden" name="product" value="<?php echo $this->product['id'];?>">
    <input type="hidden" name="formId" value="domainReg">

    <table class="ts2" cellspacing="0">
        <tr id="domainSearch">
            <td style="background:#E9F2F7;">www. <input id="registerName" name="registerName" type="text" size="50" /> .

                <select name="tld" id="tld">
                    <?php if(isset($this->tld)) { ?>
                        <?php foreach($this->tld AS $key) {?>
                        <option name=""><?php echo $key['name'];?></option>
                        <?php }?>
                    <?php }?>
                </select>

                &nbsp; <input type="button" onclick="searchDomain(document.getElementById('registerName').value,document.getElementById('tld').options[document.getElementById('tld').selectedIndex].text)" value="<?php echo $this->lang('Check Availablity');?>" style="padding:5px;" /></td>
        </tr>
    </table>

    <div id="domainSearchResults"></div>

    <input class="submit" id="submitButton" type="submit" disabled value="<?php echo $this->lang('Continue');?> &raquo;" />
</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 } ?>