Source code
Revision control
Copy as Markdown
Other Tools
/* 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
import { MozLitElement } from "chrome://global/content/lit-utils.mjs";
import { html, classMap } from "chrome://global/content/vendor/lit.all.mjs";
/**
* Custom element that implements a button for site settings in the panel.
*/
export default class IPPSiteSettingsControl extends MozLitElement {
CLICK_EVENT = "ipprotection-site-settings-control:click";
static properties = {
site: { type: String },
exceptionEnabled: { type: Boolean },
};
constructor() {
super();
this.site = null;
this.exceptionEnabled = false;
}
get iconsrc() {
if (!this.exceptionEnabled) {
return "chrome://global/skin/icons/close-fill.svg";
}
return "chrome://global/skin/icons/check-filled.svg";
}
get descriptionL10n() {
if (!this.exceptionEnabled) {
return "ipprotection-site-settings-button-vpn-off";
}
return "ipprotection-site-settings-button-vpn-on";
}
handleClickSettings(event) {
event.preventDefault();
this.dispatchEvent(
new CustomEvent(this.CLICK_EVENT, {
bubbles: true,
composed: true,
})
);
}
render() {
if (!this.site) {
return null;
}
let icon = this.iconsrc;
let descriptionL10n = this.descriptionL10n;
let l10nArgs = JSON.stringify({ sitename: this.site });
return html`
<link
rel="stylesheet"
href="chrome://browser/content/ipprotection/ipprotection-site-settings-control.css"
/>
<moz-box-group>
<moz-box-item
slot="header"
id="site-settings-label"
class="site-settings"
data-l10n-id="ipprotection-site-settings-control"
></moz-box-item>
<moz-box-button
@click=${this.handleClickSettings}
class=${classMap({
"site-settings": true,
"exception-enabled": this.exceptionEnabled,
})}
data-l10n-id=${descriptionL10n}
data-l10n-args=${l10nArgs}
iconsrc=${icon}
></moz-box-button>
</moz-box-group>
`;
}
}
customElements.define(
"ipprotection-site-settings-control",
IPPSiteSettingsControl
);