Merge pull request #32 from kumar303/recur-donate

Make a recurring donation in any amount

public/css/index.css

@@ -44,3 +44,7 @@ form.button {
 h4 {
     padding-top: 2em;
 }
+
+.donation-variable .form-group .btn {
+    margin-top: 0.5em;
+}

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>

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,
     });