Difference between revisions 34580 and 34613 on donatewiki

Template:2012FR/Form-section/Radiobuttons/Recurring
<html>
<style type="text/css">
#radiobuttons-table-title {
  font-weight: bold;
  font-size: 1.3em;
  float: </html>{{#ifeq:{{Template:2012FR/Switch/Ltr-direction|{{{uselang}}}}}|rtl|right|left}}<html>;
}

#radiobuttons-table-monthly {
  padding-top: 1em;
}

#radiobuttons-table-body {
  margin-left: -5px;
  padding-top: 1em;
}

#radiobuttons-table {
  font-size: 1.2em;
  /*width: 100%;*/
}

.radiobuttons-cell {
  white-space: nowrap;
}

#input_amount_other_box {
  color: black;
  font-size: 0.8em;
  border:1px solid #c0c0c0;
  direction: </html>{{Template:2012FR/Switch/Ltr-direction|{{{uselang}}}}}<html>;
}

</style>

<script type="text/javascript">
function clearOther(box) {
  document.getElementById("input_amount_other").checked = true;
  box.value = "";
  box.style.color = "#000000";
}

function resetOther(box) {
  box.value = "</html>{{int:donate_interface-other}}<html>";
}

function selectAmount() {
  document.getElementById("input_amount_other_box").value = "";
  document.getElementsByName("amountGiven")[0].value="";
}

//This variable tells the payment processing whether or not this donation is recurring.
var monthlyDonation = false;

//This variable tells the page whether or not to display the information for cancelling a monthly payment
var showMonthlyCancel = true;

//This variable tells the page whether or not to display a link to a monthly version of the page
var showMonthlyLink = false;

//This variable tells the page whether or not to display a link to a one-time version of the page
var showOnetimeLink = false;

function toggleMonthly(elem) {
  if(elem == "monthly-radiooption")
  {
    monthlyDonation = true;
    $(".not-monthly-capable").hide();
  }
  else
  {
    monthlyDonation = false;
    $(".not-monthly-capable").show();
  }
  document.getElementsByName("recurring-radiooption").checked = false;
  document.getElementById(elem).checked = true;
}
</script>

<input type="hidden" name="currency_code" value="</html>{{{currency|{{2012FR/Switch/Currency/Code|{{{country}}}}}}}}<html>"/>  
<div id="radiobuttons-table-header">
  <div id="radiobuttons-table-title">
    </html>{{int:donate_interface-amount-legend}}{{#ifeq: {{{currencynote|}}}|||&nbsp;{{{currencynote|}}}}}<html>:
  </div>
  <div id="radiobuttons-table-monthly" style="clear: left;">
    <input type="radio" name="recurring-radiooption" id="onetime-radiooption" onclick="toggleMonthly('onetime-radiooption');" value="" checked="true"/>
    <label for="onetime-radiooption"></html>{{int:Donate interface-onetime-short}}<html></label>
    <input type="radio" name="recurring-radiooption" id="monthly-radiooption" onclick="toggleMonthly('monthly-radiooption');" value="" />
    <label for="monthly-radiooption"></html>{{int:Donate interface-monthly-short}}*<html></label>
  </div>
</div>
<div id="radiobuttons-table-body">
  <!-- <center> -->
  <table id="radiobuttons-table">
    <tr>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_0" onclick="selectAmount();" value="</html>{{{donate-amount-0}}}<html>" />
<label for="input_amount_0"></html>{{CurrencyFormat|{{{donate-amount-0}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_1" onclick="selectAmount();" value="</html>{{{donate-amount-1}}}<html>" />
<label for="input_amount_1"></html>{{CurrencyFormat|{{{donate-amount-1}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_2" onclick="selectAmount();" value="</html>{{{donate-amount-2}}}<html>" />
<label for="input_amount_2"></html>{{CurrencyFormat|{{{donate-amount-2}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_3" onclick="selectAmount();" value="</html>{{{donate-amount-3}}}<html>" />
<label for="input_amount_3"></html>{{CurrencyFormat|{{{donate-amount-3}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td> 
    </tr>
    <tr>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_4" onclick="selectAmount();" value="</html>{{{donate-amount-4}}}<html>" />
<label for="input_amount_4"></html>{{CurrencyFormat|{{{donate-amount-4}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_5" onclick="selectAmount();" value="</html>{{{donate-amount-5}}}<html>" />
<label for="input_amount_5"></html>{{CurrencyFormat|{{{donate-amount-5}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_6" onclick="selectAmount();" value="</html>{{{donate-amount-6}}}<html>" />
<label for="input_amount_6"></html>{{CurrencyFormat|{{{donate-amount-6}}}|{{{currency}}}|{{{country}}}|{{{language}}}}}<html></label>
      </td>
      <td class="radiobuttons-cell">
<input type="radio" name="amount" id="input_amount_other" value="Other" onclick="document.getElementById('input_amount_other_box').focus();"/>
<label for="input_amount_other"></html>{{int:donate_interface-other}}<html></label>
<input type="text" id="input_amount_other_box" size="3" autocomplete="off" value="" onfocus="clearOther(this)"/>
      </td>
    </tr>
  </table>
    <div style="display: none;" class="lp-error lp-error-smallamount"></html>{{int:Donate_interface-smallamount-error}}<html></div>
    <div style="display: none;" class="lp-error lp-error-bigamount"></html>{{int:Donate_interface-bigamount-error}}<html></div>
  <!-- </center> -->
</div>
</html>