diff --git a/tildes/scss/modules/_form.scss b/tildes/scss/modules/_form.scss index d66a81d..2ec4e46 100644 --- a/tildes/scss/modules/_form.scss +++ b/tildes/scss/modules/_form.scss @@ -3,6 +3,10 @@ .form-narrow { max-width: 20rem; + + .input-group .form-select { + flex-shrink: 0; + } } select.form-select:not([multiple]) { diff --git a/tildes/static/js/behaviors/stripe-donate-form.js b/tildes/static/js/behaviors/stripe-donate-form.js new file mode 100644 index 0000000..d6db4d1 --- /dev/null +++ b/tildes/static/js/behaviors/stripe-donate-form.js @@ -0,0 +1,28 @@ +// Copyright (c) 2019 Tildes contributors +// SPDX-License-Identifier: AGPL-3.0-or-later + +$.onmount("[data-js-stripe-donate-form]", function() { + $(this).on("submit", function(event) { + var $amountInput = $(this).find("#amount"); + var amount = $amountInput.val(); + + var $errorDiv = $(this).find(".text-status-message"); + + // remove dollar sign and/or comma, then parse into float + amount = amount.replace(/[$,]/g, ""); + amount = parseFloat(amount); + + if (isNaN(amount)) { + $errorDiv.text("Please enter a valid dollar amount."); + event.preventDefault(); + return; + } else if (amount < 1.0) { + $errorDiv.text("Donation amount must be at least $1."); + event.preventDefault(); + return; + } + + // set the value in case any of the replacements happened + $amountInput.val(amount); + }); +}); diff --git a/tildes/tildes/routes.py b/tildes/tildes/routes.py index 1fe056b..fe79337 100644 --- a/tildes/tildes/routes.py +++ b/tildes/tildes/routes.py @@ -106,7 +106,7 @@ def includeme(config: Configurator) -> None: # Route to expose metrics to Prometheus config.add_route("metrics", "/metrics") - # Route for Stripe donation processing page (POSTed to from docs site) + # Routes for Stripe donations (linked from Docs site) config.add_route("donate_stripe", "/donate_stripe") config.add_route("donate_success", "/donate_success") diff --git a/tildes/tildes/templates/donate_stripe.jinja2 b/tildes/tildes/templates/donate_stripe.jinja2 index 4a0f7bf..0557b81 100644 --- a/tildes/tildes/templates/donate_stripe.jinja2 +++ b/tildes/tildes/templates/donate_stripe.jinja2 @@ -1,18 +1,38 @@ -{# Copyright (c) 2018 Tildes contributors #} +{# Copyright (c) 2019 Tildes contributors #} {# SPDX-License-Identifier: AGPL-3.0-or-later #} {% extends 'base_no_sidebar.jinja2' %} -{% block title %}Stripe donation{% endblock %} +{% block title %}Donate to Tildes{% endblock %} + +{% block main_heading %}Credit card donation (via Stripe){% endblock %} {% block content %} - +

After submitting this form, you will be redirected to the Stripe site to enter your payment info.

+ +

Note that the donation is in Canadian Dollars (CAD) by default, but you can switch to USD if you prefer. At the moment, $10 CAD is about $7.50 USD.

+ +
+ +
+ + +
+ -

Redirecting to Stripe...

+
+ $ + + +
+
- {# This div will cause the page to redirect to the Stripe Checkout page #} -
+
+ +
+
+
{% endblock %} diff --git a/tildes/tildes/templates/donate_stripe_redirect.jinja2 b/tildes/tildes/templates/donate_stripe_redirect.jinja2 new file mode 100644 index 0000000..4a0f7bf --- /dev/null +++ b/tildes/tildes/templates/donate_stripe_redirect.jinja2 @@ -0,0 +1,18 @@ +{# Copyright (c) 2018 Tildes contributors #} +{# SPDX-License-Identifier: AGPL-3.0-or-later #} + +{% extends 'base_no_sidebar.jinja2' %} + +{% block title %}Stripe donation{% endblock %} + +{% block content %} + + +

Redirecting to Stripe...

+ + {# This div will cause the page to redirect to the Stripe Checkout page #} +
+{% endblock %} diff --git a/tildes/tildes/views/donate.py b/tildes/tildes/views/donate.py index a35f426..f4c659a 100644 --- a/tildes/tildes/views/donate.py +++ b/tildes/tildes/views/donate.py @@ -17,10 +17,21 @@ from tildes.metrics import incr_counter @view_config( route_name="donate_stripe", - request_method="POST", + request_method="GET", renderer="donate_stripe.jinja2", permission=NO_PERMISSION_REQUIRED, - require_csrf=False, +) +def get_donate_stripe(request: Request) -> dict: + """Display the form for donating with Stripe.""" + # pylint: disable=unused-argument + return {} + + +@view_config( + route_name="donate_stripe", + request_method="POST", + renderer="donate_stripe_redirect.jinja2", + permission=NO_PERMISSION_REQUIRED, ) @use_kwargs( { @@ -50,7 +61,7 @@ def post_donate_stripe(request: Request, amount: int, currency: str) -> dict: ], submit_type="donate", success_url="https://tildes.net/donate_success", - cancel_url="https://docs.tildes.net/donate-stripe", + cancel_url="https://docs.tildes.net/donate", ) return {"publishable_key": publishable_key, "session_id": session.id}