Merge pull request #9 from chrisbeach/transaction_fee
Add ability to allow donor to include stripe transaction fee in their donation
This commit is contained in:
commit
96b09333ad
|
@ -1,5 +1,6 @@
|
|||
import { ajax } from 'discourse/lib/ajax';
|
||||
import { getRegister } from 'discourse-common/lib/get-owner';
|
||||
import { default as computed } from 'ember-addons/ember-computed-decorators';
|
||||
|
||||
export default Ember.Component.extend({
|
||||
donateAmounts: [
|
||||
|
@ -15,6 +16,7 @@ export default Ember.Component.extend({
|
|||
stripe: null,
|
||||
transactionInProgress: null,
|
||||
settings: null,
|
||||
showTransactionFeeDescription: false,
|
||||
|
||||
init() {
|
||||
this._super();
|
||||
|
@ -24,12 +26,27 @@ export default Ember.Component.extend({
|
|||
this.set('stripe', Stripe(this.get('settings').discourse_donations_public_key));
|
||||
},
|
||||
|
||||
card: function() {
|
||||
let elements = this.get('stripe').elements();
|
||||
@computed('stripe')
|
||||
card(stripe) {
|
||||
let elements = stripe.elements();
|
||||
return elements.create('card', {
|
||||
hidePostalCode: !this.get('settings').discourse_donations_zip_code
|
||||
});
|
||||
}.property('stripe'),
|
||||
},
|
||||
|
||||
@computed('amount')
|
||||
transactionFee(amount) {
|
||||
const fixed = Discourse.SiteSettings.discourse_donations_transaction_fee_fixed;
|
||||
const percent = Discourse.SiteSettings.discourse_donations_transaction_fee_percent;
|
||||
const fee = ((amount + fixed) / (1 - percent)) - amount;
|
||||
return Math.round(fee * 100) / 100;
|
||||
},
|
||||
|
||||
@computed('amount', 'transactionFee', 'includeTransactionFee')
|
||||
totalAmount(amount, fee, include) {
|
||||
if (include) return amount + fee;
|
||||
return amount;
|
||||
},
|
||||
|
||||
didInsertElement() {
|
||||
this._super();
|
||||
|
@ -49,24 +66,25 @@ export default Ember.Component.extend({
|
|||
},
|
||||
|
||||
actions: {
|
||||
toggleTransactionFeeDescription() {
|
||||
this.toggleProperty('showTransactionFeeDescription');
|
||||
},
|
||||
|
||||
submitStripeCard() {
|
||||
let self = this;
|
||||
|
||||
self.set('transactionInProgress', true);
|
||||
|
||||
this.get('stripe').createToken(this.get('card')).then(data => {
|
||||
|
||||
self.set('result', []);
|
||||
|
||||
if (data.error) {
|
||||
self.set('result', data.error.message);
|
||||
self.endTranscation();
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
const transactionFeeEnabled = Discourse.SiteSettings.discourse_donations_enable_transaction_fee;
|
||||
const amount = transactionFeeEnabled ? this.get('totalAmount') : this.get('amount');
|
||||
let params = {
|
||||
stripeToken: data.token.id,
|
||||
amount: self.get('amount') * 100,
|
||||
user_id: self.get('currentUser.id'),
|
||||
amount: amount * 100,
|
||||
email: self.get('email'),
|
||||
username: self.get('username'),
|
||||
create_account: self.get('create_accounts')
|
||||
|
|
|
@ -10,6 +10,32 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
{{#if siteSettings.discourse_donations_enable_transaction_fee}}
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
{{input type="checkbox" checked=includeTransactionFee}}
|
||||
{{i18n 'discourse_donations.transaction_fee.label' transactionFee=transactionFee currency=settings.discourse_donations_currency}}
|
||||
<div class='transaction-fee-description' {{action 'toggleTransactionFeeDescription'}}>
|
||||
{{d-icon 'info-circle'}}
|
||||
{{#if showTransactionFeeDescription}}
|
||||
<div class="transaction-fee-description-modal">
|
||||
{{i18n 'discourse_donations.transaction_fee.description'}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class='control-label'>
|
||||
{{i18n 'discourse_donations.transaction_fee.total'}}
|
||||
</label>
|
||||
<div class="controls">
|
||||
{{settings.discourse_donations_currency}}
|
||||
{{totalAmount}}
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
<div class="control-group" style="width: 550px;">
|
||||
<label class="control-label" for="card-element">{{i18n 'discourse_donations.card'}}</label>
|
||||
<div id="card-element" class="controls"></div>
|
||||
|
|
|
@ -1,17 +0,0 @@
|
|||
div.stripe-errors {
|
||||
border: 1px solid #c33;
|
||||
border-radius: 5px;
|
||||
color: #600;
|
||||
background-color: #fdd;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.donations-page-description {
|
||||
max-width: 700px;
|
||||
font-size: 1.1em;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.donations-page-payment {
|
||||
padding-top: 60px;
|
||||
}
|
|
@ -0,0 +1,37 @@
|
|||
div.stripe-errors {
|
||||
border: 1px solid #c33;
|
||||
border-radius: 5px;
|
||||
color: #600;
|
||||
background-color: #fdd;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.donations-page-description {
|
||||
max-width: 700px;
|
||||
font-size: 1.1em;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.donations-page-payment {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.transaction-fee-description {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin-left: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.transaction-fee-description-modal {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -30px;
|
||||
left: 20px;
|
||||
background-color: $secondary;
|
||||
border: 1px solid $primary-low;
|
||||
padding: 10px;
|
||||
box-shadow: 0 2px 2px rgba(0,0,0,0.4);
|
||||
width: 400px;
|
||||
z-index: 1;
|
||||
}
|
|
@ -12,6 +12,9 @@ en:
|
|||
discourse_donations_reward_badge_name: "Grant this badge to user when a payment is successful"
|
||||
discourse_donations_reward_group_name: "Add the user to this group when a payment is successful"
|
||||
discourse_donations_page_description: "Text to be added to /donate page. Markdown is supported."
|
||||
discourse_donations_enable_transaction_fee: "Give the user the option of including the Stripe transaction fee in their donation."
|
||||
discourse_donations_transaction_fee_fixed: "Fixed part of Stripe transaction fee (changes per region). See <a href='https://stripe.com/pricing'>Stripe's pricing for your region</a> and <a href='https://support.stripe.com/questions/can-i-charge-my-stripe-fees-to-my-customers'>Stripe's explaination of passing fees onto customers</a>."
|
||||
discourse_donations_transaction_fee_percent: "Percent part of Stripe transaction fee (changes per region). See <a href='https://stripe.com/pricing'>Stripe's pricing for your region</a> and <a href='https://support.stripe.com/questions/can-i-charge-my-stripe-fees-to-my-customers'>Stripe's explaination of passing fees onto customers</a>."
|
||||
|
||||
js:
|
||||
discourse_donations:
|
||||
|
@ -21,5 +24,9 @@ en:
|
|||
card: Credit or debit card
|
||||
submit: Make Payment
|
||||
submit_with_create_account: Make Payment and Create Account
|
||||
transaction_fee:
|
||||
label: "Include transaction fee of {{currency}} {{transactionFee}}"
|
||||
description: "When you make a donation we get charged a transaciton fee. If you would like to help us out with this fee, check this box and it will be included in your donation."
|
||||
total: "Total"
|
||||
messages:
|
||||
success: Thank you for your donation!
|
||||
|
|
|
@ -35,3 +35,12 @@ plugins:
|
|||
discourse_donations_page_description:
|
||||
client: true
|
||||
default: ''
|
||||
discourse_donations_enable_transaction_fee:
|
||||
client: true
|
||||
default: false
|
||||
discourse_donations_transaction_fee_fixed:
|
||||
client: true
|
||||
default: 0.3
|
||||
discourse_donations_transaction_fee_percent:
|
||||
client: true
|
||||
default: 0.029
|
||||
|
|
Loading…
Reference in New Issue