website/www/conservancy/templates/assignment/assignment_form.html

{% extends "assignment/base_assignment.html" %}
{% block category %}Copyright Assignment{% endblock %}
{% block outercontent %}
  <h1>Copyright Assignment</h1>

  <div class="mw7 mb5">
    <p>Thank you for considering assigning your copyright to the Software Freedom Conservancy. Your assignment helps us enforce free and open source software licenses.</p>

    <p>By filling in and submitting the below form, you agree to assign your copyrights in the specified projects to Software Freedom Conservancy, which means that Conservancy can enforce the licenses that your code is under in court, without you needing to be involved.  Conservancy agrees to keep your code under a free and open source license.</p>

    <p>If you have any questions about assigning your copyright to Conservancy, please don't hesitate to email us at <a href="mailto:info@sfconservancy.org">info@sfconservancy.org</a>.</p>

    <form id="assignment-form" action="." method="post" class="mw7">
      {% csrf_token %}
      {{ form.as_p }}

      <p><em>After submitting this agreement, if you would like to make any changes, you must let us know within 7 days by emailing <a href="mailto:info@sfconservancy.org">info@sfconservancy.org</a>, which is also where you can reach us if you have any questions.</em></p>
      <p><button type="submit" class="ph3 pv2">Submit</button></p>
    </form>
  </div>

  <script>
   'use strict';

   // End date field should be shown only when "a specific past date" is selected.
   const form = document.querySelector('#assignment-form');
   const past_date_label = document.querySelector('label[for=id_period_ends]');
   const past_date_field = document.querySelector('#id_period_ends');
   const past_date_container = past_date_field.parentElement;
   form.addEventListener('change', togglePastDate);
   togglePastDate();  // Run change handler once to initialise form.

   // Text "(if applicable)" isn't relevant with JS enabled.
   past_date_label.innerHTML = past_date_label.innerHTML.replace(' (if applicable)', '');

   function togglePastDate() {
       if (form['period_end_type'].value === 'all future contributions') {
           past_date_container.style.display = 'none';
           past_date_field.required = false;
       }
       else {
           past_date_container.style.display = '';
           past_date_field.required = true;
       }
   }
  </script>
{% endblock %}