@financial-times/o-cookie-message/demos/src/demo.js

The cookie message and behaviour approved by the FT's legal team. All FT websites must have a cookie message. Using o-cookie-message will ensure your site is compliant according to EU regulatory law.

import '../../main.js';

document.cookie = 'FTCookieConsentGDPR=; Max-Age=-9999999999; Domain=.ft.com; Path=/;';

function initDemos() {
	document.addEventListener('DOMContentLoaded', () => {
		document.dispatchEvent(new CustomEvent('o.DOMContentLoaded'));
	});
}

initDemos();

setTimeout(hideCookieMessage, 500);

function hideCookieMessage() {
	const cookieMessage = document.querySelector('.o-cookie-message');
	const action = cookieMessage.querySelector('.o-cookie-message__action');
	action.addEventListener('click', () => {
		cookieMessage.innerHTML =`<div class="o-cookie-message__container">
				<p class="o-cookie-message__description">
					<strong>Hello!</strong> normally, clicking that button will hide the cookie message for 6 months. But that would mean you wouldn't be able to see this demo anymore, which might be quite annoying. You can refresh the page to get the proper cookie message back.
				</p>
			</div>`;
	});
}

document.body.addEventListener('oCookieMessage.view', () => {
	// eslint-disable-next-line no-console
	console.log('THE 🍪 MESSAGE HAS BEEN VIEWED');
});

document.body.addEventListener('oCookieMessage.act', () => {
	// eslint-disable-next-line no-console
	console.log('THE 🍪 MESSAGE HAS BEEN ACTED UPON');
});

document.body.addEventListener('oCookieMessage.close', () => {
	// eslint-disable-next-line no-console
	console.log('THE 🍪 MESSAGE HAS BEEN CLOSED');
});