Show sourcecode
The following files exists in this folder. Click to view.
public_html/smartkortet/assets/js/
app.js
90 lines ASCII Windows (CRLF)
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
(() => {
const amountInput = document.querySelector('#amount-input');
const chips = document.querySelectorAll('.chip[data-amount]');
chips.forEach((chip) => {
chip.addEventListener('click', () => {
if (!amountInput) {
return;
}
const value = chip.getAttribute('data-amount') || '0';
amountInput.value = value;
});
});
const chartData = window.MatkortetCharts;
if (typeof Chart === 'undefined' || !chartData) {
return;
}
const createChart = (canvasId, config) => {
const canvas = document.getElementById(canvasId);
if (!canvas) {
return;
}
new Chart(canvas, config);
};
createChart('line-chart', {
type: 'line',
data: {
labels: chartData.line?.labels || [],
datasets: [{
label: 'kr per dag',
data: chartData.line?.values || [],
borderColor: '#0f766e',
backgroundColor: 'rgba(15, 118, 110, 0.15)',
borderWidth: 3,
tension: 0.32,
fill: true,
}],
},
options: {
responsive: true,
maintainAspectRatio: false,
layout: {
padding: 8,
},
plugins: {
legend: {
display: false,
},
},
scales: {
y: {
beginAtZero: true,
},
},
},
});
const palette = ['#0f766e', '#14b8a6', '#0ea5e9', '#f59e0b', '#ef4444', '#6366f1', '#84cc16'];
createChart('pie-chart', {
type: 'pie',
data: {
labels: chartData.pie?.labels || [],
datasets: [{
data: chartData.pie?.values || [],
backgroundColor: palette,
borderWidth: 0,
}],
},
options: {
responsive: true,
maintainAspectRatio: true,
aspectRatio: 1,
plugins: {
legend: {
position: 'bottom',
labels: {
boxWidth: 12,
boxHeight: 12,
padding: 14,
},
},
},
},
});
})();