From 9f2a50d7e9b642d19201f327fc4619deaf5c2f89 Mon Sep 17 00:00:00 2001
From: Kumar McMillan <kumar.mcmillan@gmail.com>
Date: Mon, 31 Aug 2015 17:47:18 -0500
Subject: [PATCH] Make a recurring donation in any amount

---
 public/css/index.css | 4 ++++
 public/index.html    | 3 ++-
 public/js/index.js   | 5 +++--
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/public/css/index.css b/public/css/index.css
index 307035f..b50cdc4 100644
--- a/public/css/index.css
+++ b/public/css/index.css
@@ -44,3 +44,7 @@ form.button {
 h4 {
     padding-top: 2em;
 }
+
+.donation-variable .form-group .btn {
+    margin-top: 0.5em;
+}
diff --git a/public/index.html b/public/index.html
index cfc8d8e..f3fb9c2 100644
--- a/public/index.html
+++ b/public/index.html
@@ -129,7 +129,8 @@
           <input type="text" placeholder="5" class="form-control" id="donation-amount"/>
         </div>
         <div class="form-group">
-          <button type="submit" class="btn btn-lg btn-success" class="form-control">Donate</button>
+          <button data-product-id="mozilla-foundation-donation" type="submit" class="donation-variable btn btn-success form-control">Donate once</button>
+          <button data-product-id="mozilla-foundation-recurring-donation" class="donation-variable btn btn-success form-control">Donate monthly</button>
         </div>
       </form>
     </section>
diff --git a/public/js/index.js b/public/js/index.js
index 0080bc2..3a0999b 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -147,10 +147,11 @@
     });
   });
 
-  $('form.donation-variable').on('submit', function(event) {
+  $('button.donation-variable').on('click', function(event) {
     event.preventDefault();
+    var productId = $(this).data('product-id');
     purchaseWithoutAuth({
-      'id': 'mozilla-foundation-donation',
+      'id': productId,
       'image': 'http://bit.ly/default-png',
       'amount': $('#donation-amount').val() || 5,
     });