Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code
Issues
All Issues

Unified Diff: pages/donate.raw

Issue 6021528219025408: Issue #1170 More progress migrating adblockplus.org to our CMS. (Closed)
Patch Set: Created Sept. 1, 2014, 10:45 a.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « pages/documentation_advanced.raw ('k') | pages/elemhidehelper.raw » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: pages/donate.raw
===================================================================
new file mode 100644
--- /dev/null
+++ b/pages/donate.raw
@@ -0,0 +1,516 @@
+<head>
+<style type="text/css">
+h2
+{
+ padding-top: 20px;
+ border-top: 1px solid #ccc;
+}
+
+label
+{
+ display: block;
+}
+
+input
+{
+ vertical-align: top;
+}
+
+button, label
+{
+ display: inline-block;
+ margin-bottom: 0;
+ font-weight: 400;
+ text-align: center;
+ vertical-align: middle;
+ cursor: pointer;
+ background-image: none;
+ border: 1px solid transparent;
+ white-space: nowrap;
+ padding: 6px 12px;
+ font-size: 14px;
+ line-height: 1.42857143;
+ border-radius: 4px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ color: #333;
+ background-color: #fff;
+ border-color: #ccc;
+}
+
+button:hover
+{
+ background-color: #ebebeb;
+ border-color: #adadad;
+}
+
+button:active
+{
+ background-color: #ebebeb;
+ border-color: #adadad;
+ outline: 0;
+ -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
+ box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
+}
+
+.hidden
+{
+ display: none;
+}
+
+.contentfield_content .hidden
+{
+ display: block;
+}
+
+#form strong
+{
+ display: block;
+ margin: 10px 0px;
+}
+
+#form button
+{
+ font-size: 18px;
+}
+
+/* Credit Card */
+
+#form.none button.credit-card,
+#form.credit-card button.credit-card
+{
+ color: #fff;
+ background-color: #d9534f;
+ border-color: #d43f3a;
+}
+
+#form.none button.credit-card:hover,
+#form.credit-card button.credit-card:hover
+{
+ background-color: #d2322d;
+ border-color: #ac2925;
+}
+
+/* Paypal */
+
+#form.none button.paypal,
+#form.paypal button.paypal
+{
+ color: #fff;
+ background-color: #428bca;
+ border-color: #357ebd;
+}
+
+#form.none button.paypal:hover,
+#form.paypal button.paypal:hover
+{
+ background-color: #3276b1;
+ border-color: #285e8e;
+}
+
+/* Bitcoin */
+
+#form.none button.bitcoin,
+#form.bitcoin button.bitcoin
+{
+ color: #fff;
+ background-color: #f0ad4e;
+ border-color: #eea236;
+}
+
+#form.none button.bitcoin:hover,
+#form.bitcoin button.bitcoin:hover
+{
+ background-color: #ed9c28;
+ border-color: #d58512;
+}
+
+/* Secondary Form Elements */
+
+#form-fields
+{
+ display: none;
+}
+
+#form.credit-card #form-fields,
+#form.paypal #form-fields,
+#form.bitcoin #form-fields
+{
+ display: block;
+}
+
+#form.bitcoin #form-price
+{
+ display: none;
+}
+
+#donate
+{
+ color: #fff;
+ background-color: #5cb85c;
+ border-color: #4cae4c;
+}
+
+#donate:hover
+{
+ background-color: #47a447;
+ border-color: #398439;
+}
+
+#error
+{
+ color: #d9534f;
+ vertical-align: middle;
+}
+
+#refund-message
+{
+ margin-top: 50px;
+ font-style: italic;
+}
+
+#refund-message *
+{
+ font-size: 12px;
+}
+
+#refund-message div
+{
+ margin-bottom: 5px;
+}
+
+#refund-message ul
+{
+ padding-top: 0px;
+ margin-top: 0px;
+}
+
+.custom-input
+{
+ display: inline-block;
+ margin-left: 6px;
+}
+
+.custom-input .addon
+{
+ padding: 2px 6px;
+ text-align: center;
+ color: #555;
+ font-size: 14px;
+ border: 1px solid #ccc;
+ border-right: 0;
+ border-radius: 3px;
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+ background-color: #eee;
+}
+
+.custom-input input
+{
+ width: 75px;
+ margin: 0px;
+ padding: 2px;
+ text-align: right;
+ font-size: 14px;
+ color: #555;
+ border: 1px solid #ccc;
+ border-radius: 4px;
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+ box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+ -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+ transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+}
+</style>
+
+<script type="text/javascript">
+// <!--
+(function()
+{
+ var textAttr = ("textContent" in document.documentElement) ? "textContent" : "innerText";
+
+ var formValues = {
+ currency: "USD",
+ description: null,
+ name: null
+ };
+
+ var priceValue = {
+ get: function()
+ {
+ var value = document.querySelector("input[name=price]:checked").value;
+ if (value == 0)
+ value = document.getElementById("price-other").value >> 0;
+ return value;
+ },
+ verify: function()
+ {
+ var selected = document.querySelector("input[name=price]:checked");
+ if (!selected)
+ return "Please select an amount";
+ if (selected.value == 0)
+ {
+ var other = document.getElementById("price-other");
+ if (other.value < 0 || isNaN(other.value))
+ return "Please select a valid amount";
+ }
+ return null;
+ }
+ };
+
+ var langValue = {
+ get: function(langs)
+ {
+ var lang = document.documentElement.lang;
+ if (lang in langs)
+ return langs[lang];
+ if ("en" in langs)
+ return langs["en"];
+ return "en";
+ }
+ };
+
+ var recurrenceValue = {
+ get: function(recurrences)
+ {
+ var checked = document.getElementById("recurrence").checked;
+ return (checked && recurrences.monthly) ? recurrences.monthly : undefined
+ }
+ };
+
+ var providers = {
+ "bitcoin": function()
+ {
+ var recurring = recurrenceValue.get({
+ "monthly": "https://coinbase.com/checkouts/d46825e3f22461f6a25b3249f8ce7c2a"
+ });
+ openProviderPage({
+ action: (recurring) ? recurring : "https://coinbase.com/checkouts/ab08a165e21d72b503cff8f30bece652"
+ });
+ },
+ "credit-card": function()
+ {
+ if (verify(priceValue))
+ return;
+
+ openProviderPage({
+ action: "https://www.2checkout.com/checkout/purchase",
+ fields: {
+ sid: "202208429",
+ mode: "2CO",
+ currency_code: formValues.currency,
+ lang: langValue.get({
+ "de": "gr",
+ "en": "en",
+ "es": "es_ib",
+ "fr": "fr",
+ "nl": "nl",
+ "pt_br": "pt",
+ "zh_cn": "zh",
+ "zh_tw": "zh"
+ }),
+ pay_method: "CC", // CC: Credit Card, PPI: PayPal
+ li_0_type: "product",
+ li_0_name: formValues.name,
+ li_0_description: formValues.description,
+ li_0_price: priceValue.get(),
+ li_0_tangible: "N",
+ li_0_recurrence: recurrenceValue.get({
+ "monthly": "1 Month"
+ })
+ }
+ });
+ },
+ // see https://developer.paypal.com/webapps/developer/docs/classic/paypal-payments-standard/integration-guide/Appx_websitestandard_htmlvariables/#id08A6HI00JQU
+ "paypal": function()
+ {
+ if (verify(priceValue))
+ return;
+
+ var recurrence = recurrenceValue.get({
+ "monthly": "M"
+ });
+
+ var fields = {
+ business: "jobp@adblockplus.org",
+ item_name: formValues.name,
+ currency_code: formValues.currency,
+ lc: langValue.get({
+ "de": "DE",
+ "en": "US",
+ "es": "ES",
+ "fr": "FR",
+ "nl": "NL",
+ "pt_br": "BR",
+ "zh_cn": "C2",
+ "zh_tw": "TW"
+ })
+ };
+ if (recurrence)
+ {
+ fields.cmd = "_xclick-subscriptions";
+ fields.a3 = priceValue.get();
+ fields.p3 = 1;
+ fields.t3 = recurrence;
+ fields.src = 1;
+ fields.modify = 1;
+ }
+ else
+ {
+ fields.cmd = "_donations";
+ fields.amount = priceValue.get();
+ }
+
+ openProviderPage({
+ action: "https://www.paypal.com/cgi-bin/webscr",
+ fields: fields
+ });
+ }
+ };
+
+ function verify()
+ {
+ var error = null;
+ for (var i in arguments)
+ {
+ error = arguments[i].verify();
+ if (error)
+ {
+ document.getElementById("error")[textAttr] = error;
+ break;
+ }
+ }
+ return error;
+ }
+
+ function openProviderPage(provider)
+ {
+ document.getElementById("error")[textAttr] = "";
+
+ var form = document.createElement("form");
+ form.target = "_blank";
+ form.action = provider.action;
+
+ var fields = provider.fields;
+ if (fields)
+ {
+ for (var i in fields)
+ {
+ var field = document.createElement("input");
+ field.name = i;
+ field.value = fields[i];
+ form.appendChild(field);
+ }
+ }
+
+ // To submit a form in Firefox it needs to be part of the DOM
+ document.head.appendChild(form);
+ form.submit();
+ document.head.removeChild(form);
+ }
+
+ function getText(id)
+ {
+ var element = document.getElementById(id);
+ return element[textAttr];
+ }
+
+ document.addEventListener("DOMContentLoaded", function()
+ {
+ formValues.description = getText("i18n_description");
+ formValues.name = getText("i18n_name");
+
+ document.getElementById("payment").addEventListener("click", function(event)
+ {
+ if (event.target.localName != "button")
+ return;
+
+ document.getElementById("form").className = event.target.className;
+ }, true);
+ document.getElementById("donate").addEventListener("click", function(event)
+ {
+ var provider = providers[document.getElementById("form").className];
+ if (provider)
+ provider();
+ }, false);
+ }, false);
+})();
+
+// -->
+</script>
+</head>
+<span class="hidden" id="i18n_name">$s1$ </span>
+<span class="hidden" id="i18n_description">$s2$</span>
+
+<p>
+ $s3$
+</p>
+
+<div class="paypal" id="form">
+ <p id="payment">
+ <strong>$s4$</strong>
+
+ <button class="paypal">$s5$</button>
+<!-- Commented out until it works properly, see https://issues.adblockplus.org/ticket/732
+ <button class="credit-card">Credit Card</button>
+-->
+ <button class="bitcoin">$s6$</button>
+ </p>
+
+ <div id="form-fields">
+ <p id="form-price">
+ <strong>$s7$</strong>
+
+ <label>
+ <input name="price" type="radio" value="5">
+ $s8$
+ </label>
+ <label>
+ <input name="price" type="radio" value="10">
+ $s9$
+ </label>
+ <label>
+ <input name="price" type="radio" value="20">
+ $s10$
+ </label>
+ <label>
+ <input name="price" type="radio" value="40">
+ $s11$
+ </label>
+ <label>
+ <input name="price" type="radio" value="0">
+ $s12$
+ <span class="custom-input">
+ <span class="addon">$s13$</span><input id="price-other" min="1" type="number" value="1">
+ </span>
+ </label>
+ </p>
+
+ <p id="form-recurrence">
+ <label>
+ <input id="recurrence" type="checkbox">
+ $s14$
+ </label>
+ </p>
+
+ <button id="donate">$s15$</button>
+ <span id="error"></span>
+
+ <div id="refund-message">
+ <div>
+ $s16(mailto:info@adblockplus.org)$
+ </div>
+ <div>
+ $s17$
+ <ul>
+ <li><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_manage-paylist" target="_blank">$s18$</a></li>
+ <li><a href="mailto:info@adblockplus.org" target="_blank">$s19$</a></li>
+ <li><a href="https://coinbase.com/recurring_payments" target="_blank">$s20$</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+</div>
« no previous file with comments | « pages/documentation_advanced.raw ('k') | pages/elemhidehelper.raw » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld