digitalmarketplace-frontend
Version:
Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects
118 lines (115 loc) • 4.52 kB
JavaScript
import { getCookiePreferences, setCookiePreferences } from './manage.mjs';
class CookieSettings {
static moduleName = 'dm-cookie-settings';
$moudle;
$radioButtonAnalyticsYes;
$radioButtonAnalyticsNo;
$confirmationMessage;
$previousPageLink;
$errorSummary;
$formGroup;
$warningMessage;
$cookieBanner;
constructor($module) {
this.$moudle = $module;
this.$radioButtonAnalyticsYes = this.$moudle.find('input[name=cookies-analytics][value=On]');
this.$radioButtonAnalyticsNo = this.$moudle.find('input[name=cookies-analytics][value=Off]');
this.$confirmationMessage = $('#dm-cookie-settings-confirmation');
this.$previousPageLink = $('.dm-cookie-settings__prev-page');
this.$errorSummary = $('#dm-cookie-settings-error');
this.$formGroup = this.$moudle.find('.govuk-form-group');
this.$warningMessage = $('#dm-cookie-settings-warning');
this.$cookieBanner = $('.dm-cookie-banner');
}
init() {
this.$moudle.on('submit', (event) => {
this.submitSettingsForm(event);
});
// Ensure there aren't two forms for setting cookie preferences on the same page
this.hideCookieBanner();
this.setInitialFormValues();
}
setInitialFormValues() {
const currentCookiePreferences = getCookiePreferences();
if (!currentCookiePreferences.settings_viewed)
return;
this.hideWarningMessage();
// Populate the form with the existing choice
let $radioButton;
if (currentCookiePreferences.usage) {
$radioButton = this.$radioButtonAnalyticsYes;
}
else {
$radioButton = this.$radioButtonAnalyticsNo;
}
$radioButton.prop('checked', true);
}
submitSettingsForm(event) {
event.preventDefault();
let usage;
for (const formDataItem of this.$moudle.serializeArray()) {
if (formDataItem.name === 'cookies-analytics') {
usage = formDataItem.value === 'On';
break;
}
}
// the cookie choice must be set when form is submitted
if (usage === undefined) {
this.showError();
return;
}
// Set the analytics cookie preferences
// If 'Off' option not checked, this function will also delete any existing Google Analytics cookies
setCookiePreferences(usage);
this.hideWarningMessage();
this.hideError();
this.showConfirmationMessage();
}
showConfirmationMessage() {
const referrer = CookieSettings.getReferrerLink();
document.body.scrollTop = document.documentElement.scrollTop = 0;
if (referrer && referrer !== document.location.pathname) {
this.$previousPageLink.attr('href', referrer);
this.$previousPageLink.css('display', 'block');
}
else {
this.$previousPageLink.css('display', 'none');
}
this.$confirmationMessage.css('display', 'block');
}
showError() {
if (this.$errorSummary.length) {
this.$errorSummary.css('display', 'block');
document.body.scrollTop = document.documentElement.scrollTop = 0;
}
this.showErrorMessage();
}
showErrorMessage() {
this.$formGroup.addClass('govuk-form-group--error');
const $errorMessageSpan = $(document.createElement('p'));
$errorMessageSpan.attr('id', 'dm-cookie-settings-error-message');
$errorMessageSpan.addClass('govuk-error-message');
$errorMessageSpan.html('<span class="govuk-visually-hidden">Error:</span> Select yes to accept analytics cookies');
$errorMessageSpan.insertBefore('#cookie-settings-1, .govuk-radios--inline');
}
hideError() {
this.$errorSummary.css('display', 'none');
this.hideErrorMessage();
}
hideErrorMessage() {
const $errorMessage = this.$moudle.find('#dm-cookie-settings-error-message');
$errorMessage.css('display', 'none');
this.$formGroup.removeClass('govuk-form-group--error');
}
hideWarningMessage() {
this.$warningMessage.css('display', 'none');
}
hideCookieBanner() {
this.$cookieBanner.css('display', 'none');
}
static getReferrerLink() {
return document.referrer ? new URL(document.referrer).pathname : false;
}
}
export { CookieSettings };
//# sourceMappingURL=settings.mjs.map