overleaf/services/web/app/views/subscriptions/dashboard.jade

134 lines
5.1 KiB
Text

extends ../layout
block scripts
script(src="https://js.recurly.com/v3/recurly.js")
script(type='text/javascript').
window.recomendedCurrency = '#{recomendedCurrency}'
window.recurlyApiKey = "!{settings.apis.recurly.publicKey}"
window.taxRate = #{taxRate}
mixin printPlan(plan)
-if (!plan.hideFromUsers)
tr(ng-controller="ChangePlanFormController")
td(ng-init="plan=#{JSON.stringify(plan)}")
strong #{plan.name}
td {{refreshPrice(plan.planCode)}}
-if (plan.annual)
| {{prices[plan.planCode]}} / #{translate("year")}
-else
| {{prices[plan.planCode]}} / #{translate("month")}
td
-if (subscription.state == "free-trial")
a(href="/user/subscription/new?planCode=#{plan.planCode}").btn.btn-success #{translate("subscribe_to_this_plan")}
-else if (typeof(subscription.planCode) != "undefined" && plan.planCode == subscription.planCode.split("_")[0])
button.btn.disabled #{translate("your_plan")}
-else
form
input(type="hidden", ng-model="plan_code", name="plan_code", value="#{plan.planCode}")
input(type="submit", ng-click="changePlan()", value=translate("change_to_this_plan")).btn.btn-success
mixin printPlans(plans)
-each plan in plans
mixin printPlan(plan)
block content
.content.content-alt
.container
.row
.col-md-8.col-md-offset-2
.card
.page-header
h1 #{translate("your_subscription")}
-if (groups.length != 0)
each groupSubscription in groups
p !{translate("member_of_group_subscription", {admin_email: "<strong>" + groupSubscription.admin_id.email + "</strong>"})}
- else if (subscription)
case subscription.state
when "free-trial"
p !{translate("on_free_trial_expiring_at", {expiresAt:"<strong>" + subscription.expiresAt + "</strong>"})}
p !{translate("choose_a_plan_below")}
when "active"
p !{translate("currently_subscribed_to_plan", {planName:"<strong>" + subscription.name + "</strong>"})}
a(href, ng-click="changePlan = true") !{translate("change_plan")}.
p !{translate("next_payment_of_x_collectected_on_y", {paymentAmmount:"<strong>" + subscription.price + "</strong>", collectionDate:"<strong>" + subscription.nextPaymentDueAt + "</strong>"})}
p.pull-right
p: form(action="/user/subscription/cancel",method="post")
input(type="hidden", name="_csrf", value=csrfToken)
a(href="/user/subscription/billing-details/edit").btn.btn-info #{translate("update_your_billing_details")}
| &nbsp;
input(type="submit", value="Cancel your subscription").btn.btn-primary#cancelSubscription
when "canceled"
p !{translate("currently_subscribed_to_plan", {planName:"<strong>" + subscription.name + "</strong>"})}
p !{translate("subscription_canceled_and_terminate_on_x", {terminateDate:"<strong>" + subscription.nextPaymentDueAt + "</strong>"})}
p: form(action="/user/subscription/reactivate",method="post")
input(type="hidden", name="_csrf", value=csrfToken)
input(type="submit",value="Reactivate your subscription").btn.btn-success
when "expired"
p !{translate("your_subscription_has_expired")}
a(href="/user/subscription/plans") !{translate("create_new_subscription")}
default
-if(groups.length == 0)
p !{translate("problem_with_subscription_contact_us")}
-if(subscription.groupPlan)
a(href="/subscription/group").btn.btn-success !{translate("manage_group")}
div(ng-show="changePlan", ng-cloak)#changePlanSection
h2.col-md-7 !{translate("change_plan")}
span.dropdown.col-md-1.changePlanButton(ng-controller="CurrenyDropdownController", style="display:none", dropdown)
a.btn.btn-primary.dropdown-toggle(
href="#",
data-toggle="dropdown",
dropdown-toggle
)
| {{currencyCode}} ({{plans[currencyCode]['symbol']}})
ul.dropdown-menu(role="menu")
li(ng-repeat="(currency, value) in plans", dropdown-toggle)
a(
href,
ng-click="changeCurrency(currency)"
) {{currency}} ({{value['symbol']}})
p: table.table
tr
th !{translate("name")}
th !{translate("price")}
th
mixin printPlans(plans.studentAccounts)
mixin printPlans(plans.individualMonthlyPlans)
mixin printPlans(plans.individualAnnualPlans)
script(type="text/javascript").
$('#cancelSubscription').on("click", function() {
ga('send', 'event', 'subscription-funnel', 'cancelation')
})
script(type='text/ng-template', id='confirmChangePlanModalTemplate')
.modal-header
h3 Change plan?
.modal-body
p !{translate("sure_you_want_to_change_plan", {planName:"<strong>{{plan.name}}</strong>"})}
.modal-footer
button.btn.btn-default(
ng-disabled="inflight"
ng-click="cancel()"
) #{translate("cancel")}
button.btn.btn-success(
ng-disabled="state.inflight"
ng-click="confirmChangePlan()"
)
span(ng-hide="inflight") #{translate("change_plan")}
span(ng-show="inflight") #{translate("processing")}...