diff --git a/common/locales/en/settings.json b/common/locales/en/settings.json
index e36462e799..419ad59695 100644
--- a/common/locales/en/settings.json
+++ b/common/locales/en/settings.json
@@ -108,6 +108,7 @@
"invitedQuest": "Invited to Quest",
"kickedGroup": "Kicked from group",
"remindersToLogin": "Reminders to check in to Habitica",
+ "subscribeUsing": "Subscribe using",
"unsubscribedSuccessfully": "Unsubscribed successfully!",
"unsubscribedTextUsers": "You have successfully unsubscribed from all Habitica emails. You can enable only the emails you want to receive from the settings (requires login).",
"unsubscribedTextOthers": "You won't receive any other email from Habitica.",
diff --git a/common/locales/en/subscriber.json b/common/locales/en/subscriber.json
index e9d05b2a9c..c580d91d04 100644
--- a/common/locales/en/subscriber.json
+++ b/common/locales/en/subscriber.json
@@ -28,6 +28,7 @@
"subscribed": "Subscribed",
"manageSub": "Click to manage subscription",
"cancelSub": "Cancel Subscription",
+ "canceledSubscription": "Canceled Subscription",
"adminSub": "Administrator Subscriptions",
"morePlans": "More Plans
Coming Soon",
"organizationSub": "Private Organization",
diff --git a/website/public/css/shared.styl b/website/public/css/shared.styl
index 6aba201052..2e772ed26f 100644
--- a/website/public/css/shared.styl
+++ b/website/public/css/shared.styl
@@ -48,6 +48,10 @@ p.resubscribe a.purchase
.buy-gems .well
margin-top:15px
+.noninteractive-button
+ padding: 0.5em
+ margin-right: 0.5em
+
// Required by angular-ui-bootstrap
.nav, .pagination, .carousel, .panel-title a
cursor: pointer
diff --git a/website/views/options/settings.jade b/website/views/options/settings.jade
index 7ae231c336..13458c0a68 100644
--- a/website/views/options/settings.jade
+++ b/website/views/options/settings.jade
@@ -278,7 +278,7 @@ mixin subPerks()
ul
li
span.hint(popover=env.t('buyGemsGoldText', {gemCost: "{{Shared.planGemLimits.convRate}}", gemLimit: "{{Shared.planGemLimits.convCap}}"}),popover-trigger='mouseenter',popover-placement='right') #{env.t('buyGemsGold')}
- span.badge.badge-success(ng-show='_subscription.key!="basic_earned"') Cap raised to {{ [25 + user.purchased.plan.consecutive.gemCapExtra + Math.floor(Content.subscriptionBlocks[_subscription.key].months/3*5), 50] | min }}
+ span.badge.badge-success(ng-show='_subscription.key!="basic_earned"')=env.t('buyGemsGoldCap', {amount: '{{gemGoldCap(_subscription) | min }}'})
li
span.hint(popover=env.t('retainHistoryText'),popover-trigger='mouseenter',popover-placement='right')=env.t('retainHistory')
li
@@ -336,6 +336,7 @@ script(id='partials/options.settings.subscription.html',type='text/ng-template')
.col-md-6
table.table.alert.alert-info(ng-if='user.purchased.plan.customerId')
tr(ng-if='user.purchased.plan.dateTerminated'): td.alert.alert-warning
+ span.noninteractive-button.btn-danger=env.t('canceledSubscription')
i.glyphicon.glyphicon-time
| #{env.t('subCanceled')} {{moment(user.purchased.plan.dateTerminated).format('MM/DD/YYYY')}}
tr(ng-if='!user.purchased.plan.dateTerminated'): td
@@ -352,6 +353,7 @@ script(id='partials/options.settings.subscription.html',type='text/ng-template')
li #{env.t('gemCapExtra')} {{user.purchased.plan.consecutive.gemCapExtra}}
li #{env.t('mysticHourglasses')} {{user.purchased.plan.consecutive.trinkets}}
div(ng-if='!user.purchased.plan.customerId || (user.purchased.plan.customerId && user.purchased.plan.dateTerminated)')
+ h4(ng-if='(user.purchased.plan.customerId && user.purchased.plan.dateTerminated)')= env.t("resubscribe")
.form-group
.radio(ng-repeat='block in Content.subscriptionBlocks | toArray | omit: "discount==true" | orderBy:"months"')
label
@@ -369,14 +371,17 @@ script(id='partials/options.settings.subscription.html',type='text/ng-template')
.form-group
button.pull-right.btn.btn-small(type='button',ng-click='applyCoupon(_subscription.coupon)')= env.t("apply")
- h4(ng-if='(user.purchased.plan.customerId && user.purchased.plan.dateTerminated)')= env.t("resubscribe")
p.resubscribe
- small.muted Subscribe using
+ small.muted=env.t('subscribeUsing')
a.purchase.btn.btn-primary(ng-click='Payments.showStripe({subscription:_subscription.key, coupon:_subscription.coupon})', ng-disabled='!_subscription.key')= env.t('card')
- a.purchase(href='/paypal/subscribe?_id={{user._id}}&apiToken={{user.apiToken}}&sub={{_subscription.key}}{{_subscription.coupon ? "&coupon="+_subscription.coupon : ""}}', ng-disabled='!_subscription.key')
- img(src='https://www.paypalobjects.com/webstatic/en_US/i/buttons/pp-acceptance-small.png',alt=env.t('paypal'))
- a.purchase(ng-click="Payments.amazonPayments.init({type: 'subscription', subscription:_subscription.key, coupon:_subscription.coupon})")
- img(src='https://payments.amazon.com/gp/cba/button',alt=env.t('amazonPayments'))
+ .container-fluid.slight-vertical-padding
+ .row.text-center
+ .col-xs-6
+ a.purchase(href='/paypal/subscribe?_id={{user._id}}&apiToken={{user.apiToken}}&sub={{_subscription.key}}{{_subscription.coupon ? "&coupon="+_subscription.coupon : ""}}', ng-disabled='!_subscription.key')
+ img(src='https://www.paypalobjects.com/webstatic/en_US/i/buttons/pp-acceptance-small.png',alt=env.t('paypal'))
+ .col-xs-6
+ a.purchase(ng-click="Payments.amazonPayments.init({type: 'subscription', subscription:_subscription.key, coupon:_subscription.coupon})")
+ img(src='https://payments.amazon.com/gp/cba/button',alt=env.t('amazonPayments'))
div(ng-if='user.purchased.plan.customerId')
.btn.btn-primary(ng-if='!user.purchased.plan.dateTerminated && user.purchased.plan.paymentMethod=="Stripe"', ng-click='Payments.showStripeEdit()')=env.t('subUpdateCard')
diff --git a/website/views/shared/modals/buy-gems.jade b/website/views/shared/modals/buy-gems.jade
index 5287bcd7a1..783c657f0b 100644
--- a/website/views/shared/modals/buy-gems.jade
+++ b/website/views/shared/modals/buy-gems.jade
@@ -3,7 +3,7 @@ mixin buyGemsDropdown()
.row
.col-md-4.col-md-offset-4.alert.alert-info $5
=env.t('USD')
- span#TotalGemPrice.dashed-underline(popover=env.t('donateText1'),popover-trigger='mouseenter',popover-placement='right') = +20
+ span#TotalGemPrice.dashed-underline(popover=env.t('donateText1'),popover-trigger='mouseenter',popover-placement='bottom') = +20
.container-fluid
.row
.col-md-10.col-md-offset-2
@@ -25,9 +25,6 @@ script(id='modals/buyGems.html', type='text/ng-template')
.panel-body
h3=env.t('buyGemsGold')
p=env.t('maxBuyGems')
- .well
- h3=env.t('purchaseGemsSeparately')
- +buyGemsDropdown()
div(ng-if='user.purchased.plan.customerId && (user.purchased.plan.gemsBought < User.user.purchased.plan.consecutive.gemCapExtra + Shared.planGemLimits.convCap)')
.panel.panel-default
@@ -48,18 +45,25 @@ script(id='modals/buyGems.html', type='text/ng-template')
.arrow
.popover-content
p=env.t('buyGemsAllow1')
- {{Shared.planGemLimits.convCap + User.user.purchased.plan.consecutive.gemCapExtra - User.user.purchased.plan.gemsBought}}
+ | {{Shared.planGemLimits.convCap + User.user.purchased.plan.consecutive.gemCapExtra - User.user.purchased.plan.gemsBought}}
=env.t('buyGemsAllow2')
-
+ div(ng-if='user.purchased.plan.customerId')
+ .well
+ h3=env.t('purchaseGemsSeparately')
+ +buyGemsDropdown()
div(ng-if='!user.purchased.plan.customerId')
.panel.panel-default
.panel-body
h3=env.t('purchaseGems')
.small
- span.dashed-underline(popover=env.t('donateText3'),popover-trigger='mouseenter',popover-placement='right')
- =env.t('donateText2')
+ span.dashed-underline(popover=env.t('donateText3'),popover-trigger='mouseenter',popover-placement='bottom')
+ =env.t('donateText2')
+buyGemsDropdown()
+ .container-fluid
+ h3=env.t('freeGemsTitle')
+ p!=env.t('subFreeGemsHow')
+
.well
h3
.small=env.t('buyGemsGoldTitle')
@@ -67,9 +71,5 @@ script(id='modals/buyGems.html', type='text/ng-template')
div(ng-include="'partials/options.settings.subscription.html'")
- .container-fluid
- h3=env.t('freeGemsTitle')
- p!=env.t('subFreeGemsHow')
-
.modal-footer
button.btn.btn-default(ng-click='$close()')=env.t('cancel')