Jaisalmer Guide Booking \u2014 Full Verified Flow<\/title>\n\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/qrious\/4.0.2\/qrious.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf-autotable\/3.8.3\/jspdf.plugin.autotable.min.js\"><\/script>\n\n<style>\n :root{\n --brand1:#6a11cb; --brand2:#2575fc; --accent:#ff9933;\n --ink:#0b2545; --muted:#5b6b82; --bg:#f6f9ff; --card:#ffffff;\n --success:#0bbd7e; --danger:#e53935;\n }\n *{box-sizing:border-box}\n body{font-family:Arial, Helvetica, sans-serif;background:var(--bg);color:var(--ink);margin:0;padding:16px}\n .wrap{max-width:980px;margin:0 auto}\n h1{margin:0 0 10px;font-size:20px}\n .ribbon{display:flex;border-radius:10px;overflow:hidden;margin-bottom:12px}\n .ribbon div{height:6px;flex:1}\n .c1{background:var(--accent)} .c2{background:#fff} .c3{background:#138808}\n\n .card{background:var(--card);padding:14px;border-radius:12px;box-shadow:0 8px 22px rgba(10,20,40,.06);margin-bottom:14px}\n label{display:block;font-weight:700;margin-top:10px}\n input[type=\"text\"], input[type=\"email\"], input[type=\"tel\"], input[type=\"date\"], select {\n width:100%;padding:10px;margin-top:6px;border-radius:10px;border:1px solid #d7e0f2;font-size:14px;background:#fff\n }\n input[type=\"file\"]{margin-top:6px}\n .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}\n .note{background:#fff8e6;border-left:4px solid #f0a500;padding:10px;border-radius:8px;color:#6b4a00;margin-top:10px}\n .btn{display:inline-block;padding:10px 14px;border-radius:12px;border:none;background:linear-gradient(90deg,var(--brand1),var(--brand2));color:#fff;font-weight:800;cursor:pointer;margin-top:12px}\n .btn.alt{background:linear-gradient(90deg,#ff9933,#ff5e5e)}\n .btn.small{padding:8px 10px;font-size:13px;border-radius:10px}\n .muted{color:var(--muted);font-size:13px}\n .center{text-align:center}\n .flex{display:flex;gap:10px;align-items:center}\n .thumb{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid #e6eefc;background:#fafcff}\n .hidden{display:none}\n .progress{display:flex;gap:6px;margin-bottom:10px}\n .step{flex:1;padding:6px;border-radius:8px;background:#eef5ff;color:var(--muted);text-align:center;font-weight:700;font-size:13px}\n .step.active{background:linear-gradient(90deg,var(--brand1),var(--brand2));color:#fff}\n @media(max-width:760px){\n .row{grid-template-columns:1fr}\n .thumb{width:72px;height:72px}\n }\n .help-container{position:fixed;bottom:100px;left:16px;z-index:9999}\n .hidden-button{background:#ff9800;color:#fff;padding:8px 12px;border-radius:24px 24px 0 24px;border:none;cursor:pointer;font-weight:700;box-shadow:0 6px 22px rgba(0,0,0,.18)}\n .note-small{font-size:13px;color:#444;margin-top:8px}\n<\/style>\n<\/head>\n<body>\n<div class=\"wrap\">\n\n <div class=\"ribbon\"><div class=\"c1\"><\/div><div class=\"c2\"><\/div><div class=\"c3\"><\/div><\/div>\n <h1>Jaisalmer Guide Booking \u2014 Full Verified Flow<\/h1>\n <p class=\"muted\">Step-by-step: Details \u2192 Verification \u2192 Payment \u2192 Confirm & PDF<\/p>\n\n <div class=\"progress\">\n <div id=\"s1\" class=\"step active\">1 \u2014 Details<\/div>\n <div id=\"s2\" class=\"step\">2 \u2014 Verification<\/div>\n <div id=\"s3\" class=\"step\">3 \u2014 Payment<\/div>\n <div id=\"s4\" class=\"step\">4 \u2014 Confirm & PDF<\/div>\n <\/div>\n\n <form id=\"form1\" class=\"card\" autocomplete=\"off\">\n <label>Your Full Name<\/label>\n <input id=\"t_name\" type=\"text\" placeholder=\"Tourist full name\" required>\n\n <div class=\"row\">\n <div>\n <label>Email<\/label>\n <input id=\"t_email\" type=\"email\" placeholder=\"email@example.com\" required>\n <\/div>\n <div>\n <label>Phone<\/label>\n <input id=\"t_phone\" type=\"tel\" placeholder=\"+91xxxxxxxxxx or +44...\" required>\n <\/div>\n <\/div>\n\n <div class=\"row\">\n <div>\n <label>Guide Name<\/label>\n <input id=\"g_name\" type=\"text\" value=\"Ajay Bissa\" readonly>\n <\/div>\n <div>\n <label>Guide ID<\/label>\n <input id=\"g_uid\" type=\"text\" value=\"LN-2007\/097\" readonly>\n <\/div>\n <\/div>\n\n <label>Select Language (fee\/day)<\/label>\n <select id=\"bk_lang\" required>\n <option value=\"\">— Choose —<\/option>\n <option value=\"English|2000\">English (\u20b92000\/day)<\/option>\n <option value=\"Hindi|1500\">Hindi (\u20b91500\/day)<\/option>\n <option value=\"French|3000\">French (\u20b93000\/day)<\/option>\n <option value=\"Spanish|2800\">Spanish (\u20b92800\/day)<\/option>\n <\/select>\n\n <div class=\"row\">\n <div>\n <label>Tour Start Date<\/label>\n <input id=\"bk_start\" type=\"date\" required>\n <\/div>\n <div>\n <label>Tour End Date<\/label>\n <input id=\"bk_end\" type=\"date\" required>\n <\/div>\n <\/div>\n\n <div class=\"note\">System computes inclusive days and total. Click NEXT to proceed to verification (ID\/photo upload).<\/div>\n\n <div style=\"display:flex;justify-content:flex-end;gap:10px;margin-top:12px\">\n <button type=\"button\" id=\"nextToVerify\" class=\"btn\">Next \u2014 Verify<\/button>\n <\/div>\n <\/form>\n\n <div id=\"verifyCard\" class=\"card hidden\">\n <label>ID Type<\/label>\n <select id=\"t_idtype\">\n <option value=\"\">— Select ID Type —<\/option>\n <option value=\"Aadhaar\">Aadhaar Card<\/option>\n <option value=\"Driving\">Driving Licence<\/option>\n <option value=\"Passport\">Passport<\/option>\n <option value=\"Foreign\">Foreign ID<\/option>\n <\/select>\n \n <label>ID Number<\/label>\n <input id=\"t_idnum\" type=\"text\" placeholder=\"Enter ID number\">\n\n <div class=\"row\" style=\"margin-top:10px\">\n <div>\n <label>Upload Self Photo (Selfie)<\/label>\n <input id=\"selfPhoto\" type=\"file\" accept=\"image\/*\">\n <div style=\"margin-top:8px\"><img id=\"selfPreview\" class=\"thumb hidden\" alt=\"self preview\"><\/div>\n <\/div>\n <div>\n <label>Upload ID Front Photo<\/label>\n <input id=\"idFrontPhoto\" type=\"file\" accept=\"image\/*\">\n <div style=\"margin-top:8px\"><img id=\"idPreview\" class=\"thumb hidden\" alt=\"id preview\"><\/div>\n <\/div>\n <\/div>\n\n <div style=\"display:flex;justify-content:space-between;gap:8px;margin-top:12px\">\n <button id=\"backToStep1\" class=\"btn small\">Back<\/button>\n <button id=\"confirmBtn\" class=\"btn small\">Confirm & Proceed to Payment<\/button>\n <\/div>\n <\/div>\n\n <div id=\"paymentCard\" class=\"card hidden\">\n <h3 class=\"center\">Payment<\/h3>\n <div style=\"display:flex;gap:12px;flex-wrap:wrap;align-items:center\">\n <canvas id=\"qrCanvas\" width=\"200\" height=\"200\" aria-label=\"Payment QR\"><\/canvas>\n <div style=\"flex:1\">\n <p id=\"amountText\" style=\"font-weight:800;font-size:16px\"><\/p>\n <small class=\"muted\">Payee: <b id=\"payeeName\"><\/b> \u2022 UPI: <b id=\"upiIdLabel\"><\/b><\/small>\n <div style=\"margin-top:8px\"><a id=\"payNow\" class=\"btn small\" href=\"#\" target=\"_blank\">Pay Now (Open UPI App)<\/a><\/div>\n <\/div>\n <\/div>\n\n <label style=\"margin-top:12px\">Enter Transaction \/ UTR ID (after payment)<\/label>\n <input id=\"txnId\" type=\"text\" placeholder=\"Txn \/ UTR ID\">\n\n <div style=\"display:flex;justify-content:space-between;gap:8px;margin-top:12px\">\n <button id=\"backToVerify\" class=\"btn small\">Back<\/button>\n <button id=\"confirmTxnBtn\" class=\"btn alt\">Confirm Payment & Finalize<\/button>\n <\/div>\n <\/div>\n\n <div id=\"finalCard\" class=\"card hidden\">\n <h3 class=\"center\">Booking Confirmed \u2014 eTicket Ready<\/h3>\n <p class=\"muted center\">Download colorful PDF (or B\/W for print). WhatsApp button opens chat with full booking text. To send PDF itself, attach downloaded PDF in WhatsApp chat.<\/p>\n\n <div style=\"display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:12px\">\n <button id=\"downloadColor\" class=\"btn\">Download Color PDF<\/button>\n <button id=\"downloadBW\" class=\"btn small\">Download B\/W PDF<\/button>\n <button id=\"whatsappShare\" class=\"btn\" style=\"background:linear-gradient(90deg,#25D366,#128C7E)\">Send Full Details on WhatsApp<\/button>\n <\/div>\n\n <div style=\"margin-top:12px\">\n <h4>Booking Summary (final)<\/h4>\n <div id=\"finalSummary\" class=\"card\" style=\"padding:12px\"><\/div>\n <\/div>\n\n <div class=\"note\" style=\"margin-top:12px\">\n <b>Note:<\/b> PDF downloads are available above. WhatsApp button sends full booking text including ID, DOB and Txn. To attach PDF file to WhatsApp, open the chat manually and add the downloaded PDF.\n <\/div>\n <\/div>\n\n<\/div>\n\n<div class=\"help-container\"><button class=\"hidden-button\" onclick=\"alert('Contact button \u2014 configure contact details in code')\">\ud83d\udcf2 Contact<\/button><\/div>\n\n<script>\n\/* CONFIG *\/\nconst GUIDE_UPI_ID = \"ajaybissa@upi\";\nconst PAYEE_NAME = \"Ajay Bissa\";\n\nlet booking = {};\nlet qrInstance = null;\nlet selfPhotoData = null;\nlet idPhotoData = null;\n\n\/* helpers *\/\nfunction $(id){ return document.getElementById(id); }\nfunction setStep(n){\n for(let i=1;i<=4;i++){ $('s'+i).classList.toggle('active', i===n); }\n $('form1').classList.toggle('hidden', n!==1);\n $('verifyCard').classList.toggle('hidden', n!==2);\n $('paymentCard').classList.toggle('hidden', n!==3);\n $('finalCard').classList.toggle('hidden', n!==4);\n}\nfunction formatDateForPDF(dateString) {\n if (!dateString) return 'N\/A';\n try {\n const d = new Date(dateString + \"T00:00:00\");\n if (isNaN(d.getTime())) {\n return 'Invalid Date';\n }\n const day = String(d.getDate()).padStart(2, '0');\n const month = String(d.getMonth() + 1).padStart(2, '0');\n const year = d.getFullYear();\n return `${day}\/${month}\/${year}`;\n } catch (e) {\n return 'Invalid Date';\n }\n}\nfunction getPhotoDataURI(fileInput, callback) {\n const file = fileInput.files[0];\n if (file) {\n const reader = new FileReader();\n reader.onload = function(e) {\n callback(e.target.result);\n };\n reader.readAsDataURL(file);\n } else {\n callback(null);\n }\n}\n\n\/* init *\/\nsetStep(1);\n\n\/* STEP 1 -> STEP 2 *\/\n$('nextToVerify').addEventListener('click', function(){\n const t_name = $('t_name').value.trim();\n const t_email = $('t_email').value.trim();\n const t_phone = $('t_phone').value.trim();\n const bk = $('bk_lang').value;\n const start = $('bk_start').value, end = $('bk_end').value;\n if(!t_name || !t_email || !t_phone || !bk || !start || !end){ alert('\u0915\u0943\u092a\u092f\u093e \u0938\u092d\u0940 \u092b\u0940\u0932\u094d\u0921 \u092d\u0930\u0947\u0902 (Step 1)'); return; }\n const parts = bk.split('|'); const base = parseInt(parts[1],10);\n const sDate = new Date(start+\"T00:00:00\"), eDate = new Date(end+\"T00:00:00\");\n if(eDate < sDate){ alert('End date cannot be before Start date'); return; }\n\n const oneDay = 24 * 60 * 60 * 1000;\n const days = Math.round(Math.abs((sDate - eDate) \/ oneDay)) + 1;\n const totalFee = days * base;\n\n booking = {\n t_name: t_name,\n t_email: t_email,\n t_phone: t_phone,\n g_name: $('g_name').value,\n g_uid: $('g_uid').value,\n lang: parts[0],\n base_fee: base,\n days: days,\n total_fee: totalFee,\n start_date: start,\n end_date: end\n };\n setStep(2);\n});\n\n\/\/ Show image preview and store data URI\n$('selfPhoto').addEventListener('change', function(e){\n getPhotoDataURI(this, function(uri){\n if(uri) {\n $('selfPreview').src = uri;\n $('selfPreview').classList.remove('hidden');\n selfPhotoData = uri;\n } else {\n $('selfPreview').classList.add('hidden');\n selfPhotoData = null;\n }\n });\n});\n\n$('idFrontPhoto').addEventListener('change', function(e){\n getPhotoDataURI(this, function(uri){\n if(uri) {\n $('idPreview').src = uri;\n $('idPreview').classList.remove('hidden');\n idPhotoData = uri;\n } else {\n $('idPreview').classList.add('hidden');\n idPhotoData = null;\n }\n });\n});\n\n\n\/* STEP 2 -> STEP 3 *\/\n$('confirmBtn').addEventListener('click', function(){\n const t_idnum = $('t_idnum').value.trim();\n if(!t_idnum){ alert('Please enter ID number.'); return; }\n \n booking.t_id_type = $('t_idtype').value;\n booking.t_id_num = t_idnum;\n booking.selfPhoto = selfPhotoData;\n booking.idPhoto = idPhotoData;\n\n \/\/ set payment details\n $('payeeName').textContent = PAYEE_NAME;\n $('upiIdLabel').textContent = GUIDE_UPI_ID;\n $('amountText').textContent = `Amount to Pay: \u20b9${booking.total_fee.toLocaleString('en-IN')}`;\n\n const upiUrl = `upi:\/\/pay?pa=${GUIDE_UPI_ID}&pn=${encodeURIComponent(PAYEE_NAME)}&am=${booking.total_fee}&cu=INR&tn=${encodeURIComponent('Jaisalmer Guide Booking')}`;\n $('payNow').href = upiUrl;\n\n if(qrInstance) qrInstance.clear();\n qrInstance = new QRious({\n element: $('qrCanvas'),\n value: upiUrl,\n size: 200,\n background: '#ffffff',\n foreground: '#0b2545'\n });\n setStep(3);\n});\n\n\/\/ Back buttons\n$('backToStep1').addEventListener('click', function(){ setStep(1); });\n$('backToVerify').addEventListener('click', function(){ setStep(2); });\n\n\/* STEP 3 -> STEP 4 *\/\n$('confirmTxnBtn').addEventListener('click', function(){\n const txnId = $('txnId').value.trim();\n if(!txnId){ alert('Please enter Transaction ID\/UTR ID.'); return; }\n booking.txn_id = txnId;\n \n \/\/ DOB is not used in this version, so a placeholder is set for the PDF\n booking.t_dob = 'N\/A';\n\n \/\/ Final summary\n const sdate = formatDateForPDF(booking.start_date);\n const edate = formatDateForPDF(booking.end_date);\n\n $('finalSummary').innerHTML = `\n <b>Tourist Name:<\/b> ${booking.t_name}<br>\n <b>Booking ID:<\/b> ${booking.g_uid}-${Date.now().toString().slice(-6)}<br>\n <b>Guide Name:<\/b> ${booking.g_name}<br>\n <b>Language:<\/b> ${booking.lang}<br>\n <b>Dates:<\/b> ${sdate} to ${edate}<br>\n <b>Total Days:<\/b> ${booking.days}<br>\n <b>Daily Fee:<\/b> \u20b9${booking.base_fee.toLocaleString('en-IN')}<br>\n <b>Total Amount:<\/b> \u20b9${booking.total_fee.toLocaleString('en-IN')}<br>\n <b>Transaction ID:<\/b> ${booking.txn_id}<br>\n <br>\n <b>ID Type:<\/b> ${booking.t_id_type}<br>\n <b>ID Number:<\/b> ${booking.t_id_num}<br>\n `;\n setStep(4);\n});\n\n\/* PDF GENERATION *\/\nfunction generatePDF(isColor){\n const { jsPDF } = window.jspdf;\n const doc = new jsPDF();\n const primaryColor = isColor ? '#6a11cb' : '#000000';\n const secondaryColor = isColor ? '#2575fc' : '#333333';\n const accentColor = isColor ? '#ff9933' : '#666666';\n\n \/\/ Watermark\n doc.setFontSize(30);\n doc.setTextColor(isColor ? '#dcdcdc' : '#e0e0e0');\n doc.setGState(new doc.GState({opacity: 0.5}));\n doc.text(\"Welcome to Jaisalmer\", 105, 140, null, 45, \"center\");\n doc.setGState(new doc.GState({opacity: 1.0}));\n \n doc.setFontSize(22);\n doc.setTextColor(primaryColor);\n doc.setFont(\"helvetica\", \"bold\");\n doc.text(\"Jaisalmer Tour Guide Booking\", 105, 20, null, null, \"center\");\n\n doc.setFontSize(10);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.setFont(\"helvetica\", \"normal\");\n doc.text(`Booking ID: ${booking.g_uid}-${Date.now().toString().slice(-6)}`, 105, 28, null, null, \"center\");\n\n doc.setDrawColor(primaryColor);\n doc.line(20, 35, 185, 35);\n\n let currentY = 45;\n\n \/\/ Add photos side-by-side if available\n const photoSize = 40;\n if (booking.selfPhoto || booking.idPhoto) {\n if (booking.selfPhoto) {\n doc.addImage(booking.selfPhoto, 'JPEG', 20, currentY, photoSize, photoSize);\n doc.setFontSize(8);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.text(\"Selfie Photo\", 20, currentY + photoSize + 3);\n }\n if (booking.idPhoto) {\n const xPos = booking.selfPhoto ? 70 : 20; \/\/ Adjust position if only one photo is present\n doc.addImage(booking.idPhoto, 'JPEG', xPos, currentY, photoSize, photoSize);\n doc.setFontSize(8);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.text(\"ID Photo\", xPos, currentY + photoSize + 3);\n }\n currentY += photoSize + 15;\n }\n \n doc.setTextColor(secondaryColor);\n doc.setFontSize(14);\n doc.text(\"Booking Details\", 20, currentY + 5);\n\n const sdate = formatDateForPDF(booking.start_date);\n const edate = formatDateForPDF(booking.end_date);\n const dob = formatDateForPDF(booking.t_dob);\n\n const tableData = [\n [\"Tourist Name\", booking.t_name],\n [\"Guide Name\", booking.g_name],\n [\"Guide ID\", booking.g_uid],\n [\"Language\", booking.lang],\n [\"Tour Dates\", `${sdate} to ${edate}`],\n [\"Total Days\", booking.days],\n [\"Daily Fee\", `\u20b9${booking.base_fee.toLocaleString('en-IN')}`],\n [\"Total Amount\", `\u20b9${booking.total_fee.toLocaleString('en-IN')}`],\n ];\n\n doc.autoTable({\n startY: currentY + 10,\n head: [['Field', 'Details']],\n body: tableData,\n theme: 'striped',\n styles: {\n fontSize: 10,\n textColor: isColor ? '#0b2545' : '#000000',\n fillColor: isColor ? '#f6f9ff' : '#ffffff',\n },\n headStyles: {\n fillColor: [isColor ? 106 : 0, isColor ? 17 : 0, isColor ? 203 : 0],\n textColor: isColor ? 255 : 255,\n fontStyle: 'bold'\n },\n });\n const finalY = doc.autoTable.previous.finalY;\n\n doc.setTextColor(secondaryColor);\n doc.setFontSize(14);\n doc.text(\"Verification & Payment\", 20, finalY + 15);\n\n const finalTable = [\n [\"ID Type\", booking.t_id_type],\n [\"ID Number\", booking.t_id_num],\n [\"Transaction ID\", booking.txn_id]\n ];\n\n doc.autoTable({\n startY: finalY + 20,\n head: [['Field', 'Details']],\n body: finalTable,\n theme: 'striped',\n styles: {\n fontSize: 10,\n textColor: isColor ? '#0b2545' : '#000000',\n fillColor: isColor ? '#f6f9ff' : '#ffffff',\n },\n headStyles: {\n fillColor: [isColor ? 106 : 0, isColor ? 17 : 0, isColor ? 203 : 0],\n textColor: isColor ? 255 : 255,\n fontStyle: 'bold'\n },\n });\n\n const finalY2 = doc.autoTable.previous.finalY;\n doc.setFontSize(12);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.setFont(\"helvetica\", \"italic\");\n doc.text(\"Thank you for your booking!\", 105, finalY2 + 25, null, null, \"center\");\n\n doc.setFontSize(8);\n doc.setTextColor(isColor ? '#5b6b82' : '#888888');\n doc.text(\"This is an electronically generated e-ticket and does not require a signature.\", 105, finalY2 + 35, null, null, \"center\");\n\n doc.save(`Jaisalmer_Booking_${booking.t_name}.pdf`);\n}\n\n$('downloadColor').addEventListener('click', function(){ generatePDF(true); });\n$('downloadBW').addEventListener('click', function(){ generatePDF(false); });\n\n\/* WhatsApp Share *\/\n$('whatsappShare').addEventListener('click', function(){\n const sdate = formatDateForPDF(booking.start_date);\n const edate = formatDateForPDF(booking.end_date);\n const msg = `\n*Jaisalmer Guide Booking Confirmation*\n\n*Booking ID:* ${booking.g_uid}-${Date.now().toString().slice(-6)}\n*Tourist Name:* ${booking.t_name}\n*Guide Name:* ${booking.g_name}\n*Language:* ${booking.lang}\n*Tour Dates:* ${sdate} to ${edate}\n*Total Days:* ${booking.days}\n*Daily Fee:* \u20b9${booking.base_fee.toLocaleString('en-IN')}\n*Total Amount:* \u20b9${booking.total_fee.toLocaleString('en-IN')}\n*Transaction ID:* ${booking.txn_id}\n\n*Verification Details:*\n*ID Type:* ${booking.t_id_type}\n*ID Number:* ${booking.t_id_num}\n\n*Thank you for your booking!*\n`;\n const whatsappUrl = `https:\/\/wa.me\/?text=${encodeURIComponent(msg)}`;\n window.open(whatsappUrl, '_blank');\n});\n\n<\/script>\n<\/body>\n<\/html>\n\n\n\n<div style=\"height:0px\" aria-hidden=\"true\" class=\"wp-block-spacer wp-container-content-6388d5dc\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-xx-large-font-size\"><a href=\"#\">RSVP<\/a><\/h2>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\"><\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Jaisalmer Guide Booking \u2014 Full Verified Flow Jaisalmer Guide Booking \u2014 Full Verified Flow Step-by-step: Details \u2192 Verification \u2192 Payment \u2192 Confirm & PDF 1 \u2014 Details 2 \u2014 Verification 3 \u2014 Payment 4 \u2014 Confirm & PDF Your Full Name Email Phone Guide Name Guide ID Select Language (fee\/day) — Choose —English (\u20b92000\/day)Hindi (\u20b91500\/day)French […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-124","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages\/124","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=124"}],"version-history":[{"count":56,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages\/124\/revisions"}],"predecessor-version":[{"id":191,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages\/124\/revisions\/191"}],"wp:attachment":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=124"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\n\n\n\n\nJaisalmer Guide Booking \u2014 Full Verified Flow<\/title>\n\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/qrious\/4.0.2\/qrious.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf-autotable\/3.8.3\/jspdf.plugin.autotable.min.js\"><\/script>\n\n<style>\n :root{\n --brand1:#6a11cb; --brand2:#2575fc; --accent:#ff9933;\n --ink:#0b2545; --muted:#5b6b82; --bg:#f6f9ff; --card:#ffffff;\n --success:#0bbd7e; --danger:#e53935;\n }\n *{box-sizing:border-box}\n body{font-family:Arial, Helvetica, sans-serif;background:var(--bg);color:var(--ink);margin:0;padding:16px}\n .wrap{max-width:980px;margin:0 auto}\n h1{margin:0 0 10px;font-size:20px}\n .ribbon{display:flex;border-radius:10px;overflow:hidden;margin-bottom:12px}\n .ribbon div{height:6px;flex:1}\n .c1{background:var(--accent)} .c2{background:#fff} .c3{background:#138808}\n\n .card{background:var(--card);padding:14px;border-radius:12px;box-shadow:0 8px 22px rgba(10,20,40,.06);margin-bottom:14px}\n label{display:block;font-weight:700;margin-top:10px}\n input[type=\"text\"], input[type=\"email\"], input[type=\"tel\"], input[type=\"date\"], select {\n width:100%;padding:10px;margin-top:6px;border-radius:10px;border:1px solid #d7e0f2;font-size:14px;background:#fff\n }\n input[type=\"file\"]{margin-top:6px}\n .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}\n .note{background:#fff8e6;border-left:4px solid #f0a500;padding:10px;border-radius:8px;color:#6b4a00;margin-top:10px}\n .btn{display:inline-block;padding:10px 14px;border-radius:12px;border:none;background:linear-gradient(90deg,var(--brand1),var(--brand2));color:#fff;font-weight:800;cursor:pointer;margin-top:12px}\n .btn.alt{background:linear-gradient(90deg,#ff9933,#ff5e5e)}\n .btn.small{padding:8px 10px;font-size:13px;border-radius:10px}\n .muted{color:var(--muted);font-size:13px}\n .center{text-align:center}\n .flex{display:flex;gap:10px;align-items:center}\n .thumb{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid #e6eefc;background:#fafcff}\n .hidden{display:none}\n .progress{display:flex;gap:6px;margin-bottom:10px}\n .step{flex:1;padding:6px;border-radius:8px;background:#eef5ff;color:var(--muted);text-align:center;font-weight:700;font-size:13px}\n .step.active{background:linear-gradient(90deg,var(--brand1),var(--brand2));color:#fff}\n @media(max-width:760px){\n .row{grid-template-columns:1fr}\n .thumb{width:72px;height:72px}\n }\n .help-container{position:fixed;bottom:100px;left:16px;z-index:9999}\n .hidden-button{background:#ff9800;color:#fff;padding:8px 12px;border-radius:24px 24px 0 24px;border:none;cursor:pointer;font-weight:700;box-shadow:0 6px 22px rgba(0,0,0,.18)}\n .note-small{font-size:13px;color:#444;margin-top:8px}\n<\/style>\n<\/head>\n<body>\n<div class=\"wrap\">\n\n <div class=\"ribbon\"><div class=\"c1\"><\/div><div class=\"c2\"><\/div><div class=\"c3\"><\/div><\/div>\n <h1>Jaisalmer Guide Booking \u2014 Full Verified Flow<\/h1>\n <p class=\"muted\">Step-by-step: Details \u2192 Verification \u2192 Payment \u2192 Confirm & PDF<\/p>\n\n <div class=\"progress\">\n <div id=\"s1\" class=\"step active\">1 \u2014 Details<\/div>\n <div id=\"s2\" class=\"step\">2 \u2014 Verification<\/div>\n <div id=\"s3\" class=\"step\">3 \u2014 Payment<\/div>\n <div id=\"s4\" class=\"step\">4 \u2014 Confirm & PDF<\/div>\n <\/div>\n\n <form id=\"form1\" class=\"card\" autocomplete=\"off\">\n <label>Your Full Name<\/label>\n <input id=\"t_name\" type=\"text\" placeholder=\"Tourist full name\" required>\n\n <div class=\"row\">\n <div>\n <label>Email<\/label>\n <input id=\"t_email\" type=\"email\" placeholder=\"email@example.com\" required>\n <\/div>\n <div>\n <label>Phone<\/label>\n <input id=\"t_phone\" type=\"tel\" placeholder=\"+91xxxxxxxxxx or +44...\" required>\n <\/div>\n <\/div>\n\n <div class=\"row\">\n <div>\n <label>Guide Name<\/label>\n <input id=\"g_name\" type=\"text\" value=\"Ajay Bissa\" readonly>\n <\/div>\n <div>\n <label>Guide ID<\/label>\n <input id=\"g_uid\" type=\"text\" value=\"LN-2007\/097\" readonly>\n <\/div>\n <\/div>\n\n <label>Select Language (fee\/day)<\/label>\n <select id=\"bk_lang\" required>\n <option value=\"\">— Choose —<\/option>\n <option value=\"English|2000\">English (\u20b92000\/day)<\/option>\n <option value=\"Hindi|1500\">Hindi (\u20b91500\/day)<\/option>\n <option value=\"French|3000\">French (\u20b93000\/day)<\/option>\n <option value=\"Spanish|2800\">Spanish (\u20b92800\/day)<\/option>\n <\/select>\n\n <div class=\"row\">\n <div>\n <label>Tour Start Date<\/label>\n <input id=\"bk_start\" type=\"date\" required>\n <\/div>\n <div>\n <label>Tour End Date<\/label>\n <input id=\"bk_end\" type=\"date\" required>\n <\/div>\n <\/div>\n\n <div class=\"note\">System computes inclusive days and total. Click NEXT to proceed to verification (ID\/photo upload).<\/div>\n\n <div style=\"display:flex;justify-content:flex-end;gap:10px;margin-top:12px\">\n <button type=\"button\" id=\"nextToVerify\" class=\"btn\">Next \u2014 Verify<\/button>\n <\/div>\n <\/form>\n\n <div id=\"verifyCard\" class=\"card hidden\">\n <label>ID Type<\/label>\n <select id=\"t_idtype\">\n <option value=\"\">— Select ID Type —<\/option>\n <option value=\"Aadhaar\">Aadhaar Card<\/option>\n <option value=\"Driving\">Driving Licence<\/option>\n <option value=\"Passport\">Passport<\/option>\n <option value=\"Foreign\">Foreign ID<\/option>\n <\/select>\n \n <label>ID Number<\/label>\n <input id=\"t_idnum\" type=\"text\" placeholder=\"Enter ID number\">\n\n <div class=\"row\" style=\"margin-top:10px\">\n <div>\n <label>Upload Self Photo (Selfie)<\/label>\n <input id=\"selfPhoto\" type=\"file\" accept=\"image\/*\">\n <div style=\"margin-top:8px\"><img id=\"selfPreview\" class=\"thumb hidden\" alt=\"self preview\"><\/div>\n <\/div>\n <div>\n <label>Upload ID Front Photo<\/label>\n <input id=\"idFrontPhoto\" type=\"file\" accept=\"image\/*\">\n <div style=\"margin-top:8px\"><img id=\"idPreview\" class=\"thumb hidden\" alt=\"id preview\"><\/div>\n <\/div>\n <\/div>\n\n <div style=\"display:flex;justify-content:space-between;gap:8px;margin-top:12px\">\n <button id=\"backToStep1\" class=\"btn small\">Back<\/button>\n <button id=\"confirmBtn\" class=\"btn small\">Confirm & Proceed to Payment<\/button>\n <\/div>\n <\/div>\n\n <div id=\"paymentCard\" class=\"card hidden\">\n <h3 class=\"center\">Payment<\/h3>\n <div style=\"display:flex;gap:12px;flex-wrap:wrap;align-items:center\">\n <canvas id=\"qrCanvas\" width=\"200\" height=\"200\" aria-label=\"Payment QR\"><\/canvas>\n <div style=\"flex:1\">\n <p id=\"amountText\" style=\"font-weight:800;font-size:16px\"><\/p>\n <small class=\"muted\">Payee: <b id=\"payeeName\"><\/b> \u2022 UPI: <b id=\"upiIdLabel\"><\/b><\/small>\n <div style=\"margin-top:8px\"><a id=\"payNow\" class=\"btn small\" href=\"#\" target=\"_blank\">Pay Now (Open UPI App)<\/a><\/div>\n <\/div>\n <\/div>\n\n <label style=\"margin-top:12px\">Enter Transaction \/ UTR ID (after payment)<\/label>\n <input id=\"txnId\" type=\"text\" placeholder=\"Txn \/ UTR ID\">\n\n <div style=\"display:flex;justify-content:space-between;gap:8px;margin-top:12px\">\n <button id=\"backToVerify\" class=\"btn small\">Back<\/button>\n <button id=\"confirmTxnBtn\" class=\"btn alt\">Confirm Payment & Finalize<\/button>\n <\/div>\n <\/div>\n\n <div id=\"finalCard\" class=\"card hidden\">\n <h3 class=\"center\">Booking Confirmed \u2014 eTicket Ready<\/h3>\n <p class=\"muted center\">Download colorful PDF (or B\/W for print). WhatsApp button opens chat with full booking text. To send PDF itself, attach downloaded PDF in WhatsApp chat.<\/p>\n\n <div style=\"display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:12px\">\n <button id=\"downloadColor\" class=\"btn\">Download Color PDF<\/button>\n <button id=\"downloadBW\" class=\"btn small\">Download B\/W PDF<\/button>\n <button id=\"whatsappShare\" class=\"btn\" style=\"background:linear-gradient(90deg,#25D366,#128C7E)\">Send Full Details on WhatsApp<\/button>\n <\/div>\n\n <div style=\"margin-top:12px\">\n <h4>Booking Summary (final)<\/h4>\n <div id=\"finalSummary\" class=\"card\" style=\"padding:12px\"><\/div>\n <\/div>\n\n <div class=\"note\" style=\"margin-top:12px\">\n <b>Note:<\/b> PDF downloads are available above. WhatsApp button sends full booking text including ID, DOB and Txn. To attach PDF file to WhatsApp, open the chat manually and add the downloaded PDF.\n <\/div>\n <\/div>\n\n<\/div>\n\n<div class=\"help-container\"><button class=\"hidden-button\" onclick=\"alert('Contact button \u2014 configure contact details in code')\">\ud83d\udcf2 Contact<\/button><\/div>\n\n<script>\n\/* CONFIG *\/\nconst GUIDE_UPI_ID = \"ajaybissa@upi\";\nconst PAYEE_NAME = \"Ajay Bissa\";\n\nlet booking = {};\nlet qrInstance = null;\nlet selfPhotoData = null;\nlet idPhotoData = null;\n\n\/* helpers *\/\nfunction $(id){ return document.getElementById(id); }\nfunction setStep(n){\n for(let i=1;i<=4;i++){ $('s'+i).classList.toggle('active', i===n); }\n $('form1').classList.toggle('hidden', n!==1);\n $('verifyCard').classList.toggle('hidden', n!==2);\n $('paymentCard').classList.toggle('hidden', n!==3);\n $('finalCard').classList.toggle('hidden', n!==4);\n}\nfunction formatDateForPDF(dateString) {\n if (!dateString) return 'N\/A';\n try {\n const d = new Date(dateString + \"T00:00:00\");\n if (isNaN(d.getTime())) {\n return 'Invalid Date';\n }\n const day = String(d.getDate()).padStart(2, '0');\n const month = String(d.getMonth() + 1).padStart(2, '0');\n const year = d.getFullYear();\n return `${day}\/${month}\/${year}`;\n } catch (e) {\n return 'Invalid Date';\n }\n}\nfunction getPhotoDataURI(fileInput, callback) {\n const file = fileInput.files[0];\n if (file) {\n const reader = new FileReader();\n reader.onload = function(e) {\n callback(e.target.result);\n };\n reader.readAsDataURL(file);\n } else {\n callback(null);\n }\n}\n\n\/* init *\/\nsetStep(1);\n\n\/* STEP 1 -> STEP 2 *\/\n$('nextToVerify').addEventListener('click', function(){\n const t_name = $('t_name').value.trim();\n const t_email = $('t_email').value.trim();\n const t_phone = $('t_phone').value.trim();\n const bk = $('bk_lang').value;\n const start = $('bk_start').value, end = $('bk_end').value;\n if(!t_name || !t_email || !t_phone || !bk || !start || !end){ alert('\u0915\u0943\u092a\u092f\u093e \u0938\u092d\u0940 \u092b\u0940\u0932\u094d\u0921 \u092d\u0930\u0947\u0902 (Step 1)'); return; }\n const parts = bk.split('|'); const base = parseInt(parts[1],10);\n const sDate = new Date(start+\"T00:00:00\"), eDate = new Date(end+\"T00:00:00\");\n if(eDate < sDate){ alert('End date cannot be before Start date'); return; }\n\n const oneDay = 24 * 60 * 60 * 1000;\n const days = Math.round(Math.abs((sDate - eDate) \/ oneDay)) + 1;\n const totalFee = days * base;\n\n booking = {\n t_name: t_name,\n t_email: t_email,\n t_phone: t_phone,\n g_name: $('g_name').value,\n g_uid: $('g_uid').value,\n lang: parts[0],\n base_fee: base,\n days: days,\n total_fee: totalFee,\n start_date: start,\n end_date: end\n };\n setStep(2);\n});\n\n\/\/ Show image preview and store data URI\n$('selfPhoto').addEventListener('change', function(e){\n getPhotoDataURI(this, function(uri){\n if(uri) {\n $('selfPreview').src = uri;\n $('selfPreview').classList.remove('hidden');\n selfPhotoData = uri;\n } else {\n $('selfPreview').classList.add('hidden');\n selfPhotoData = null;\n }\n });\n});\n\n$('idFrontPhoto').addEventListener('change', function(e){\n getPhotoDataURI(this, function(uri){\n if(uri) {\n $('idPreview').src = uri;\n $('idPreview').classList.remove('hidden');\n idPhotoData = uri;\n } else {\n $('idPreview').classList.add('hidden');\n idPhotoData = null;\n }\n });\n});\n\n\n\/* STEP 2 -> STEP 3 *\/\n$('confirmBtn').addEventListener('click', function(){\n const t_idnum = $('t_idnum').value.trim();\n if(!t_idnum){ alert('Please enter ID number.'); return; }\n \n booking.t_id_type = $('t_idtype').value;\n booking.t_id_num = t_idnum;\n booking.selfPhoto = selfPhotoData;\n booking.idPhoto = idPhotoData;\n\n \/\/ set payment details\n $('payeeName').textContent = PAYEE_NAME;\n $('upiIdLabel').textContent = GUIDE_UPI_ID;\n $('amountText').textContent = `Amount to Pay: \u20b9${booking.total_fee.toLocaleString('en-IN')}`;\n\n const upiUrl = `upi:\/\/pay?pa=${GUIDE_UPI_ID}&pn=${encodeURIComponent(PAYEE_NAME)}&am=${booking.total_fee}&cu=INR&tn=${encodeURIComponent('Jaisalmer Guide Booking')}`;\n $('payNow').href = upiUrl;\n\n if(qrInstance) qrInstance.clear();\n qrInstance = new QRious({\n element: $('qrCanvas'),\n value: upiUrl,\n size: 200,\n background: '#ffffff',\n foreground: '#0b2545'\n });\n setStep(3);\n});\n\n\/\/ Back buttons\n$('backToStep1').addEventListener('click', function(){ setStep(1); });\n$('backToVerify').addEventListener('click', function(){ setStep(2); });\n\n\/* STEP 3 -> STEP 4 *\/\n$('confirmTxnBtn').addEventListener('click', function(){\n const txnId = $('txnId').value.trim();\n if(!txnId){ alert('Please enter Transaction ID\/UTR ID.'); return; }\n booking.txn_id = txnId;\n \n \/\/ DOB is not used in this version, so a placeholder is set for the PDF\n booking.t_dob = 'N\/A';\n\n \/\/ Final summary\n const sdate = formatDateForPDF(booking.start_date);\n const edate = formatDateForPDF(booking.end_date);\n\n $('finalSummary').innerHTML = `\n <b>Tourist Name:<\/b> ${booking.t_name}<br>\n <b>Booking ID:<\/b> ${booking.g_uid}-${Date.now().toString().slice(-6)}<br>\n <b>Guide Name:<\/b> ${booking.g_name}<br>\n <b>Language:<\/b> ${booking.lang}<br>\n <b>Dates:<\/b> ${sdate} to ${edate}<br>\n <b>Total Days:<\/b> ${booking.days}<br>\n <b>Daily Fee:<\/b> \u20b9${booking.base_fee.toLocaleString('en-IN')}<br>\n <b>Total Amount:<\/b> \u20b9${booking.total_fee.toLocaleString('en-IN')}<br>\n <b>Transaction ID:<\/b> ${booking.txn_id}<br>\n <br>\n <b>ID Type:<\/b> ${booking.t_id_type}<br>\n <b>ID Number:<\/b> ${booking.t_id_num}<br>\n `;\n setStep(4);\n});\n\n\/* PDF GENERATION *\/\nfunction generatePDF(isColor){\n const { jsPDF } = window.jspdf;\n const doc = new jsPDF();\n const primaryColor = isColor ? '#6a11cb' : '#000000';\n const secondaryColor = isColor ? '#2575fc' : '#333333';\n const accentColor = isColor ? '#ff9933' : '#666666';\n\n \/\/ Watermark\n doc.setFontSize(30);\n doc.setTextColor(isColor ? '#dcdcdc' : '#e0e0e0');\n doc.setGState(new doc.GState({opacity: 0.5}));\n doc.text(\"Welcome to Jaisalmer\", 105, 140, null, 45, \"center\");\n doc.setGState(new doc.GState({opacity: 1.0}));\n \n doc.setFontSize(22);\n doc.setTextColor(primaryColor);\n doc.setFont(\"helvetica\", \"bold\");\n doc.text(\"Jaisalmer Tour Guide Booking\", 105, 20, null, null, \"center\");\n\n doc.setFontSize(10);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.setFont(\"helvetica\", \"normal\");\n doc.text(`Booking ID: ${booking.g_uid}-${Date.now().toString().slice(-6)}`, 105, 28, null, null, \"center\");\n\n doc.setDrawColor(primaryColor);\n doc.line(20, 35, 185, 35);\n\n let currentY = 45;\n\n \/\/ Add photos side-by-side if available\n const photoSize = 40;\n if (booking.selfPhoto || booking.idPhoto) {\n if (booking.selfPhoto) {\n doc.addImage(booking.selfPhoto, 'JPEG', 20, currentY, photoSize, photoSize);\n doc.setFontSize(8);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.text(\"Selfie Photo\", 20, currentY + photoSize + 3);\n }\n if (booking.idPhoto) {\n const xPos = booking.selfPhoto ? 70 : 20; \/\/ Adjust position if only one photo is present\n doc.addImage(booking.idPhoto, 'JPEG', xPos, currentY, photoSize, photoSize);\n doc.setFontSize(8);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.text(\"ID Photo\", xPos, currentY + photoSize + 3);\n }\n currentY += photoSize + 15;\n }\n \n doc.setTextColor(secondaryColor);\n doc.setFontSize(14);\n doc.text(\"Booking Details\", 20, currentY + 5);\n\n const sdate = formatDateForPDF(booking.start_date);\n const edate = formatDateForPDF(booking.end_date);\n const dob = formatDateForPDF(booking.t_dob);\n\n const tableData = [\n [\"Tourist Name\", booking.t_name],\n [\"Guide Name\", booking.g_name],\n [\"Guide ID\", booking.g_uid],\n [\"Language\", booking.lang],\n [\"Tour Dates\", `${sdate} to ${edate}`],\n [\"Total Days\", booking.days],\n [\"Daily Fee\", `\u20b9${booking.base_fee.toLocaleString('en-IN')}`],\n [\"Total Amount\", `\u20b9${booking.total_fee.toLocaleString('en-IN')}`],\n ];\n\n doc.autoTable({\n startY: currentY + 10,\n head: [['Field', 'Details']],\n body: tableData,\n theme: 'striped',\n styles: {\n fontSize: 10,\n textColor: isColor ? '#0b2545' : '#000000',\n fillColor: isColor ? '#f6f9ff' : '#ffffff',\n },\n headStyles: {\n fillColor: [isColor ? 106 : 0, isColor ? 17 : 0, isColor ? 203 : 0],\n textColor: isColor ? 255 : 255,\n fontStyle: 'bold'\n },\n });\n const finalY = doc.autoTable.previous.finalY;\n\n doc.setTextColor(secondaryColor);\n doc.setFontSize(14);\n doc.text(\"Verification & Payment\", 20, finalY + 15);\n\n const finalTable = [\n [\"ID Type\", booking.t_id_type],\n [\"ID Number\", booking.t_id_num],\n [\"Transaction ID\", booking.txn_id]\n ];\n\n doc.autoTable({\n startY: finalY + 20,\n head: [['Field', 'Details']],\n body: finalTable,\n theme: 'striped',\n styles: {\n fontSize: 10,\n textColor: isColor ? '#0b2545' : '#000000',\n fillColor: isColor ? '#f6f9ff' : '#ffffff',\n },\n headStyles: {\n fillColor: [isColor ? 106 : 0, isColor ? 17 : 0, isColor ? 203 : 0],\n textColor: isColor ? 255 : 255,\n fontStyle: 'bold'\n },\n });\n\n const finalY2 = doc.autoTable.previous.finalY;\n doc.setFontSize(12);\n doc.setTextColor(isColor ? '#5b6b82' : '#555555');\n doc.setFont(\"helvetica\", \"italic\");\n doc.text(\"Thank you for your booking!\", 105, finalY2 + 25, null, null, \"center\");\n\n doc.setFontSize(8);\n doc.setTextColor(isColor ? '#5b6b82' : '#888888');\n doc.text(\"This is an electronically generated e-ticket and does not require a signature.\", 105, finalY2 + 35, null, null, \"center\");\n\n doc.save(`Jaisalmer_Booking_${booking.t_name}.pdf`);\n}\n\n$('downloadColor').addEventListener('click', function(){ generatePDF(true); });\n$('downloadBW').addEventListener('click', function(){ generatePDF(false); });\n\n\/* WhatsApp Share *\/\n$('whatsappShare').addEventListener('click', function(){\n const sdate = formatDateForPDF(booking.start_date);\n const edate = formatDateForPDF(booking.end_date);\n const msg = `\n*Jaisalmer Guide Booking Confirmation*\n\n*Booking ID:* ${booking.g_uid}-${Date.now().toString().slice(-6)}\n*Tourist Name:* ${booking.t_name}\n*Guide Name:* ${booking.g_name}\n*Language:* ${booking.lang}\n*Tour Dates:* ${sdate} to ${edate}\n*Total Days:* ${booking.days}\n*Daily Fee:* \u20b9${booking.base_fee.toLocaleString('en-IN')}\n*Total Amount:* \u20b9${booking.total_fee.toLocaleString('en-IN')}\n*Transaction ID:* ${booking.txn_id}\n\n*Verification Details:*\n*ID Type:* ${booking.t_id_type}\n*ID Number:* ${booking.t_id_num}\n\n*Thank you for your booking!*\n`;\n const whatsappUrl = `https:\/\/wa.me\/?text=${encodeURIComponent(msg)}`;\n window.open(whatsappUrl, '_blank');\n});\n\n<\/script>\n<\/body>\n<\/html>\n\n\n\n<div style=\"height:0px\" aria-hidden=\"true\" class=\"wp-block-spacer wp-container-content-6388d5dc\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-xx-large-font-size\"><a href=\"#\">RSVP<\/a><\/h2>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\"><\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Jaisalmer Guide Booking \u2014 Full Verified Flow Jaisalmer Guide Booking \u2014 Full Verified Flow Step-by-step: Details \u2192 Verification \u2192 Payment \u2192 Confirm & PDF 1 \u2014 Details 2 \u2014 Verification 3 \u2014 Payment 4 \u2014 Confirm & PDF Your Full Name Email Phone Guide Name Guide ID Select Language (fee\/day) — Choose —English (\u20b92000\/day)Hindi (\u20b91500\/day)French […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-124","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages\/124","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=124"}],"version-history":[{"count":56,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages\/124\/revisions"}],"predecessor-version":[{"id":191,"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=\/wp\/v2\/pages\/124\/revisions\/191"}],"wp:attachment":[{"href":"https:\/\/jaisalmerguide.sabpro.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=124"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}