Skip to content

Commit 529dab1

Browse files
saleweaversaleweaver
committed
added feedback widget
1 parent 1bdad11 commit 529dab1

File tree

5 files changed

+255
-0
lines changed

5 files changed

+255
-0
lines changed

‎.gitignore

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,3 +138,23 @@ dmypy.json
138138
# Cython debug symbols
139139
cython_debug/
140140

141+
#amplify-do-not-edit-begin
142+
amplify/\#current-cloud-backend
143+
amplify/.config/local-*
144+
amplify/logs
145+
amplify/mock-data
146+
amplify/backend/amplify-meta.json
147+
amplify/backend/.temp
148+
build/
149+
dist/
150+
node_modules/
151+
aws-exports.js
152+
awsconfiguration.json
153+
amplifyconfiguration.json
154+
amplifyconfiguration.dart
155+
amplify-build-config.json
156+
amplify-gradle-config.json
157+
amplifytools.xcconfig
158+
.secret-*
159+
**.sample
160+
#amplify-do-not-edit-end

‎docs/_static/helpful-widget.js

Whitespace-only changes.

‎docs/_templates/footer.html

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
{% extends "!footer.html" %}
2+
3+
{% block extrafooter %}
4+
<style>
5+
.helpful-widget-disabled {
6+
pointer-events: none;
7+
filter: grayscale(70%);
8+
}
9+
</style>
10+
<div id="helpful-widget"
11+
style="margin-top: 3em; display: flex; padding: 5px;border: 1px solid lightgray; justify-content: center; align-items: center; flex-direction: column;">
12+
<span>Was this page helpful?</span>
13+
<div style="display: flex; justify-content: space-around; width: 50%; align-items: center; font-size: 4em; margin-top: 1.5rem;">
14+
<span data-helpful="true" class="helpful-btn fa fa-check-circle-o"
15+
style="color: darkgreen; cursor: pointer;"></span>
16+
<span data-helpful="false" class="helpful-btn fa fa-times-circle-o" style="color: red; cursor: pointer;"></span>
17+
</div>
18+
<div id="helpful-feedback" style="width: 100%; margin-top: 1.5rem; display: none;">
19+
<textarea id="helpful-feedback-textarea" style="width: 100%;" placeholder="What could be better?"></textarea>
20+
<button id="send-feedback-msg"
21+
style="margin-top: .6rem; width: 100%; display: flex; justify-content: center; align-items: center; background: darkgreen; color: white; padding: 7px">
22+
<span class="fa fa-send" style="margin-right: 10px;"></span>Send Feedback
23+
</button>
24+
</div>
25+
26+
</div>
27+
28+
29+
<div style="position: fixed; bottom: 2em; right: 2em; padding: 15px; background: #134113; border-radius: 10px; color: white; display: none;"
30+
id="thank-you">
31+
Thank you for your feedback!
32+
</div>
33+
34+
<script>
35+
const baseUrl = 'https://u7kb21h077.execute-api.eu-central-1.amazonaws.com/staging/helpful/';
36+
let wasClicked = false;
37+
38+
const thankYouToast = document.getElementById('thank-you');
39+
const showThankYou = (hide = false) => {
40+
thankYouToast.style.display = hide ? 'none' : 'block';
41+
setTimeout(() => showThankYou(true), 3000);
42+
}
43+
44+
const disable = () => {
45+
document.getElementById('helpful-widget').classList.add('helpful-widget-disabled');
46+
}
47+
48+
Array.from(document.getElementsByClassName('helpful-btn')).forEach(btn => btn.addEventListener('click', e => {
49+
if (!wasClicked) {
50+
wasClicked = true;
51+
const defaultParams = {page: document.location.href, title: document.title}
52+
const dataHelpful = e.currentTarget.getAttribute('data-helpful');
53+
window.analytics.track('WAS_HELPFUL', {response: dataHelpful, ...defaultParams});
54+
const wasHelpful = dataHelpful === 'true';
55+
fetch(`${baseUrl}${dataHelpful}`).then(e => {
56+
if (wasHelpful) {
57+
disable();
58+
showThankYou();
59+
}
60+
}).catch(() => showThankYou());
61+
if (!wasHelpful) {
62+
const feedbackElement = document.getElementById('helpful-feedback');
63+
feedbackElement.style.display = 'block';
64+
document.getElementById('send-feedback-msg').addEventListener('click', () => {
65+
const feedbackMessage = document.getElementById('helpful-feedback-textarea').value || 'no-text-filter';
66+
window.analytics.track('WAS_HELPFUL', {response: dataHelpful, feedbackMessage, ...defaultParams})
67+
fetch(`${baseUrl}${dataHelpful}`, {
68+
method: 'POST', body: JSON.stringify({feedbackMessage})
69+
}).then(e => {
70+
disable();
71+
showThankYou();
72+
}).catch(() => showThankYou());
73+
feedbackElement.style.display = 'none';
74+
});
75+
}
76+
}
77+
}))
78+
79+
</script>
80+
81+
{% endblock %}

