{"id":134,"date":"2025-11-19T08:44:53","date_gmt":"2025-11-19T07:44:53","guid":{"rendered":"https:\/\/www.retrobottegamatera.it\/staging\/?page_id=134"},"modified":"2026-03-16T17:45:04","modified_gmt":"2026-03-16T16:45:04","slug":"prenotazione","status":"publish","type":"page","link":"https:\/\/www.retrobottegamatera.it\/?page_id=134","title":{"rendered":"prenotazione"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"134\" class=\"elementor elementor-134\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f44eaae e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-parent\" data-id=\"f44eaae\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-4d72605 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-child\" data-id=\"4d72605\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5d76cad elementor-widget elementor-widget-image\" data-id=\"5d76cad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"268\" height=\"265\" src=\"https:\/\/www.retrobottegamatera.it\/wp-content\/uploads\/2025\/11\/Risorsa-4@2x.png\" class=\"attachment-large size-large wp-image-31\" alt=\"\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-aec7026 elementor-widget elementor-widget-heading\" data-id=\"aec7026\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/www.retrobottegamatera.it\">Indietro<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e5d48b2 elementor-widget elementor-widget-heading\" data-id=\"e5d48b2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Prenotazione<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9708b83 elementor-widget elementor-widget-html\" data-id=\"9708b83\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\/* Stile del form *\/\n#prenotazioneWhatsApp {\n    max-width: 400px;\n    margin: 20px auto;\n    padding: 25px;\n    background: #fff;\n    border-radius: 12px;\n    box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n    font-family: Arial, sans-serif;\n}\n\n#prenotazioneWhatsApp label {\n    font-weight: bold;\n    display: block;\n    margin-bottom: 5px;\n}\n\n#prenotazioneWhatsApp input,\n#prenotazioneWhatsApp select,\n#prenotazioneWhatsApp textarea {\n    width: 100%;\n    padding: 10px;\n    margin-bottom: 15px;\n    border: 1px solid #ccc;\n    border-radius: 6px;\n    transition: border-color 0.3s;\n    font-size: 14px;\n}\n\n#prenotazioneWhatsApp input:focus,\n#prenotazioneWhatsApp select:focus,\n#prenotazioneWhatsApp textarea:focus {\n    border-color: #007bff;\n    outline: none;\n}\n\n#messaggio {\n    font-weight: bold;\n    transition: all 0.3s ease;\n}\n\n#prenotazioneWhatsApp button {\n    background-color: #25D366;\n    color: white;\n    border: none;\n    padding: 12px;\n    width: 100%;\n    font-size: 16px;\n    font-weight: bold;\n    border-radius: 8px;\n    cursor: pointer;\n    transition: background 0.3s;\n}\n\n#prenotazioneWhatsApp button:hover {\n    background-color: #1ebe5d;\n}\n\n.disabled {\n    opacity: 0.6;\n    pointer-events: none;\n}\n<\/style>\n\n<form id=\"prenotazioneWhatsApp\">\n  <label>Nome e Cognome<\/label>\n  <input type=\"text\" id=\"nome\" name=\"nome\" placeholder=\"Mario Rossi\" required>\n\n  <label>Data<\/label>\n  <input type=\"date\" id=\"data\" name=\"data\" required>\n\n  <div id=\"messaggio\" style=\"color:red;\"><\/div>\n\n  <label>Seleziona turno<\/label>\n  <select id=\"turno\" name=\"turno\" required>\n    <option value=\"\">-- Seleziona --<\/option>\n  <\/select>\n\n  <label>Seleziona orario<\/label>\n  <select id=\"orario\" name=\"orario\" disabled required>\n    <option value=\"\">-- Seleziona --<\/option>\n  <\/select>\n\n  <label>Numero di ospiti<\/label>\n  <input type=\"number\" id=\"ospiti\" name=\"ospiti\" min=\"1\" placeholder=\"1\" required>\n\n  <label>Note aggiuntive<\/label>\n  <textarea id=\"note\" name=\"note\" rows=\"3\" placeholder=\"Allergie, richieste particolari...\"><\/textarea>\n\n  <button type=\"submit\">Invia su WhatsApp<\/button>\n<\/form>\n\n<script>\n\/\/ Funzione per generare orari ogni mezz'ora\nfunction generaOrari(start, end) {\n    const orari = [];\n    let [h, m] = start.split(\":\").map(Number);\n    const [endH, endM] = end.split(\":\").map(Number);\n    while (h < endH || (h === endH && m <= endM)) {\n        const hh = h.toString().padStart(2, \"0\");\n        const mm = m.toString().padStart(2, \"0\");\n        orari.push(`${hh}:${mm}`);\n        m += 30;\n        if (m >= 60) { m -= 60; h += 1; }\n    }\n    return orari;\n}\n\nconst turno = document.getElementById(\"turno\");\nconst orario = document.getElementById(\"orario\");\nconst messaggio = document.getElementById(\"messaggio\");\nlet giornoTipo = \"normale\";\n\n\/\/ Aggiorna menu turno e messaggio in base alla data\ndocument.getElementById(\"data\").addEventListener(\"change\", function() {\n    const dataVal = this.value;\n    if (!dataVal) return;\n\n    const dataSelezionata = new Date(dataVal + 'T00:00');\n    const giorno = dataSelezionata.getDay(); \/\/ 0=Dom,1=Lun,2=Mar...,6=Sab\n\n    \/\/ Reset menu turno e orario\n    turno.replaceChildren();\n    const defaultTurno = document.createElement(\"option\");\n    defaultTurno.value = \"\";\n    defaultTurno.textContent = \"-- Seleziona --\";\n    turno.appendChild(defaultTurno);\n\n    orario.replaceChildren();\n    const defaultOrario = document.createElement(\"option\");\n    defaultOrario.value = \"\";\n    defaultOrario.textContent = \"-- Seleziona --\";\n    orario.appendChild(defaultOrario);\n    orario.disabled = true;\n    messaggio.textContent = \"\";\n\n    if (giorno === 2) { \/\/ Marted\u00ec chiuso\n        messaggio.textContent = \"Siamo chiusi il marted\u00ec.\";\n        turno.disabled = true;\n        turno.classList.add(\"disabled\");\n        giornoTipo = \"chiuso\";\n    } else if (giorno === 6 || giorno === 0) { \/\/ Weekend\n        turno.disabled = false;\n        turno.classList.remove(\"disabled\");\n        [\"Pranzo\",\"Cena\"].forEach(t => {\n            const opt = document.createElement(\"option\");\n            opt.value = t; opt.textContent = t;\n            turno.appendChild(opt);\n        });\n        giornoTipo = \"weekend\";\n    } else { \/\/ Giorni normali\n        turno.disabled = false;\n        turno.classList.remove(\"disabled\");\n        const opt = document.createElement(\"option\");\n        opt.value = \"Cena\"; opt.textContent = \"Cena\";\n        turno.appendChild(opt);\n        giornoTipo = \"normale\";\n    }\n});\n\n\/\/ Aggiorna menu orari in base al turno selezionato\nturno.addEventListener(\"change\", function() {\n    orario.replaceChildren();\n    const defaultOrario = document.createElement(\"option\");\n    defaultOrario.value = \"\";\n    defaultOrario.textContent = \"-- Seleziona --\";\n    orario.appendChild(defaultOrario);\n    orario.disabled = true;\n\n    if (this.value === \"Pranzo\") {\n        const orariPranzo = generaOrari(\"11:30\", \"14:30\");\n        orariPranzo.forEach(o => {\n            const opt = document.createElement(\"option\");\n            opt.value = o; opt.textContent = o;\n            orario.appendChild(opt);\n        });\n        orario.disabled = false;\n    } else if (this.value === \"Cena\") {\n        let start, end;\n        if (giornoTipo === \"weekend\") { start = \"18:30\"; end = \"22:00\"; }\n        else { start = \"17:00\"; end = \"22:30\"; }\n        const orariCena = generaOrari(start, end);\n        orariCena.forEach(o => {\n            const opt = document.createElement(\"option\");\n            opt.value = o; opt.textContent = o;\n            orario.appendChild(opt);\n        });\n        orario.disabled = false;\n    }\n});\n\n\/\/ Invia WhatsApp (compatibile iPhone)\ndocument.getElementById(\"prenotazioneWhatsApp\").addEventListener(\"submit\", function(e) {\n    e.preventDefault();\n\n    const nome = document.getElementById(\"nome\").value;\n    const data = document.getElementById(\"data\").value;\n    const turnoSelezionato = document.getElementById(\"turno\").value;\n    const orarioSelezionato = document.getElementById(\"orario\").value;\n    const ospiti = document.getElementById(\"ospiti\").value;\n    const note = document.getElementById(\"note\").value;\n\n    if (!nome || !data || !turnoSelezionato || !orarioSelezionato || !ospiti) {\n        alert(\"Compila tutti i campi richiesti!\");\n        return;\n    }\n\n    const numeroWhatsApp = \"393783092480\";\n    let messaggioWhats = `Prenotazione:\\nNome: ${nome}\\nData: ${data}\\nTurno: ${turnoSelezionato}\\nOrario: ${orarioSelezionato}\\nOspiti: ${ospiti}\\n`;\n    if (note) messaggioWhats += `Note: ${note}\\n`;\n\n    \/\/ Usato window.location.href per compatibilit\u00e0 iPhone\/Safari\n    const link = `https:\/\/wa.me\/${numeroWhatsApp}?text=${encodeURIComponent(messaggioWhats)}`;\n    window.location.href = link;\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Indietro Prenotazione Nome e Cognome Data Seleziona turno &#8212; Seleziona &#8212; Seleziona orario &#8212; Seleziona &#8212; Numero di ospiti Note aggiuntive Invia su WhatsApp<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-134","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=\/wp\/v2\/pages\/134","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=134"}],"version-history":[{"count":130,"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=\/wp\/v2\/pages\/134\/revisions"}],"predecessor-version":[{"id":586,"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=\/wp\/v2\/pages\/134\/revisions\/586"}],"wp:attachment":[{"href":"https:\/\/www.retrobottegamatera.it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}