refactor: replace parseInt with Number.parseInt for consistency and clarity

fix: add hidden input to card data labels for improved accessibility
refactor: add scope attributes to table headers for better semantic structure
This commit is contained in:
2026-05-26 13:31:07 +02:00
parent 33dee87cb2
commit e4f0611ac5
4 changed files with 21 additions and 21 deletions
+3 -3
View File
@@ -86,12 +86,12 @@ document.addEventListener('DOMContentLoaded', function() {
stars.forEach(star => { stars.forEach(star => {
star.addEventListener('click', function() { star.addEventListener('click', function() {
const value = parseInt(this.dataset.value); const value = Number.parseInt(this.dataset.value);
updateStars(value); updateStars(value);
}); });
star.addEventListener('mouseenter', function() { star.addEventListener('mouseenter', function() {
const value = parseInt(this.dataset.value); const value = Number.parseInt(this.dataset.value);
stars.forEach((s, index) => { stars.forEach((s, index) => {
if (index < value) { if (index < value) {
s.classList.remove('text-secondary'); s.classList.remove('text-secondary');
@@ -101,7 +101,7 @@ document.addEventListener('DOMContentLoaded', function() {
}); });
star.addEventListener('mouseleave', function() { star.addEventListener('mouseleave', function() {
updateStars(parseInt(ratingInput.value) || 1); updateStars(Number.parseInt(ratingInput.value) || 1);
}); });
}); });
}); });
+1 -1
View File
@@ -44,7 +44,7 @@
</p> </p>
<div class="mb-3"> <div class="mb-3">
<label id="label-card-data" class="form-label">Datos de la tarjeta</label> <label id="label-card-data" class="form-label">Datos de la tarjeta <input type="hidden"></label>
<div id="card-element" aria-labelledby="label-card-data"></div> <div id="card-element" aria-labelledby="label-card-data"></div>
<div id="card-errors" role="alert"></div> <div id="card-errors" role="alert"></div>
</div> </div>
+2 -2
View File
@@ -106,8 +106,8 @@
<!-- Barra de búsqueda con sugerencias --> <!-- Barra de búsqueda con sugerencias -->
<form class="search-suggestions-container" method="GET" action="{% url 'search' %}" role="search" id="searchForm"> <form class="search-suggestions-container" method="GET" action="{% url 'search' %}" role="search" id="searchForm">
<div class="input-group"> <div class="input-group">
<input class="form-control" type="search" name="q" id="searchInput" placeholder="Buscar productos..." aria-label="Buscar" autocomplete="off" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-controls="searchSuggestions" aria-activedescendant="" aria-haspopup="listbox"> <input class="form-control" type="search" name="q" id="searchInput" placeholder="Buscar productos..." aria-label="Buscar" autocomplete="off" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-controls="searchSuggestions" aria-activedescendant="searchbutton" aria-haspopup="listbox">
<button class="btn btn-outline-primary" type="submit" aria-label="Buscar productos">🔍 Buscar</button> <button class="btn btn-outline-primary" type="submit" id="searchbutton" aria-label="Buscar productos">🔍 Buscar</button>
</div> </div>
<div class="search-suggestions" id="searchSuggestions" role="listbox" aria-label="Sugerencias de búsqueda"></div> <div class="search-suggestions" id="searchSuggestions" role="listbox" aria-label="Sugerencias de búsqueda"></div>
</form> </form>
+15 -15
View File
@@ -84,11 +84,11 @@
<table class="table table-striped align-middle"> <table class="table table-striped align-middle">
<thead> <thead>
<tr> <tr>
<th>Producto</th> <th scope="col">Producto</th>
<th class="text-end">Precio (sin IVA)</th> <th scope="col" class="text-end">Precio (sin IVA)</th>
<th class="text-end">Cantidad</th> <th scope="col" class="text-end">Cantidad</th>
<th class="text-end">Stock actual</th> <th scope="col" class="text-end">Stock actual</th>
<th class="text-end">Subtotal (con IVA)</th> <th scope="col" class="text-end">Subtotal (con IVA)</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@@ -104,16 +104,16 @@
</tbody> </tbody>
<tfoot> <tfoot>
<tr> <tr>
<th colspan="4" class="text-end">Subtotal:</th> <th colspan="4" scope="row" class="text-end">Subtotal:</th>
<th class="text-end">{{ cart.get_total|format_price }}€</th> <td class="text-end">{{ cart.get_total|format_price }}€</th>
</tr> </tr>
<tr> <tr>
<th colspan="4" class="text-end">IVA (21%):</th> <th scope="row" colspan="4" class="text-end">IVA (21%):</th>
<th class="text-end text-success">+{{ cart.get_vat_amount|format_price }}€</th> <td class="text-end text-success">+{{ cart.get_vat_amount|format_price }}€</th>
</tr> </tr>
<tr style="background-color: #f8f9fa;"> <tr style="background-color: #f8f9fa;">
<th colspan="4" class="text-end" style="font-size: 1.1rem;">Total:</th> <th scope="row" colspan="4" class="text-end" style="font-size: 1.1rem;">Total:</th>
<th class="text-end" style="font-size: 1.1rem;">{{ cart.get_total_with_vat|format_price }}€</th> <td class="text-end" style="font-size: 1.1rem;">{{ cart.get_total_with_vat|format_price }}€</th>
</tr> </tr>
</tfoot> </tfoot>
</table> </table>
@@ -125,7 +125,7 @@
<h5 class="card-title mb-3">2) Selecciona tu método de pago</h5> <h5 class="card-title mb-3">2) Selecciona tu método de pago</h5>
<!-- Tabs --> <!-- Tabs -->
<ul class="nav nav-tabs mb-3" id="paymentTabs" role="tablist"> <ul class="nav nav-tabs mb-3" id="paymentTabs">
<li class="nav-item" role="presentation"> <li class="nav-item" role="presentation">
<button class="nav-link active" id="tab-card" data-tab="pane-card" type="button" <button class="nav-link active" id="tab-card" data-tab="pane-card" type="button"
role="tab" aria-selected="true" aria-controls="pane-card" tabindex="0"> role="tab" aria-selected="true" aria-controls="pane-card" tabindex="0">
@@ -142,7 +142,7 @@
<!-- Tarjeta tab --> <!-- Tarjeta tab -->
<div id="pane-card" class="payment-tab-content active" <div id="pane-card" class="payment-tab-content active"
role="tabpanel" aria-labelledby="tab-card" tabindex="0"> role="tabpanel" aria-labelledby="tab-card">
{% if saved_cards %} {% if saved_cards %}
<fieldset class="mb-3"> <fieldset class="mb-3">
<legend class="fw-semibold fs-6 mb-2">Selección de tarjeta</legend> <legend class="fw-semibold fs-6 mb-2">Selección de tarjeta</legend>
@@ -164,7 +164,7 @@
<div id="new-card-section" {% if saved_cards %}style="display:none;"{% endif %}> <div id="new-card-section" {% if saved_cards %}style="display:none;"{% endif %}>
<div class="mb-3"> <div class="mb-3">
<label id="label-card-number" class="form-label">Número de tarjeta</label> <label id="label-card-number" class="form-label">Número de tarjeta <input type="hidden"></label>
<div id="card-element" aria-labelledby="label-card-number"></div> <div id="card-element" aria-labelledby="label-card-number"></div>
<div id="card-errors" role="alert"></div> <div id="card-errors" role="alert"></div>
</div> </div>
@@ -187,7 +187,7 @@
<!-- PayPal tab --> <!-- PayPal tab -->
<div id="pane-paypal" class="payment-tab-content" <div id="pane-paypal" class="payment-tab-content"
role="tabpanel" aria-labelledby="tab-paypal" tabindex="0"> role="tabpanel" aria-labelledby="tab-paypal">
{% if saved_paypal %} {% if saved_paypal %}
<div class="alert alert-light border mb-3"> <div class="alert alert-light border mb-3">
<small class="text-muted">Cuenta PayPal guardada:</small> <small class="text-muted">Cuenta PayPal guardada:</small>