Skip to content

Commit 5ffbcb9

Browse files
EdsCodesEdsCodes
committed
limpieza de codigo, se borraron y modificaron funciones repetidas, se mejoro nombres de funciones y variables. Otros detalles menores
1 parent 1d10d9e commit 5ffbcb9

File tree

7 files changed

+69
-81
lines changed

7 files changed

+69
-81
lines changed

‎index.html‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -185,7 +185,6 @@ <h2>Síguenos</h2>
185185
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
186186
<!--Link a scripts propios Js-->
187187
<script src="./js/index.js"></script>
188-
<script src="./js/detalleFiltrados.js"></script>
189188
<script src="./js/detalleProducto.js"></script>
190189
<script src="./js/carrito.js"></script>
191190
</body>

‎js/carrito.js‎

Lines changed: 37 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,29 @@
1-
function obtenerprodsPagPpalLS() {
2-
return JSON.parse(localStorage.getItem("prodsPagPpal")) || [];
3-
}
4-
5-
const prodsPagPpal = obtenerprodsPagPpalLS();
6-
71
const saveLsCarrito = (prods) => {
8-
localStorage.setItem("carrito", JSON.stringify(prods));
2+
localStorage.setItem("carritoCompras", JSON.stringify(prods));
93
}
104

115
const GetCarritoLs = () => {
12-
return JSON.parse(localStorage.getItem("carrito")) || [];
13-
}
14-
15-
function getProdId() {
16-
return JSON.parse(localStorage.getItem("idProducto")) || 0;
17-
}
18-
19-
function buscarProdConId() {
20-
const id = getProdId();
21-
const producto = prodsPagPpal.find(item => item.id === id);
22-
return producto;
6+
return JSON.parse(localStorage.getItem("carritoCompras")) || [];
237
}
248

259
const agregarProdCarrito = () => {
26-
const producto = buscarProdConId();
27-
const carrito = GetCarritoLs();
28-
carrito.push(producto);
29-
saveLsCarrito(carrito);
30-
desplegarBotonCarrito();
10+
const producto = FindProductoConId();
11+
if (producto) {
12+
const carritoCompras = GetCarritoLs();
13+
carritoCompras.push(producto);
14+
saveLsCarrito(carritoCompras);
15+
desplegarTotalCarrito();
16+
} else {
17+
console.error('El producto no se encontró en la página principal.');
18+
}
3119
}
3220

