Skip to content

Commit b1d41e9

Browse files
filippoweb3filippoweb3
authored
Add Cookies consent (#6768)
* edits * conditional rendering of AI chatbot - based on user choice of accepting reCaptcha cookies * changed script name * edited text - re-added simple analytics js
1 parent acc1a2e commit b1d41e9

3 files changed

Lines changed: 94 additions & 53 deletions

File tree

‎material-overrides/js/cookies-config.js‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
window.addEventListener("load", function () {
2+
window.cookieconsent.initialise({
3+
palette: {
4+
popup: { background: "#000" },
5+
button: { background: "#f1d600" }
6+
},
7+
type: "opt-in",
8+
content: {
9+
message: "We use cookies to enable the AI chatbot on this site. These cookies help protect the chatbot from spam and abuse. By accepting, you can ask questions using the Polkadot AI assistant.",
10+
dismiss: "Accept",
11+
deny: "Decline",
12+
link: "See the Privacy Policy.",
13+
href: "https://docs.polkadot.com/privacy-policy/"
14+
},
15+
onInitialise: function (status) {
16+
if (status === 'allow') {
17+
loadKapaWidget();
18+
} else {
19+
disableKapaWidget();
20+
}
21+
},
22+
onStatusChange: function (status) {
23+
if (status === 'allow') {
24+
loadKapaWidget();
25+
} else {
26+
disableKapaWidget();
27+
}
28+
},
29+
});
30+
31+
function loadKapaWidget() {
32+
if (window.kapaWidgetLoaded) return; // prevent multiple loads
33+
window.kapaWidgetLoaded = true;
34+
35+
const script = document.createElement('script');
36+
script.defer = true;
37+
script.src = 'https://widget.kapa.ai/kapa-widget.bundle.js';
38+
39+
// replicate all your data-* attributes here:
40+
script.setAttribute('data-website-id', 'f4bbad14-cc24-471c-8b7d-3267eafc6dc2');
41+
script.setAttribute('data-project-name', 'Polkadot');
42+
script.setAttribute('data-modal-title', 'Polkadot AI Chatbot');
43+
script.setAttribute('data-project-color', '#1E1E1E');
44+
script.setAttribute('data-button-bg-color', '#1C0533');
45+
script.setAttribute('data-button-text-color', 'white');
46+
script.setAttribute('data-button-height', '80px');
47+
script.setAttribute('data-button-width', '72px');
48+
script.setAttribute('data-font-size-xs', '12px');
49+
script.setAttribute('data-font-size-sm', '14px');
50+
script.setAttribute('data-font-size-md', '16px');
51+
script.setAttribute('data-font-size-lg', '18px');
52+
script.setAttribute('data-font-size-xl', '22px');
53+
script.setAttribute('data-modal-title-font-size', '22px');
54+
script.setAttribute('data-button-text-font-size', '18px');
55+
script.setAttribute('data-query-input-font-size', '16px');
56+
script.setAttribute('data-button-image-height', '24px');
57+
script.setAttribute('data-button-image-width', '24px');
58+
script.setAttribute('data-modal-image-height', '24px');
59+
script.setAttribute('data-modal-image-width', '24px');
60+
script.setAttribute('data-project-logo', 'https://1000logos.net/wp-content/uploads/2022/08/Polkadot-Symbol.png');
61+
script.setAttribute('data-modal-header-bg-color', '#1C0533');
62+
script.setAttribute('data-modal-title-color', 'white');
63+
script.setAttribute('data-modal-disclaimer', `This is an AI chatbot trained to answer questions about Polkadot. As such, the answers it provides might not always be accurate or up-to-date. Please use your best judgement when evaluating its responses. Also, **please refrain from sharing any personal or private information with the bot**. By submitting a query, you agree that you have read and understood [these conditions](https://polkadot.com/legal-disclosures/).
64+
**If you need further assistance, you can reach out to [Polkadot Support](https://support.polkadot.network/support/tickets/new?ticket_form=i_have_a_support_request).**`);
65+
script.setAttribute('data-modal-example-questions', 'Where can I store my DOT?, How can I create a DOT account?, How can I stake my DOT?, How does Polkadot OpenGov work?');
66+
script.setAttribute('data-modal-disclaimer-font-size', '12px');
67+
script.setAttribute('data-search-mode-enabled', 'false');
68+
script.setAttribute('data-search-mode-default', 'false');
69+
script.setAttribute('data-search-result-primary-title-font-size', '16px');
70+
script.setAttribute('data-button-position-top', '120px');
71+
script.setAttribute('data-button-position-right', '0px');
72+
script.setAttribute('data-user-analytics-cookie-enabled', 'false');
73+
74+
document.head.appendChild(script);
75+
}
76+
77+
function disableKapaWidget() {
78+
// Remove the container if it exists
79+
const container = document.getElementById('kapa-widget-container');
80+
if (container) container.remove();
81+
82+
// Also, remove the Kapa script tag if needed
83+
const scripts = document.querySelectorAll('script[src="https://widget.kapa.ai/kapa-widget.bundle.js"]');
84+
scripts.forEach(script => script.remove());
85+
86+
// Reset flag so widget can be reloaded later if needed
87+
window.kapaWidgetLoaded = false;
88+
}
89+
90+
});

‎material-overrides/main.html‎

Lines changed: 0 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -34,58 +34,6 @@
3434
{% endif %}
3535
{% endblock %}
3636

37-
{% block libs %}
38-
{{ super() }}
39-
<link rel="preconnect" href="https://widget.kapa.ai/">
40-
<style data-emotion="mantine" data-s=""></style>
41-
<script defer
42-
src="https://widget.kapa.ai/kapa-widget.bundle.js"
43-
data-website-id="f4bbad14-cc24-471c-8b7d-3267eafc6dc2"
44-
data-project-name="Polkadot"
45-
data-modal-title="Polkadot AI Chatbot"
46-
data-project-color="#1E1E1E"
47-
data-button-bg-color="#1C0533"
48-
data-button-text-color="white"
49-
data-button-height="80px"
50-
data-button-width="72px"
51-
data-font-size-xs="12px"
52-
data-font-size-sm="14px"
53-
data-font-size-md="16px"
54-
data-font-size-lg="18px"
55-
data-font-size-xl="22px"
56-
data-modal-title-font-size="22px"
57-
data-button-text-font-size="18px"
58-
data-query-input-font-size="16px"
59-
data-button-image-height="24px"
60-
data-button-image-width="24px"
61-
data-modal-image-height="24px"
62-
data-modal-image-width="24px"
63-
data-project-logo="https://1000logos.net/wp-content/uploads/2022/08/Polkadot-Symbol.png"
64-
data-modal-header-bg-color="#1C0533"
65-
data-modal-title-color="white"
66-
data-modal-disclaimer="This is an AI chatbot trained to answer questions about Polkadot. As such, the answers it provides might not always be accurate or up-to-date. Please use your best judgement when evaluating its responses. Also, **please refrain from sharing any personal or private information with the bot**. By submitting a query, you agree that you have read and understood [these conditions](https://polkadot.com/legal-disclosures/).
67-
**If you need further assistance, you can reach out to [Polkadot Support](https://support.polkadot.network/support/tickets/new?ticket_form=i_have_a_support_request).**"
68-
data-modal-example-questions="Where can I store my DOT?, How can I create a DOT account?, How can I stake my DOT?, How does Polkadot OpenGov work?"
69-
data-modal-disclaimer-font-size="12px"
70-
data-search-mode-enabled="false"
71-
data-search-mode-default="false"
72-
data-search-result-primary-title-font-size="16px"
73-
data-button-position-top="120px"
74-
data-button-position-right="0px"
75-
></script>
76-
<script defer>
77-
document.addEventListener('DOMContentLoaded', () => {
78-
document.body.addEventListener('click', (event) => {
79-
if (event.target.id === 'kapa-widget-container') {
80-
event.target.addEventListener('keydown', (event) => {
81-
event.stopPropagation();
82-
});
83-
}
84-
});
85-
});
86-
</script>
87-
{% endblock %}
88-
8937
{% block site_nav %}
9038
{#- Navigation (left menu) -#}
9139
{% if nav %}

‎mkdocs.yml‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,16 @@ site_author: Web3 Foundation Technologies
55
copyright: Copyright &copy; 2025 Web3 Foundation
66
extra_javascript:
77
- js/MessageBox.js
8-
- js/simple-analytics.js
98
- js/root-level-sections.js
109
- js/search-bar-results.js
1110
- js/header-scroll.js
1211
- js/homepage-light-mode.js
1312
- js/dynamic-logo.js
13+
- https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js
14+
- js/cookies-config.js
15+
- js/simple-analytics.js
1416
extra_css:
17+
- https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css
1518
- assets/stylesheets/extra.css
1619
- assets/stylesheets/MessageBox.css
1720
- assets/stylesheets/announcement-bar.css

0 commit comments

Comments
 (0)