Single variant dropdown for Retina Notify Me form

product-notify-me.liquid

{% assign show_form = settings.notify_me_form %}

{% if product.tags contains 'bis_hidden' %}
  {% assign show_form = false %}
{% endif %}

{% if show_form %}
  <div class="notify_form" id="notify-form-{{ product.id }}" {% if product.available %}style="display:none"{% endif %}>
    <form action="/contact" method="post" data-first-variant="{{product.variants.first.id}}" id="BIS_form" onsubmit="return createNotification{{product.id}}(this); return false;">
      {% if product.available == false and product.variants.size > 1 %}
      <div class="select">
        <label>{{ product.options[0] }}:</label>
        <select id="product-select-{{ product.id }}" name='id'>
          {% for variant in product.variants %}
            <option value="{{ variant.id }}">{{ variant.title }}</option>
          {% endfor %}
        </select>
      </div>
      {% endif %}
      
      <p>
          
          
          <label for="contact[email]">Notify me when this product is available:</label>

          {% if customer %}
            <input type="hidden" name="contact[email]" value="{{ customer.email }}" />
          {% else %}
            <input required type="email" name="contact[email]" id="contact[email]" placeholder="Enter your email address..." value="{{ contact.fields.email }}" style="display:inline;margin-bottom:0px" />
          {% endif %}

          
            <span class="bis-integrations">
            <input class="bis-checkbox" value="1" type="checkbox"  checked="checked"  id="customer_accepts_marketing" name="customer_accepts_marketing">
            <label class="bis-checkbox-label" for="customer_accepts_marketing">Add me to the store mailing list!</label>
            </span>
          

          <input class="submit" type="submit" value="Send" style="margin-bottom:0px" />    
        </p>
      <p class="BIS_response"></p>
    </form>
    </div>

    <style>
      .bis-integrations {
        margin-top: 4px;
        margin-bottom: 4px;
        display: block;
      }

      .bis-integrations .bis-checkbox {
        vertial-align: baseline;
      }

      .bis-integrations .bis-checkbox-label {
        display: inline-block;
      }
    </style>

  <script>
    var createNotification{{product.id}} = function(form) {
      if (BISMobiliaForm) {
        var bis = new BISMobiliaForm(form);
      }

      return false;
    };

    var clearBISResponse = function() { 
      $('#BIS_form .BIS_response').text('');
    };

    $(function() { 
      $('#BIS_form input').on('focus change', clearBISResponse);
      $('.product_form select').on('change', clearBISResponse);
    });

  </script>
{% endif %}