3321
const eliminarProductoCarrito = (id) => {
34-
const carrito = GetCarritoLs();
35-
const carritoActual = carrito.filter(item => item.id !== id);
22+
const carritoCompras = GetCarritoLs();
23+
const carritoActual = carritoCompras.filter(item => item.id !== id);
3624
saveLsCarrito(carritoActual);
3725
desplegarGraficosCarrito();
38-
desplegarBotonCarrito();
26+
desplegarTotalCarrito();
3927
Swal.fire({
4028
position:"center",
4129
icon: "error",
@@ -46,12 +34,12 @@ const eliminarProductoCarrito = (id) => {
4634
}
4735

4836
const sumaVrTotalProds = () => {
49-
const carrito = GetCarritoLs();
50-
return carrito.reduce((acumulador, item) => acumulador + item.precio, 0);
37+
const carritoCompras = GetCarritoLs();
38+
return carritoCompras.reduce((acumulador, item) => acumulador + item.precio, 0);
5139
}
5240

5341
async function recargaPagTiempo() {
54-
await new Promise (resolve => setTimeout(resolve, 5000));
42+
await new Promise (resolve => setTimeout(resolve, 3000));
5543
location.reload();
5644
}
5745

@@ -69,15 +57,16 @@ const borrarTodoCarrito = () => {
6957

7058
Swal.fire(swalOptions).then((result) => {
7159
if (result.isConfirmed) {
72-
localStorage.removeItem("carrito");
60+
localStorage.removeItem("carritoCompras");
7361
Swal.fire({
7462
title: "¡Carrito Eliminado!",
7563
text: "Tus productos fueron eliminados correctamente de tu carrito de compras.",
7664
icon: "success"
7765
});
66+
recargaPagTiempo();
7867
} else {
7968
desplegarGraficosCarrito();
80-
desplegarBotonCarrito();
69+
desplegarTotalCarrito();
8170
Swal.fire({
8271
title: "Guardado",
8372
text: "¡Estás a un solo paso de tener tus productos favoritos!",
@@ -86,31 +75,30 @@ const borrarTodoCarrito = () => {
8675
}
8776
});
8877

89-
recargaPagTiempo();
9078
}
9179

92-
const desplegarBotonCarrito = () => {
80+
const desplegarTotalCarrito = () => {
9381
document.getElementById("totalCarrito").innerHTML = QTotalProductos();
9482
}
9583

9684
const QTotalProductos = () => {
97-
const carrito = GetCarritoLs();
98-
return carrito.length === 0 ? null : carrito.length;
85+
const carritoCompras = GetCarritoLs();
86+
return carritoCompras.length === 0 ? null : carritoCompras.length;
9987
}
10088

10189

10290
function desplegarGraficosCarrito() {
103-
const carrito = GetCarritoLs();
104-
let contenido = "";
105-
if (carrito && QTotalProductos() > 0) {
106-
contenido = `
91+
const carritoCompras = GetCarritoLs();
92+
let contenidoHtml = "";
93+
if (carritoCompras && QTotalProductos() > 0) {
94+
contenidoHtml = `
10795
<div class="tituloArticuloVta col-12">
10896
<h1 class="articulo">Tu carrito</h1>
10997
</div>
11098
`;
11199

112-
for (const producto of carrito) {
113-
contenido += `
100+
for (const producto of carritoCompras) {
101+
contenidoHtml += `
114102
<div class="columnaIzqCarrito col-sm-6 col-md-4 col-lg-4" id="ProductosCarrito">
115103
<div class="itemCarrito">
116104
<div class="ImgProducto_carrito">
@@ -128,7 +116,7 @@ function desplegarGraficosCarrito() {
128116
`;
129117
}
130118

131-
contenido += `
119+
contenidoHtml += `
132120
<div class="columnaDerCompras col-sm-6 col-md-8 col-lg-8">
133121
<h2 class="resumen_articulovta">Resumen de tu compra</h2>
134122
<div class="campoCodDescuento">
@@ -163,12 +151,14 @@ function desplegarGraficosCarrito() {
163151
</div>
164152
`;
165153
} else {
166-
contenido = `<h1 class="textoCarritoVacio">Tu carrito de compras se encuentra vacío!</h1>`;
154+
contenidoHtml = `<h1 class="textoCarritoVacio">Tu carrito de compras se encuentra vacío!</h1>`;
167155
}
168156
let contenidoCarrito = document.getElementById("contenidoGralCarrito")
169-
contenidoCarrito? contenidoCarrito.innerHTML = contenido: null;
157+
contenidoCarrito? contenidoCarrito.innerHTML = contenidoHtml: null;
170158
}
171159

160+
//Logica cupones de descuento "ganados" en la pag. InicioSesion:
161+
172162
let codigoDescuentoAplicado = false;
173163

174164
function validarCodigoProm() {
@@ -237,16 +227,16 @@ const finalizarCompra = () => {
237227

238228
Swal.fire(swalOptions).then((result) => {
239229
if (result.isConfirmed) {
240-
localStorage.removeItem("carrito");
230+
localStorage.removeItem("carritoCompras");
241231
Swal.fire({
242232
title: "¡Listo!",
243233
text: "Tu compra será enviada a la dirección registrada.",
244234
icon: "success"
245235
});
246236
}
237+
recargaPagTiempo();
247238
});
248-
recargaPagTiempo();
249239
}
250240

251241
desplegarGraficosCarrito();
252-
desplegarBotonCarrito();
242+
desplegarTotalCarrito();

‎js/detalleFiltrados.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
function obtenerProductosFiltradosLS() {
1+
function obtenerProdsFiltLS() {
22
return JSON.parse(localStorage.getItem("productosFiltrados")) || [];
33
}
44

5-
const mostrarProdsFilt = obtenerProductosFiltradosLS();
5+
const mostrarProdsFilt = obtenerProdsFiltLS();
66

77
function generarHTMLProductoDetalle(producto) {
88
const precioConAumento = Math.round(producto.precio * 1.10);
@@ -18,15 +18,15 @@ function generarHTMLProductoDetalle(producto) {
1818
<p class="textoTachado">$${precioConAumento}</p>
1919
<p class="card-textPrice">$${producto.precio}</p>
2020
</div>
21-
<a href="../pages/detalleProducto.html" class="btn btn-dark" onclick="encontrarIdProd(${producto.id});">Ver detalle</a>
22-
<a class="btn btn-dark" onclick="encontrarIdProd(${producto.id}); agregarProdCarrito();">Añadir al carrito</a>
21+
<a href="../pages/detalleProducto.html" class="btn btn-dark" onclick="SaveIdProd(${producto.id});">Ver detalle</a>
22+
<a class="btn btn-dark" onclick="SaveIdProd(${producto.id}); agregarProdCarrito();">Añadir al carrito</a>
2323
</div>
2424
</div>
2525
`;
2626
}
2727

2828
mostrarProdsFilt.forEach(producto => {
2929
const productoHTML = generarHTMLProductoDetalle(producto);
30-
let contenidoDetallefiltrados = document.getElementById('prodsFiltrados');
31-
contenidoDetallefiltrados ? contenidoDetallefiltrados.innerHTML += productoHTML : null;
30+
let contenidoDetalleFiltrados = document.getElementById('prodsFiltrados');
31+
contenidoDetalleFiltrados ? contenidoDetalleFiltrados.innerHTML += productoHTML : null;
3232
});

‎js/detalleProducto.js‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,30 +2,28 @@ function obtenerprodsPagPpalLS() {
22
return JSON.parse(localStorage.getItem("prodsPagPpal")) || [];
33
}
44

5-
const encontrarIdProd = (id) => {
5+
const SaveIdProd = (id) => {
66
localStorage.setItem("idProducto", JSON.stringify(id));
77
}
88

9-
function obtenerIdProductoLS() {
9+
function getIdProd() {
1010
return JSON.parse(localStorage.getItem("idProducto")) || 0;
1111
}
1212

13-
const verProducto = () => {
14-
const id = obtenerIdProductoLS();
13+
const FindProductoConId = () => {
14+
const id = getIdProd();
1515
const productos = obtenerprodsPagPpalLS();
1616
const producto = productos.find(item => item.id === id);
1717
return producto;
1818
}
1919

2020
function mostrarProducto() {
21-
const producto = verProducto();
22-
let contenido = '';
21+
const producto = FindProductoConId();
22+
let contenidoDetalleProd = '';
2323
let precioConAumento = 0;
2424
if(producto){
2525
precioConAumento = Math.round(producto.precio * 1.10);
26-
}
27-
if (producto) {
28-
contenido = `
26+
contenidoDetalleProd = `
2927
<div class="tituloArticuloVta col-12">
3028
<h1 class="articulo">${producto.textoProducto}</h1>
3129
<p class="ref_articulo">REF: ${producto.ref}</p>
@@ -95,8 +93,8 @@ function mostrarProducto() {
9593
</div>
9694
`;
9795
let vista = document.getElementById('vistaDetalleProd');
98-
vista ? vista.innerHTML = contenido: null;
99-
}
96+
vista ? vista.innerHTML = contenidoDetalleProd: null;
97+
}
10098
}
10199

102-
mostrarProducto();
100+
mostrarProducto();

‎js/index.js‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
document.addEventListener('DOMContentLoaded', async function () {
22

3-
async function consumirApiProductos() {
3+
async function consumirApiProds() {
44
try {
55
const respuesta = await fetch('./js/productos.json');
66
const datos = await respuesta.json();
@@ -10,7 +10,7 @@ document.addEventListener('DOMContentLoaded', async function () {
1010
}
1111
}
1212

13-
async function consumirApiProductosCarrete() {
13+
async function consumirApiProdsCarrete() {
1414
try {
1515
const respuesta = await fetch('./js/productosCarrete.json');
1616
const datos = await respuesta.json();
@@ -20,7 +20,7 @@ document.addEventListener('DOMContentLoaded', async function () {
2020
}
2121
}
2222

23-
const [productos, productosCarrete] = await Promise.all([consumirApiProductos(), consumirApiProductosCarrete()]);
23+
const [productos, productosCarrete] = await Promise.all([consumirApiProds(), consumirApiProdsCarrete()]);
2424

2525
function generarHTMLProducto(producto) {
2626
const precioConAumento = Math.round(producto.precio * 1.10);
@@ -37,8 +37,8 @@ document.addEventListener('DOMContentLoaded', async function () {
3737
<p class="card-text"><small>${producto.color} ${producto.talla}</small></p>
3838
</div>
3939
<div class="botonesAccionCompra">
40-
<a href="./pages/detalleProducto.html" class="btn btn-dark" value="Ver detalle" onclick="encontrarIdProd(${producto.id});">Ver detalle</a>
41-
<button class="btn btn-dark" onclick="encontrarIdProd(${producto.id}); agregarProdCarrito();">Añadir al carrito</button>
40+
<a href="./pages/detalleProducto.html" class="btn btn-dark" value="Ver detalle" onclick="SaveIdProd(${producto.id});">Ver detalle</a>
41+
<button class="btn btn-dark" onclick="SaveIdProd(${producto.id}); agregarProdCarrito();">Añadir al carrito</button>
4242
</div>
4343
</div>
4444
</div>
@@ -60,28 +60,32 @@ document.addEventListener('DOMContentLoaded', async function () {
6060
<p class="textoTachado">$${precioConAumento}</p>
6161
<p class="card-textPrice">$${producto.precio}</p>
6262
</div>
63-
<a href="./pages/detalleProducto.html" class="btn btn-dark" onclick="encontrarIdProd(${producto.id});"> Ver detalle</a>
64-
<button class="btn btn-dark" onclick="encontrarIdProd(${producto.id}); agregarProdCarrito();">Añadir al carrito</button>
63+
<a href="./pages/detalleProducto.html" class="btn btn-dark" onclick="SaveIdProd(${producto.id});"> Ver detalle</a>
64+
<button class="btn btn-dark" onclick="SaveIdProd(${producto.id}); agregarProdCarrito();">Añadir al carrito</button>
6565
</div>
6666
</div>
6767
`;
6868
};
6969

70-
function renderizarProductos(productos, elemento) {
70+
function desplegarProductos(productos, elemento) {
7171
const htmlProductos = productos.map(producto => generarHTMLProducto(producto)).join('');
7272
elemento? elemento.innerHTML = htmlProductos: null;
7373
};
7474

75-
function renderizarProdsCarrete (productos, elemento) {
75+
function desplegarProdsCarrete (productos, elemento) {
7676
const htmlProductos = productos.map(producto => generarHTMLProductosCarrete(producto)).join('');
7777
elemento? elemento.innerHTML = htmlProductos: null;
7878
};
7979

80-
renderizarProductos(productos, document.getElementById('listaProductosPagPpal'));
81-
renderizarProdsCarrete(productosCarrete, document.getElementById('carrete_recomendados'));
80+
desplegarProductos(productos, document.getElementById('listaProductosPagPpal'));
81+
desplegarProdsCarrete(productosCarrete, document.getElementById('carrete_recomendados'));
8282

8383
const prodsPagPpal = productos.concat(productosCarrete);
8484

85+
localStorage.setItem('prodsPagPpal', JSON.stringify(prodsPagPpal));
86+
87+
//Filtros por genero de la pag ppal:
88+
8589
let prodsFiltrados = [];
8690

8791
function filtrarPorGenero(genero) {
@@ -97,8 +101,6 @@ document.addEventListener('DOMContentLoaded', async function () {
97101
guardarProductosFiltradosLS(prodsFiltrados);
98102
}
99103

100-
localStorage.setItem('prodsPagPpal', JSON.stringify(prodsPagPpal));
101-
102104
function abrirPagDetalle () {
103105
window.open('./pages/detalleFiltrados.html')
104106
}

‎pages/carrito.html‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,6 @@ <h2>Síguenos</h2>
118118
</footer>
119119
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
120120
<!--Link a scripts propio Js-->
121-
<script src="../js/index.js"></script>
122121
<script src="../js/detalleFiltrados.js"></script>
123122
<script src="../js/detalleProducto.js"></script>
124123
<script src="../js/carrito.js"></script>

‎pages/detalleFiltrados.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ <h2>Síguenos</h2>
117117
</div>
118118
</footer>
119119
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
120-
<!--Link a script propio Js-->
120+
<!--Link a scripts propios Js-->
121121
<script src="../js/detalleFiltrados.js"></script>
122122
<script src="../js/detalleProducto.js"></script>
123123
<script src="../js/carrito.js"></script>

0 commit comments

Comments
 (0)