@kompasid/lit-web-components 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/workflows/npm-publish.yml +5 -5
- package/README.md +44 -13
- package/assets/kompas-icon.svg +362 -0
- package/demo/index.html +2 -0
- package/dist/assets/font-awesome.d.ts +2 -2
- package/dist/src/components/kompas-footer/KompasFooter.d.ts +1 -1
- package/dist/src/components/kompas-footer/KompasFooter.js +1 -1
- package/dist/src/components/kompas-footer/KompasFooter.js.map +1 -1
- package/dist/src/components/kompas-metered-paywall/KompasMeteredPaywall.d.ts +1 -1
- package/dist/src/components/kompas-metered-paywall/KompasMeteredPaywall.js.map +1 -1
- package/dist/src/components/kompas-paywall/KompasPaywall.d.ts +1 -1
- package/dist/src/components/kompas-paywall/KompasPaywall.js.map +1 -1
- package/dist/src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.d.ts +2 -1
- package/dist/src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.js +9 -2
- package/dist/src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.js.map +1 -1
- package/dist/src/components/kompas-paywall-body/KompasPaywallBody.d.ts +1 -1
- package/dist/src/components/kompas-paywall-body/KompasPaywallBody.js.map +1 -1
- package/dist/src/components/kompas-paywall-information-header/KompasPaywallInformationHeader.d.ts +1 -1
- package/dist/src/components/kompas-paywall-information-header/KompasPaywallInformationHeader.js.map +1 -1
- package/dist/src/components/kompas-paywall-video/KompasPaywallVideo.d.ts +2 -4
- package/dist/src/components/kompas-paywall-video/KompasPaywallVideo.js +7 -12
- package/dist/src/components/kompas-paywall-video/KompasPaywallVideo.js.map +1 -1
- package/dist/tailwind/tailwind.js +1343 -1368
- package/dist/tailwind/tailwind.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/components/kompas-footer/KompasFooter.ts +1 -1
- package/src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.ts +10 -2
- package/src/components/kompas-paywall-video/KompasPaywallVideo.ts +7 -6
- package/tailwind/tailwind.css +0 -9
- package/tailwind/tailwind.ts +1344 -1368
- package/tsconfig.json +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KompasMeteredPaywall.js","sourceRoot":"","sources":["../../../../src/components/kompas-metered-paywall/KompasMeteredPaywall.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement } from 'lit'\nimport { customElement, state, property } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\n\n@customElement('kompas-metered-paywall')\nexport class KompasMeteredPaywall extends LitElement {\n static styles = [\n css`\n .text-transition {\n width: 100%;\n height: 5rem;\n }\n\n .body {\n position: sticky;\n top: 0;\n height: 100%;\n width: 100%;\n }\n\n .icon {\n height: 1rem;\n color: #48bb78;\n }\n\n .icon.lg {\n height: 1.5rem;\n }\n\n .icon.lg svg {\n height: 1.5rem;\n }\n `,\n TWStyles,\n ]\n\n @state() maxQuota: number = 5\n\n @state() subscriptionUrl: string = 'https://www.kompas.id/berlangganan'\n /**\n * Props\n */\n /**\n * prop countdownArticle untuk menghandle sudah berapa artikel gratis yang user baca.\n * prop paywall_location = The location where user encounter the paywall\n * prop paywall_subscription_package = The name of the subscription package viewed by user\n * prop paywall_subscription_id = The ID of the subscription package viewed by user\n * prop paywall_subscription_price = The price of the subscriprtion package viewed by user\n * prop paywall_position = The position of ther subscription package viewed by user\n * prop tracker_page_type = Type of the page\n * prop tracker_content_id = ID of article (slug)\n * prop tracker_content_type = Whether it's free article or paid article\n * prop tracker_content_title = The title of article\n * prop tracker_content_categories = The category of the content\n * prop tracker_user_type = Type of user based on their subscription\n * prop tracker_subscription_status = Status of their subscription\n * prop tracker_page_domain = Page Domain\n * prop tracker_metered_wall_type = The type of Metered Wall\n * prop tracker_epaper_edition = The edition of epaper viewed by user\n * prop tracker_metered_wall_balance = The balance of their metered wall\n */\n @property({ type: Number }) countdownArticle = 0\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: String }) paywall_subscription_id = ''\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n\n private getCountdownArticle() {\n const getCountdown = this.countdownArticle\n const { maxQuota } = this\n\n if (getCountdown > 0 && getCountdown < maxQuota) {\n return html`\n <p>\n Anda memiliki sisa\n <b>${maxQuota - getCountdown} dari ${maxQuota}</b> artikel premium\n gratis bulan ini. Langganan untuk akses tanpa batas\n </p>\n `\n }\n return html`\n <p>\n Anda sedang membaca <b>artikel gratis terakhir bulan ini.</b> Langganan\n untuk akses tanpa batas\n </p>\n `\n }\n\n connectedCallback() {\n super.connectedCallback()\n\n this.dataLayeronMeteredPaywall()\n }\n\n private redirectToBerlangganan() {\n this.dataLayeronLanggananButton()\n window.location.href = this.subscriptionUrl\n }\n\n private dataLayeronLanggananButton() {\n window.dataLayer.push({\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location || '',\n paywall_subscription_package: this.paywall_subscription_package || '',\n paywall_subscription_id: this.paywall_subscription_id || '',\n paywall_subscription_price: this.paywall_subscription_price || 0,\n paywall_position: this.paywall_position || 0,\n page_type: this.tracker_page_type,\n content_id: this.tracker_content_id,\n content_title: this.tracker_content_title,\n content_categories: this.tracker_content_categories,\n content_type: this.tracker_content_type,\n user_type: this.tracker_user_type || 'R',\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'MP',\n metered_wall_balance: (this.maxQuota - this.countdownArticle) + 1\n })\n }\n\n private dataLayeronMeteredPaywall() {\n window.dataLayer.push({\n event: 'paywall_viewed',\n paywall_location: this.paywall_location || '',\n paywall_subscription_package: this.paywall_subscription_package || '',\n paywall_subscription_id: this.paywall_subscription_id || '',\n paywall_subscription_price: this.paywall_subscription_price || 0,\n paywall_position: this.paywall_position || 0,\n page_type: this.tracker_page_type,\n content_id: this.tracker_content_id,\n content_title: this.tracker_content_title,\n content_categories: this.tracker_content_categories,\n content_type: this.tracker_content_type,\n user_type: this.tracker_user_type || 'R',\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'MP',\n metered_wall_balance: (this.maxQuota - this.countdownArticle) + 1\n })\n }\n\n render() {\n return html`\n <div class=\"sticky bottom-0 w-full h-full\">\n <div\n class=\"flex flex-row w-full bg-blue-100 py-4 justify-center space-x-4 px-4 lg:px-0 bottom-0\"\n >\n <div class=\"text-grey-600 text-sm md:text-lg self-center text-left\">\n ${this.getCountdownArticle()}\n </div>\n <div class=\"self-center\">\n <button\n @click=\"${this.redirectToBerlangganan}\"\n class=\"bg-green-400 p-2 rounded-md font-bold text-grey-100 text-sm md:text-xl\"\n >\n Langganan\n </button>\n </div>\n </div>\n </div>\n `\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"KompasMeteredPaywall.js","sourceRoot":"","sources":["../../../../src/components/kompas-metered-paywall/KompasMeteredPaywall.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement } from 'lit'\nimport { customElement, state, property } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\n\n@customElement('kompas-metered-paywall')\nexport class KompasMeteredPaywall extends LitElement {\n static styles = [\n css`\n .text-transition {\n width: 100%;\n height: 5rem;\n }\n\n .body {\n position: sticky;\n top: 0;\n height: 100%;\n width: 100%;\n }\n\n .icon {\n height: 1rem;\n color: #48bb78;\n }\n\n .icon.lg {\n height: 1.5rem;\n }\n\n .icon.lg svg {\n height: 1.5rem;\n }\n `,\n TWStyles,\n ]\n\n @state() maxQuota: number = 5\n\n @state() subscriptionUrl: string = 'https://www.kompas.id/berlangganan'\n /**\n * Props\n */\n /**\n * prop countdownArticle untuk menghandle sudah berapa artikel gratis yang user baca.\n * prop paywall_location = The location where user encounter the paywall\n * prop paywall_subscription_package = The name of the subscription package viewed by user\n * prop paywall_subscription_id = The ID of the subscription package viewed by user\n * prop paywall_subscription_price = The price of the subscriprtion package viewed by user\n * prop paywall_position = The position of ther subscription package viewed by user\n * prop tracker_page_type = Type of the page\n * prop tracker_content_id = ID of article (slug)\n * prop tracker_content_type = Whether it's free article or paid article\n * prop tracker_content_title = The title of article\n * prop tracker_content_categories = The category of the content\n * prop tracker_user_type = Type of user based on their subscription\n * prop tracker_subscription_status = Status of their subscription\n * prop tracker_page_domain = Page Domain\n * prop tracker_metered_wall_type = The type of Metered Wall\n * prop tracker_epaper_edition = The edition of epaper viewed by user\n * prop tracker_metered_wall_balance = The balance of their metered wall\n */\n @property({ type: Number }) countdownArticle = 0\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: String }) paywall_subscription_id = ''\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n\n private getCountdownArticle() {\n const getCountdown = this.countdownArticle\n const { maxQuota } = this\n\n if (getCountdown > 0 && getCountdown < maxQuota) {\n return html`\n <p>\n Anda memiliki sisa\n <b>${maxQuota - getCountdown} dari ${maxQuota}</b> artikel premium\n gratis bulan ini. Langganan untuk akses tanpa batas\n </p>\n `\n }\n return html`\n <p>\n Anda sedang membaca <b>artikel gratis terakhir bulan ini.</b> Langganan\n untuk akses tanpa batas\n </p>\n `\n }\n\n connectedCallback() {\n super.connectedCallback()\n\n this.dataLayeronMeteredPaywall()\n }\n\n private redirectToBerlangganan() {\n this.dataLayeronLanggananButton()\n window.location.href = this.subscriptionUrl\n }\n\n private dataLayeronLanggananButton() {\n window.dataLayer.push({\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location || '',\n paywall_subscription_package: this.paywall_subscription_package || '',\n paywall_subscription_id: this.paywall_subscription_id || '',\n paywall_subscription_price: this.paywall_subscription_price || 0,\n paywall_position: this.paywall_position || 0,\n page_type: this.tracker_page_type,\n content_id: this.tracker_content_id,\n content_title: this.tracker_content_title,\n content_categories: this.tracker_content_categories,\n content_type: this.tracker_content_type,\n user_type: this.tracker_user_type || 'R',\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'MP',\n metered_wall_balance: (this.maxQuota - this.countdownArticle) + 1\n })\n }\n\n private dataLayeronMeteredPaywall() {\n window.dataLayer.push({\n event: 'paywall_viewed',\n paywall_location: this.paywall_location || '',\n paywall_subscription_package: this.paywall_subscription_package || '',\n paywall_subscription_id: this.paywall_subscription_id || '',\n paywall_subscription_price: this.paywall_subscription_price || 0,\n paywall_position: this.paywall_position || 0,\n page_type: this.tracker_page_type,\n content_id: this.tracker_content_id,\n content_title: this.tracker_content_title,\n content_categories: this.tracker_content_categories,\n content_type: this.tracker_content_type,\n user_type: this.tracker_user_type || 'R',\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'MP',\n metered_wall_balance: (this.maxQuota - this.countdownArticle) + 1\n })\n }\n\n render() {\n return html`\n <div class=\"sticky bottom-0 w-full h-full\">\n <div\n class=\"flex flex-row w-full bg-blue-100 py-4 justify-center space-x-4 px-4 lg:px-0 bottom-0\"\n >\n <div class=\"text-grey-600 text-sm md:text-lg self-center text-left\">\n ${this.getCountdownArticle()}\n </div>\n <div class=\"self-center\">\n <button\n @click=\"${this.redirectToBerlangganan}\"\n class=\"bg-green-400 p-2 rounded-md font-bold text-grey-100 text-sm md:text-xl\"\n >\n Langganan\n </button>\n </div>\n </div>\n </div>\n `\n }\n}\n"]}
|
|
@@ -69,5 +69,5 @@ export declare class KompasPaywall extends LitElement {
|
|
|
69
69
|
private renderEpaperPaywallSection;
|
|
70
70
|
private renderRegularPaywallSection;
|
|
71
71
|
private selectorTypePaywall;
|
|
72
|
-
render(): import("lit
|
|
72
|
+
render(): import("lit").TemplateResult<1>;
|
|
73
73
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KompasPaywall.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall/KompasPaywall.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { PaywallProduct } from './types.js'\nimport '../kompas-paywall-body/KompasPaywallBody.js'\nimport '../kompas-paywall-banner-registration/KompasPaywallBannerRegistration.js'\nimport '../kompas-paywall-information-header/KompasPaywallInformationHeader.js'\n\n@customElement('kompas-paywall')\nexport class KompasPaywall extends LitElement {\n static styles = [\n css`\n :host {\n font-family: 'PT Sans', sans-serif;\n }\n `,\n TWStyles,\n ]\n\n /**\n * Props\n */\n /**\n * property isLogin untuk menghandle apakah user sudah login atau belum\n * property countdownArticle untuk menghandle count artikel\n * property type untuk menghandle tipe epaper\n * property isWithHeader untuk menghandle paywall information header\n * property textHeader digunakan sebagai text pada paywall information header\n * property paywallData untuk menghandle data paywall\n * property userGuid untuk menghandle user Guid\n * property subscriptionStatus untuk menghandle status subscription user\n * property swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * property paywall_location = The location where user encounter the paywall\n * property paywall_subscription_package = The name of the subscription package viewed by user\n * property paywall_subscription_id = The ID of the subscription package viewed by user\n * property paywall_subscription_price = The price of the subscriprtion package viewed by user\n * property paywall_position = The position of the subscription package viewed by user\n * property page_type = Type of the page\n * property content_id = ID of article (slug)\n * property content_type = Whether it's free article or paid article\n * property content_title = The title of article\n * property tracker_content_categories = The category of the content\n * property user_type = Type of user based on their subscription\n * property subscription_status = Status of their subscription\n * property page_domain = Page Domain\n * property metered_wall_type = The type of Metered Wall\n * property metered_wall_balance = The balance of their metered wall\n * property epaper_edition = The edition of epaper viewed by user\n * property theme = The theme of the paywall component\n */\n\n @state() private paywallData: PaywallProduct = {} as PaywallProduct\n\n @property({ type: Boolean }) isLogin = false\n @property({ type: Number }) countdownArticle = 0\n @property({ type: String }) type: 'epaper' | 'reguler' = 'reguler'\n @property({ type: Boolean }) isWithHeader = false\n @property({ type: String }) textHeader = ''\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\n @property({ type: Boolean }) swgEnable = false\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n @property({ type: String }) tracker_epaper_edition = ''\n @property({ type: String }) theme = ''\n\n mockResult: PaywallProduct = {\n informations: {\n title: 'Langganan untuk Lanjut Membaca',\n description: [\n 'Akses tak terbatas Kompas.id (web & app)',\n 'Berita digital tanpa iklan pop-up',\n '30 arsip terbaru ePaper Kompas',\n 'Artikel Opini eksklusif',\n ],\n register: {\n img: 'https://www.kompas.id/img/backgrounds/ilustrasi-banner-registration.png',\n title: 'Ingin Membaca Artikel Ini Secara Utuh?',\n subtitle: 'Daftar akun untuk membaca 5 artikel premium secara gratis ',\n label: 'Daftar Sekarang ',\n },\n meterred: {\n maxQuota: 5,\n label: 'Langganan',\n maxQuotaMessage: 'Akses artikel gratis Anda bulan ini sudah habis.',\n url: 'https://kompas.id/berlangganan',\n },\n },\n packages: {\n title: 'Sekali bayar, tanpa perpanjang otomatis',\n memberships: [\n {\n title: 'Kompas Digital Premium 12 Bulan (Hemat 40%)',\n percentage: 40,\n price: 360000,\n discountPrice: 600000,\n periode: '1 Tahun',\n isHighlight: true,\n url: 'https://checkoutv2.kompas.id/kdp?productId=9802032&referrer=',\n },\n {\n title: 'Kompas Digital Premium 1 Bulan',\n percentage: 0,\n discountPrice: 0,\n price: 50000,\n periode: '1 Bulan',\n isHighlight: false,\n url: 'https://checkoutv2.kompas.id/kdp?productId=9802035&referrer=',\n },\n ],\n },\n payment: {\n desktop: [\n {\n name: 'gopay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n {\n name: 'dana',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n ],\n mobile: [\n {\n name: 'gopay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n ],\n ekstension: [\n {\n name: 'dana',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n ],\n },\n }\n\n get darkUrl() {\n return this.theme === 'dark' ? '-dark' : ''\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this.paywallData = this.mockResult\n }\n\n private transitionBox() {\n return html`\n <div\n class=\"h-20 ${this.theme === 'dark'\n ? 'transparent-linear-dark'\n : 'transparent-linear'} -mt-24 z-0 w-full\"\n ></div>\n `\n }\n\n private renderEpaperPaywallSection() {\n return html`<kompas-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n tracker_content_type=${this.tracker_content_type}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompas-paywall-body>`\n }\n\n private renderRegularPaywallSection() {\n const defaultHeaderText: string =\n this.paywallData.informations.meterred.maxQuotaMessage\n if (this.isWithHeader) {\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompas-paywall-information-header\n text=${this.textHeader || defaultHeaderText}\n theme=${this.theme}\n ></kompas-paywall-information-header>\n <kompas-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n tracker_content_type=${this.tracker_content_type}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompas-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompas-paywall-banner-registration\n .bannerData=${this.paywallData.informations.register}\n theme=${this.theme}\n ></kompas-paywall-banner-registration>\n <kompas-paywall-body\n tracker_content_type=${this.tracker_content_type}\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompas-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n\n private selectorTypePaywall = (type: 'epaper' | 'reguler') => {\n switch (type) {\n case 'epaper':\n return this.renderEpaperPaywallSection()\n case 'reguler':\n return this.renderRegularPaywallSection()\n default:\n return this.renderRegularPaywallSection()\n }\n }\n\n render() {\n return html`\n <div class=\"relative w-full\">${this.selectorTypePaywall(this.type)}</div>\n `\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"KompasPaywall.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall/KompasPaywall.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { PaywallProduct } from './types.js'\nimport '../kompas-paywall-body/KompasPaywallBody.js'\nimport '../kompas-paywall-banner-registration/KompasPaywallBannerRegistration.js'\nimport '../kompas-paywall-information-header/KompasPaywallInformationHeader.js'\n\n@customElement('kompas-paywall')\nexport class KompasPaywall extends LitElement {\n static styles = [\n css`\n :host {\n font-family: 'PT Sans', sans-serif;\n }\n `,\n TWStyles,\n ]\n\n /**\n * Props\n */\n /**\n * property isLogin untuk menghandle apakah user sudah login atau belum\n * property countdownArticle untuk menghandle count artikel\n * property type untuk menghandle tipe epaper\n * property isWithHeader untuk menghandle paywall information header\n * property textHeader digunakan sebagai text pada paywall information header\n * property paywallData untuk menghandle data paywall\n * property userGuid untuk menghandle user Guid\n * property subscriptionStatus untuk menghandle status subscription user\n * property swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * property paywall_location = The location where user encounter the paywall\n * property paywall_subscription_package = The name of the subscription package viewed by user\n * property paywall_subscription_id = The ID of the subscription package viewed by user\n * property paywall_subscription_price = The price of the subscriprtion package viewed by user\n * property paywall_position = The position of the subscription package viewed by user\n * property page_type = Type of the page\n * property content_id = ID of article (slug)\n * property content_type = Whether it's free article or paid article\n * property content_title = The title of article\n * property tracker_content_categories = The category of the content\n * property user_type = Type of user based on their subscription\n * property subscription_status = Status of their subscription\n * property page_domain = Page Domain\n * property metered_wall_type = The type of Metered Wall\n * property metered_wall_balance = The balance of their metered wall\n * property epaper_edition = The edition of epaper viewed by user\n * property theme = The theme of the paywall component\n */\n\n @state() private paywallData: PaywallProduct = {} as PaywallProduct\n\n @property({ type: Boolean }) isLogin = false\n @property({ type: Number }) countdownArticle = 0\n @property({ type: String }) type: 'epaper' | 'reguler' = 'reguler'\n @property({ type: Boolean }) isWithHeader = false\n @property({ type: String }) textHeader = ''\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\n @property({ type: Boolean }) swgEnable = false\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n @property({ type: String }) tracker_epaper_edition = ''\n @property({ type: String }) theme = ''\n\n mockResult: PaywallProduct = {\n informations: {\n title: 'Langganan untuk Lanjut Membaca',\n description: [\n 'Akses tak terbatas Kompas.id (web & app)',\n 'Berita digital tanpa iklan pop-up',\n '30 arsip terbaru ePaper Kompas',\n 'Artikel Opini eksklusif',\n ],\n register: {\n img: 'https://www.kompas.id/img/backgrounds/ilustrasi-banner-registration.png',\n title: 'Ingin Membaca Artikel Ini Secara Utuh?',\n subtitle: 'Daftar akun untuk membaca 5 artikel premium secara gratis ',\n label: 'Daftar Sekarang ',\n },\n meterred: {\n maxQuota: 5,\n label: 'Langganan',\n maxQuotaMessage: 'Akses artikel gratis Anda bulan ini sudah habis.',\n url: 'https://kompas.id/berlangganan',\n },\n },\n packages: {\n title: 'Sekali bayar, tanpa perpanjang otomatis',\n memberships: [\n {\n title: 'Kompas Digital Premium 12 Bulan (Hemat 40%)',\n percentage: 40,\n price: 360000,\n discountPrice: 600000,\n periode: '1 Tahun',\n isHighlight: true,\n url: 'https://checkoutv2.kompas.id/kdp?productId=9802032&referrer=',\n },\n {\n title: 'Kompas Digital Premium 1 Bulan',\n percentage: 0,\n discountPrice: 0,\n price: 50000,\n periode: '1 Bulan',\n isHighlight: false,\n url: 'https://checkoutv2.kompas.id/kdp?productId=9802035&referrer=',\n },\n ],\n },\n payment: {\n desktop: [\n {\n name: 'gopay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n {\n name: 'dana',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n ],\n mobile: [\n {\n name: 'gopay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n ],\n ekstension: [\n {\n name: 'dana',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://d3w4qaq4xm1ncv.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n ],\n },\n }\n\n get darkUrl() {\n return this.theme === 'dark' ? '-dark' : ''\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this.paywallData = this.mockResult\n }\n\n private transitionBox() {\n return html`\n <div\n class=\"h-20 ${this.theme === 'dark'\n ? 'transparent-linear-dark'\n : 'transparent-linear'} -mt-24 z-0 w-full\"\n ></div>\n `\n }\n\n private renderEpaperPaywallSection() {\n return html`<kompas-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n tracker_content_type=${this.tracker_content_type}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompas-paywall-body>`\n }\n\n private renderRegularPaywallSection() {\n const defaultHeaderText: string =\n this.paywallData.informations.meterred.maxQuotaMessage\n if (this.isWithHeader) {\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompas-paywall-information-header\n text=${this.textHeader || defaultHeaderText}\n theme=${this.theme}\n ></kompas-paywall-information-header>\n <kompas-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n tracker_content_type=${this.tracker_content_type}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompas-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompas-paywall-banner-registration\n .bannerData=${this.paywallData.informations.register}\n theme=${this.theme}\n ></kompas-paywall-banner-registration>\n <kompas-paywall-body\n tracker_content_type=${this.tracker_content_type}\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompas-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n\n private selectorTypePaywall = (type: 'epaper' | 'reguler') => {\n switch (type) {\n case 'epaper':\n return this.renderEpaperPaywallSection()\n case 'reguler':\n return this.renderRegularPaywallSection()\n default:\n return this.renderRegularPaywallSection()\n }\n }\n\n render() {\n return html`\n <div class=\"relative w-full\">${this.selectorTypePaywall(this.type)}</div>\n `\n }\n}\n"]}
|
package/dist/src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.d.ts
CHANGED
|
@@ -5,7 +5,8 @@ export declare class KompasPaywallBannerRegistration extends LitElement {
|
|
|
5
5
|
theme: string;
|
|
6
6
|
bannerData: Registration | undefined;
|
|
7
7
|
get isDark(): boolean;
|
|
8
|
+
private redirectToLogin;
|
|
8
9
|
private redirectToRegister;
|
|
9
10
|
private sendDataLayer;
|
|
10
|
-
render(): import("lit
|
|
11
|
+
render(): import("lit").TemplateResult<1>;
|
|
11
12
|
}
|
package/dist/src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.js
CHANGED
|
@@ -12,13 +12,20 @@ let KompasPaywallBannerRegistration = class KompasPaywallBannerRegistration exte
|
|
|
12
12
|
get isDark() {
|
|
13
13
|
return this.theme === 'dark';
|
|
14
14
|
}
|
|
15
|
-
|
|
15
|
+
redirectToLogin() {
|
|
16
16
|
this.sendDataLayer('registrationOfferClick');
|
|
17
17
|
const loginHost = 'https://account.kompas.id/login';
|
|
18
18
|
const nextParams = encodeURIComponent(window.location.href);
|
|
19
19
|
const directUrlRegister = `${loginHost}?next=${nextParams}`;
|
|
20
20
|
window.location.href = directUrlRegister;
|
|
21
21
|
}
|
|
22
|
+
redirectToRegister() {
|
|
23
|
+
this.sendDataLayer('registrationOfferClick');
|
|
24
|
+
const registerHost = 'https://account.kompas.id/register';
|
|
25
|
+
const nextParams = encodeURIComponent(window.location.href);
|
|
26
|
+
const directUrlRegister = `${registerHost}?next=${nextParams}?status=sukses_login&status_login=login&loc=hard_paywall`;
|
|
27
|
+
window.location.href = directUrlRegister;
|
|
28
|
+
}
|
|
22
29
|
sendDataLayer(value) {
|
|
23
30
|
window.dataLayer.push({
|
|
24
31
|
event: value,
|
|
@@ -73,7 +80,7 @@ let KompasPaywallBannerRegistration = class KompasPaywallBannerRegistration exte
|
|
|
73
80
|
<h6 class="${this.isDark && 'text-white'}">
|
|
74
81
|
Sudah punya akun?
|
|
75
82
|
<button
|
|
76
|
-
@click=${() => this.
|
|
83
|
+
@click=${() => this.redirectToLogin()}
|
|
77
84
|
class="font-bold ${this.isDark
|
|
78
85
|
? 'text-blue-300'
|
|
79
86
|
: 'text-blue-600'} underline"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KompasPaywallBannerRegistration.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAExD,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAG/C,IAAM,+BAA+B,GAArC,MAAM,+BAAgC,SAAQ,UAAU;IAAxD;;QAGuB,UAAK,GAAG,EAAE,CAAA;QACV,eAAU,GAA6B,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"KompasPaywallBannerRegistration.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall-banner-registration/KompasPaywallBannerRegistration.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAExD,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAG/C,IAAM,+BAA+B,GAArC,MAAM,+BAAgC,SAAQ,UAAU;IAAxD;;QAGuB,UAAK,GAAG,EAAE,CAAA;QACV,eAAU,GAA6B,SAAS,CAAA;IAwF9E,CAAC;IAtFC,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,KAAK,KAAK,MAAM,CAAA;IAC9B,CAAC;IAEO,eAAe;QACrB,IAAI,CAAC,aAAa,CAAC,wBAAwB,CAAC,CAAA;QAC5C,MAAM,SAAS,GAAW,iCAAiC,CAAA;QAC3D,MAAM,UAAU,GAAW,kBAAkB,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;QACnE,MAAM,iBAAiB,GAAW,GAAG,SAAS,SAAS,UAAU,EAAE,CAAA;QACnE,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,iBAAiB,CAAA;IAC1C,CAAC;IAEO,kBAAkB;QACxB,IAAI,CAAC,aAAa,CAAC,wBAAwB,CAAC,CAAA;QAC5C,MAAM,YAAY,GAAW,oCAAoC,CAAA;QACjE,MAAM,UAAU,GAAW,kBAAkB,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;QACnE,MAAM,iBAAiB,GAAW,GAAG,YAAY,SAAS,UAAU,0DAA0D,CAAA;QAC9H,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,iBAAiB,CAAA;IAC1C,CAAC;IAEO,aAAa,CAAC,KAAa;QACjC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC;YACpB,KAAK,EAAE,KAAK;YACZ,SAAS,EAAE,UAAU,EAAE;SACxB,CAAC,CAAA;IACJ,CAAC;IAED,MAAM;;QACJ,IAAI,CAAC,aAAa,CAAC,8BAA8B,CAAC,CAAA;QAClD,OAAO,IAAI,CAAA;;;;;;;;oBAQK,MAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,GAAG,mCAAI,EAAE;;;;mDAIK,IAAI,CAAC,MAAM;YAChD,YAAY;;;;;kBAKR,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK;;;kBAGtB,MAAA,IAAI,CAAC,UAAU,0CAAE,QAAQ;;;;;qBAKtB,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE;yCACX,IAAI,CAAC,MAAM;YACtC,CAAC,CAAC,cAAc;YAChB,CAAC,CAAC,YAAY;;;iCAGK,IAAI,CAAC,MAAM;YAC5B,CAAC,CAAC,YAAY;YACd,CAAC,CAAC,YAAY;;gBAEd,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK;;;;;;uBAMf,IAAI,CAAC,MAAM,IAAI,YAAY;;;uBAG3B,GAAG,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE;iCAClB,IAAI,CAAC,MAAM;YAC5B,CAAC,CAAC,eAAe;YACjB,CAAC,CAAC,eAAe;;;;;;;KAO5B,CAAA;IACH,CAAC;;AA1FM,sCAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,CAAA;AAEL;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8DAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mEAAiD;AAJjE,+BAA+B;IAD3C,aAAa,CAAC,oCAAoC,CAAC;GACvC,+BAA+B,CA4F3C;SA5FY,+BAA+B","sourcesContent":["import { html, css, LitElement } from 'lit'\nimport { property, customElement } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { Registration } from '../kompas-paywall/types.js'\nimport { deviceType } from '../../utils/deviceType.js'\n\n@customElement('kompas-paywall-banner-registration')\nexport class KompasPaywallBannerRegistration extends LitElement {\n static styles = [css``, TWStyles]\n\n @property({ type: String }) theme = ''\n @property({ type: Object }) bannerData: Registration | undefined = undefined\n\n get isDark() {\n return this.theme === 'dark'\n }\n\n private redirectToLogin(): void {\n this.sendDataLayer('registrationOfferClick')\n const loginHost: string = 'https://account.kompas.id/login'\n const nextParams: string = encodeURIComponent(window.location.href)\n const directUrlRegister: string = `${loginHost}?next=${nextParams}`\n window.location.href = directUrlRegister\n }\n\n private redirectToRegister(): void {\n this.sendDataLayer('registrationOfferClick')\n const registerHost: string = 'https://account.kompas.id/register'\n const nextParams: string = encodeURIComponent(window.location.href)\n const directUrlRegister: string = `${registerHost}?next=${nextParams}?status=sukses_login&status_login=login&loc=hard_paywall`\n window.location.href = directUrlRegister\n }\n\n private sendDataLayer(value: string): void {\n window.dataLayer.push({\n event: value,\n interface: deviceType(),\n })\n }\n\n render() {\n this.sendDataLayer('registrationOfferimppression')\n return html`\n <div class=\"flex flex-col items-center my-5\">\n <div\n class=\"flex flex-col md:flex-row justify-between items-center w-full\"\n >\n <div class=\"flex flex-col md:flex-row items-center w-full\">\n <img\n class=\"object-cover w-20 h-20\"\n src=${this.bannerData?.img ?? ''}\n alt=\"information-register-img\"\n />\n <div\n class=\"flex flex-col justify-start ${this.isDark &&\n 'text-white'} md:ml-6 my-4\"\n >\n <h5\n class=\"text-center md:text-left text-base md:text-xl font-serif font-bold\"\n >\n ${this.bannerData?.title}\n </h5>\n <h6 class=\"text-center md:text-left\">\n ${this.bannerData?.subtitle}\n </h6>\n </div>\n </div>\n <button\n @click=${() => this.redirectToRegister()}\n class=\"w-40 md:w-52 h-auto ${this.isDark\n ? 'bg-green-300'\n : 'bg-brand-1'} rounded\"\n >\n <h6\n class=\"text-base ${this.isDark\n ? 'text-black'\n : 'text-white'} font-bold py-2 px-4\"\n >\n ${this.bannerData?.label}\n </h6>\n </button>\n </div>\n <div class=\"border-b-2 border-grey-200 w-32 md:w-40 my-6\"></div>\n <div>\n <h6 class=\"${this.isDark && 'text-white'}\">\n Sudah punya akun?\n <button\n @click=${() => this.redirectToLogin()}\n class=\"font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Silakan Masuk\n </button>\n </h6>\n </div>\n </div>\n `\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KompasPaywallBody.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall-body/KompasPaywallBody.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-return-assign */\n\nimport { html, css, LitElement } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport {\n PaywallProduct,\n Product,\n Packages,\n PaymentImage,\n} from '../kompas-paywall/types.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport { deviceType } from '../../utils/deviceType.js'\n\n@customElement('kompas-paywall-body')\nexport class KompasPaywallBody extends LitElement {\n static styles = [css``, TWStyles]\n\n /**\n * Props\n */\n /**\n * prop slug untuk menghandle slug\n * prop isLogin untuk menghandle apakah user sudah login atau belum\n * prop type untuk menghandle tipe epaper\n * prop paywallData untuk menghandle data paywall\n * prop userGuid untuk menghandle user Guid\n * prop subscriptionStatus untuk menghandle status subscription user\n * prop countdownArticle untuk menghandle count artikel\n * prop swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * prop paywall_location = The location where user encounter the paywall\n * prop paywall_subscription_package = The name of the subscription package viewed by user\n * prop paywall_subscription_id = The ID of the subscription package viewed by user\n * prop paywall_subscription_price = The price of the subscriprtion package viewed by user\n * prop paywall_position = The position of the subscription package viewed by user\n * prop tracker_page_type = Type of the page\n * prop tracker_content_id = ID of article (slug)\n * prop tracker_content_type = Whether it's free article or paid article\n * prop tracker_content_title = The title of article\n * prop tracker_content_categories = The category of the content\n * prop tracker_user_type = Type of user based on their subscription\n * prop tracker_subscription_status = Status of their subscription\n * prop tracker_page_domain = Page Domain\n * prop tracker_metered_wall_type = The type of Metered Wall\n * prop tracker_metered_wall_balance = The balance of their metered wall\n * prop tracker_metered_wall_balance = The edition of epaper viewed by user\n * prop theme = The theme of the paywall component\n */\n\n @property({ type: String }) slug = ''\n @property({ type: Number }) udin = 0\n @property({ type: Boolean }) isLogin = false\n @property({ type: String }) type: 'epaper' | 'reguler' = 'reguler'\n @property({ type: Object }) paywallData: PaywallProduct | undefined =\n undefined\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\n @property({ type: Number }) countdownArticle = 0\n @property({ type: Boolean }) swgEnable = false\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n @property({ type: String }) tracker_epaper_edition = ''\n @property({ type: String }) theme = ''\n\n @state() private isExtensionsOpened = false\n @state() private kompasAkunHost = 'https://akun.kompas.id'\n @state() private kompasApigenHost = 'https://apigen.kompas.id'\n @state() private kompasApiWcmHost = 'https://apiwcm.kompas.id'\n @state() private kompasLoginHost = 'https://account.kompas.id/login'\n @state() private selfHost = 'https://epaper.kompas.id'\n @state() private swgPublisherName = 'Harian Kompas'\n @state() private swgPublisherId = 'kompas.id'\n @state() private swgProductId = 'kompas.id:kompas_digital_premium'\n @state() private errorFlag = 0\n\n buttonElement!: HTMLButtonElement\n\n private getRupiahFormat(value: number) {\n const roundedValue = Math.round(value)\n return `Rp ${roundedValue\n .toString()\n .replace(/(\\d)(?=(\\d{3})+(?!\\d))/g, '$1.')}`\n }\n\n private redirectToCheckout(\n url: string,\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n this.sendDataLayeronButtonBuyPackage(name, id, price, position)\n const originHost: string = encodeURIComponent(window.location.href)\n const directUrlCheckout: string = url + originHost\n window.open(directUrlCheckout)\n }\n\n private redirectToPrevUrl(): void {\n window.history.back()\n }\n\n private redirectToSubscriber(): void {\n this.sendDataLayer()\n window.open('https://www.kompas.id/berlangganan')\n }\n\n private redirectToRegister(): void {\n const loginHost: string = 'https://account.kompas.id/login'\n const nextParams: string = encodeURIComponent(window.location.href)\n const directUrlRegister: string = `${loginHost}?next=${nextParams}?status=sukses_login&status_login=login`\n window.location.href = directUrlRegister\n }\n\n private redirectToHelpdesk(): void {\n this.sendDataLayeronHelpDesk()\n window.open(\n 'https://api.whatsapp.com/send/?phone=6281290050800&text=Halo,%20saya%20perlu%20informasi%20mengenai%20kompas.id'\n )\n }\n\n private paymentExtensionHandler(): void {\n this.isExtensionsOpened = !this.isExtensionsOpened\n }\n\n get isDark() {\n return this.theme === 'dark'\n }\n\n get redirectToLogin() {\n return `${this.kompasLoginHost}?next=${encodeURIComponent(\n this.selfHost + window.location.pathname\n )}`\n }\n\n private async getRegisterToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/register/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getUserToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getSubscriptionToken(\n path: string,\n payload: any\n ): Promise<string> {\n return fetch(`${this.kompasAkunHost}/api/subscription/login/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => {\n this.errorFlag = 0\n return data.access_token\n })\n .catch(async error => {\n const errorCode = error.response.status\n if (errorCode === 500 && this.errorFlag < 5) {\n // eslint-disable-next-line no-plusplus\n this.errorFlag++\n setTimeout(async () => {\n await this.getSubscriptionToken(path, payload)\n }, 2000)\n } else {\n this.errorFlag = 0\n throw error\n }\n })\n }\n\n private async createSwG(payload: any, token: string) {\n await fetch(`${this.kompasApiWcmHost}/v2/membership/swg/create`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n Authorization: `Bearer ${token}`,\n },\n })\n .then(response => response.json())\n .catch(error => {\n throw error\n })\n }\n\n private subscribeWithGoogleButton = (): any => {\n // @ts-ignore\n // eslint-disable-next-line no-restricted-globals\n ;(self.SWG = self.SWG || []).push((subscriptions: any) => {\n // set entitlement\n subscriptions.setOnEntitlementsResponse(() => {\n // subscriptions attach button\n subscriptions.attachButton(\n this.buttonElement,\n { theme: 'light', lang: 'en' },\n () => {\n subscriptions.showOffers({ isClosable: true })\n subscriptions.setOnLoginRequest(() => {\n window.location.href = this.redirectToLogin\n })\n subscriptions.setOnPaymentResponse(async (paymentResponse: any) => {\n const response = await paymentResponse\n const raw = JSON.parse(response.purchaseData.raw)\n const { productId, purchaseToken, packageName } = raw\n const { email } = response.userData.data\n\n const payload = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const userToken = await this.getUserToken('google', payload)\n if (userToken) {\n // login and update membership\n const accessToken = await this.getSubscriptionToken('google', {\n token: userToken,\n })\n if (accessToken) {\n const payloadSWG = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWG, accessToken)\n }\n } else {\n // register and login the unknown user\n const payloadRegisterToken = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const token = await this.getRegisterToken(\n 'google',\n payloadRegisterToken\n )\n if (token) {\n const accessToken = await this.getSubscriptionToken(\n 'google',\n { token }\n )\n const payloadSWRUknown = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWRUknown, accessToken)\n }\n }\n response.complete().then(() => {\n window.location.href = this.redirectToLogin\n })\n })\n }\n )\n })\n })\n }\n\n private jsonScript() {\n const jsonData = {\n '@context': 'https://schema.org',\n '@type': ['WebSite', 'WebPage'],\n isAccessibleForFree: false,\n url: this.selfHost + window.location.pathname,\n name: this.swgPublisherName,\n hasPart: {\n '@type': 'WebPageElement',\n },\n isPartOf: {\n '@type': ['CreativeWork', 'Product'],\n name: this.swgPublisherId,\n productID: this.swgProductId,\n },\n }\n const str = JSON.stringify(jsonData)\n const jsonScript = document.createElement('script')\n jsonScript.type = 'application/ld+json'\n jsonScript.text = str\n jsonScript.defer = true\n const jsonHead = document.querySelector('head')\n if (jsonHead) {\n jsonHead.appendChild(jsonScript)\n }\n }\n\n override connectedCallback() {\n // eslint-disable-next-line wc/guard-super-call\n super.connectedCallback()\n if (this.swgEnable) {\n this.jsonScript()\n if (this.buttonElement) {\n const head = document.querySelector('head')\n const script = document.createElement('script')\n script.src = 'https://news.google.com/swg/js/v1/swg.js'\n script.defer = true\n script.onload = this.subscribeWithGoogleButton()\n if (head) {\n head.appendChild(script)\n }\n }\n }\n }\n\n private sendDataLayer(): void {\n window.dataLayer.push({\n event: 'halamanBerlanggananClick',\n subscriptionStatus: '',\n GUID: '',\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronHelpDesk(): void {\n window.dataLayer.push({\n event: 'helpOfferClick',\n userType: this.subscriptionStatus,\n GUID: this.userGuid,\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronButtonBuyPackage(\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n const gtmParams: Record<string, any> = {\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location,\n paywall_subscription_package: name,\n paywall_subscription_id: id,\n paywall_subscription_price: price,\n paywall_position: position,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n }\n\n if (this.type !== 'epaper') {\n gtmParams.content_title = this.tracker_content_title\n gtmParams.content_id = this.tracker_content_id\n gtmParams.content_categories = this.tracker_content_categories\n gtmParams.content_type = this.tracker_content_type\n gtmParams.page_type = this.tracker_page_type\n } else {\n gtmParams.epaper_edition = this.tracker_epaper_edition\n }\n\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayeronPaywallBody = (): void => {\n const gtmParams: Record<string, any> = {\n event: 'paywall_viewed',\n impressions: [\n {\n paywall_location: this.paywall_location || '',\n paywall_subscription_package:\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 12',\n paywall_subscription_id: '9802032',\n paywall_subscription_price: 360000,\n paywall_position: 1,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n },\n {\n paywall_location: this.paywall_location || '',\n paywall_subscription_package:\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 1',\n paywall_subscription_id: '9802035',\n paywall_subscription_price: 50000,\n paywall_position: 2,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n },\n ],\n }\n\n if (this.type === 'epaper') {\n gtmParams.impressions[0].epaper_edition = this.tracker_epaper_edition\n gtmParams.impressions[1].epaper_edition = this.tracker_epaper_edition\n } else {\n gtmParams.impressions[0].page_type = this.tracker_page_type\n gtmParams.impressions[0].content_id = this.tracker_content_id\n gtmParams.impressions[0].content_title = this.tracker_content_title\n gtmParams.impressions[0].content_categories =\n this.tracker_content_categories\n gtmParams.impressions[0].content_type = this.tracker_content_type\n\n gtmParams.impressions[1].page_type = this.tracker_page_type\n gtmParams.impressions[1].content_id = this.tracker_content_id\n gtmParams.impressions[1].content_title = this.tracker_content_title\n gtmParams.impressions[1].content_categories =\n this.tracker_content_categories\n gtmParams.impressions[1].content_type = this.tracker_content_type\n }\n\n window.dataLayer.push(gtmParams)\n }\n\n private headerSection(type: 'epaper' | 'reguler') {\n return html`\n <div class=\"flex w-full items-center\">\n ${type === 'epaper'\n ? html`<button\n @click=${() => this.redirectToPrevUrl()}\n class=\"hidden lg:block w-8 h-8 text-blue-600 pl-4\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'arrow-left'))}\n </button>`\n : ''}\n <h4\n class=\"text-base md:text-xl ${this.isDark &&\n 'text-white'} text-center font-bold font-serif tracking-wide md:tracking-normal w-full\"\n >\n Langganan untuk Lanjut Membaca\n </h4>\n </div>\n `\n }\n\n private descriptionSection(data: Array<string>) {\n return html`<div class=\" flex flex-col items-center\">\n <div class=\"flex flex-col space-y-2 mt-2.5 md:mt-3\">\n ${data.map(\n item =>\n html`\n <div class=\"flex items-center\">\n <div class=\"text-green-500\">\n ${unsafeSVG(getFontAwesomeIcon('fas', 'check', 12, 12))}\n </div>\n <h6\n class=\"text-xs md:text-base ${this.isDark &&\n 'text-white'} ml-0.5 md:ml-1\"\n >\n ${item}\n </h6>\n </div>\n `\n )}\n </div>\n </div>`\n }\n\n private informationPackages() {\n return html` <div class=\"mt-4 flex justify-center\">\n <button\n @click=${() => this.redirectToSubscriber()}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Lihat Paket Lainnya\n </button>\n </div>`\n }\n\n private separatorLine() {\n return html`\n <div class=\"flex flex-row w-full justify-center\">\n <div\n class=\"border-b-2 ${this.isDark\n ? 'border-dark-2'\n : 'border-blue-200'} w-1/4 my-4 flex justify-center\"\n ></div>\n <p class=\"px-4 pt-1 ${this.isDark && 'text-dark-1'}\">atau</p>\n <div\n class=\"border-b-2 ${this.isDark\n ? 'border-dark-2'\n : 'border-blue-200'} w-1/4 my-4 flex justify-center\"\n ></div>\n </div>\n `\n }\n\n private paymentDesktopSection(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"hidden md:flex w-full md:max-w-sm items-center justify-center flex-wrap\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"object-cover ${this.isDark ? 'h-9' : 'h-10'}\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n </div>\n `\n }\n\n private paymentMobileSection(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"grid md:hidden items-center grid-flow-col grid-cols-auto grid-rows-1 mt-4 mx-4\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"w-16\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n <button\n @click=${() => this.paymentExtensionHandler()}\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} font-bold\"\n >\n +9 lainnya\n </button>\n </div>\n `\n }\n\n private paymentMobileExtension(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"w-full ${this.isDark\n ? '-bottom-6'\n : 'bottom-0'} max-w-xs mb-1 ml-8 md:hidden absolute px-4\"\n >\n <div\n class=\"w-full ${this.isDark\n ? 'bg-dark-6 border-dark-6'\n : 'bg-white border-white'} rounded p-3 max-w-xs\"\n >\n <svg\n class=\"right-0 ${this.isDark\n ? 'text-dark-6 border-dark-6'\n : 'text-white border-white '} h-4 mr-10 -mt-7 z-0 transform rotate-180 absolute\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 255 255\"\n >\n <polygon class=\"fill-current\" points=\"0,0 127.5,127.5 255,0\" />\n </svg>\n <div\n class=\"grid place-items-center items-center grid-flow-row grid-cols-5 grid-rows-2 gap-y-4\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"object-cover\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n </div>\n </div>\n </div>\n `\n }\n\n private primaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap justify-between items-center ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} rounded md:mx-0 w-full max-w-xs md:max-w-sm md:w-3/5 mt-2.5 md:mt-4 border border-yellow-400 relative\"\n >\n <div class=\"flex flex-col py-3 px-4\">\n <div class=\"flex flex-none items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${this.getRupiahFormat(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark &&\n 'text-white'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n <div class=\"flex items-center\">\n <p class=\"text-xs ${this.isDark && 'text-white'}\">\n hanya <span class=\"text-orange-400\">Rp 30.000</span> / bulan\n </p>\n </div>\n </div>\n <button\n class=\"h-auto ${this.isDark\n ? 'bg-green-300 border border-green-400'\n : 'bg-green-500'} rounded mr-4\"\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 12',\n '9802032',\n 360000,\n 1\n )}\n >\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-black'\n : 'text-white'} font-bold py-2 px-4\"\n >\n Langganan\n </h6>\n </button>\n <div class=\"absolute -top-2 left-4\">\n <div class=\"rounded bg-yellow-300 px-2 py-0.5 text-xs\">\n <b>Harga Terbaik</b>\n </div>\n </div>\n </div>\n `\n }\n\n private secondaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap justify-between ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded md:mx-0 w-full max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n <div class=\"flex items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${this.getRupiahFormat(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark &&\n 'text-white'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n <button\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 1',\n '9802035',\n 50000,\n 2\n )}\n class=\"h-auto ${!this.isDark &&\n 'bg-white'} border border-green-500 rounded\"\n >\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-green-300'\n : 'text-green-500'} font-bold py-2 px-4\"\n >\n Langganan\n </h6>\n </button>\n </div>\n `\n }\n\n private packagesSection(data: Packages) {\n return html`\n <div class=\"flex flex-col w-full items-center mt-8 lg:mt-2 px-2 \">\n <h6\n class=\"text-sm md:text-base ${this.isDark && 'text-white'} font-bold\"\n >\n ${data.title}\n </h6>\n ${data.memberships.map(item =>\n item.isHighlight\n ? this.primaryPackages(item)\n : this.secondaryPackages(item)\n )}\n </div>\n `\n }\n\n private topNavigator() {\n return html`\n <div class=\"flex lg:hidden items-center w-full pb-4 \">\n <button\n @click=${() => this.redirectToPrevUrl()}\n class=\"text-xs md:text-lg text-white flex flex-row\"\n >\n <div class=\"icon-lg icon-white w-4 h-4 mr-3.5 md:mr-5 pt-0.5\">\n ${unsafeSVG(getFontAwesomeIcon('fas', 'arrow-left'))}\n </div>\n Kembali\n </button>\n </div>\n `\n }\n\n private helpDesk() {\n return html`\n <div class=\"py-2.5 text-white self-center text-xs md:text-sm\">\n Mengalami masalah? Hubungi\n <button\n @click=${() => this.redirectToHelpdesk()}\n class=\"font-bold ${this.isDark && 'text-blue-300'} underline\"\n >\n Layanan Pelanggan.\n </button>\n </div>\n `\n }\n\n private authRegister() {\n return html`\n <div\n class=\"flex flex-row text-white px-2 py-2.5 space-x-4 md:space-x-8 self-center\"\n >\n <div class=\"flex flex-col text-left text-xs md:text-sm text-white\">\n <b>Sudah berlangganan Kompas.id?</b>\n <p>Masuk untuk lanjut membaca.</p>\n </div>\n <button\n @click=${() => this.redirectToRegister()}\n class=\"h-auto ${this.isDark\n ? 'bg-blue-300'\n : 'bg-grey-100'} rounded mr-3\"\n >\n <p\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-black'\n : 'text-blue-600'} font-bold py-2 px-4\"\n >\n Masuk / Daftar\n </p>\n </button>\n </div>\n `\n }\n\n private userAction(isLogin: boolean, type: 'epaper' | 'reguler') {\n return html`\n <div\n class=\"flex h-20 ${this.isDark\n ? 'bg-dark-4'\n : 'bg-blue-600'} w-full justify-evenly rounded-b mt-6 md:mt-8 relative\"\n >\n ${isLogin || type !== 'epaper' ? this.helpDesk() : this.authRegister()}\n </div>\n `\n }\n\n render() {\n return html`\n <div\n class=\"${this.type === 'epaper'\n ? 'bg-transparent wrapper-body'\n : 'wrapper-body'}\"\n >\n <div\n class=\"flex flex-col justify-center items-center w-full max-w-screen-sm px-4 md:px-0 my-5 relative\"\n >\n ${this.type === 'epaper' ? this.topNavigator() : ''}\n <div\n class=\"flex w-full flex-col items-center justify-center ${this\n .isDark\n ? 'bg-dark-3'\n : 'bg-blue-100'} rounded pt-6 md:pt-8 relative\"\n >\n ${this.headerSection(this.type)}\n ${this.descriptionSection(\n this.paywallData?.informations?.description ?? []\n )}\n ${this.packagesSection(\n this.paywallData?.packages ?? ({} as Packages)\n )}\n ${this.informationPackages()}\n ${this.swgEnable ? this.separatorLine() : null}\n ${this.swgEnable\n ? html`<button\n class=\"border-2 bg-grey-100 border-grey-100 rounded-lg px-6 shadow-sm flex flex-row py-2 mt-1 mb-4\"\n ref=${(el: any) => (this.buttonElement = el as HTMLButtonElement)}\n >\n <p>Subscribe with</p>\n <img class=\"pl-2 object-scale-down w-20 pt-0.5\" src=\"https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/paywall-asset/google.png\" alt=\"subscribe with google\"></img>\n </button>`\n : null}\n ${this.paymentDesktopSection(\n this.paywallData?.payment?.desktop ?? []\n )}\n ${this.paymentMobileSection(\n this.paywallData?.payment?.mobile ?? []\n )}\n ${this.userAction(this.isLogin, this.type)}\n ${this.sendDataLayeronPaywallBody()}\n </div>\n ${this.isExtensionsOpened\n ? this.paymentMobileExtension(\n this.paywallData?.payment?.ekstension ?? []\n )\n : ''}\n </div>\n </div>\n `\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"KompasPaywallBody.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall-body/KompasPaywallBody.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-return-assign */\n\nimport { html, css, LitElement } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport {\n PaywallProduct,\n Product,\n Packages,\n PaymentImage,\n} from '../kompas-paywall/types.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport { deviceType } from '../../utils/deviceType.js'\n\n@customElement('kompas-paywall-body')\nexport class KompasPaywallBody extends LitElement {\n static styles = [css``, TWStyles]\n\n /**\n * Props\n */\n /**\n * prop slug untuk menghandle slug\n * prop isLogin untuk menghandle apakah user sudah login atau belum\n * prop type untuk menghandle tipe epaper\n * prop paywallData untuk menghandle data paywall\n * prop userGuid untuk menghandle user Guid\n * prop subscriptionStatus untuk menghandle status subscription user\n * prop countdownArticle untuk menghandle count artikel\n * prop swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * prop paywall_location = The location where user encounter the paywall\n * prop paywall_subscription_package = The name of the subscription package viewed by user\n * prop paywall_subscription_id = The ID of the subscription package viewed by user\n * prop paywall_subscription_price = The price of the subscriprtion package viewed by user\n * prop paywall_position = The position of the subscription package viewed by user\n * prop tracker_page_type = Type of the page\n * prop tracker_content_id = ID of article (slug)\n * prop tracker_content_type = Whether it's free article or paid article\n * prop tracker_content_title = The title of article\n * prop tracker_content_categories = The category of the content\n * prop tracker_user_type = Type of user based on their subscription\n * prop tracker_subscription_status = Status of their subscription\n * prop tracker_page_domain = Page Domain\n * prop tracker_metered_wall_type = The type of Metered Wall\n * prop tracker_metered_wall_balance = The balance of their metered wall\n * prop tracker_metered_wall_balance = The edition of epaper viewed by user\n * prop theme = The theme of the paywall component\n */\n\n @property({ type: String }) slug = ''\n @property({ type: Number }) udin = 0\n @property({ type: Boolean }) isLogin = false\n @property({ type: String }) type: 'epaper' | 'reguler' = 'reguler'\n @property({ type: Object }) paywallData: PaywallProduct | undefined =\n undefined\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\n @property({ type: Number }) countdownArticle = 0\n @property({ type: Boolean }) swgEnable = false\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n @property({ type: String }) tracker_epaper_edition = ''\n @property({ type: String }) theme = ''\n\n @state() private isExtensionsOpened = false\n @state() private kompasAkunHost = 'https://akun.kompas.id'\n @state() private kompasApigenHost = 'https://apigen.kompas.id'\n @state() private kompasApiWcmHost = 'https://apiwcm.kompas.id'\n @state() private kompasLoginHost = 'https://account.kompas.id/login'\n @state() private selfHost = 'https://epaper.kompas.id'\n @state() private swgPublisherName = 'Harian Kompas'\n @state() private swgPublisherId = 'kompas.id'\n @state() private swgProductId = 'kompas.id:kompas_digital_premium'\n @state() private errorFlag = 0\n\n buttonElement!: HTMLButtonElement\n\n private getRupiahFormat(value: number) {\n const roundedValue = Math.round(value)\n return `Rp ${roundedValue\n .toString()\n .replace(/(\\d)(?=(\\d{3})+(?!\\d))/g, '$1.')}`\n }\n\n private redirectToCheckout(\n url: string,\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n this.sendDataLayeronButtonBuyPackage(name, id, price, position)\n const originHost: string = encodeURIComponent(window.location.href)\n const directUrlCheckout: string = url + originHost\n window.open(directUrlCheckout)\n }\n\n private redirectToPrevUrl(): void {\n window.history.back()\n }\n\n private redirectToSubscriber(): void {\n this.sendDataLayer()\n window.open('https://www.kompas.id/berlangganan')\n }\n\n private redirectToRegister(): void {\n const loginHost: string = 'https://account.kompas.id/login'\n const nextParams: string = encodeURIComponent(window.location.href)\n const directUrlRegister: string = `${loginHost}?next=${nextParams}?status=sukses_login&status_login=login`\n window.location.href = directUrlRegister\n }\n\n private redirectToHelpdesk(): void {\n this.sendDataLayeronHelpDesk()\n window.open(\n 'https://api.whatsapp.com/send/?phone=6281290050800&text=Halo,%20saya%20perlu%20informasi%20mengenai%20kompas.id'\n )\n }\n\n private paymentExtensionHandler(): void {\n this.isExtensionsOpened = !this.isExtensionsOpened\n }\n\n get isDark() {\n return this.theme === 'dark'\n }\n\n get redirectToLogin() {\n return `${this.kompasLoginHost}?next=${encodeURIComponent(\n this.selfHost + window.location.pathname\n )}`\n }\n\n private async getRegisterToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/register/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getUserToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getSubscriptionToken(\n path: string,\n payload: any\n ): Promise<string> {\n return fetch(`${this.kompasAkunHost}/api/subscription/login/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => {\n this.errorFlag = 0\n return data.access_token\n })\n .catch(async error => {\n const errorCode = error.response.status\n if (errorCode === 500 && this.errorFlag < 5) {\n // eslint-disable-next-line no-plusplus\n this.errorFlag++\n setTimeout(async () => {\n await this.getSubscriptionToken(path, payload)\n }, 2000)\n } else {\n this.errorFlag = 0\n throw error\n }\n })\n }\n\n private async createSwG(payload: any, token: string) {\n await fetch(`${this.kompasApiWcmHost}/v2/membership/swg/create`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n Authorization: `Bearer ${token}`,\n },\n })\n .then(response => response.json())\n .catch(error => {\n throw error\n })\n }\n\n private subscribeWithGoogleButton = (): any => {\n // @ts-ignore\n // eslint-disable-next-line no-restricted-globals\n ;(self.SWG = self.SWG || []).push((subscriptions: any) => {\n // set entitlement\n subscriptions.setOnEntitlementsResponse(() => {\n // subscriptions attach button\n subscriptions.attachButton(\n this.buttonElement,\n { theme: 'light', lang: 'en' },\n () => {\n subscriptions.showOffers({ isClosable: true })\n subscriptions.setOnLoginRequest(() => {\n window.location.href = this.redirectToLogin\n })\n subscriptions.setOnPaymentResponse(async (paymentResponse: any) => {\n const response = await paymentResponse\n const raw = JSON.parse(response.purchaseData.raw)\n const { productId, purchaseToken, packageName } = raw\n const { email } = response.userData.data\n\n const payload = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const userToken = await this.getUserToken('google', payload)\n if (userToken) {\n // login and update membership\n const accessToken = await this.getSubscriptionToken('google', {\n token: userToken,\n })\n if (accessToken) {\n const payloadSWG = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWG, accessToken)\n }\n } else {\n // register and login the unknown user\n const payloadRegisterToken = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const token = await this.getRegisterToken(\n 'google',\n payloadRegisterToken\n )\n if (token) {\n const accessToken = await this.getSubscriptionToken(\n 'google',\n { token }\n )\n const payloadSWRUknown = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWRUknown, accessToken)\n }\n }\n response.complete().then(() => {\n window.location.href = this.redirectToLogin\n })\n })\n }\n )\n })\n })\n }\n\n private jsonScript() {\n const jsonData = {\n '@context': 'https://schema.org',\n '@type': ['WebSite', 'WebPage'],\n isAccessibleForFree: false,\n url: this.selfHost + window.location.pathname,\n name: this.swgPublisherName,\n hasPart: {\n '@type': 'WebPageElement',\n },\n isPartOf: {\n '@type': ['CreativeWork', 'Product'],\n name: this.swgPublisherId,\n productID: this.swgProductId,\n },\n }\n const str = JSON.stringify(jsonData)\n const jsonScript = document.createElement('script')\n jsonScript.type = 'application/ld+json'\n jsonScript.text = str\n jsonScript.defer = true\n const jsonHead = document.querySelector('head')\n if (jsonHead) {\n jsonHead.appendChild(jsonScript)\n }\n }\n\n override connectedCallback() {\n // eslint-disable-next-line wc/guard-super-call\n super.connectedCallback()\n if (this.swgEnable) {\n this.jsonScript()\n if (this.buttonElement) {\n const head = document.querySelector('head')\n const script = document.createElement('script')\n script.src = 'https://news.google.com/swg/js/v1/swg.js'\n script.defer = true\n script.onload = this.subscribeWithGoogleButton()\n if (head) {\n head.appendChild(script)\n }\n }\n }\n }\n\n private sendDataLayer(): void {\n window.dataLayer.push({\n event: 'halamanBerlanggananClick',\n subscriptionStatus: '',\n GUID: '',\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronHelpDesk(): void {\n window.dataLayer.push({\n event: 'helpOfferClick',\n userType: this.subscriptionStatus,\n GUID: this.userGuid,\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronButtonBuyPackage(\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n const gtmParams: Record<string, any> = {\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location,\n paywall_subscription_package: name,\n paywall_subscription_id: id,\n paywall_subscription_price: price,\n paywall_position: position,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n }\n\n if (this.type !== 'epaper') {\n gtmParams.content_title = this.tracker_content_title\n gtmParams.content_id = this.tracker_content_id\n gtmParams.content_categories = this.tracker_content_categories\n gtmParams.content_type = this.tracker_content_type\n gtmParams.page_type = this.tracker_page_type\n } else {\n gtmParams.epaper_edition = this.tracker_epaper_edition\n }\n\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayeronPaywallBody = (): void => {\n const gtmParams: Record<string, any> = {\n event: 'paywall_viewed',\n impressions: [\n {\n paywall_location: this.paywall_location || '',\n paywall_subscription_package:\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 12',\n paywall_subscription_id: '9802032',\n paywall_subscription_price: 360000,\n paywall_position: 1,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n },\n {\n paywall_location: this.paywall_location || '',\n paywall_subscription_package:\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 1',\n paywall_subscription_id: '9802035',\n paywall_subscription_price: 50000,\n paywall_position: 2,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain || 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type || 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n },\n ],\n }\n\n if (this.type === 'epaper') {\n gtmParams.impressions[0].epaper_edition = this.tracker_epaper_edition\n gtmParams.impressions[1].epaper_edition = this.tracker_epaper_edition\n } else {\n gtmParams.impressions[0].page_type = this.tracker_page_type\n gtmParams.impressions[0].content_id = this.tracker_content_id\n gtmParams.impressions[0].content_title = this.tracker_content_title\n gtmParams.impressions[0].content_categories =\n this.tracker_content_categories\n gtmParams.impressions[0].content_type = this.tracker_content_type\n\n gtmParams.impressions[1].page_type = this.tracker_page_type\n gtmParams.impressions[1].content_id = this.tracker_content_id\n gtmParams.impressions[1].content_title = this.tracker_content_title\n gtmParams.impressions[1].content_categories =\n this.tracker_content_categories\n gtmParams.impressions[1].content_type = this.tracker_content_type\n }\n\n window.dataLayer.push(gtmParams)\n }\n\n private headerSection(type: 'epaper' | 'reguler') {\n return html`\n <div class=\"flex w-full items-center\">\n ${type === 'epaper'\n ? html`<button\n @click=${() => this.redirectToPrevUrl()}\n class=\"hidden lg:block w-8 h-8 text-blue-600 pl-4\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'arrow-left'))}\n </button>`\n : ''}\n <h4\n class=\"text-base md:text-xl ${this.isDark &&\n 'text-white'} text-center font-bold font-serif tracking-wide md:tracking-normal w-full\"\n >\n Langganan untuk Lanjut Membaca\n </h4>\n </div>\n `\n }\n\n private descriptionSection(data: Array<string>) {\n return html`<div class=\" flex flex-col items-center\">\n <div class=\"flex flex-col space-y-2 mt-2.5 md:mt-3\">\n ${data.map(\n item =>\n html`\n <div class=\"flex items-center\">\n <div class=\"text-green-500\">\n ${unsafeSVG(getFontAwesomeIcon('fas', 'check', 12, 12))}\n </div>\n <h6\n class=\"text-xs md:text-base ${this.isDark &&\n 'text-white'} ml-0.5 md:ml-1\"\n >\n ${item}\n </h6>\n </div>\n `\n )}\n </div>\n </div>`\n }\n\n private informationPackages() {\n return html` <div class=\"mt-4 flex justify-center\">\n <button\n @click=${() => this.redirectToSubscriber()}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Lihat Paket Lainnya\n </button>\n </div>`\n }\n\n private separatorLine() {\n return html`\n <div class=\"flex flex-row w-full justify-center\">\n <div\n class=\"border-b-2 ${this.isDark\n ? 'border-dark-2'\n : 'border-blue-200'} w-1/4 my-4 flex justify-center\"\n ></div>\n <p class=\"px-4 pt-1 ${this.isDark && 'text-dark-1'}\">atau</p>\n <div\n class=\"border-b-2 ${this.isDark\n ? 'border-dark-2'\n : 'border-blue-200'} w-1/4 my-4 flex justify-center\"\n ></div>\n </div>\n `\n }\n\n private paymentDesktopSection(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"hidden md:flex w-full md:max-w-sm items-center justify-center flex-wrap\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"object-cover ${this.isDark ? 'h-9' : 'h-10'}\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n </div>\n `\n }\n\n private paymentMobileSection(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"grid md:hidden items-center grid-flow-col grid-cols-auto grid-rows-1 mt-4 mx-4\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"w-16\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n <button\n @click=${() => this.paymentExtensionHandler()}\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} font-bold\"\n >\n +9 lainnya\n </button>\n </div>\n `\n }\n\n private paymentMobileExtension(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"w-full ${this.isDark\n ? '-bottom-6'\n : 'bottom-0'} max-w-xs mb-1 ml-8 md:hidden absolute px-4\"\n >\n <div\n class=\"w-full ${this.isDark\n ? 'bg-dark-6 border-dark-6'\n : 'bg-white border-white'} rounded p-3 max-w-xs\"\n >\n <svg\n class=\"right-0 ${this.isDark\n ? 'text-dark-6 border-dark-6'\n : 'text-white border-white '} h-4 mr-10 -mt-7 z-0 transform rotate-180 absolute\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 255 255\"\n >\n <polygon class=\"fill-current\" points=\"0,0 127.5,127.5 255,0\" />\n </svg>\n <div\n class=\"grid place-items-center items-center grid-flow-row grid-cols-5 grid-rows-2 gap-y-4\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"object-cover\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n </div>\n </div>\n </div>\n `\n }\n\n private primaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap justify-between items-center ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} rounded md:mx-0 w-full max-w-xs md:max-w-sm md:w-3/5 mt-2.5 md:mt-4 border border-yellow-400 relative\"\n >\n <div class=\"flex flex-col py-3 px-4\">\n <div class=\"flex flex-none items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${this.getRupiahFormat(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark &&\n 'text-white'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n <div class=\"flex items-center\">\n <p class=\"text-xs ${this.isDark && 'text-white'}\">\n hanya <span class=\"text-orange-400\">Rp 30.000</span> / bulan\n </p>\n </div>\n </div>\n <button\n class=\"h-auto ${this.isDark\n ? 'bg-green-300 border border-green-400'\n : 'bg-green-500'} rounded mr-4\"\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 12',\n '9802032',\n 360000,\n 1\n )}\n >\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-black'\n : 'text-white'} font-bold py-2 px-4\"\n >\n Langganan\n </h6>\n </button>\n <div class=\"absolute -top-2 left-4\">\n <div class=\"rounded bg-yellow-300 px-2 py-0.5 text-xs\">\n <b>Harga Terbaik</b>\n </div>\n </div>\n </div>\n `\n }\n\n private secondaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap justify-between ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded md:mx-0 w-full max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n <div class=\"flex items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${this.getRupiahFormat(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark &&\n 'text-white'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n <button\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n 'Cash-B2C-Halaman Berlangganan-Reguler_Digital-KDP 1',\n '9802035',\n 50000,\n 2\n )}\n class=\"h-auto ${!this.isDark &&\n 'bg-white'} border border-green-500 rounded\"\n >\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-green-300'\n : 'text-green-500'} font-bold py-2 px-4\"\n >\n Langganan\n </h6>\n </button>\n </div>\n `\n }\n\n private packagesSection(data: Packages) {\n return html`\n <div class=\"flex flex-col w-full items-center mt-8 lg:mt-2 px-2 \">\n <h6\n class=\"text-sm md:text-base ${this.isDark && 'text-white'} font-bold\"\n >\n ${data.title}\n </h6>\n ${data.memberships.map(item =>\n item.isHighlight\n ? this.primaryPackages(item)\n : this.secondaryPackages(item)\n )}\n </div>\n `\n }\n\n private topNavigator() {\n return html`\n <div class=\"flex lg:hidden items-center w-full pb-4 \">\n <button\n @click=${() => this.redirectToPrevUrl()}\n class=\"text-xs md:text-lg text-white flex flex-row\"\n >\n <div class=\"icon-lg icon-white w-4 h-4 mr-3.5 md:mr-5 pt-0.5\">\n ${unsafeSVG(getFontAwesomeIcon('fas', 'arrow-left'))}\n </div>\n Kembali\n </button>\n </div>\n `\n }\n\n private helpDesk() {\n return html`\n <div class=\"py-2.5 text-white self-center text-xs md:text-sm\">\n Mengalami masalah? Hubungi\n <button\n @click=${() => this.redirectToHelpdesk()}\n class=\"font-bold ${this.isDark && 'text-blue-300'} underline\"\n >\n Layanan Pelanggan.\n </button>\n </div>\n `\n }\n\n private authRegister() {\n return html`\n <div\n class=\"flex flex-row text-white px-2 py-2.5 space-x-4 md:space-x-8 self-center\"\n >\n <div class=\"flex flex-col text-left text-xs md:text-sm text-white\">\n <b>Sudah berlangganan Kompas.id?</b>\n <p>Masuk untuk lanjut membaca.</p>\n </div>\n <button\n @click=${() => this.redirectToRegister()}\n class=\"h-auto ${this.isDark\n ? 'bg-blue-300'\n : 'bg-grey-100'} rounded mr-3\"\n >\n <p\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-black'\n : 'text-blue-600'} font-bold py-2 px-4\"\n >\n Masuk / Daftar\n </p>\n </button>\n </div>\n `\n }\n\n private userAction(isLogin: boolean, type: 'epaper' | 'reguler') {\n return html`\n <div\n class=\"flex h-20 ${this.isDark\n ? 'bg-dark-4'\n : 'bg-blue-600'} w-full justify-evenly rounded-b mt-6 md:mt-8 relative\"\n >\n ${isLogin || type !== 'epaper' ? this.helpDesk() : this.authRegister()}\n </div>\n `\n }\n\n render() {\n return html`\n <div\n class=\"${this.type === 'epaper'\n ? 'bg-transparent wrapper-body'\n : 'wrapper-body'}\"\n >\n <div\n class=\"flex flex-col justify-center items-center w-full max-w-screen-sm px-4 md:px-0 my-5 relative\"\n >\n ${this.type === 'epaper' ? this.topNavigator() : ''}\n <div\n class=\"flex w-full flex-col items-center justify-center ${this\n .isDark\n ? 'bg-dark-3'\n : 'bg-blue-100'} rounded pt-6 md:pt-8 relative\"\n >\n ${this.headerSection(this.type)}\n ${this.descriptionSection(\n this.paywallData?.informations?.description ?? []\n )}\n ${this.packagesSection(\n this.paywallData?.packages ?? ({} as Packages)\n )}\n ${this.informationPackages()}\n ${this.swgEnable ? this.separatorLine() : null}\n ${this.swgEnable\n ? html`<button\n class=\"border-2 bg-grey-100 border-grey-100 rounded-lg px-6 shadow-sm flex flex-row py-2 mt-1 mb-4\"\n ref=${(el: any) => (this.buttonElement = el as HTMLButtonElement)}\n >\n <p>Subscribe with</p>\n <img class=\"pl-2 object-scale-down w-20 pt-0.5\" src=\"https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/paywall-asset/google.png\" alt=\"subscribe with google\"></img>\n </button>`\n : null}\n ${this.paymentDesktopSection(\n this.paywallData?.payment?.desktop ?? []\n )}\n ${this.paymentMobileSection(\n this.paywallData?.payment?.mobile ?? []\n )}\n ${this.userAction(this.isLogin, this.type)}\n ${this.sendDataLayeronPaywallBody()}\n </div>\n ${this.isExtensionsOpened\n ? this.paymentMobileExtension(\n this.paywallData?.payment?.ekstension ?? []\n )\n : ''}\n </div>\n </div>\n `\n }\n}\n"]}
|
package/dist/src/components/kompas-paywall-information-header/KompasPaywallInformationHeader.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KompasPaywallInformationHeader.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall-information-header/KompasPaywallInformationHeader.ts"],"names":[],"mappings":";AAAA,2CAA2C;AAC3C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAGjD,IAAM,8BAA8B,GAApC,MAAM,8BAA+B,SAAQ,UAAU;IAAvD;;QAGuB,SAAI,GAAG,EAAE,CAAA;QACT,UAAK,GAAG,EAAE,CAAA;IAkBxC,CAAC;IAhBC,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,KAAK,KAAK,MAAM,CAAA;IAC9B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;oDAGqC,IAAI,CAAC,KAAK,KAAK,MAAM;YAC/D,YAAY;;YAEV,IAAI,CAAC,IAAI;;;KAGhB,CAAA;IACH,CAAC;;AApBM,qCAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,
|
|
1
|
+
{"version":3,"file":"KompasPaywallInformationHeader.js","sourceRoot":"","sources":["../../../../src/components/kompas-paywall-information-header/KompasPaywallInformationHeader.ts"],"names":[],"mappings":";AAAA,2CAA2C;AAC3C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAGjD,IAAM,8BAA8B,GAApC,MAAM,8BAA+B,SAAQ,UAAU;IAAvD;;QAGuB,SAAI,GAAG,EAAE,CAAA;QACT,UAAK,GAAG,EAAE,CAAA;IAkBxC,CAAC;IAhBC,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,KAAK,KAAK,MAAM,CAAA;IAC9B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;oDAGqC,IAAI,CAAC,KAAK,KAAK,MAAM;YAC/D,YAAY;;YAEV,IAAI,CAAC,IAAI;;;KAGhB,CAAA;IACH,CAAC;;AApBM,qCAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,CAAA;AAEL;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4DAAU;AACT;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DAAW;AAJ3B,8BAA8B;IAD1C,aAAa,CAAC,mCAAmC,CAAC;GACtC,8BAA8B,CAsB1C;SAtBY,8BAA8B","sourcesContent":["/* eslint-disable class-methods-use-this */\nimport { html, css, LitElement } from 'lit'\nimport { property, customElement } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\n\n@customElement('kompas-paywall-information-header')\nexport class KompasPaywallInformationHeader extends LitElement {\n static styles = [css``, TWStyles]\n\n @property({ type: String }) text = ''\n @property({ type: String }) theme = ''\n\n get isDark() {\n return this.theme === 'dark'\n }\n\n render() {\n return html`\n <div class=\"my-4 md:my-8\">\n <h5\n class=\"text-base text-center md:text-xl ${this.theme === 'dark' &&\n 'text-white'} font-bold font-serif\"\n >\n ${this.text}\n </h5>\n </div>\n `\n }\n}\n"]}
|
|
@@ -22,9 +22,7 @@ export declare class KompasPaywallVideo extends LitElement {
|
|
|
22
22
|
* prop metered_wall_type = The type of Metered Wall
|
|
23
23
|
* prop metered_wall_balance = The balance of their metered wall
|
|
24
24
|
*/
|
|
25
|
-
private loginUrl;
|
|
26
25
|
private subscriptionUrl;
|
|
27
|
-
private registerUrl;
|
|
28
26
|
isLogin: boolean;
|
|
29
27
|
paywall_location: string;
|
|
30
28
|
paywall_subscription_package: string;
|
|
@@ -47,7 +45,7 @@ export declare class KompasPaywallVideo extends LitElement {
|
|
|
47
45
|
private sendDataLayeronBerlangganan;
|
|
48
46
|
private sendDataLayeronButtonLogin;
|
|
49
47
|
private sendDataLayeronButtonBerlangganan;
|
|
50
|
-
private
|
|
48
|
+
private redirectToRegister;
|
|
51
49
|
private redirectToBerlangganan;
|
|
52
|
-
render(): import("lit
|
|
50
|
+
render(): import("lit").TemplateResult<1>;
|
|
53
51
|
}
|