Greg/WeightTracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement core UI and utility modules with form handling and data validation and add data security against XSS.

Browse Source
This commit is contained in:
Greg 2025-05-29 17:14:44 +02:00
parent 88c4f70aa4
commit 1c79adb906
2 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
js/ui.js
View File

@ -303,7 +303,7 @@ const UI = (() => {
row.innerHTML = ` row.innerHTML = `
<td>${Utils.formatDate(entry.date)}</td> <td>${Utils.formatDate(entry.date)}</td>
<td>${entry.weight} kg</td> <td>${entry.weight} kg</td>
<td>${entry.notes}</td> <td>${Utils.sanitizeHTML(entry.notes)}</td>
<td> <td>
<button class="btn text-btn delete-weight" data-id="${entry.id}">Delete</button> <button class="btn text-btn delete-weight" data-id="${entry.id}">Delete</button>
</td> </td>
@ -350,10 +350,10 @@ const UI = (() => {
const row = document.createElement('tr'); const row = document.createElement('tr');
row.innerHTML = ` row.innerHTML = `
<td>${Utils.formatDate(entry.date)}</td> <td>${Utils.formatDate(entry.date)}</td>
<td>${Utils.truncateText(entry.breakfast, 30)}</td> <td>${Utils.sanitizeHTML(Utils.truncateText(entry.breakfast, 30))}</td>
<td>${Utils.truncateText(entry.lunch, 30)}</td> <td>${Utils.sanitizeHTML(Utils.truncateText(entry.lunch, 30))}</td>
<td>${Utils.truncateText(entry.dinner, 30)}</td> <td>${Utils.sanitizeHTML(Utils.truncateText(entry.dinner, 30))}</td>
<td>${Utils.truncateText(entry.otherMeals, 30)}</td> <td>${Utils.sanitizeHTML(Utils.truncateText(entry.otherMeals, 30))}</td>
<td> <td>
<button class="btn text-btn edit-meal" data-id="${entry.id}">Edit</button> <button class="btn text-btn edit-meal" data-id="${entry.id}">Edit</button>
<button class="btn text-btn delete-meal" data-id="${entry.id}">Delete</button> <button class="btn text-btn delete-meal" data-id="${entry.id}">Delete</button>

22
js/utils.js
View File

@ -155,6 +155,25 @@ const Utils = (() => {
} }
}; };
/**
* Sanitize HTML to prevent XSS attacks.
* Replaces special characters with their HTML entities.
* @param {string} text - The text to sanitize.
* @returns {string} - The sanitized text.
*/
const sanitizeHTML = (text) => {
if (typeof text !== 'string') return '';
return text.replace(/[&<>"']/g, function (match) {
return {
'&': '&amp;',
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
"'": '&#39;'
}[match];
});
};
// Return public API // Return public API
return { return {
formatDate, formatDate,
@ -163,6 +182,7 @@ const Utils = (() => {
showNotification, showNotification,
validateWeightEntry, validateWeightEntry,
calculateWeightStats, calculateWeightStats,
copyToClipboard copyToClipboard,
sanitizeHTML
}; };
})(); })();