/* Add these styles to your existing CSS */
/*.time-slots-container {*/
/* display: grid;*/
/* grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));*/
/* gap: 10px;*/
/*}*/
/*.slot-container {*/
/* display: flex;*/
/* align-items: center;*/
/* margin-bottom: 8px;*/
/*}*/
/*.time-slot {*/
/* flex: 1;*/
/* margin: 0;*/
/* text-align: center;*/
/* transition: all 0.2s ease;*/
/*}*/
/*.waitlist-btn {*/
/* white-space: nowrap;*/
/* margin-left: 8px;*/
/* padding: 8px 12px;*/
/* border-radius: 4px;*/
/* font-size: 0.9em;*/
/* background: blue;*/
/*}*/
/*.disabled-slot {*/
/* background-color: #dc3545;*/
/* opacity: 0.9;*/
/*}*/
/*.disabled-slot:hover {*/
/* background-color: #bb2d3b;*/
/*}*/
/* Make sure these don't conflict with existing styles */
/* Updated CSS for the slot containers and waitlist buttons */
/* Add these additional styles */
width: 100%; /* Add this to ensure full width */
/* Status indicator for slots */
background-color: #28a745; /* Green for available */
background-color: #dc3545; /* Red for booked */
/* Diagonal strikethrough for booked slots */
flex: 1; /* Add this */
text-align: center; /* Just to be safe */
/* Available time slots */
/* Time icon for better visual cue */
content: "\F552"; /* Bootstrap icons clock */
/* Animation for slots on hover */
/* Add these to your CSS for better visual feedback */
/* Pulse animation for waitlist button */
/* Improved form field styling */
/* Make phone input field nicer */
/* Improved modal transitions */
/* Enhanced responsive design */
-->
0: [], // Sunday - closed
1: [], // Monday - closed
2: ['09:00', '18:00'], // Tuesday
3: ['09:00', '18:00'], // Wednesday
4: ['09:00', '18:00'], // Thursday
5: ['09:00', '18:00'], // Friday
6: ['09:00', '18:00'] // Saturday
// Function to get current New York time
// Create a date object in the local timezone
// Get the UTC timestamp
// Get timezone offset for America/New_York for this specific date
// Format in ISO to extract components
// Create a new date using these components (in month-1 format that JavaScript expects)
// Get current date in local time
// Convert to Eastern Time for consistency with rest of the code
// Fetch availability data from server
// Initialize with default settings if fetching fails
// Set maxDate to the end of next month (removing day < 15 condition)
let maxDate = new Date(year, month + 12, 0); // End of next month
const currentMonth = date.getMonth() + 1; // JavaScript months are 0-indexed
// Check if date is in unavailable dates list
// Check if date is in available dates list (overrides everything else)
// Check if month is available
// If month is not available, disable the date
// Keep original Sunday/Monday logic in onChange handler
// Helper function to format date as YYYY-MM-DD
// commented to block 1-8 as requested by jashan
// document.addEventListener("DOMContentLoaded", function () {
// flatpickr("#appointmentDate", {
// dateFormat: "Y-m-d",
// minDate: new Date().getDate() < 15 ? "today" : new Date(new Date().getFullYear(), new Date().getMonth() + 1, 1),
// maxDate: new Date(new Date().getFullYear(), new Date().getMonth() + 2, 0),
// disable: [
// function (date) {
// return (date.getDate() < 15 && date.getMonth() === new Date().getMonth());
// }
// ],
// onChange: function (selectedDates, dateStr, instance) {
// const dayOfWeek = selectedDates[0].getDay();
// if (dayOfWeek === 0 || dayOfWeek === 1) {
// alert("We are closed on Sundays and Mondays. Please select another day.");
// instance.clear(); // Clears invalid selection
// } else {
// updateTimeSlots(); // ✅ Ensure time slots are updated on date selection
// }
// }
// });
// });
// unblock for may
// document.addEventListener("DOMContentLoaded", function () {
// const today = new Date();
// const day = today.getDate();
// const month = today.getMonth();
// const year = today.getFullYear();
// // Determine the minDate (ensuring April 1-7 is blocked)
// let minDate;
// if (month === 3 && day <= 7) {
// minDate = new Date(year, 3, 8); // April 8
// } else {
// minDate = day < 15 ? "today" : new Date(year, month + 1, 1);
// }
// // Determine the maxDate (restrict future bookings)
// let maxDate;
// if (day < 15) {
// maxDate = new Date(year, month + 1, 0); // Last day of the current month
// } else {
// maxDate = new Date(year, month + 2, 0); // Last day of the next month
// }
// flatpickr("#appointmentDate", {
// dateFormat: "Y-m-d",
// minDate: minDate,
// maxDate: maxDate,
// disable: [
// function (date) {
// // Block April 1-7
// if (date.getMonth() === 3 && date.getDate() >= 1 && date.getDate() <= 7) {
// return true;
// }
// // Block April 22-26
// if (date.getMonth() === 3 && date.getDate() >= 22 && date.getDate() <= 26) {
// return true;
// }
// return false;
// }
// ],
// onChange: function (selectedDates, dateStr, instance) {
// const dayOfWeek = selectedDates[0].getDay();
// if (dayOfWeek === 0 || dayOfWeek === 1) {
// alert("We are closed on Sundays and Mondays. Please select another day.");
// instance.clear();
// } else {
// updateTimeSlots();
// }
// }
// });
// });
// Replace your initializeDatePicker function with this improved version
// function initializeDatePicker() {
// const dateInput = document.getElementById('appointmentDate');
// const today = new Date();
// today.setHours(0, 0, 0, 0);
// const formatDate = (date) => {
// const year = date.getFullYear();
// const month = String(date.getMonth() + 1).padStart(2, '0');
// const day = String(date.getDate()).padStart(2, '0');
// return `${year}-${month}-${day}`;
// };
// const nextMonth = new Date(today.getFullYear(), today.getMonth() + 1, 1);
// const lastDayOfNextMonth = new Date(today.getFullYear(), today.getMonth() + 2, 0);
// if (today.getDate() < 15) {
// dateInput.min = formatDate(today);
// } else {
// dateInput.min = formatDate(nextMonth);
// }
// dateInput.max = formatDate(lastDayOfNextMonth);
// dateInput.value = dateInput.min;
// dateInput.addEventListener('change', function () {
// const selectedDate = new Date(this.value);
// const minDate = new Date(this.min);
// const maxDate = new Date(this.max);
// if (selectedDate < minDate || selectedDate > maxDate) {
// alert('Selected date is out of range. Please pick a valid date.');
// this.value = this.min; // Reset to minimum allowed date
// }
// });
// }
// adjustForClosedDays();
// Force adjust on page load
// Parse date in a way that works on all browsers
// Create date object (months are 0-indexed in JS)
parseInt(parts[0], 10), // year
parseInt(parts[1], 10) - 1, // month (0-11)
parseInt(parts[2], 10) // day
// Get day of week (0 = Sunday, 1 = Monday, etc.)
// Check if closed day (Sunday or Monday)
// Calculate days to add (2 for Sunday, 1 for Monday to reach Tuesday)
// Add days to selected date
// Format the new date for the input
// Update input value
// Update available time slots
// Improved getBookedTimeSlots function with better logging
const formattedDate = new Date(selectedDate).toISOString().split('T')[0]; // Convert to YYYY-MM-DD
console.log("Fetching booked slots for date:", formattedDate); // Debug log
console.log("Raw response:", responseText); // Debug log
// async function updateTimeSlots() {
// const dateInput = document.getElementById('appointmentDate').value;
// if (!dateInput) return; // Prevent errors if date is empty
// // Parse the date in a more compatible way
// const parts = dateInput.split('-');
// const inputDate = new Date(
// parseInt(parts[0], 10),
// parseInt(parts[1], 10) - 1,
// parseInt(parts[2], 10)
// );
// // Get day of week (0 = Sunday, 6 = Saturday)
// const dayOfWeek = inputDate.getDay();
// console.log("updateTimeSlots - Selected date:", inputDate);
// console.log("updateTimeSlots - Day of week:", dayOfWeek);
// const timeSlotsContainer = document.getElementById('timeSlots');
// timeSlotsContainer.innerHTML = '';
// // Block Sundays and Mondays immediately
// if (dayOfWeek === 0 || dayOfWeek === 1) {
// timeSlotsContainer.innerHTML = 'We are closed on Sundays and Mondays. Please select another day.
';
// return;
// }
// Enhanced updateTimeSlots function
// Parse the date
// Check day restrictions
// Show loading indicator
// Clear loading indicator
// Define standard time slots
// Add date heading
// Create slot container wrapper for grid layout
// Generate time slots
// Check if the slot is booked
// Create a container for each time slot
// For booked slots
// For available slots
// Add helper text if there are available slots
// Helper function to format date for display
// Remove selection from all slots
// Add selection to clicked slot
// Scroll to phone number field for better UX
// Show visual confirmation
// Remove any existing confirmation
// Add new confirmation
// Fade out after 3 seconds
// Update summary
// Form submission
phoneNumber: phoneNumber// Include phone number
// Send booking data to PHP script
// Enable debug logs
// Configure the transaction
// Handle approved transactions
// Combine PayPal data with booking data
phoneNumber: document.getElementById('phoneNumber').value, // Include phone number
payer: orderData.payer // Include PayPal payer information
console.log('Sending booking data:', bookingData); // Debug log
// Send to your server
// Debug logging
// Handle errors
// Check if buttons can be rendered
// Update summary
// Prepare form data
// Clear previous PayPal buttons
// Go to step 3
// Create new PayPal buttons
// Terms and Conditions Modal Logic
// Store the original validateAndProceed function
// Enable/disable continue button based on checkbox
// Continue button action
// Complete the booking process
// Function to complete the booking process
// Update summary
// Move to step 3
// Create PayPal buttons
// Clear previous PayPal buttons if they exist
// Override validateAndProceed to show terms modal
// Reset checkbox and button state
// Show the terms modal
// Function to open waitlist modal
// Function to open enhanced waitlist modal
// Parse the date for better formatting
// Set datetime in a more readable format
// Populate service dropdown with all services
// Get all services from your page
// First add a placeholder option
// Then add all services
// Automatically select the currently chosen service
// Clear previous inputs
// Handle waitlist submission
-->