Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/diazdavilajesus16-stack/Sevicheria-Mar-sabroso/llms.txt

Use this file to discover all available pages before exploring further.

The shopping cart in El Sabor Marino is a fully client-side system built with vanilla JavaScript. Items are stored in an in-memory array for the duration of the browser session. There is no server-side persistence, user account requirement, or checkout flow in the current implementation — the cart provides a lightweight “add and review” experience without a payment backend.

Cart data structure

The cart is a module-level JavaScript array:
cart state
let carrito = [];
Each item added to the cart is a plain object with two properties:
cart item shape
{ nombre: "Ceviche Clásico", precio: 25 }

Core functions

agregarCarrito(nombre, precio)

Called by the “Agregar 🛒” button on each menu card. Pushes a new item object into carrito, triggers a toast notification, and calls actualizarCarrito().
agregarCarrito
function agregarCarrito(nombre, precio) {
    carrito.push({ nombre, precio });
    mostrarNotificacion(nombre + " agregado 🛒");
    actualizarCarrito();
}

actualizarCarrito()

Currently logs the carrito array to the browser console. This function serves as the integration point for any future cart UI rendering (e.g., a sidebar panel showing item count and subtotal).
actualizarCarrito
function actualizarCarrito() {
    console.log(carrito);
}

mostrarNotificacion(msg)

Creates a temporary toast notification and appends it to document.body. The .show class is added after 100ms (triggering a CSS transition) and removed after 2,500ms, followed by DOM removal after a 300ms fade-out.
mostrarNotificacion
function mostrarNotificacion(msg) {
    const notif = document.createElement("div");
    notif.className = "toast";
    notif.innerText = msg;
    document.body.appendChild(notif);
    setTimeout(() => notif.classList.add("show"), 100);
    setTimeout(() => {
        notif.classList.remove("show");
        setTimeout(() => notif.remove(), 300);
    }, 2500);
}

toggleCarrito()

Called from the cart icon (🛒) in the navbar. This function is defined but not yet implemented — it is the intended hook for showing or hiding a cart sidebar or modal.
toggleCarrito
function toggleCarrito() {
    // called from navbar cart icon
}

Dish detail modal

A modal is used to display full dish information when a user wants to see more details before adding to cart.
modal functions
function abrirModal(nombre, desc) {
    document.getElementById("modal").style.display = "block";
    document.getElementById("modalTitulo").innerText = nombre;
    document.getElementById("modalDesc").innerText = desc;
}

function cerrarModal() {
    document.getElementById("modal").style.display = "none";
}
The modal reads from DOM elements with IDs modal, modalTitulo, and modalDesc. abrirModal populates those elements with the dish name and description, then makes the modal visible. cerrarModal hides it again.

Current limitations

The cart is entirely client-side. All cart state is lost on page refresh or navigation. There is no:
  • Server-side cart persistence
  • User authentication or session binding
  • Checkout or payment flow
  • Order confirmation or email receipt
The toggleCarrito() function is also currently a no-op — the cart sidebar/panel UI has not been implemented yet.

Planned improvements

Wire up a payment gateway (e.g., Culqi or Stripe) to support card payments directly from the cart. This requires a checkout view on the Django backend and a secure token exchange flow.
Integrate Django’s authentication system so logged-in users can save their cart, view past orders, and reorder with one click.
Build a Django admin or custom staff dashboard to receive and manage incoming orders in real time, with status tracking (received, preparing, ready, delivered).
Implement the toggleCarrito() function to open a slide-in sidebar showing all items in carrito, individual prices, a running total, and a checkout button.

Build docs developers (and LLMs) love