1 | import { Component, Input } from '@angular/core';
|
2 | var VaPricingComponent = (function () {
|
3 | function VaPricingComponent() {
|
4 | this.pricing = null;
|
5 | this.wrapFrequency = false;
|
6 | this.isAddon = false;
|
7 | }
|
8 | VaPricingComponent.prototype.getCurrencySymbol = function (currency) {
|
9 | var currencySymbol = '$';
|
10 | switch (currency) {
|
11 | case 'EUR':
|
12 | currencySymbol = '\u20AC';
|
13 | break;
|
14 | case 'GBP':
|
15 | currencySymbol = '\u00A3';
|
16 | break;
|
17 | case 'CHF':
|
18 | currencySymbol = 'Fr';
|
19 | break;
|
20 | case 'CNY':
|
21 | currencySymbol = '\u00A5';
|
22 | break;
|
23 | case 'JPY':
|
24 | currencySymbol = '\u00A5';
|
25 | break;
|
26 | case 'CZK':
|
27 | currencySymbol = 'K\u010d';
|
28 | break;
|
29 | case 'INR':
|
30 | currencySymbol = '\u20B9';
|
31 | break;
|
32 | case 'KHR':
|
33 | currencySymbol = '\u17DB';
|
34 | break;
|
35 | case 'KRW':
|
36 | currencySymbol = '\u20A9';
|
37 | break;
|
38 | case 'NOK':
|
39 | currencySymbol = 'kr';
|
40 | break;
|
41 | case 'SEK':
|
42 | currencySymbol = 'kr';
|
43 | break;
|
44 | case 'RUB':
|
45 | currencySymbol = '\u20BD';
|
46 | break;
|
47 | case 'TRY':
|
48 | currencySymbol = '\u20BA';
|
49 | break;
|
50 | case 'ZAR':
|
51 | currencySymbol = 'R';
|
52 | break;
|
53 | default:
|
54 | currencySymbol = '$';
|
55 | break;
|
56 | }
|
57 | return currencySymbol;
|
58 | };
|
59 |
|
60 | VaPricingComponent.prototype.getDisplayPrice = function (priceWithoutCents) {
|
61 | return priceWithoutCents ? (priceWithoutCents / 100.0).toFixed(2).toString() : null;
|
62 | };
|
63 | Object.defineProperty(VaPricingComponent.prototype, "currencyString", {
|
64 | get: function () {
|
65 | var hasCurrencyAndIsNotUSD = this.pricing.currency && this.pricing.currency !== 'USD';
|
66 | return hasCurrencyAndIsNotUSD ? this.pricing.currency : '';
|
67 | },
|
68 | enumerable: true,
|
69 | configurable: true
|
70 | });
|
71 | Object.defineProperty(VaPricingComponent.prototype, "isFree", {
|
72 | get: function () {
|
73 | return this.pricing && this.pricing.prices ? this.pricing.prices.some(function (p) { return p.price === 0; }) : null;
|
74 | },
|
75 | enumerable: true,
|
76 | configurable: true
|
77 | });
|
78 | Object.defineProperty(VaPricingComponent.prototype, "shouldContactSales", {
|
79 | get: function () {
|
80 | return this.pricing && this.pricing.prices ?
|
81 | this.pricing.prices.some(function (p) { return p.price === null; }) ||
|
82 | this.pricing.prices.length === 0 : true;
|
83 | },
|
84 | enumerable: true,
|
85 | configurable: true
|
86 | });
|
87 | VaPricingComponent.decorators = [
|
88 | { type: Component, args: [{
|
89 | selector: 'va-pricing',
|
90 | template: "\n <div *ngIf=\"pricing\">\n <div class=\"no-price\" *ngIf=\"shouldContactSales\">\n Contact sales for pricing\n </div>\n <div class=\"no-price\" *ngIf=\"!shouldContactSales && isFree\">\n <b>Free</b>\n </div>\n <ng-container *ngIf=\"!shouldContactSales && !isFree && !isAddon\">\n <div *ngIf= \"pricing && pricing.prices[0] as price\" class=\"price-box\">\n <b class=\"price-number\">{{getCurrencySymbol(pricing.currency)}}{{ getDisplayPrice(price.price) }} {{currencyString}} </b>\n <span *ngIf=\"price.frequency as frequency\" class=\"billing-freq\" [ngClass]=\"{'va-wrap': wrapFrequency}\">\n {{ frequency }}</span>\n </div>\n <div *ngIf=\"pricing && pricing.prices[1] as price\" class=\"price-box\">\n <b class=\"price-number\">+ {{getCurrencySymbol(pricing.currency)}}{{ getDisplayPrice(price.price) }} {{currencyString}}</b>\n <span *ngIf=\"price.frequency as frequency\" class=\"billing-freq\" [ngClass]=\"{'va-wrap': wrapFrequency}\">\n {{ frequency }}</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"!shouldContactSales && !isFree && isAddon\">\n <div *ngIf= \"pricing && pricing.prices[0] as price\" class=\"price-box\">\n <span *ngIf=\"price.frequency\" class=\"addon-billing-freq\">\n {{ price.frequency }}</span>\n <b class=\"price-number\">{{getCurrencySymbol(pricing.currency)}}{{ getDisplayPrice(price.price) }} {{currencyString}} </b>\n </div>\n </ng-container>\n </div>\n <div *ngIf=\"!pricing\">\n <div class=\"stencil-pricing-title shimmer\"></div>\n <div class=\"stencil-pricing shimmer\"></div>\n </div>\n ",
|
91 | styles: [":host { color: #9e9e9e; } .price-box { display: flex; align-items: baseline; flex-direction: row-reverse; } @media screen and (max-width: 600px) { .price-box { font-size: 16px; } } .no-price { text-align: center; } @media screen and (max-width: 600px) { .no-price { font-size: 16px; } } b { color: #212121; font-size: 20px; } @media screen and (max-width: 600px) { b { font-size: 16px; } } .billing-freq { text-transform: capitalize; flex: 1; } .addon-billing-freq { padding-left: 5px; } .va-wrap { display: block; } .stencil-pricing-title { height: 32px; margin-bottom: 10px; } .stencil-pricing { height: 75px; } "]
|
92 | },] },
|
93 | ];
|
94 |
|
95 | VaPricingComponent.ctorParameters = function () { return []; };
|
96 | VaPricingComponent.propDecorators = {
|
97 | 'pricing': [{ type: Input },],
|
98 | 'wrapFrequency': [{ type: Input },],
|
99 | 'isAddon': [{ type: Input },],
|
100 | };
|
101 | return VaPricingComponent;
|
102 | }());
|
103 | export { VaPricingComponent };
|