$j( document ).ready( function() {
        $j( '#medicare_number' )
            .attr( 'maxlength', 10 )
            .css( 'width', '95px' );
            
        var day = '<select id="expiry-day"><option value=""></option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option>';
            
        var month = '<select id="expiry-month"><option value=""></option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option></select>';
        
        var year = '<select id="expiry-year"><option value=""></option><option value="2010">2010</option><option value="2011">2011</option><option value="2012">2012</option><option value="2013">2013</option><option value="2014">2014</option><option value="2015">2015</option><option value="2016">2016</option><option value="2017">2017</option><option value="2018">2018</option><option value="2019">2019</option><option value="2020">2020</option></select>';
        
        $j( 'label[for=medicare_expiry_month]' )
            .next()
            .hide()
            .after( month + year );
            
        $j( '#medicare_expiry_day' ).val( '1' );
            
        $j( '#expiry-month' )
            .attr( 'id', 'medicare-expiry-month-custom' )
            .change( function() {
                $j( '#medicare_expiry_month' ).val( $j( this ).val());
            });
        $j( '#expiry-year' )
            .attr( 'id', 'medicare-expiry-year-custom' )
            .change( function() {
                $j( '#medicare_expiry_year' ).val( $j( this ).val());
            });
            
            
            
        $j( 'label[for=healthcare_expiry_month]' )
            .next()
            .hide()
            .after( day + month + year );
        
        $j( '#expiry-day' )
            .attr( 'id', 'healthcare-expiry-day-custom' )
            .change( function() {
                $j( '#healthcare_expiry_day' ).val( $j( this ).val());
            });
        
        $j( '#expiry-month' )
            .attr( 'id', 'healthcare-expiry-month-custom' )
            .change( function() {
                $j( '#healthcare_expiry_month' ).val( $j( this ).val());
            });
            
        $j( '#expiry-year' )
            .attr( 'id', 'healthcare-expiry-year-custom' )
            .change( function() {
                $j( '#healthcare_expiry_year' ).val( $j( this ).val());
            });
            
            
            
        $j( 'label[for=medicare_sub_number]' )
            .next()
            .hide()
            .after( '<select id="medicare-sub-number-custom"><option value=""></option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option></select>' );
            
        $j( '#medicare-sub-number-custom' ).change( function() {
            $j( '#medicare_sub_number' ).val( $j( this ).val() );
        });
    });

$j(function($) {
    $('body.checkout-onepage-index').each(function() {
        $('#billing\\:medicare_sub_number, #popup-medicare-sub-number').each(function() {
            var $sub_number = $(this);

            var $alternative_sub_number = $('<select id="alternative-sub-number"></select>');
            $.each([1,2,3,4,5,6,7,8,9], function(idx, value) {
                $alternative_sub_number.append('<option value="'+value+'">'+value+'</option>');
            });
            $alternative_sub_number.change(function() {
                $sub_number.val($(this).val());
            });
            $alternative_sub_number.val($sub_number.val()).trigger('change');
            
            $sub_number.hide();
            $sub_number.after($alternative_sub_number);
            $alternative_sub_number.css('width', 'auto');
        });

        $('#popup-medicare-expiry, #billing\\:medicare_expiry_full').each(function() {
            var $expiry = $(this);
            var popup = false;
            if ($expiry.attr('id') == 'popup-medicare-expiry') {
                popup = true;
            }
            var current_date = $expiry.val();
            var current_date_array = current_date.split(' ');
            current_date_array = current_date_array[0].split('-');

            var year = current_date_array[0];
            var month = current_date_array[1];

            var $alternative_month = $('<select id="alternative-month"></select>');
            $.each(['01','02','03','04','05','06','07','08','09','10','11','12'], function(idx, value) {
                $alternative_month.append('<option value="'+value+'">'+value+'</option>');
            });
            $alternative_month.change(function() {
                //$('#billing\\:medicare_expiry_full').trigger('update');
                $expiry.trigger('update');
            });
            $alternative_month.val(month);

            // TODO: swap the following constant array to auto increment the next 10 years beyond the current year.
            var $alternative_year = $('<select id="alternative-year"></select>');
            $.each([2010,2011,2012,2013,2014,2015,2016,2017,2018,2019,2020], function(idx, value) {
                $alternative_year.append('<option value="'+value+'">'+value+'</option>');
            });
            $alternative_year.change(function() {
                //$('#billing\\:medicare_expiry_full').trigger('update');
                $expiry.trigger('update');
            });
            $alternative_year.val(year);


            if (popup) {
                $(this).hide().after($alternative_month);
                $(this).after($alternative_year);
            } else {
                $('.dob-day').hide();
                $('.dob-month label').hide();
                $('.dob-year label').hide();
                $('#billing\\:medicare_expiry_month').hide().after($alternative_month);
                $('#billing\\:medicare_expiry_year').hide().after($alternative_year);
            }

            $alternative_month.css('width', 'auto');
            $alternative_year.css('width', 'auto');
    
            $expiry.bind('update', function() {
                var month = $alternative_month.val();
                var year = $alternative_year.val();
    
                var new_date = year + '-' + month + '-01 00:00:00';
                $(this).val(new_date);
            });
        });
    });
    
    if (typeof trigger_save_billing != 'undefined') {
        trigger_save_billing();
    }
});

