Yarninator/toddler_shop_frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Placed umami tracking in JS

Browse source
This commit is contained in:
Yarne Coppens 2024-10-04 09:29:12 +02:00
parent d7976fa4b6
commit bca3c65ead
4 changed files with 17 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
static/scripts/main.js
View file

@ -103,6 +103,7 @@ async function loadProducts() {
}
function removeProduct(element_to_remove){
umami.track('Remove Product');
const product_row = document.getElementById('product_row')
const products = product_row.children
@ -143,15 +144,18 @@ function removeProduct(element_to_remove){
}
function payCash() {
umami.track('Pay Cash button');
const total_cost = document.getElementById('totalprice').innerHTML.replace('€ ','')
window.location.href = "/pay_cash/" + total_cost
}
function payCard() {
umami.track('Pay Card button');
const total_cost = document.getElementById('totalprice').innerHTML.replace('€ ','')
window.location.href = "/pay_card/" + total_cost
}
function toMain() {
umami.track('To Main button');
window.location.href = "/";
}

14
templates/index.jinja
View file

@ -25,7 +25,7 @@
<div class="row" style="margin-bottom: 5rem;" id="product_row">
<div class="col product_col">
<div class="card h-100">
<input type="image" onclick="removeProduct(this)" data-umami-event="remove_product_1" class="card-img-top product_image" alt="">
<input type="image" onclick="removeProduct(this)" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
@ -33,7 +33,7 @@
</div>
<div class="col product_col">
<div class="card h-100">
<input type="image" onclick="removeProduct(this)" data-umami-event="remove_product_2" class="card-img-top product_image" alt="">
<input type="image" onclick="removeProduct(this)" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
@ -41,7 +41,7 @@
</div>
<div class="col product_col">
<div class="card h-100">
<input type="image" onclick="removeProduct(this)" data-umami-event="remove_product_3" class="card-img-top product_image" alt="">
<input type="image" onclick="removeProduct(this)" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
@ -49,7 +49,7 @@
</div>
<div class="col product_col">
<div class="card h-100">
<input type="image" onclick="removeProduct(this)" data-umami-event="remove_product_4" class="card-img-top product_image" alt="">
<input type="image" onclick="removeProduct(this)" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
@ -57,7 +57,7 @@
</div>
<div class="col product_col">
<div class="card h-100">
<input type="image" onclick="removeProduct(this)" data-umami-event="remove_product_5" class="card-img-top product_image" alt="">
<input type="image" onclick="removeProduct(this)" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
@ -81,12 +81,12 @@
</div>
<div class="col-2">
<div class="card">
<input type="image" data-umami-event="pay_cash_button" onclick="payCash()" src="{{api_url}}/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="" />
<input type="image" onclick="payCash()" src="{{api_url}}/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="" />
</div>
</div>
<div class="col-2">
<div class="card">
<input type="image" data-umami-event="pay_card_button" onclick="payCard()" src="{{api_url}}/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="" />
<input type="image" onclick="payCard()" src="{{api_url}}/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="" />
</div>
</div>
</div>

6
templates/paycard.jinja
View file

@ -17,7 +17,7 @@
<div class="row m-5">
<div class="col-2">
<div class="card">
<input type="image" onclick="payCash()" data-umami-event="pay_cash_button" src="{{api_url}}/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="">
<input type="image" onclick="payCash()" src="{{api_url}}/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="">
</div>
</div>
<div class="col-8">
@ -36,7 +36,7 @@
</div>
<div class="col-2">
<div class="card">
<input type="image" onclick="payCard()" data-umami-event="pay_card_button" src="{{api_url}}/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="">
<input type="image" onclick="payCard()" src="{{api_url}}/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="">
</div>
</div>
</div>
@ -51,7 +51,7 @@
<div class="row justify-content-end m-5">
<div class="col-2">
<div class="card">
<input type="image" onclick="toMain()" data-umami-event="back_to_main_button" src="{{api_url}}/icons/shop" height="100rem" width="100rem" class="card-img-top" alt="" />
<input type="image" onclick="toMain()" src="{{api_url}}/icons/shop" height="100rem" width="100rem" class="card-img-top" alt="" />
</div>
</div>
</div>

6
templates/paycash.jinja
View file

@ -17,7 +17,7 @@
<div class="row m-5">
<div class="col-2">
<div class="card">
<input type="image" onclick="payCash()" data-umami-event="pay_cash_button" src="{{api_url}}/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="">
<input type="image" onclick="payCash()" src="{{api_url}}/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="">
</div>
</div>
<div class="col-8">
@ -36,7 +36,7 @@
</div>
<div class="col-2">
<div class="card">
<input type="image" onclick="payCard()" data-umami-event="pay_card_button" src="{{api_url}}/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="">
<input type="image" onclick="payCard()" src="{{api_url}}/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="">
</div>
</div>
</div>
@ -47,7 +47,7 @@
<div class="row justify-content-end m-5">
<div class="col-2">
<div class="card">
<input type="image" onclick="toMain()" data-umami-event="back_to_main_button" src="{{api_url}}/icons/shop" height="100rem" width="100rem" class="card-img-top" alt="" />
<input type="image" onclick="toMain()" src="{{api_url}}/icons/shop" height="100rem" width="100rem" class="card-img-top" alt="" />
</div>
</div>
</div>