<!-- Give the purchaser a discount if the correct discount code is entered into
     the storefront checkout page.  You define the discount code and the discount.
     The discount code cannot have quotation marks.  The discount rate is a decimal
     number.  For example, an discount of 15% is 0.15. -->

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">

// Discount rate is 15% if the discount code is "Mountain Goat".
var DISCOUNT_CODE = "Mountain Goat";
var DISCOUNT_RATE = 0.15;

$(document).ready(function() {
    // This script is restricted to storefront checkout pages.
    if (RegExp('checkOut.jsp\\?storefront_KEY=').test(window.location.href)) {

        // Update the total by getting the page shipping charge and
        // formatting the subtotal, shipping and total fields.
        function updateTotal() {
            var sub = parseFloat($('*[name=sub]').val());

            var discount = 0.0;
            var discountCode = $('#discount_code').val();
            if (discountCode.length > 0 && discountCode == DISCOUNT_CODE) {
                discount = -1 * sub * DISCOUNT_RATE;
            }
            if (discount != 0.0) {
                $('#discount').val(discount.toFixed(2));
            } else {
                $('#discount').val('');
            }

            var shipping = parseFloat($('[name=shipping]').val());
            shipping = shipping !== null ? shipping : 0;
            $('*[name=shipping]').val(shipping.toFixed(2));

            var amountDisplay = sub + shipping + discount;
            $('*[name=amountDisplay]').val(amountDisplay.toFixed(2));

            // Just A Number. Cannot be fancy.
            $('*[name=amount]').val(amountDisplay.toFixed(2));
        }

        // Add the discount code and amount fields.
        $('td:contains("Shipping/Handling")').filter(':last').parent().before($('#discount_row'));
        $('#apply_discount').click(updateTotal);
    }
});
</script>
<!-- Style changes to make the totals look better. -->
<style type="text/css">
/* Make the subtotals and totals right-justified. */

#sub,
#discount,
#shipping,
#amountDisplay {
    padding-right: 15px;
    text-align: right;
}

#discount_code {
    font-family: Droid Sans;
    font-size: 11pt;
    text-align: left;
}

td input {
    text-align: right;
}
#shoppingCart a {
    font-size: 18pt;
    font-weight: 600;
    font-family: Arial;
    color: forestgreen;
    padding-left: 20px;
    padding-right: 20px;
}
</style>
<div style="display:none">
    <table>
        <thead/>
        <tbody>
            <tr id="discount_row">
                <td></td>
                <td>Discount code:
                    <input size="14" id="discount_code">
                </td>
                <td align="right">Discount:</td>
                <td align="right">
                    $
                    <input id="discount" value="" size="7" readonly>
                </td>
                <td>
                    <input type="button" value="Apply" id="apply_discount" />
                </td>
                <td> </td>
            </tr>
        </tbody>
    </table>
</div>