Index.js

Variables y Selección de Elementos del DOM:

Estas líneas declaran variables y seleccionan elementos específicos del DOM.

• let celulares, marcas, ...: Declaraciones de variables que se usarán para almacenar datos o referencias a elementos del DOM.
• document.getElementById("..."): Selecciona elementos específicos del DOM utilizando sus identificadores.

Función getData:

Es una función asíncrona que obtiene datos de un archivo JSON y clasifica los celulares según su categoría.

• async function getData() {...}: Esta función busca datos en Daba.json y, a continuación, clasifica los celulares por marca y categoría (por ejemplo, Samsung, Xiaomi, iPhone, etc.) y los almacena en arrays específicos.

Evento de Clic para Navegación:

Establece un evento de clic en los elementos de navegación para cambiar el contenido mostrado.

• var buttonNav = document.getElementsByClassName("nav-item"): Selecciona todos los botones de navegación.
• function imprimir(id) {...}: Esta función toma un ID y muestra el contenido correspondiente, ya sea una lista de productos, ofertas, novedades, un formulario de contacto, etc.

Función display:

Esta función crea y muestra las tarjetas de productos en la página.

• function display(tarjeta) {...}: Genera el HTML para mostrar las tarjetas de productos basadas en el argumento tarjeta.

Función detalle:

Muestra detalles adicionales de un producto cuando se hace clic en él.

• function detalle(id) {...}: Toma un ID de producto y muestra sus detalles.

Función rutasPaginas:

Esta función verifica la URL para determinar qué contenido mostrar.

• function rutasPaginas() {...}: Basado en una consulta de URL, decide qué contenido mostrar al usuario.

Función actionForm:

Se activa cuando se envía el formulario, pero simplemente previene la acción predeterminada y recoge los datos del formulario.

• function actionForm(event) {...}: Recoge datos del formulario.

Filtros de Búsqueda:

Estas funciones y eventos gestionan el filtrado de productos según los criterios de búsqueda del usuario.

• inputSearch.addEventListener("keyup", ...): Filtra los productos según la entrada del usuario.
• function eventsCategories(array) {...}: Filtra productos según su categoría.
• function checkboxListener() {...}: Establece un listener en las casillas de verificación de categoría para filtrar productos.
• function filtrosCombinados() {...}: Combina filtros de búsqueda y categoría para mostrar productos.

Funcionalidad del Carrito:

Estas funciones y eventos gestionan la adición de productos al carrito, la visualización del carrito y la actualización de los totales.

• contenedorCard.addEventListener("click", e => {...}): Añade productos al carrito cuando se hace clic en ellos.
• function carrito() {...}: Muestra el contenido del carrito.
• function sumarCantidad(index) {...}, function restarCantidad(index) {...} y function eliminarProducto(index) {...}: Actualizan la cantidad de productos en el carrito.
• function sumarTotal() {...}: Calcula y muestra el total a pagar.

Esta explicación proporciona una visión general del código. Si necesitas detalles adicionales o tienes preguntas específicas sobre alguna parte, no dudes en preguntar.