From 72fcb324cdda7c7b4f0f8c40fb8ded9ff70f34a9 Mon Sep 17 00:00:00 2001
From: Rimian Perkins <hello@rimian.com.au>
Date: Thu, 23 Feb 2017 09:30:40 +1100
Subject: [PATCH] fix var scope error and diplay some html when result is
 success

---
 .../discourse/components/stripe-card.js.es6     | 17 ++++++++++++-----
 .../templates/components/stripe-card.hbs        |  4 ++++
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/assets/javascripts/discourse/components/stripe-card.js.es6 b/assets/javascripts/discourse/components/stripe-card.js.es6
index c21c62a..948c590 100644
--- a/assets/javascripts/discourse/components/stripe-card.js.es6
+++ b/assets/javascripts/discourse/components/stripe-card.js.es6
@@ -1,6 +1,7 @@
 import { ajax } from 'discourse/lib/ajax';
 
 export default Ember.Component.extend({
+  result: null,
   stripe: Stripe('pk_test_b8RmhzlL8QPizJRqOrKF3JEV'),
 
   card: function() {
@@ -9,25 +10,31 @@ export default Ember.Component.extend({
   }.property('stripe'),
 
   didInsertElement() {
+    this._super();
     this.get('card').mount('#card-element');
   },
 
   actions: {
     submitStripeCard() {
+      var self = this;
+
       this.get('stripe').createToken(this.get('card')).then(function(result) {
+
+        self.set('result', null);
+
         if (result.error) {
           console.log('error yo');
         }
         else {
-          var data = {
+          var params = {
             stripeToken: result.token.id,
             amount: 1234
           };
 
-          ajax('/charges', { data: data, method: 'post' }).then(data => {
-            console.log(data);
-          }).catch(() => {
-            console.log('error');
+          ajax('/charges', { data: params, method: 'post' }).then(data => {
+            self.set('result', (data.status == 'succeeded' ? true : null));
+          }).catch((data) => {
+            console.log('catch', data);
           });
         }
       });
diff --git a/assets/javascripts/discourse/templates/components/stripe-card.hbs b/assets/javascripts/discourse/templates/components/stripe-card.hbs
index 499d4c8..5a47186 100644
--- a/assets/javascripts/discourse/templates/components/stripe-card.hbs
+++ b/assets/javascripts/discourse/templates/components/stripe-card.hbs
@@ -5,4 +5,8 @@
   </div>
 
   <button {{action "submitStripeCard"}}>Submit Payment</button>
+
+  {{#if result}}
+    <div class="stripe-card-result">payment happened</div>
+  {{/if}}
 </form>