{% extends "base.html" %}
{{ form.media }}
{% load crispy_forms_tags %}
{% block extra_js %}
<script type='text/javascript'>pageView();</script>
<script type="text/javascript">
$('#auction-form').submit(function(event){
    $(this).find(':input[type=submit]').prop('disabled', true);
});
$('#id_winning_bid_percent_to_club').blur(function(event) {
    $('#id_user_cut').val(100-this.value);
});
$('#id_user_cut').blur(function(event) {
    $('#id_winning_bid_percent_to_club').val(100-this.value);
});
$('#id_winning_bid_percent_to_club_for_club_members').blur(function(event) {
    $('#id_club_member_cut').val(100-this.value);
});
$('#id_club_member_cut').blur(function(event) {
    $('#id_winning_bid_percent_to_club_for_club_members').val(100-this.value);
});
var form_id = '#auction-form';
{% include 'leave_page_warning.js' %}

$(document).ready(function() {
    change_bidding(document.getElementById('id_online_bidding').value);
    // Show/hide club-dependent fields immediately based on whether a club is selected.
    update_club_fields($('#id_club').val());
});
$('#id_online_bidding').change(function(data) {
    change_bidding(this.value);
});
// Toggle the whole Bootstrap grid column, not just the inner field wrapper,
// so a hidden field doesn't leave an empty cell reserving space in its row.
// Falls back to the element itself for widgets (e.g. PrependedAppendedText)
// where the col-* class already sits on #div_id_<field>.
function toggleCol(sel, show) {
    var $el = $(sel);
    if (!$el.length) return;
    var $col = $el.closest('[class*="col-"]');
    if (!$col.length) { $col = $el; }
    $col.toggle(!!show);
}
function update_club_fields(club_val) {
    [
        '#div_id_add_membership_fee_to_invoices_for_expired_members',
        '#div_id_manage_users_through_club',
        '#div_id_club_member_discount',
    ].forEach(function(sel) {
        toggleCol(sel, club_val);
    });
    update_alternate_split_fields();
}
function update_alternate_split_fields() {
    var club_val = $('#id_club').val();
    var $mode = $('#id_alternate_split_mode');
    // The club member discount option only makes sense with a connected club
    var $memberOption = $mode.find('option[value="club_member"]');
    $memberOption.prop('disabled', !club_val).toggle(!!club_val);
    if (!club_val && $mode.val() == 'club_member') {
        $mode.val('off');
    }
    var mode = $mode.val();
    [
        '#div_id_lot_entry_fee_for_club_members',
        '#div_id_winning_bid_percent_to_club_for_club_members',
        '#div_id_club_member_cut',
    ].forEach(function(sel) {
        toggleCol(sel, mode != 'off');
    });
    // In club member discount mode the label is always "Club member", so hide the name field
    toggleCol('#div_id_alternative_split_label', mode == 'custom');
}
$('#id_alternate_split_mode').on('change', update_alternate_split_fields);
// Native select change (covers plain <select> and select2 hidden input)
$('#id_club').on('change', function() {
    update_club_fields($(this).val());
});
// select2 fires a custom event on the visible element; the underlying <select>
// also gets 'change' so the above handler suffices, but add this as a fallback.
$(document).on('select2:select select2:unselect select2:clear', '[name="club"]', function() {
    update_club_fields($(this).val());
});
function change_bidding(value){
    if (value != 'disable') {
        $('#div_id_date_online_bidding_starts').closest('.col-md-3').show();
        $('#div_id_date_online_bidding_ends').closest('.col-md-3').show();
        $('#div_id_only_approved_bidders').closest('.col-md-3').show();
        $('#div_id_allow_deleting_bids').closest('.col-md-3').show();
        $('#div_id_invoice_payment_instructions').closest('.col-md-6').show();
        {% if not auction.is_online %}
            $('#div_id_date_start label').html('In-person bidding opens<span class="asteriskField">*</span>');
            $('#id_date_start_helptext').html('Does not change online bidding');
        {% endif %}
    } else {
        $('#div_id_date_online_bidding_starts').closest('.col-md-3').hide();
        $('#div_id_date_online_bidding_ends').closest('.col-md-3').hide();
        $('#div_id_only_approved_bidders').closest('.col-md-3').hide();
        $('#div_id_allow_deleting_bids').closest('.col-md-3').hide();
        $('#div_id_invoice_payment_instructions').closest('.col-md-6').hide();
        {% if not auction.is_online %}
            $('#div_id_date_start label').html('Bidding opens<span class="asteriskField">*</span>');
            $('#id_date_start_helptext').html('When the auction actually starts');
        {% endif %}
    }
}
{% if auction.is_online %}
$(document).ready(function() {
    $('#div_id_only_approved_bidders').show();
    $('#div_id_allow_deleting_bids').show();
});
{% endif %}
</script>
{% endblock %}
{% block title %}{{ title }}{% endblock %}
{% block content %}
<!-- <div class="container mt-5 mb-5">
        <div class="col-md-10 offset-md1">
          <div style='padding: 2vw;'> -->
            {% include 'auction_ribbon.html' %}
            {% crispy form form.helper %}
        <!-- </div>
    </div>
</div> -->
{% endblock %}