website/layouts/partials/feedback.html

47 lines
2.0 KiB
HTML

{{ if not .Params.hide_feedback }}
<h2>Feedback</h2>
<p class="feedback--prompt">Was this page helpful?</p>
<button class="button feedback--yes">Yes</button>
<button class="button feedback--no">No</button>
<p class="feedback--response feedback--response__hidden">
Thanks for the feedback. If you have a specific, answerable question about how to use Kubernetes,
ask it on <a target="_blank" rel="noopener"
href="https://stackoverflow.com/questions/tagged/kubernetes">Stack Overflow</a>. Open
an issue in the GitHub repo if you want to <a class="feedback--link" target="_blank" rel="noopener"
href="https://github.com/kubernetes/website/issues/new?title=Issue%20with%20k8s.io">report a problem</a> or
<a class="feedback--link" target="_blank" rel="noopener"
href="https://github.com/kubernetes/website/issues/new?title=Improvement%20for%20k8s.io">suggest an improvement</a>.
</p>
<script>
const yes = document.querySelector('.feedback--yes');
const no = document.querySelector('.feedback--no');
document.querySelectorAll('.feedback--link').forEach(link => {
link.href = link.href + window.location.pathname;
});
const sendFeedback = (value) => {
if (!gtag) { console.log('!gtag'); }
gtag('event', 'click', {
'event_category': 'Helpful',
'event_label': window.location.pathname,
value
});
};
const disableButtons = () => {
yes.disabled = true;
yes.classList.add('feedback--button__disabled');
no.disabled = true;
no.classList.add('feedback--button__disabled');
};
yes.addEventListener('click', () => {
sendFeedback(1);
disableButtons();
document.querySelector('.feedback--response').classList.remove('feedback--response__hidden');
});
no.addEventListener('click', () => {
sendFeedback(0);
disableButtons();
document.querySelector('.feedback--response').classList.remove('feedback--response__hidden');
});
</script>
{{ end }}