Changeset - b4883ca6bd25
[Not reviewed]
0 1 1
Brett Smith (brett) - 5 years ago 2017-01-01 15:39:23
brett@sfconservancy.org
supporter: Make a partial for the supporter form.

This commit shouldn't make any substantial changes to the form or its
presentation. This is just cleaning things up as a development aid.
2 files changed with 137 insertions and 185 deletions:
0 comments (0 inline, 0 general)
www/conservancy/templates/supporter/form_partial.html
Show inline comments
 
new file 100644
 
{% comment %}
 

	
 
This partial requires these parameters:
 

	
 
* `form_id`: The type of Supportership this form enrolls.  One of "annual",
 
  "monthly", or "renewal".
 
  Note that the form substantially changes the form based on this value.
 
  If you're changing this later to add a type, you'll want to consider how
 
  to handle all those.
 
* `min_amt`: The lowest amount of support the form will accept.
 

	
 
This partial accepts these optional parameters:
 

	
 
* `supptype`: Used in text to describe what type of Supporter this is.
 
  By default, it's generated from form_id.
 
  Override it for renewals.
 
* `article`: Used in front of `form_id` when it's written in the form.
 
  Default "a".  Set it to "an" when `supptype` begins with a vowel.
 
* `verb`: Used in form text to describe the sign-up process.
 
  Default "join".  Use "renew" when `form_id` is "renewal".
 
* `default_amt`: The amount of support the form loads with.
 
  Default `min_amt`.
 
* `partial_amt`: This form is for a donor who previously gave `partial_amt`,
 
  and is letting them contribute `min_amt` more to get up the usual
 
  Supporter amount.  This is attached to the form as a data attribute.
 

	
 
{% endcomment %}
 

	
 
{% with supptype=supptype|default:form_id article=article|default:"a" verb=verb|default:"join" default_amt=default_amt|default:min_amt partial_amt=partial_amt|default:0 %}
 
