Просмотр исходного кода

works with multi plan and currency, auto updates view on change

Henry Oswald 11 лет назад
Родитель
Сommit
a47b25d4b2

+ 21 - 6
services/web/app/views/subscriptions/new.jade

@@ -35,10 +35,25 @@ block content
 										) {{currency}} ({{value['symbol']}})
 										) {{currency}} ({{value['symbol']}})
 							h1 #{translate("new_subscription")}
 							h1 #{translate("new_subscription")}
 							hr
 							hr
+
 							form
 							form
+
+								.row
+									.col-md-9
+										h2 {{planName}}
+										span First {{trialLength}} days free
+									.col-md-3
+										h2.pull-right {{price}}
+										span.pull-right every {{billingCycleType}}
+
+								input(type='text', data-recurly='coupon')
+
+
+
+
 								.form-group
 								.form-group
 									input.form-control.input-lg-1(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='number', ng-model='data.number', placeholder='Credit Card Number')
 									input.form-control.input-lg-1(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='number', ng-model='data.number', placeholder='Credit Card Number')
-									input.form-control.input-lg-1(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='cvv', ng-model='data.cvv')		
+									input.form-control.input-lg-1(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly='cvv', ng-model='data.cvv')
 								.form-group
 								.form-group
 									label #{translate("month")}
 									label #{translate("month")}
 									select.form-control(data-recurly='month', ng-model='data.month')
 									select.form-control(data-recurly='month', ng-model='data.month')
@@ -71,23 +86,23 @@ block content
 										option(value="2026") 2026
 										option(value="2026") 2026
 								.form-group
 								.form-group
 									label #{translate("first_name")}
 									label #{translate("first_name")}
-									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="first_name", ng-model="data.first_name")								
+									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="first_name", ng-model="data.first_name")
 								.form-group
 								.form-group
 									label #{translate("last_name")}
 									label #{translate("last_name")}
-									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="last_name", ng-model="data.last_name")		
+									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="last_name", ng-model="data.last_name")
 								.form-group
 								.form-group
 									label #{translate("address")}
 									label #{translate("address")}
-									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="address1", ng-model="data.address1")		
+									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="address1", ng-model="data.address1")
 								.form-group
 								.form-group
 									label #{translate("city")}
 									label #{translate("city")}
-									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="city", ng-model="data.city")		
+									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="city", ng-model="data.city")
 								.form-group
 								.form-group
 									label #{translate("country")}
 									label #{translate("country")}
 									select.form-control(data-recurly="country", ng-model="data.country")
 									select.form-control(data-recurly="country", ng-model="data.country")
 										mixin countries_options()
 										mixin countries_options()
 								.form-group
 								.form-group
 									label #{translate("country")}
 									label #{translate("country")}
-									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="postal_code", ng-model="data.postal_code")		
+									input.form-control(type='text', value='', maxlength='255', tabindex='1', onkeyup='', data-recurly="postal_code", ng-model="data.postal_code")
 																																							
 																																							
 								.form-group
 								.form-group
 									button.btn.btn-success(ng-click="submit()") #{translate("submit")} 						
 									button.btn.btn-success(ng-click="submit()") #{translate("submit")} 						

+ 20 - 6
services/web/public/coffee/main/new-subscription.coffee

@@ -3,12 +3,14 @@ define [
 ], (App)->
 ], (App)->
 
 
 	App.controller "NewSubscriptionController", ($scope, MultiCurrencyPricing, abTestManager, $http)->
 	App.controller "NewSubscriptionController", ($scope, MultiCurrencyPricing, abTestManager, $http)->
+		throw new Error("Recurly API Library Missing.")  if typeof recurly is "undefined"
 	
 	
 		$scope.currencyCode = MultiCurrencyPricing.currencyCode
 		$scope.currencyCode = MultiCurrencyPricing.currencyCode
 		$scope.plans = MultiCurrencyPricing.plans
 		$scope.plans = MultiCurrencyPricing.plans
 
 
 		$scope.changeCurrency = (newCurrency)->
 		$scope.changeCurrency = (newCurrency)->
-			window.location = "/user/subscription/new?planCode=#{window.plan_code}&currency=#{newCurrency}"
+			$scope.currencyCode = newCurrency
+			updatePlan()
 
 
 		$scope.switchToStudent = ()->
 		$scope.switchToStudent = ()->
 			window.location = "/user/subscription/new?planCode=student&currency=#{$scope.currencyCode}"
 			window.location = "/user/subscription/new?planCode=student&currency=#{$scope.currencyCode}"
@@ -28,16 +30,28 @@ define [
 			address1 : "7 somewhere"
 			address1 : "7 somewhere"
 			city:"london"
 			city:"london"
 			country:"GB"
 			country:"GB"
+		recurly.configure __api_key
+		pricing = recurly.Pricing()
+		#pricing.attach(document.querySelector('#pricing'))
+		window.pricing = pricing
 
 
+		$scope.planName = "no yet set"
+		
+		updatePlan = ->
+			pricing.plan(window.plan_code, { quantity: 1 }).currency($scope.currencyCode).done()
 
 
+		updatePlan()
+
+
+		pricing.on "change", =>
+			$scope.planName = pricing.items.plan.name
+			$scope.price = pricing.price.currency.symbol+pricing.price.next.total
+			$scope.trialLength = pricing.items.plan.trial.length
+			$scope.billingCycleType = if pricing.items.plan.period.interval == "months" then "month" else "year"
+			$scope.$apply()
 
 
 		$scope.submit = ->
 		$scope.submit = ->
-			throw new Error("Recurly API Library Missing.")  if typeof recurly is "undefined"
-			console.log $scope.data
 			$scope.error = ""
 			$scope.error = ""
-			if !configured
-				recurly.configure __api_key
-				configured = true
 			recurly.token $scope.data, (err, recurly_token_id) ->
 			recurly.token $scope.data, (err, recurly_token_id) ->
 				if err
 				if err
 					$scope.error = err.message
 					$scope.error = err.message