‎docs/_templates/layout.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
{% extends "!layout.html" %}
22

3+
34
{% block footer %}
45
{{ super() }}
6+
7+
58
<!-- Global site tag (gtag.js) - Google Analytics -->
69
<script async src="https://www.googletagmanager.com/gtag/js?id=G-WXLCV6BS2G"></script>
710
<script>

‎r.json

Lines changed: 151 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,151 @@
1+
{
2+
'resource': '/helpful/{washelpful}',
3+
'path': '/helpful/true',
4+
'httpMethod': 'GET',
5+
'headers': {
6+
'Accept': '*/*',
7+
'Accept-Encoding': 'gzip, deflate, br',
8+
'Accept-Language': 'de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7',
9+
'CloudFront-Forwarded-Proto': 'https',
10+
'CloudFront-Is-Desktop-Viewer': 'true',
11+
'CloudFront-Is-Mobile-Viewer': 'false',
12+
'CloudFront-Is-SmartTV-Viewer': 'false',
13+
'CloudFront-Is-Tablet-Viewer': 'false',
14+
'CloudFront-Viewer-Country': 'NL',
15+
'dnt': '1',
16+
'Host': 'u7kb21h077.execute-api.eu-central-1.amazonaws.com',
17+
'origin': 'http://localhost:63343',
18+
'Referer': 'http://localhost:63343/',
19+
'sec-ch-ua': '" Not A;Brand";v="99", "Chromium";v="96", "Google Chrome";v="96"',
20+
'sec-ch-ua-mobile': '?0',
21+
'sec-ch-ua-platform': '"macOS"',
22+
'sec-fetch-dest': 'empty',
23+
'sec-fetch-mode': 'cors',
24+
'sec-fetch-site': 'cross-site',
25+
'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.55 Safari/537.36',
26+
'Via': '2.0 3649c20f8adf8628b43dbef00864e392.cloudfront.net (CloudFront)',
27+
'X-Amz-Cf-Id': 'NtENayXcKl1FfQSdxPdQmx3Ja0Oig59Dtl634Yy3cwPKnniwW-cjdg==',
28+
'X-Amzn-Trace-Id': 'Root=1-61a6746e-2d4b96e65bcb5c535d6996aa',
29+
'X-Forwarded-For': '136.143.43.219, 64.252.178.75',
30+
'X-Forwarded-Port': '443',
31+
'X-Forwarded-Proto': 'https'
32+
},
33+
'multiValueHeaders': {
34+
'Accept': [
35+
'*/*'
36+
],
37+
'Accept-Encoding': [
38+
'gzip, deflate, br'
39+
],
40+
'Accept-Language': [
41+
'de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7'
42+
],
43+
'CloudFront-Forwarded-Proto': [
44+
'https'
45+
],
46+
'CloudFront-Is-Desktop-Viewer': [
47+
'true'
48+
],
49+
'CloudFront-Is-Mobile-Viewer': [
50+
'false'
51+
],
52+
'CloudFront-Is-SmartTV-Viewer': [
53+
'false'
54+
],
55+
'CloudFront-Is-Tablet-Viewer': [
56+
'false'
57+
],
58+
'CloudFront-Viewer-Country': [
59+
'NL'
60+
],
61+
'dnt': [
62+
'1'
63+
],
64+
'Host': [
65+
'u7kb21h077.execute-api.eu-central-1.amazonaws.com'
66+
],
67+
'origin': [
68+
'http://localhost:63343'
69+
],
70+
'Referer': [
71+
'http://localhost:63343/'
72+
],
73+
'sec-ch-ua': [
74+
'" Not A;Brand";v="99", "Chromium";v="96", "Google Chrome";v="96"'
75+
],
76+
'sec-ch-ua-mobile': [
77+
'?0'
78+
],
79+
'sec-ch-ua-platform': [
80+
'"macOS"'
81+
],
82+
'sec-fetch-dest': [
83+
'empty'
84+
],
85+
'sec-fetch-mode': [
86+
'cors'
87+
],
88+
'sec-fetch-site': [
89+
'cross-site'
90+
],
91+
'User-Agent': [
92+
'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.55 Safari/537.36'
93+
],
94+
'Via': [
95+
'2.0 3649c20f8adf8628b43dbef00864e392.cloudfront.net (CloudFront)'
96+
],
97+
'X-Amz-Cf-Id': [
98+
'NtENayXcKl1FfQSdxPdQmx3Ja0Oig59Dtl634Yy3cwPKnniwW-cjdg=='
99+
],
100+
'X-Amzn-Trace-Id': [
101+
'Root=1-61a6746e-2d4b96e65bcb5c535d6996aa'
102+
],
103+
'X-Forwarded-For': [
104+
'136.143.43.219, 64.252.178.75'
105+
],
106+
'X-Forwarded-Port': [
107+
'443'
108+
],
109+
'X-Forwarded-Proto': [
110+
'https'
111+
]
112+
},
113+
'queryStringParameters': None,
114+
'multiValueQueryStringParameters': None,
115+
'pathParameters': {
116+
'washelpful': 'true'
117+
},
118+
'stageVariables': None,
119+
'requestContext': {
120+
'resourceId': 'pi42vc',
121+
'resourcePath': '/helpful/{washelpful}',
122+
'httpMethod': 'GET',
123+
'extendedRequestId': 'JochUEgfliAFeZw=',
124+
'requestTime': '30/Nov/2021:18:58:54 +0000',
125+
'path': '/staging/helpful/true',
126+
'accountId': '315005433390',
127+
'protocol': 'HTTP/1.1',
128+
'stage': 'staging',
129+
'domainPrefix': 'u7kb21h077',
130+
'requestTimeEpoch': 1638298734643,
131+
'requestId': 'a732268c-8ffe-42b6-b8e8-8f32845e2a92',
132+
'identity': {
133+
'cognitoIdentityPoolId': None,
134+
'accountId': None,
135+
'cognitoIdentityId': None,
136+
'caller': None,
137+
'sourceIp': '136.143.43.219',
138+
'principalOrgId': None,
139+
'accessKey': None,
140+
'cognitoAuthenticationType': None,
141+
'cognitoAuthenticationProvider': None,
142+
'userArn': None,
143+
'userAgent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.55 Safari/537.36',
144+
'user': None
145+
},
146+
'domainName': 'u7kb21h077.execute-api.eu-central-1.amazonaws.com',
147+
'apiId': 'u7kb21h077'
148+
},
149+
'body': None,
150+
'isBase64Encoded': False
151+
}

0 commit comments

Comments
 (0)