diff --git a/carrito.php b/carrito.php new file mode 100644 index 0000000..64e0dfb --- /dev/null +++ b/carrito.php @@ -0,0 +1,181 @@ +query($query); + + if ($resultado) { + while ($row = $resultado->fetch_assoc()) { + $row['cantidad'] = $_SESSION['carrito'][$row['id']]; + $row['subtotal'] = $row['precio'] * $row['cantidad']; + $total += $row['subtotal']; + $productos_en_carrito[] = $row; + } + } +} +//$estado_local = 'abierto'; // PARA PRUEBAS SOLAMENTE !!!! +$estado_local = es_horario_comercial($conexion); +?> + + + + + + Tu carrito - La Pecosa + + + + + +
+

Mi carrito

+ + +
+

Tu carrito está vacío.

+
+ Ir a comprar algo rico +
+ + + + + + + + + + + + + = $stock_disponible); + ?> + + + + + + + + + +
ProductoPrecioCantidadSubtotal
+ + + $ +
+ + + + + + + + + + + + + + + +
+
$ + +
+ +
+

Total a pagar:

+

$

+
+ + +
+

Local cerrado temporalmente

+ "; + echo "Horarios de entrega: Lunes a Sábados de 08:30 a 13:30 y de 17:30 a 21:00 hs. · Domingos de 09:00 a 13:00 hs."; + } + ?> +
+ + +
+ ← Seguir comprando + + + Finalizar pedido + + + +
+ +
+ + + \ No newline at end of file diff --git a/diseño.css b/diseño.css new file mode 100644 index 0000000..26c33e3 --- /dev/null +++ b/diseño.css @@ -0,0 +1,735 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +html { scroll-behavior: smooth; } + +body { + font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; + background-color: #fffef8; + color: #333; +} + +/* ══════════════════════════════════════ + NAVBAR +══════════════════════════════════════ */ +.navbar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 14px 5%; + background-color: #e02828; + position: sticky; + top: 0; + z-index: 1000; + box-shadow: 0 2px 12px rgba(0,0,0,0.15); +} + +.info-contacto { + display: flex; + gap: 20px; + font-size: 13px; + color: #fffef8; + font-weight: 600; +} + +.nav-links { + display: flex; + gap: 8px; + list-style: none; + align-items: center; +} + +.nav-links > li > a { + text-decoration: none; + background-color: rgba(255,255,255,0.15); + color: #fff; + padding: 8px 18px; + border-radius: 50px; + font-size: 12px; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.5px; + border: 1px solid rgba(255,255,255,0.25); + transition: all 0.25s ease; +} + +.nav-links > li > a:hover { + background-color: #fff; + color: #e02828; + transform: translateY(-1px); + box-shadow: 0 4px 12px rgba(0,0,0,0.15); +} + +/* Dropdown */ +.dropdown { position: relative; } + +.dropdown-content { + display: none; + position: absolute; + right: 0; + top: calc(100% + 10px); + background: #fff; + min-width: 220px; + box-shadow: 0 15px 40px rgba(0,0,0,0.12); + border-radius: 12px; + z-index: 1000; + border: 1px solid rgba(224,40,40,0.08); + overflow: hidden; +} + +.dropdown-content.show { + display: block; + animation: fadeInDropdown 0.18s ease-out; +} + +@keyframes fadeInDropdown { + from { opacity: 0; transform: translateY(6px); } + to { opacity: 1; transform: translateY(0); } +} + +.dropdown-content a { + display: block !important; + padding: 11px 20px !important; + color: #444 !important; + text-decoration: none !important; + font-size: 13.5px !important; + border-bottom: 1px solid #f5f5f5; + transition: 0.15s; + font-weight: 500; +} + +.dropdown-content a:last-child { border-bottom: none; } + +.dropdown-content a:hover { + background-color: #fff5f5 !important; + color: #e02828 !important; + padding-left: 26px !important; +} + +/* ══════════════════════════════════════ + HERO +══════════════════════════════════════ */ +.hero { + width: 100%; + min-height: 82vh; + background-color: #fffef8; + background-image: url('imagenes/la-pecosa-inicio-opcion7.png'); + background-size: 700px; + background-position: center 55%; + background-repeat: no-repeat; + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding-bottom: 56px; + position: relative; +} + +.hero::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + right: 0; + height: 6px; + background: linear-gradient(90deg, #e02828 0%, #ff6b6b 50%, #e02828 100%); +} + +/* ══════════════════════════════════════ + SLIDER +══════════════════════════════════════ */ +.product-banner-slider { + width: 100%; + height: 300px; + overflow: hidden; + background: #fff; + border-top: 1px solid #f5f5f5; + border-bottom: 1px solid #f5f5f5; + position: relative; +} + +.product-slider-wrapper { + display: flex; + width: max-content; + height: 100%; + animation: scroll-infinito 55s linear infinite; +} + +.product-slide { + width: 380px; + height: 100%; + flex-shrink: 0; +} + +.product-slide img { + width: 100%; + height: 100%; + object-fit: cover; +} + +@keyframes scroll-infinito { + 0% { transform: translateX(0); } + 100% { transform: translateX(-50%); } +} + +.product-banner-slider:hover .product-slider-wrapper { + animation-play-state: paused; +} + +/* ══════════════════════════════════════ + SECCIÓN INFO (NOSOTROS / HORARIOS) +══════════════════════════════════════ */ +.seccion-info { + display: flex; + justify-content: center; + flex-wrap: wrap; + gap: 32px; + padding: 70px 5%; + background-color: #fffef8; +} + +.clean-card { + background: #fff; + border: 1px solid rgba(224, 40, 40, 0.1); + border-radius: 20px; + width: 100%; + max-width: 400px; + padding: 48px 40px; + text-align: center; + box-shadow: 0 4px 24px rgba(0,0,0,0.04); + transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); + position: relative; + overflow: hidden; +} + +.clean-card::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + height: 4px; + background: linear-gradient(90deg, #e02828, #ff8585); + opacity: 0; + transition: opacity 0.3s; +} + +.clean-card:hover { + transform: translateY(-6px); + box-shadow: 0 16px 40px rgba(224, 40, 40, 0.1); + border-color: rgba(224, 40, 40, 0.25); +} + +.clean-card:hover::before { opacity: 1; } + +.clean-card-icon { + width: 72px; + height: 72px; + background: #fff5f5; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + margin: 0 auto 24px; + transition: background 0.3s; +} + +.clean-card:hover .clean-card-icon { background: #fee2e2; } + +.clean-card-icon i { + font-size: 2rem; + color: #e02828; +} + +.clean-card h2 { + color: #1a1a1a; + font-size: 1.4rem; + font-weight: 800; + text-transform: uppercase; + letter-spacing: 2px; + margin-bottom: 18px; + position: relative; +} + +.clean-card h2::after { + content: ''; + display: block; + width: 40px; + height: 3px; + background: #e02828; + margin: 10px auto 0; + border-radius: 2px; + transition: width 0.3s; +} + +.clean-card:hover h2::after { width: 64px; } + +.clean-card-body { + color: #555; + font-size: 1rem; + line-height: 1.8; +} + +.clean-card-body p { margin: 10px 0; } + +.highlight-red { + color: #e02828; + font-weight: 700; +} + +/* ══════════════════════════════════════ + MODALES +══════════════════════════════════════ */ +.modal { + display: none; + position: fixed; + top: 0; left: 0; + width: 100%; height: 100%; + background: rgba(0,0,0,0.55); + backdrop-filter: blur(5px); + justify-content: center; + align-items: center; + z-index: 9999; +} + +.modal-content { + background: #fff; + padding: 40px; + border-radius: 20px; + width: 90%; + max-width: 550px; + text-align: center; + box-shadow: 0 24px 60px rgba(0,0,0,0.2); + position: relative; + animation: modalIn 0.25s ease; +} + +@keyframes modalIn { + from { opacity: 0; transform: scale(0.96) translateY(10px); } + to { opacity: 1; transform: scale(1) translateY(0); } +} + +.modal-content button { + background: #e02828; + color: #fff; + padding: 12px 28px; + border-radius: 50px; + border: none; + font-weight: 700; + text-transform: uppercase; + cursor: pointer; + transition: 0.25s; + margin-top: 16px; +} + +.modal-content button:hover { + background: #c71f1f; + transform: translateY(-1px); +} + +/* ══════════════════════════════════════ + BARRA INFERIOR FIJA +══════════════════════════════════════ */ +.bottom-bar { + position: fixed; + bottom: 0; + width: 100%; + background: #e02828; + color: #fffef8; + padding: 12px 5%; + display: flex; + justify-content: space-between; + align-items: center; + z-index: 1000; + box-shadow: 0 -2px 16px rgba(0,0,0,0.12); +} + +.footer-text { + font-size: 0.85rem; + font-weight: 600; + opacity: 0.9; +} + +.btn-red { + background: rgba(255,255,255,0.15); + color: #fff; + border: 1px solid rgba(255,255,255,0.3); + padding: 9px 20px; + border-radius: 50px; + font-size: 0.875rem; + font-weight: 700; + cursor: pointer; + display: flex; + align-items: center; + gap: 9px; + text-decoration: none; + transition: all 0.25s; +} + +.btn-red:hover { + background: #fff; + color: #e02828; + transform: translateY(-1px); + box-shadow: 0 4px 12px rgba(0,0,0,0.15); +} + +#cart-count { + background: #fff; + color: #e02828; + font-size: 0.72rem; + width: 22px; + height: 22px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + font-weight: 800; + transition: all 0.25s; +} + +.btn-red:hover #cart-count { + background: #e02828; + color: #fff; + outline: 2px solid #fff; +} + +/* ══════════════════════════════════════ + CHATBOT — Botón circular +══════════════════════════════════════ */ +#chat-circle { + position: fixed; + bottom: 76px; + right: 24px; + background: #e02828; + width: 56px; + height: 56px; + border-radius: 50%; + color: #fff; + display: flex; + align-items: center; + justify-content: center; + font-size: 22px; + cursor: pointer; + box-shadow: 0 6px 20px rgba(224,40,40,0.4); + z-index: 999; + transition: transform 0.2s, box-shadow 0.2s; +} + +#chat-circle:hover { + transform: scale(1.08); + box-shadow: 0 8px 24px rgba(224,40,40,0.5); +} + +/* ══════════════════════════════════════ + CHATBOT — Ventana +══════════════════════════════════════ */ +.chat-box { + display: none; + position: fixed; + bottom: 148px; + right: 24px; + width: 310px; + background: #fff; + border-radius: 16px; + box-shadow: 0 8px 32px rgba(0,0,0,0.18); + z-index: 999; + overflow: hidden; + flex-direction: column; + animation: chatIn 0.2s ease; +} + +@keyframes chatIn { + from { opacity: 0; transform: translateY(10px) scale(0.97); } + to { opacity: 1; transform: translateY(0) scale(1); } +} + +.chat-box-header { + background: #e02828; + color: #fff; + padding: 14px 16px; + display: flex; + justify-content: space-between; + align-items: center; + font-weight: 700; + font-size: 0.9rem; +} + +.chat-box-body { + height: 230px; + padding: 12px; + overflow-y: auto; + background: #fafafa; + display: flex; + flex-direction: column; + gap: 6px; +} + +/* Scrollbar del chat */ +.chat-box-body::-webkit-scrollbar { width: 4px; } +.chat-box-body::-webkit-scrollbar-track { background: transparent; } +.chat-box-body::-webkit-scrollbar-thumb { background: #f0c0c0; border-radius: 4px; } + +/* Mensaje del bot */ +.chat-msg { width: 100%; } + +.cm-msg-text { + background: #fff; + padding: 10px 12px; + border-radius: 0 10px 10px 10px; + box-shadow: 0 1px 4px rgba(0,0,0,0.06); + font-size: 13.5px; + border-left: 3px solid #e02828; + line-height: 1.5; + display: inline-block; + max-width: 90%; +} + +/* Mensaje del promo */ +.chat-promo .cm-msg-text { + border-left-color: #e02828; + background: #fff5f5; +} + +/* Mensaje del usuario (derecha) */ +.chat-msg-user { + align-self: flex-end; + background: #e02828; + color: #fff; + padding: 9px 13px; + border-radius: 10px 10px 0 10px; + font-size: 13.5px; + max-width: 80%; + word-break: break-word; + margin-left: auto; +} + +/* Opciones dentro del chat (botones de pago, etc.) */ +.chat-opciones { + display: flex; + flex-direction: column; + gap: 6px; + margin-top: 4px; +} + +/* Links dentro del chat (teléfonos, redes, etc.) */ +.chat-links { + display: flex; + flex-direction: column; + gap: 6px; + margin-top: 4px; +} + +.chat-link-btn { + display: block; + padding: 9px 14px; + background: #e02828; + color: #fff; + border-radius: 8px; + text-decoration: none; + font-size: 13px; + font-weight: 600; + text-align: center; + transition: background 0.2s, transform 0.15s; +} + +.chat-link-btn:hover { + background: #c71f1f; + transform: translateY(-1px); +} + +.chat-link-ig { background: #e1306c; } +.chat-link-ig:hover { background: #c0255a; } + +.chat-link-mail { background: #4285f4; } +.chat-link-mail:hover { background: #2b6fd4; } + +/* ══════════════════════════════════════ + CHATBOT — Input +══════════════════════════════════════ */ +.chat-input-wrapper { + display: flex; + align-items: center; + gap: 6px; + padding: 10px 10px 6px; + background: #fff; + border-top: 1px solid #f0f0f0; +} + +#chat-input-text { + flex: 1; + padding: 8px 12px; + border: 1px solid #e5e7eb; + border-radius: 20px; + font-size: 13px; + outline: none; + background: #fafafa; + color: #333; + transition: border-color 0.2s; +} + +#chat-input-text:focus { + border-color: #e02828; + background: #fff; +} + +.chat-send-btn { + width: 34px; + height: 34px; + background: #e02828; + color: #fff; + border: none; + border-radius: 50%; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + font-size: 13px; + flex-shrink: 0; + transition: background 0.2s, transform 0.15s; +} + +.chat-send-btn:hover { + background: #c71f1f; + transform: scale(1.05); +} + +/* Sugerencias debajo del input */ +.chat-hints { + padding: 0 12px 8px; + font-size: 11px; + color: #aaa; + background: #fff; + text-align: center; + line-height: 1.4; +} + +/* Botones de opción dentro del chat (retiro/envío) */ +.opt-btn { + padding: 8px 10px; + font-size: 12px; + border: 1px solid #e5e7eb; + border-radius: 7px; + background: #fafafa; + cursor: pointer; + font-weight: 600; + color: #374151; + transition: all 0.15s; + display: flex; + align-items: center; + justify-content: center; + gap: 5px; + width: 100%; +} + +.opt-btn:hover { + background: #fee2e2; + border-color: #fca5a5; + color: #e02828; +} + +/* ══════════════════════════════════════ + ALERTA PROMO FLOTANTE +══════════════════════════════════════ */ +#alerta-flotante-promo { + position: fixed; + bottom: 80px; + left: 24px; + background: #fff; + box-shadow: 0 8px 30px rgba(0,0,0,0.15); + border-radius: 14px; + padding: 16px 20px; + max-width: 300px; + z-index: 9999; + display: none; + border-left: 4px solid #e02828; + opacity: 0; + transform: translateX(-16px); + transition: all 0.4s ease; +} + +/* ══════════════════════════════════════ + USUARIO EN NAV +══════════════════════════════════════ */ +.user-name-nav { + display: inline-block; + background: rgba(255,255,255,0.2); + color: #fff; + padding: 8px 18px; + border-radius: 50px; + font-size: 12px; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.5px; + border: 1px solid rgba(255,255,255,0.3); +} + +.user-badge-nav { + display: inline-block; + background: #1a1a1a; + color: #fffef8; + padding: 8px 18px; + border-radius: 50px; + font-size: 12px; + font-weight: 700; +} + +/* ══════════════════════════════════════ + RESPONSIVE +══════════════════════════════════════ */ +@media (max-width: 768px) { + .hero { + background-size: 90%; + min-height: 52vh; + padding-bottom: 30px; + } + + .navbar { + flex-direction: column; + gap: 10px; + padding: 12px 4%; + } + + .nav-links { + gap: 6px; + flex-wrap: wrap; + justify-content: center; + } + + .nav-links > li > a { + padding: 6px 12px; + font-size: 11px; + } + + .bottom-bar { + flex-direction: column; + gap: 8px; + text-align: center; + padding: 10px; + } + + .seccion-info { + padding: 44px 5%; + gap: 22px; + } + + .clean-card { + padding: 36px 26px; + } + + .product-banner-slider { height: 220px; } + .product-slide { width: 280px; } + + .chat-box { + width: calc(100vw - 32px); + right: 16px; + bottom: 130px; + } + + #alerta-flotante-promo { + max-width: calc(100vw - 48px); + left: 16px; + } +} \ No newline at end of file diff --git a/gestionar_carrito.php b/gestionar_carrito.php new file mode 100644 index 0000000..6f2aaee --- /dev/null +++ b/gestionar_carrito.php @@ -0,0 +1,62 @@ + 0) { + $sql_stock = "SELECT stock FROM productos WHERE id = ?"; + $stmt = $conexion->prepare($sql_stock); + $stmt->bind_param("i", $id); + $stmt->execute(); + $resultado = $stmt->get_result(); + + if ($row = $resultado->fetch_assoc()) { + $stock_disponible = (int)$row['stock']; + + + $cantidad_futura = isset($_SESSION['carrito'][$id]) ? $_SESSION['carrito'][$id] + 1 : 1; + + if ($cantidad_futura <= $stock_disponible) { + $_SESSION['carrito'][$id] = $cantidad_futura; + } + } + } + + if ($origen === 'carrito') { + header("Location: carrito.php"); + } else { + header("Location: productos.php?cat=" . urlencode($cat_retorno) . "#prod-" . $id); + } + exit(); + + case 'quitar': + if (isset($_SESSION['carrito'][$id])) { + $_SESSION['carrito'][$id]--; + if ($_SESSION['carrito'][$id] <= 0) { + unset($_SESSION['carrito'][$id]); + } + } + header("Location: carrito.php"); + exit(); + + case 'eliminar': + unset($_SESSION['carrito'][$id]); + header("Location: carrito.php"); + exit(); + + default: + header("Location: productos.php"); + exit(); +} \ No newline at end of file diff --git a/productos.php b/productos.php new file mode 100644 index 0000000..e45ceec --- /dev/null +++ b/productos.php @@ -0,0 +1,659 @@ +real_escape_string($categoria); + $query = "SELECT * FROM productos WHERE categoria = '$cat_segura' AND activo = 1 AND id != 999"; +} + +$resultado = $conexion->query($query); + +$query_promo = "SELECT p.mensaje + FROM promociones p + WHERE p.fecha_publicacion >= NOW() - INTERVAL 1 DAY + ORDER BY p.id DESC LIMIT 1"; +$res_promo = $conexion->query($query_promo); + +$promo_activa = null; +if ($res_promo && $res_promo->num_rows > 0) { + $datos_promo = $res_promo->fetch_assoc(); + + $query_prod_999 = "SELECT precio, imagen, stock FROM productos WHERE id = 999 AND activo = 1"; + $res_999 = $conexion->query($query_prod_999); + + if ($res_999 && $res_999->num_rows > 0) { + $prod_999 = $res_999->fetch_assoc(); + $promo_activa = array( + 'mensaje' => $datos_promo['mensaje'], + 'precio' => $prod_999['precio'], + 'imagen' => $prod_999['imagen'], + 'stock' => $prod_999['stock'] + ); + } +} + +// Contador del pedido (solo lectura de sesión, no modifica la lógica del carrito) +$cant_pedido = 0; +if (!empty($_SESSION['carrito']) && is_array($_SESSION['carrito'])) { + foreach ($_SESSION['carrito'] as $item) { + if (is_array($item) && isset($item['cantidad'])) { + $cant_pedido += (int) $item['cantidad']; + } else { + $cant_pedido += 1; + } + } +} +?> + + + + + + + Productos - La Pecosa + + + + + + + + +
+ +
+

+

+
+ +
+
+
Promo 3
+
Promo 4
+
Promo 5
+
Promo 6
+
Promo 7
+
Promo 8
+
Promo 9
+
Promo 10
+
Promo 11
+
Promo 12
+
Promo 13
+
Promo 14
+
Promo 15
+
Promo 16
+
Promo 17
+
Promo 18
+ +
Promo 3
+
Promo 4
+
Promo 5
+
Promo 6
+
Promo 7
+
Promo 8
+
Promo 9
+
Promo 10
+
Promo 11
+
Promo 12
+
Promo 13
+
Promo 14
+
Promo 15
+
Promo 16
+
Promo 17
+
Promo 18
+
+
+ + +
+ +
+ Imagen de la Promo +
+ +
+
+

Súper Promo de Hoy

+

+ $ +
+ +
+ 0): ?> + + ¡Quedan solo unidades! + + + Añadir Promo al Carrito + + + + +
+
+ +
+ + +
+ num_rows > 0) { + while($row = $resultado->fetch_assoc()) { + ?> +
+ <?php echo htmlspecialchars($row['nombre']); ?> +

+ $ + 0): ?> + + Disponibles: un. + + + + Añadir al carrito + + + + ¡Agotado por hoy! + + + + +
+ No hay productos disponibles por el momento en esta sección.
"; + } + ?> +
+ + + + + + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..f0ae9ca --- /dev/null +++ b/script.js @@ -0,0 +1,328 @@ +document.addEventListener("DOMContentLoaded", () => { + iniciarSlider(); + configurarChatInput(); +}); + +/* ══════════════════════════════ + SLIDER +══════════════════════════════ */ +function iniciarSlider() { + // El slider corre por CSS animation (scroll-infinito), no necesita JS. + // Esta función existe por si se agrega lógica futura. +} + +/* ══════════════════════════════ + MAPA +══════════════════════════════ */ +function toggleMapa() { + const modal = document.getElementById('modal-mapa'); + modal.style.display = (modal.style.display === 'flex') ? 'none' : 'flex'; +} + +/* ══════════════════════════════ + MODALES GENÉRICOS +══════════════════════════════ */ +function cerrarModal(id) { + const el = document.getElementById(id); + if (el) el.style.display = 'none'; +} + +// Cerrar modales al hacer click fuera del contenido +document.addEventListener('click', function(e) { + if (e.target.classList.contains('modal')) { + e.target.style.display = 'none'; + } +}); + +/* ══════════════════════════════ + ALERTA ÉXITO (auto-ocultar) +══════════════════════════════ */ +const alertSuccess = document.getElementById('success-alert'); +if (alertSuccess) { + setTimeout(() => { + alertSuccess.style.transition = "opacity 0.5s ease"; + alertSuccess.style.opacity = "0"; + setTimeout(() => { + alertSuccess.remove(); + const url = new URL(window.location); + url.searchParams.delete('exito'); + window.history.replaceState({}, document.title, url); + }, 500); + }, 4000); +} + +/* ══════════════════════════════ + DROPDOWN CATEGORÍAS +══════════════════════════════ */ +function toggleDropdown(event) { + event.stopPropagation(); + document.getElementById("myDropdown").classList.toggle("show"); +} + +window.onclick = function(event) { + if (!event.target.matches('.dropbtn') && !event.target.matches('.dropbtn *')) { + const dropdown = document.getElementById("myDropdown"); + if (dropdown && dropdown.classList.contains('show')) { + dropdown.classList.remove('show'); + } + } +}; + +/* ══════════════════════════════ + CHATBOT +══════════════════════════════ */ +let intentos = 0; +let ultimaRespuestaFueDesconocida = false; +const MINUTOS_BLOQUEO = 10; + +function configurarChatInput() { + const input = document.getElementById('chat-input-text'); + if (!input) return; + input.addEventListener('keypress', function(e) { + if (e.key === 'Enter') enviarMensaje(); + }); +} + +function enviarMensaje() { + const input = document.getElementById('chat-input-text'); + if (!input) return; + const texto = input.value.trim(); + if (!texto) return; + input.value = ''; + procesarConsulta(texto.toLowerCase()); +} + +function toggleChat() { + const chatBox = document.getElementById('chat-box'); + const logs = document.getElementById('chat-logs'); + if (!chatBox) return; + + const isVisible = window.getComputedStyle(chatBox).display !== 'none'; + + if (!isVisible) { + // Verificar bloqueo + const bloqueadoHasta = localStorage.getItem('chat_bloqueado_hasta'); + if (bloqueadoHasta && Date.now() < parseInt(bloqueadoHasta)) { + const minutosRestantes = Math.ceil((parseInt(bloqueadoHasta) - Date.now()) / 60000); + chatBox.style.display = 'flex'; + logs.innerHTML = ` +
+
El chat estará disponible en ${minutosRestantes} minuto${minutosRestantes !== 1 ? 's' : ''}.
+
+ `; + // Deshabilitar input + const input = document.getElementById('chat-input-text'); + const btn = document.querySelector('.chat-send-btn'); + if (input) input.disabled = true; + if (btn) btn.disabled = true; + return; + } + + // Sin bloqueo: abrir normal + chatBox.style.display = 'flex'; + logs.innerHTML = ` +
+
¡Hola! Soy el asistente de La Pecosa 🍎 ¿En qué puedo ayudarte?
+
+ `; + const input = document.getElementById('chat-input-text'); + const btn = document.querySelector('.chat-send-btn'); + if (input) { input.disabled = false; input.focus(); } + if (btn) btn.disabled = false; + + } else { + intentos = 0; + chatBox.style.display = 'none'; + } +} + +function procesarConsulta(mensaje) { + const logs = document.getElementById('chat-logs'); + + const divUsuario = document.createElement("div"); + divUsuario.className = "chat-msg-user"; + divUsuario.textContent = mensaje; + logs.appendChild(divUsuario); + logs.scrollTop = logs.scrollHeight; + + fetch('consultar_bot.php', { + method: 'POST', + headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, + body: 'mensaje=' + encodeURIComponent(mensaje) + }) + .then(r => r.json()) + .then(data => { + agregarMensaje(data.respuesta); + + if (data.accion === 'abrir_mapa') { + setTimeout(toggleMapa, 800); + } else if (data.accion === 'abrir_horarios') { + setTimeout(() => { + const modal = document.getElementById('modal-horarios-visual'); + if (modal) modal.style.display = 'flex'; + }, 600); + } else if (data.accion === 'abrir_novedades') { + setTimeout(() => { + const modal = document.getElementById('modal-novedades'); + if (modal) modal.style.display = 'flex'; + }, 600); + } else if (data.accion === 'mostrar_telefonos') { + mostrarTelefonos(); + } else if (data.accion === 'mostrar_contacto') { + mostrarContacto(); + } else if (data.accion === 'mostrar_redes') { + mostrarRedes(); + } else if (data.accion === 'mostrar_pagos') { + const divBtns = document.createElement("div"); + divBtns.className = "chat-opciones"; + divBtns.innerHTML = ` + + + `; + logs.appendChild(divBtns); + + } else if (data.accion === 'forzar_cierre') { + intentos++; + if (intentos >= 3) { + agregarMensaje("No puedo seguir ayudándote por este medio. ¡Llamanos o escribinos! 😊"); + // Guardar bloqueo + const hasta = Date.now() + MINUTOS_BLOQUEO * 60 * 1000; + localStorage.setItem('chat_bloqueado_hasta', hasta); + setTimeout(() => { + toggleChat(); + intentos = 0; + }, 3000); + } +} else { + intentos = 0; +} + + logs.scrollTop = logs.scrollHeight; + }) + .catch(err => { + console.error("Error en el chatbot:", err); + agregarMensaje("No pude procesar tu consulta en este momento. ¡Llamanos por teléfono!"); + }); +} + +function procesarPago(tipo) { + if (tipo === 'presencial') { + agregarMensaje("💵 Medios de pago — Retiro presencial:
• Efectivo
• Tarjeta de Débito
• Transferencia (Alias: LA.PECOSA.PARANA)"); + } else { + agregarMensaje("🚚 Medios de pago — Envío a domicilio:
• Solo transferencia al Alias: LA.PECOSA.PARANA"); + } +} + +function mostrarTelefonos() { + //agregarMensaje("📞 Podés llamarnos a:"); + const logs = document.getElementById('chat-logs'); + const div = document.createElement("div"); + div.className = "chat-links"; + div.innerHTML = ` + 0343 423-1400 + 0343 431-2763 + `; + logs.appendChild(div); + logs.scrollTop = logs.scrollHeight; +} + +function mostrarContacto() { + //agregarMensaje("¡Contactanos por donde prefieras!"); + const logs = document.getElementById('chat-logs'); + const div = document.createElement("div"); + div.className = "chat-links"; + div.innerHTML = ` + Instagram + Enviar correo + 0343 423-1400 + `; + logs.appendChild(div); + logs.scrollTop = logs.scrollHeight; +} + +function mostrarRedes() { + //agregarMensaje("📱 ¡Seguinos en nuestras redes!"); + const logs = document.getElementById('chat-logs'); + const div = document.createElement("div"); + div.className = "chat-links"; + div.innerHTML = ` + Instagram + Enviar correo + `; + logs.appendChild(div); + logs.scrollTop = logs.scrollHeight; +} + +function agregarMensaje(texto) { + const logs = document.getElementById('chat-logs'); + const div = document.createElement("div"); + div.className = "chat-msg"; + div.innerHTML = `
${texto}
`; + logs.appendChild(div); + logs.scrollTop = logs.scrollHeight; +} + +function talkToHuman() { + window.open("https://wa.me/543434231400?text=Hola! Necesito ayuda con un pedido", "_blank"); +} + +/* ══════════════════════════════ + PROMO FLOTANTE +══════════════════════════════ */ +let ultimaPromoId = 0; +let esPrimeraCarga = true; + +function observarPromociones() { + fetch('verificar_promo.php') + .then(r => r.json()) + .then(data => { + if (data && data.id) { + if (esPrimeraCarga) { + esPrimeraCarga = false; + ultimaPromoId = data.id; + mostrarPromoEnChatbot(data.mensaje, false); + return; + } + if (data.id > ultimaPromoId) { + ultimaPromoId = data.id; + mostrarPromoEnChatbot(data.mensaje, true); + } + } + }) + .catch(err => console.error('Error al observar promos:', err)); +} + +function mostrarPromoEnChatbot(mensaje, forzarApertura) { + const chatLogs = document.getElementById('chat-logs'); + const cartelFlotante = document.getElementById('alerta-flotante-promo'); + const textoFlotante = document.getElementById('texto-alerta-flotante'); + + if (chatLogs) { + const div = document.createElement("div"); + div.className = "chat-msg chat-promo"; + div.innerHTML = `
📢 ¡MENÚ DEL DÍA!
${mensaje}
`; + chatLogs.appendChild(div); + chatLogs.scrollTop = chatLogs.scrollHeight; + } + + if (cartelFlotante && textoFlotante) { + textoFlotante.innerHTML = mensaje; + cartelFlotante.style.display = 'block'; + setTimeout(() => { + cartelFlotante.style.opacity = '1'; + cartelFlotante.style.transform = 'translateX(0)'; + }, 100); + } +} + +function cerrarAlertaFlotante() { + const cartel = document.getElementById('alerta-flotante-promo'); + if (cartel) { + cartel.style.opacity = '0'; + cartel.style.transform = 'translateX(-20px)'; + setTimeout(() => { cartel.style.display = 'none'; }, 500); + } +} + +observarPromociones(); +setInterval(observarPromociones, 10000); \ No newline at end of file