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

extends ../layout
block scripts


	script(type='text/javascript').
		window.recomendedCurrency = '#{currency}'
		window.plan_code = '#{plan_code}'

		window.recurlyCreds = { apiKey : "sc-GVdZOe7akgWbZRIFPllOx9", apiUrl:""}


block content
	- locals.supressDefaultJs = true
	script(data-main=jsPath+'main.js', src=jsPath+'libs/require.js', baseurl=jsPath)
	script(src="https://js.recurly.com/v3/recurly.js")


	.content.content-alt
		.container(ng-controller="NewSubscriptionController" ng-cloak)
			.row.card-group
				.col-md-6.col-md-push-3
					.card.card-highlighted
						.page-header
							span.dropdown.changePlanButton.pull-right(ng-cloak)
								a.btn.btn-default.dropdown-toggle(
									href="#",
									data-toggle="dropdown"
								)
									| {{currencyCode}} ({{plans[currencyCode]['symbol']}}) 
									span.caret
								ul.dropdown-menu(role="menu")
									li(ng-repeat="(currency, value) in plans", dropdown-toggle)
										a(
											ng-click="changeCurrency(currency)",
										) {{currency}} ({{value['symbol']}})
							h1 #{translate("new_subscription")}
							
							form
								.form-group
									label #{translate("credit_card_number")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='number', ng-model='data.number')
								.form-group
									label #{translate("month")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='month', ng-model='data.month')
								.form-group
									label #{translate("year")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='year', ng-model='data.year')		
								.form-group
									label #{translate("cvv")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='cvv', ng-model='data.cvv')		
								.form-group
									label #{translate("first_name")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="first_name", ng-model="data.first_name")								
								.form-group
									label #{translate("last_name")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="last_name", ng-model="data.last_name")		
								.form-group
									label #{translate("address")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="address1", ng-model="data.address1")		
								.form-group
									label #{translate("city")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="city", ng-model="data.city")		
								.form-group
									label #{translate("country")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="country", ng-model="data.country")		
								.form-group
									label #{translate("country")}
									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="postal_code", ng-model="data.postal_code")		
																																							
								.form-group
									button.btn.btn-success(ng-click="submit()") #{translate("submit")} 						









				
				.col-md-3.col-md-pull-6
					if showStudentPlan == 'true'
						a.btn-primary.btn.plansPageStudentLink(
							href,
							ng-click="switchToStudent()"
						) #{translate("half_price_student")} 

					.card.card-first
						.paymentPageFeatures
							.page-header
								h3 #{translate("features")}
							h3 #{translate("unlimited_projects")}
							p #{translate("create_unlimited_projects")}
						
							h3
								if plan.features.collaborators == -1
									- var collaboratorCount = 'Unlimited'
								else
									- var collaboratorCount = plan.features.collaborators
								| #{translate("collabs_per_proj", {collabcount:collaboratorCount})}
							p #{translate("work_on_single_version")}. #{translate("view_collab_edits")} in real time.
							
							h3 #{translate("full_doc_history")}
							p #{translate("see_what_has_been")} 
								span.added #{translate("added")} 
								| #{translate("and")} 
								span.removed #{translate("removed")}. 
								| #{translate("restore_to_any_older_version")}.
							
							h3 #{translate("sync_to_dropbox")}
							p
								| #{translate("acces_work_from_anywhere")}. 
								| #{translate("work_offline_and_sync_with_dropbox")}.
								
							hr
							
							p.small.text-center We're confident that you'll love ShareLaTeX, but if not you can cancel anytime. We'll give you your money back, no questions asked, if you let us know within 30 days.


	script(type="text/javascript").
		ga('send', 'event', 'pageview', 'payment_form', "#{plan_code}")


	script(type="text/javascript").
		window.ab = [
			{step:1, bucket:"red", testName:"button_color"},
			{step:1, bucket:"blue", testName:"button_color"}
		]