diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /browser/components/protections/content/vpn-card.mjs | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/components/protections/content/vpn-card.mjs')
-rw-r--r-- | browser/components/protections/content/vpn-card.mjs | 103 |
1 files changed, 103 insertions, 0 deletions
diff --git a/browser/components/protections/content/vpn-card.mjs b/browser/components/protections/content/vpn-card.mjs new file mode 100644 index 0000000000..dd2039db2e --- /dev/null +++ b/browser/components/protections/content/vpn-card.mjs @@ -0,0 +1,103 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +/* eslint-env mozilla/remote-page */ + +export default class VPNCard { + constructor(doc) { + this.doc = doc; + } + + init() { + const vpnLink = this.doc.getElementById("get-vpn-link"); + const vpnBannerLink = this.doc.getElementById("vpn-banner-link"); + vpnLink.href = RPMGetStringPref( + "browser.contentblocking.report.vpn.url", + "" + ); + vpnBannerLink.href = RPMGetStringPref( + "browser.contentblocking.report.vpn-promo.url", + "" + ); + + vpnLink.addEventListener("click", () => { + this.doc.sendTelemetryEvent("click", "vpn_card_link"); + }); + let androidVPNAppLink = document.getElementById( + "vpn-google-playstore-link" + ); + androidVPNAppLink.href = RPMGetStringPref( + "browser.contentblocking.report.vpn-android.url" + ); + androidVPNAppLink.addEventListener("click", () => { + document.sendTelemetryEvent("click", "vpn_app_link_android"); + }); + let iosVPNAppLink = document.getElementById("vpn-app-store-link"); + iosVPNAppLink.href = RPMGetStringPref( + "browser.contentblocking.report.vpn-ios.url" + ); + iosVPNAppLink.addEventListener("click", () => { + document.sendTelemetryEvent("click", "vpn_app_link_ios"); + }); + + const vpnBanner = this.doc.querySelector(".vpn-banner"); + const exitIcon = vpnBanner.querySelector(".exit-icon"); + vpnBannerLink.addEventListener("click", () => { + this.doc.sendTelemetryEvent("click", "vpn_banner_link"); + }); + // User has closed the vpn banner, hide it. + exitIcon.addEventListener("click", () => { + vpnBanner.classList.add("hidden"); + this.doc.sendTelemetryEvent("click", "vpn_banner_close"); + }); + + this.showVPNCard(); + } + + // Show the VPN card if user is located in areas, and on platforms, it serves + async showVPNCard() { + const showVPNBanner = this.showVPNBanner.bind(this); + RPMSendQuery("FetchShowVPNCard", {}).then(shouldShow => { + if (!shouldShow) { + return; + } + const vpnCard = this.doc.querySelector(".vpn-card"); + + // add 'subscribed' class if user is subscribed to vpn + RPMSendQuery("FetchVPNSubStatus", {}).then(async hasVPN => { + if (hasVPN) { + vpnCard.classList.add("subscribed"); + document.l10n.setAttributes( + vpnCard.querySelector(".card-title"), + "vpn-title-subscribed" + ); + + // hide the promo banner if the user is already subscribed to vpn + await RPMSetPref( + "browser.contentblocking.report.hide_vpn_banner", + true + ); + } + + vpnCard.classList.remove("hidden"); + showVPNBanner(); + }); + }); + } + + showVPNBanner() { + if ( + RPMGetBoolPref("browser.contentblocking.report.hide_vpn_banner", false) || + !RPMGetBoolPref("browser.vpn_promo.enabled", false) + ) { + return; + } + + const vpnBanner = this.doc.querySelector(".vpn-banner"); + vpnBanner.classList.remove("hidden"); + this.doc.sendTelemetryEvent("show", "vpn_banner"); + // VPN banner only shows on the first visit, flip a pref so it does not show again. + RPMSetPref("browser.contentblocking.report.hide_vpn_banner", true); + } +} |