-
-
Notifications
You must be signed in to change notification settings - Fork 8
/
Checkout.ts
107 lines (96 loc) · 3.35 KB
/
Checkout.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
import Vue from 'vue';
import Component from 'vue-class-component';
import { SubscriptionLike } from 'rxjs';
import { appManager } from '../../shared/AppManager';
import { tap, first } from 'rxjs/operators';
import { BrowserSimulation } from '@casual-simulation/aux-vm-browser';
import { Simulation } from '@casual-simulation/aux-vm';
import {
calculateNumericalTagValue,
calculateStringTagValue,
hasValue,
toast,
StartCheckoutEvent,
} from '@casual-simulation/aux-common';
import CheckoutForm from '../CheckoutForm/CheckoutForm';
import { getStripeKey, loadStripe } from '../../shared/checkout/utils';
import { remote } from '@casual-simulation/causal-trees';
import { PaymentRequestOptions } from '@casual-simulation/aux-common/Formulas/formula-lib';
@Component({
components: {
'checkout-form': CheckoutForm,
},
})
export default class Checkout extends Vue {
showCheckoutDialog: boolean = false;
cardError: string = '';
simulationId: string = null;
productId: string = null;
processingChannel: string = null;
title: string = '';
description: string = '';
requestBillingAddress: boolean = false;
paymentRequest: PaymentRequestOptions = null;
private _subs: SubscriptionLike[] = [];
private _simulationSubs: Map<Simulation, SubscriptionLike[]>;
created() {
this._subs = [];
this._simulationSubs = new Map();
this._subs.push(
appManager.simulationManager.simulationAdded
.pipe(tap(sim => this._simulationAdded(sim)))
.subscribe(),
appManager.simulationManager.simulationRemoved
.pipe(tap(sim => this._simulationRemoved(sim)))
.subscribe()
);
}
checkoutFinished() {
this.closeCheckoutDialog();
}
checkoutCanceled() {
this.closeCheckoutDialog();
}
closeCheckoutDialog() {
this.showCheckoutDialog = false;
}
private _simulationAdded(sim: BrowserSimulation): void {
let subs: SubscriptionLike[] = [];
subs.push(
sim.connection.syncStateChanged
.pipe(first(connected => connected))
.subscribe(connected => {
const key = getStripeKey(sim);
const hasKey = hasValue(key);
if (hasKey) {
loadStripe();
}
}),
sim.localEvents.subscribe(e => {
if (e.name === 'start_checkout') {
this._startCheckout(sim, e);
}
})
);
this._simulationSubs.set(sim, subs);
}
private _simulationRemoved(sim: BrowserSimulation): void {
const subs = this._simulationSubs.get(sim);
if (subs) {
subs.forEach(s => {
s.unsubscribe();
});
}
this._simulationSubs.delete(sim);
}
private async _startCheckout(sim: Simulation, event: StartCheckoutEvent) {
this.showCheckoutDialog = true;
this.simulationId = sim.id;
this.description = event.description;
this.title = event.title;
this.requestBillingAddress = event.requestBillingAddress || false;
this.productId = event.productId;
this.processingChannel = event.processingChannel;
this.paymentRequest = event.paymentRequest;
}
}