<div id="{{ form_id }}" class="supporter-type-selection">
 
  <h3>{{ verb|capfirst }} as {{ article }} {{ supptype|capfirst }} Supporter</h3>
 

	
 
  {% if form_id == "annual" %}
 
  <p><strong>Note:</strong> annual supporter is not an automatic renewal
 
    relationship.  If you join today, you'll receive an email in about one
 
    year to remind you to optionally renew.</p>
 
  {% elif form_id == "monthly" %}
 
  <p>Monthly renewal is automatic.  Also, monthly supporters might not
 
    receive tangible Supporter benefits (such as the t-shirt) until they've
 
    reached at least
 
    {# Six months of payments #}
 
    ${{ min_amt|add:min_amt|add:min_amt|add:min_amt|add:min_amt|add:min_amt }}
 
    in monthly supporter donations.
 
    However, they will be included immediately in
 
    the <a href="/sponsors/#supporters">Supporters' list</a>.</p>
 
  {% elif form_id == "renewal" %}
 
  <p><strong>Note:</strong> This option is for existing annual supporters
 
    who seek to renew for another year.  The annual renewal is not
 
    automatic; annual supporters are emailed each year to invite them to
 
    optionally renew.</p>
 
  {% endif %}
 

	
 
  <form class="supporter-form" method="post" target="_top"
 
        action="https://www.paypal.com/cgi-bin/webscr"
 
        data-upgrade-from-amount="{{ partial_amt }}">
 
    <div class="supporter-form-inputs">
 
      <input type="hidden" name="business" value="supporter@sfconservancy.org">
 
      <input type="hidden" name="return" value="https://sfconservancy.org/supporter/thank-you.html">
 
      <input type="hidden" name="no_shipping" value="0">
 
      <input type="hidden" name="item_name"
 
             value="Conservancy Supporter, {{ supptype|capfirst }}{% if form_id == "renewal" %} Renewal{% endif %}"
 
             >
 
      {% if form_id == "monthly" %}
 
      <input type="hidden" name="cmd" value="_xclick-subscriptions">
 
      <input type="hidden" name="lc" value="US">
 
      <input type="hidden" name="no_note" value="1">
 
      <input type="hidden" name="t3" value="M">
 
      <input type="hidden" name="p3" value="1">
 
      <input type="hidden" name="src" value="1">
 
      <input type="hidden" name="srt" value="0">
 
      <label for="a3"><strong>Monthly Amount:</strong> $</label>
 
      <input type="number" name="a3" size="5"
 
             min="{{ min_amt }}" value="{{ default_amt }}">
 
      {% else %}
 
      <input type="hidden" name="cmd" value="_xclick">
 
      <label for="amount"><strong>Amount:</strong> $</label>
 
      <input type="number" name="amount" size="5"
 
             min="{{ min_amt }}" value="{{ default_amt }}">
 
      {% endif %}
 
      <span class="form-error">${{ min_amt|add:partial_amt }} is a minimum for
 
        Conservancy Supporters.
 
        <a href="/donate">Donate smaller amounts here</a>.</span><br>
 
      <label for="wantGift"><strong>Do you want to receive
 
          {% if form_id == "renewal" %}
 
          another
 
          {% else %}
 
          a
 
          {% endif %}
 
          t-shirt? </strong></label>
 
      <input type="radio" name="on0" value="wantGiftYes">Yes
 
      <input type="radio" checked="checked" name="on0" value="wantGiftNo">No
 
      <br>
 
      <span class="t-shirt-size-selector">
 
        <label for="tShirtSize"><strong>T-shirt size: </strong></label>
 
        <select name="os0">
 
          <option value="MenS">Men's S</option>
 
          <option value="MenM">Men's M</option>
 
          <option value="MenL">Men's L</option>
 
          <option value="MenXL">Men's XL</option>
 
          <option value="Men2XL">Men's 2XL</option>
 
          <option value="StandardLadiesS">Standard Ladies' S</option>
 
          <option value="StandardLadiesM">Standard Ladies' M</option>
 
          <option value="StandardLadiesL">Standard Ladies' L</option>
 
          <option value="StandardLadiesXL">Standard Ladies' XL</option>
 
          <option value="FittedLadiesS">Fitted Ladies' S</option>
 
          <option value="FittedLadiesM">Fitted Ladies' M</option>
 
          <option value="FittedLadiesL">Fitted Ladies' L</option>
 
          <option value="FittedLadiesXL">Fitted Ladies' XL</option>
 
        </select><br></span>
 
      <label for="publicAck"><strong>
 
          Should we <a href="/sponsors#supporters">list you publicly</a> as a Conservancy Supporter? </strong></label>
 
      <input type="radio" checked="checked" name="on1" value="publicAckYes">Yes
 
      <input type="radio" name="on1" value="publicAckNo">No<br>
 
      <label for="joinList"><strong>Join Conservancy's
 
          Low-Traffic Announcement Email List? </strong></label>
 
      <input type="radio" checked="checked" name="os1" value="joinListYes">Yes
 
      <input type="radio" name="os1" value="joinListNo">No<br>
 
      <br></div>
 
    <div>
 
      <input type="image" name="submit"
 
             src="/img/supporter-payment-button-{{ form_id }}.png"
 
             height="81" width="188" border="0"
 
             alt="{{ verb|capfirst }} as {{ article }} {{ supptype|capfirst }} Supporter Now!">
 
      <br><br><small>Button above redirects to PayPal's site for credit
 
        card, bank account or PayPal balance payment methods.  Select
 
        options first.</small>
 
    </div>
 
  </form>
 
</div>
 
{% endwith %}
www/conservancy/templates/supporter/index.html
Show inline comments
...
 
@@ -53,198 +53,20 @@
 
<div class="content-with-donate-sidebar">
 
  <h1 class="appeal"><img class="appeal-header" alt="Become a Conservancy Supporter!" src="/img/conservancy-supporter-header.png"/></h1>
 

	
 
  
 
<div class="supporter-type-selector">
 
  <strong>Become a Supporter Now:</strong>   <a id="annualSelector" href="#annual">Annual</a> | <a id="monthlySelector" href="#monthly">Monthly</a> | <a id="renewalSelector" href="#renewal">Annual Renew</a></div>
 
<div id="annual" class="supporter-type-selection">
 
<h3>Join as an Annual Supporter</h3>
 
<p><strong>Note:</strong> annual supporter is not an automatic renewal
 
  relationship.  If you join today, you'll receive an email in about one year to remind you to
 
  optionally renew.</p>
 
<form class="supporter-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" name="supporter"
 
      data-upgrade-from-amount="{{ partial_amount }}">
 
<div class="supporter-form-inputs">
 
            <input type="hidden" name="return" value="https://sfconservancy.org/supporter/thank-you.html" />
 
            <input type="hidden" name="cmd" value="_xclick" />
 
            <input type="hidden" name="business" value="supporter@sfconservancy.org" />
 
            <input type="hidden" name="item_name" value="Conservancy Supporter, Annual" />
 
            <input type="hidden" name="no_shipping" value="0" />
 
  <label for="amount"><strong>Amount:</strong> $</label>
 
  <input type="number" name="amount" size="7" min="{{ minimum_amount }}" value="{{ minimum_amount }}" />
 
  <span class="form-error">$120 is a minimum for Conservancy
 
  Supporters.  <a href="/donate">Donate smaller amounts here</a>.</span><br/>
 

	
 
                      <label for="wantGift"><strong>Do you want to receive a t-shirt? </strong></label>
 
                      <input type="radio" name="on0" value="wantGiftYes" />Yes
 
                      <input type="radio" checked="checked" name="on0" value="wantGiftNo" />No
 
                      <br />
 
                      <span class="t-shirt-size-selector">
 
                      <label for="tShirtSize"><strong>T-shirt size: </strong></label>
 
                      <select name="os0">
 
                        <option value="MenS">Men's S</option>
 
                        <option value="MenM">Men's M</option>
 
                        <option value="MenL">Men's L</option>
 
                        <option value="MenXL">Men's XL</option>
 
                        <option value="Men2XL">Men's 2XL</option>
 
                        <option value="StandardLadiesS">Standard Ladies' S</option>
 
                        <option value="StandardLadiesM">Standard Ladies' M</option>
 
                        <option value="StandardLadiesL">Standard Ladies' L</option>
 
                         <option value="StandardLadiesXL">Standard Ladies' XL</option>
 
                        <option value="FittedLadiesS">Fitted Ladies' S</option>
 
                        <option value="FittedLadiesM">Fitted Ladies' M</option>
 
                        <option value="FittedLadiesL">Fitted Ladies' L</option>
 
                         <option value="FittedLadiesXL">Fitted Ladies' XL</option>
 
                      </select><br/></span>
 
                      <label for="publicAck"><strong>
 
                          Should we <a href="/sponsors#supporters">list you publicly</a> as a Conservancy Supporter? </strong></label>
 
                      <input type="radio" checked="checked" name="on1" value="publicAckYes" />Yes
 
                      <input type="radio" name="on1" value="publicAckNo" />No<br/>
 
            
 
                      <label for="joinList"><strong>Join Conservancy's
 
                      Low-Traffic Announcement Email List? </strong></label>
 
                      <input type="radio" checked="checked" name="os1" value="joinListYes" />Yes
 
                      <input type="radio" name="os1" value="joinListNo" />No<br/>
 
                      <br />
 
                      <br /></div>
 
                      <div>
 
                      <input type="image"
 
                             src="/img/supporter-payment-button-annual.png"
 
                             height="81" width="188"
 
                             border="0" name="submit" alt="Become an Annual Supporter Now!">
 
                      <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
 
<br/><br/><small>Button above redirects to PayPal's site for credit
 
        card, bank account or PayPal balance payment methods.  Select options first.</small>
 
                      </div>
 
</form>
 
</div>
 
<div id="monthly" class="supporter-type-selection">
 
<h3>Join as an Monthly Supporter</h3>
 
<p>Monthly renewal is automatic.  Also, monthly supporters might not receive tangible Supporter benefits (such as
 
  the t-shirt) until they've reached at least $60 in monthly supporter
 
  donations.  However, they will be included immediately
 
  in the <a href="/sponsors/#supporters">Supporters' list</a>.</p>
 
<form class="supporter-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
 
<div class="supporter-form-inputs">
 
            <input type="hidden" name="business" value="supporter@sfconservancy.org" />
 
            <input type="hidden" name="item_name" value="Conservancy Supporter, Monthly" />
 
            <input type="hidden" name="return" value="https://sfconservancy.org/supporter/thank-you.html" />
 
            <input type="hidden" name="cmd" value="_xclick-subscriptions">
 
            <input type="hidden" name="no_shipping" value="0" />
 
            <input type="hidden" name="lc" value="US">
 
            <input type="hidden" name="no_note" value="1">
 
            <input type="hidden" name="t3" value="M" />
 
            <input type="hidden" name="p3" value="1" />
 
            <input type="hidden" name="src" value="1" />
 
            <input type="hidden" name="srt" value="0" />
 
            <input type="hidden" name="item_name" value="Conservancy Supporter, Monthly" />
 
  <label for="amount"><strong>Monthly Amount:</strong> $</label>
 
  <input type="number" name="a3" size="5" min="10" value="10" />
 
  <span class="form-error">$10/month is a minimum for Conservancy
 
  Supporters.  <a href="/donate">Donate smaller amounts here</a>.</span><br/>
 
                      <label for="wantGift"><strong>Do you want to receive a t-shirt? </strong></label>
 
                      <input type="radio" name="on0" value="wantGiftYes" />Yes
 
                      <input type="radio" checked="checked" name="on0" value="wantGiftNo" />No
 
                      <br />
 
                      <span class="t-shirt-size-selector">
 
                      <label for="tShirtSize"><strong>T-shirt size: </strong></label>
 
                      <select name="os0">
 
                        <option value="MenS">Men's S</option>
 
                        <option value="MenM">Men's M</option>
 
                        <option value="MenL">Men's L</option>
 
                        <option value="MenXL">Men's XL</option>
 
                        <option value="Men2XL">Men's 2XL</option>
 
                        <option value="StandardLadiesS">Standard Ladies' S</option>
 
                        <option value="StandardLadiesM">Standard Ladies' M</option>
 
                        <option value="StandardLadiesL">Standard Ladies' L</option>
 
                         <option value="StandardLadiesXL">Standard Ladies' XL</option>
 
                        <option value="FittedLadiesS">Fitted Ladies' S</option>
 
                        <option value="FittedLadiesM">Fitted Ladies' M</option>
 
                        <option value="FittedLadiesL">Fitted Ladies' L</option>
 
                         <option value="FittedLadiesXL">Fitted Ladies' XL</option>
 
                      </select><br/></span>
 
                      <label for="publicAck"><strong>
 
                          Should we  <a href="/sponsors#supporters">list you publicly</a> as a Conservancy Supporter? </strong></label>
 
                      <input type="radio" checked="checked" name="on1" value="publicAckYes" />Yes
 
                      <input type="radio" name="on1" value="publicAckNo" />No<br/>
 
                      <label for="joinList"><strong>Join Conservancy's
 
                      Low-Traffic Announcement Email List? </strong></label>
 
                      <input type="radio" checked="checked" name="os1" value="joinListYes" />Yes
 
                      <input type="radio" name="os1" value="joinListNo" />No<br/>
 
                      <br /></div>
 
                      <div>
 
                      <input type="image"
 
                      src="/img/supporter-payment-button-monthly.png"
 
                      height="81" width="188"
 
                      border="0" name="submit" alt="Become a Monthly Supporter Now!">
 
<br/><br/><small>Button above redirects to PayPal's site for credit
 
        card, bank account or PayPal balance payment methods.  Select
 
                      options first.</small>
 
                      </div>
 
</form>
 
</div>
 

	
 
<div id="renewal" class="supporter-type-selection">
 
<h3 id="renew">Renew as an Annual Supporter</h3>
 
<p><strong>Note:</strong> This option is for existing annual supporters who
 
  seek to renew for another year.  The annual renewal is not automatic;
 
  annual supporters are emailed each year to invite them to optionally renew. </p>
 
<form class="supporter-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" name="supporter">
 
<div class="supporter-form-inputs">
 
            <input type="hidden" name="return" value="https://sfconservancy.org/supporter/thank-you.html" />
 
            <input type="hidden" name="cmd" value="_xclick" />
 
            <input type="hidden" name="business" value="supporter@sfconservancy.org" />
 
            <input type="hidden" name="item_name" value="Conservancy Supporter, Annual Renewal" />
 
            <input type="hidden" name="no_shipping" value="0" />
 
  <label for="amount"><strong>Amount:</strong> $</label>
 
  <input type="number" name="amount" size="7" min="120" value="120" />
 
  <span class="form-error">$120 is a minimum for Conservancy
 
  Supporters.  <a href="/donate">Donate smaller amounts here</a>.</span><br/>
 

	
 
                      <label for="wantGift"><strong>Do you want to receive (another) t-shirt? </strong></label>
 
                      <input type="radio" name="on0" value="wantGiftYes" />Yes
 
                      <input type="radio" checked="checked" name="on0" value="wantGiftNo" />No
 
                      <br />
 
                      <span class="t-shirt-size-selector">
 
                      <label for="tShirtSize"><strong>T-shirt size: </strong></label>
 
                      <select name="os0">
 
                        <option value="MenS">Men's S</option>
 
                        <option value="MenM">Men's M</option>
 
                        <option value="MenL">Men's L</option>
 
                        <option value="MenXL">Men's XL</option>
 
                        <option value="Men2XL">Men's 2XL</option>
 
                        <option value="StandardLadiesS">Standard Ladies' S</option>
 
                        <option value="StandardLadiesM">Standard Ladies' M</option>
 
                        <option value="StandardLadiesL">Standard Ladies' L</option>
 
                         <option value="StandardLadiesXL">Standard Ladies' XL</option>
 
                        <option value="FittedLadiesS">Fitted Ladies' S</option>
 
                        <option value="FittedLadiesM">Fitted Ladies' M</option>
 
                        <option value="FittedLadiesL">Fitted Ladies' L</option>
 
                         <option value="FittedLadiesXL">Fitted Ladies' XL</option>
 
                      </select><br/></span>
 
                      <label for="publicAck"><strong>
 
                          Should we <a href="/sponsors#supporters">list you publicly</a> as a Conservancy Supporter? </strong></label>
 
                      <input type="radio" checked="checked" name="on1" value="publicAckYes" />Yes
 
                      <input type="radio" name="on1" value="publicAckNo" />No<br/>
 
            
 
                      <label for="joinList"><strong>Join Conservancy's
 
                      Low-Traffic Announcement Email List? </strong></label>
 
                      <input type="radio" checked="checked" name="os1" value="joinListYes" />Yes
 
                      <input type="radio" name="os1" value="joinListNo" />No<br/>
 
                      <br />
 
                      <br /></div>
 
                      <div>
 
                      <input type="image"
 
                             src="/img/supporter-payment-button-renewal.png"
 
                             height="81" width="188"
 
                             border="0" name="submit" alt="Renew as an Annual Supporter Now!">
 
                      <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
 
<br/><br/><small>Button above redirects to PayPal's site for credit
 
        card, bank account or PayPal balance payment methods.  Select options
 
  first.  Choosing options here will change any previous settings.</small>
 
</div></form></div>
 
{% include "supporter/form_partial.html" with form_id="annual" min_amt=minimum_amount partial_amt=partial_amount article="an" only %}
 

	
 
{% include "supporter/form_partial.html" with form_id="monthly" min_amt=10 only %}
 

	
 
<a name="renew" class="hidden"></a>
 
{% include "supporter/form_partial.html" with form_id="renewal" min_amt=120 verb="renew" article="an" supptype="annual" only %}
 

	
 
<span id="form-correction-needed" class="form-error">Please ensure all form data above is correct.</span>
 

	
 
<hr style="clear: both;"/>
 
<h4>Software Freedom needs your help.</h4>
 

	
 
<p><em>Conservancy is continuing its shift towards being a
0 comments (0 inline, 0 general)