{"id":514,"date":"2025-02-21T10:57:20","date_gmt":"2025-02-21T01:57:20","guid":{"rendered":"https:\/\/saltwater-sc.com\/kr\/?page_id=514"},"modified":"2025-03-05T13:45:12","modified_gmt":"2025-03-05T04:45:12","slug":"reservationform","status":"publish","type":"page","link":"https:\/\/saltwater-sc.com\/kr\/reservationform\/","title":{"rendered":"\uc608\uc57d \uc591\uc2dd"},"content":{"rendered":"\n<p>\uc608\uc57d\uc740 \uc5ec\uae30\uc5d0\uc11c<\/p>\n\n\n        <div id=\"shunsaku-booking-container\">\n            <form id=\"shunsaku-booking-form\">\n                <input type=\"hidden\" name=\"service\" id=\"selected-service\">\n                <div>\n                    <label for=\"service-select\">\uc11c\ube44\uc2a4 \uc120\ud0dd:<\/label>\n                    <select id=\"service-select\" name=\"service\" required>\n                        <option value=\"\">\uc120\ud0dd\ud574\uc8fc\uc138\uc694<\/option>\n                                                    <option value=\"0\" \n                                    data-cost=\"6900\" \n                                    data-cost-exclusive=\"8900\" \n                                    data-limit=\"6\" \n                                    data-type=\"both\" \n                                    data-max=\"6\" \n                                    data-times=\"08:00,10:00,13:00\" \n                                    data-start=\"2025-02-24\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                \uc990\uac70\uc6b4 \ub2e4\uc774\ube59 \ud22c\uc5b4 (2025-02-24 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"1\" \n                                    data-cost=\"5900\" \n                                    data-cost-exclusive=\"7900\" \n                                    data-limit=\"6\" \n                                    data-type=\"both\" \n                                    data-max=\"6\" \n                                    data-times=\"08:00,10:00,13:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"90\">\n                                \ub2c8\ubaa8 \uc2a4\ub178\ud074\ub9c1 (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"2\" \n                                    data-cost=\"5900\" \n                                    data-cost-exclusive=\"7900\" \n                                    data-limit=\"6\" \n                                    data-type=\"both\" \n                                    data-max=\"6\" \n                                    data-times=\"08:00,10:00,13:00\" \n                                    data-start=\"2025-02-24\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                \uc6b0\ubbf8\uac00\uba54 \uc2a4\ub178\ud074\ub9c1 (2025-02-24 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"3\" \n                                    data-cost=\"30000\" \n                                    data-cost-exclusive=\"30000\" \n                                    data-limit=\"4\" \n                                    data-type=\"group\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00,10:00,13:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                PADI \uc2a4\ud0a8 \ub2e4\uc774\ubc84 \ucf54\uc2a4 (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"4\" \n                                    data-cost=\"30000\" \n                                    data-cost-exclusive=\"30000\" \n                                    data-limit=\"4\" \n                                    data-type=\"group\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                DW (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"5\" \n                                    data-cost=\"50000\" \n                                    data-cost-exclusive=\"50000\" \n                                    data-limit=\"4\" \n                                    data-type=\"both\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00\" \n                                    data-start=\"2025-02-24\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                WAVE1 (2025-02-24 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"6\" \n                                    data-cost=\"60000\" \n                                    data-cost-exclusive=\"60000\" \n                                    data-limit=\"4\" \n                                    data-type=\"both\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00\" \n                                    data-start=\"2025-02-24\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                WAVE2 (2025-02-24 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"7\" \n                                    data-cost=\"30000\" \n                                    data-cost-exclusive=\"30000\" \n                                    data-limit=\"4\" \n                                    data-type=\"both\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                AIDA 1 (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"8\" \n                                    data-cost=\"40000\" \n                                    data-cost-exclusive=\"40000\" \n                                    data-limit=\"4\" \n                                    data-type=\"both\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                AIDA 2 (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"9\" \n                                    data-cost=\"50000\" \n                                    data-cost-exclusive=\"50000\" \n                                    data-limit=\"4\" \n                                    data-type=\"both\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                AIDA 3 (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                                    <option value=\"10\" \n                                    data-cost=\"10000\" \n                                    data-cost-exclusive=\"12000\" \n                                    data-limit=\"4\" \n                                    data-type=\"both\" \n                                    data-max=\"4\" \n                                    data-times=\"08:00,10:00,13:00\" \n                                    data-start=\"2025-03-01\" \n                                    data-end=\"2025-10-31\" \n                                    data-duration=\"120\">\n                                \ud504\ub9ac\ub2e4\uc774\ube59 \ucf54\uce6d \uc138\uc158 (2025-03-01 - 2025-10-31)\n                            <\/option>\n                                            <\/select>\n                <\/div>\n                <div id=\"attendees-container\" style=\"display:none;\">\n                    <label for=\"attendees\">\ucc38\uc11d\uc790 \uc218:<\/label>\n                    <select id=\"attendees\" name=\"attendees\" required>\n                        <option value=\"\">\uc778\uc6d0 \uc218 \uc120\ud0dd<\/option>\n                    <\/select>\n                <\/div>\n                <div id=\"mode-container\" style=\"display:none;\">\n                    <label for=\"service-mode\">\uc608\uc57d \ubaa8\ub4dc:<\/label>\n                    <select id=\"service-mode\" name=\"service_mode\" required>\n                        <option value=\"\">\ubaa8\ub4dc \uc120\ud0dd<\/option>\n                    <\/select>\n                <\/div>\n                <div id=\"calendar-container\" style=\"display:none;\">\n                    <label>\uc608\uc57d \ub0a0\uc9dc \uc120\ud0dd:<\/label>\n                    <div id=\"slot-selection-message\">\ub0a0\uc9dc\ub97c \uc120\ud0dd\ud574\uc8fc\uc138\uc694<\/div>\n                    <div id=\"shunsaku-booking-calendar\"><\/div>\n                    <div id=\"time-selection-container\" style=\"display:none; margin-top: 20px;\"><\/div>\n                    <input type=\"hidden\" name=\"selected_dates\" id=\"selected-dates\">\n                <\/div>\n                <div id=\"details-container\" style=\"display:none;\">\n                    <div id=\"options-container\" style=\"display:none;\">\n                        <label>\uc120\ud0dd \uc11c\ube44\uc2a4:<\/label>\n                        <div id=\"options-list\"><\/div>\n                    <\/div>\n                    <div id=\"attendees-details\" style=\"display:none;\">\n                        <label>\ucc38\uc11d\uc790 \uc138\ubd80 \uc815\ubcf4 (\ub098\uc911\uc5d0 \uc785\ub825\ud560 \uacbd\uc6b0 \ube44\uc6cc\ub450\uc138\uc694):<\/label>\n                        <div id=\"attendees-details-list\"><\/div>\n                    <\/div>\n                    <div>\n                        <label>\ube44\uc6a9 \ub0b4\uc5ed:<\/label>\n                        <div id=\"cost-breakdown\">\n                            <p>\uae30\ubcf8 \ube44\uc6a9: <span id=\"base-cost\">0\uc5d4<\/span><\/p>\n                            <p>\ucc38\uc11d\uc790 \ube44\uc6a9: <span id=\"attendees-cost\">0\uc5d4<\/span><\/p>\n                            <div id=\"options-cost\"><\/div>\n                            <div id=\"booking-details\" style=\"margin-top: 10px;\"><\/div>\n                            <p>\ucd1d \ube44\uc6a9: <span id=\"total-cost-display\">0\uc5d4<\/span><\/p>\n                        <\/div>\n                    <\/div>\n                    <label for=\"payment-method\">\uacb0\uc81c \ubc29\ubc95:<\/label>\n                    <select id=\"payment-method\" name=\"payment_method\" required>\n                        <option value=\"\">\uc120\ud0dd\ud574\uc8fc\uc138\uc694<\/option>\n                        <option value=\"cash\">\ud604\uae08<\/option>\n                    <\/select>\n                    <h3>\uc5f0\ub77d\ucc98 \uc815\ubcf4<\/h3>\n                    <input type=\"text\" name=\"postal_code\" placeholder=\"\uc6b0\ud3b8\ubc88\ud638 (\uc608: 123-4567)\" required>\n                    <input type=\"text\" name=\"address\" placeholder=\"\uc8fc\uc18c\" required>\n                    <input type=\"tel\" name=\"phone\" placeholder=\"\uc804\ud654\ubc88\ud638 (\uc608: 090-1234-5678)\" required>\n                    <input type=\"text\" name=\"name\" placeholder=\"\uc774\ub984\" required>\n                    <input type=\"email\" name=\"email\" placeholder=\"\uc774\uba54\uc77c \uc8fc\uc18c\" required>\n                <\/div>\n                <button type=\"submit\">\uc9c0\uae08 \uc608\uc57d<\/button>\n            <\/form>\n            <div id=\"thank-you-message\" style=\"display:none; color: green; margin-top: 20px;\">\n                \uc608\uc57d\ud574 \uc8fc\uc154\uc11c \uac10\uc0ac\ud569\ub2c8\ub2e4! \ud655\uc778 \uc774\uba54\uc77c\uc774 \ubc1c\uc1a1\ub418\uc5c8\uc2b5\ub2c8\ub2e4.            <\/div>\n        <\/div>\n        <script>\n        jQuery(document).ready(function($) {\n            console.log('Shunsaku Booking: Form script loaded');\n            var translations = shunsaku_booking.translations || {};\n            var services = [{\"name\":\"\\uc990\\uac70\\uc6b4 \\ub2e4\\uc774\\ube59 \\ud22c\\uc5b4\",\"duration\":120,\"cost\":6900,\"cost_exclusive\":8900,\"times\":[\"08:00\",\"10:00\",\"13:00\"],\"limit\":6,\"start_date\":\"2025-02-24\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":6,\"options\":[{\"name\":\"\\uc0ac\\uc9c4 \\ud604\\uc0c1\",\"cost\":3000},{\"name\":\"\\uc7a0\\uc218\\ubcf5\",\"cost\":1000}]},{\"name\":\"\\ub2c8\\ubaa8 \\uc2a4\\ub178\\ud074\\ub9c1\",\"duration\":90,\"cost\":5900,\"cost_exclusive\":7900,\"times\":[\"08:00\",\"10:00\",\"13:00\"],\"limit\":6,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":6,\"options\":[{\"name\":\"\\uc0ac\\uc9c4 \\ud604\\uc0c1\",\"cost\":3000},{\"name\":\"\\uc7a0\\uc218\\ubcf5\",\"cost\":1000}]},{\"name\":\"\\uc6b0\\ubbf8\\uac00\\uba54 \\uc2a4\\ub178\\ud074\\ub9c1\",\"duration\":120,\"cost\":5900,\"cost_exclusive\":7900,\"times\":[\"08:00\",\"10:00\",\"13:00\"],\"limit\":6,\"start_date\":\"2025-02-24\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":6,\"options\":[{\"name\":\"\\uc0ac\\uc9c4 \\ud604\\uc0c1\",\"cost\":3000},{\"name\":\"\\uc7a0\\uc218\\ubcf5\",\"cost\":1000}]},{\"name\":\"PADI \\uc2a4\\ud0a8 \\ub2e4\\uc774\\ubc84 \\ucf54\\uc2a4\",\"duration\":120,\"cost\":30000,\"cost_exclusive\":30000,\"times\":[\"08:00\",\"10:00\",\"13:00\"],\"limit\":4,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"group\",\"max_attendees\":4,\"options\":[]},{\"name\":\"DW\",\"duration\":120,\"cost\":30000,\"cost_exclusive\":30000,\"times\":[\"08:00\"],\"limit\":4,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"group\",\"max_attendees\":4,\"options\":[]},{\"name\":\"WAVE1\",\"duration\":120,\"cost\":50000,\"cost_exclusive\":50000,\"times\":[\"08:00\"],\"limit\":4,\"start_date\":\"2025-02-24\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":4,\"options\":[]},{\"name\":\"WAVE2\",\"duration\":120,\"cost\":60000,\"cost_exclusive\":60000,\"times\":[\"08:00\"],\"limit\":4,\"start_date\":\"2025-02-24\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":4,\"options\":[]},{\"name\":\"AIDA 1\",\"duration\":120,\"cost\":30000,\"cost_exclusive\":30000,\"times\":[\"08:00\"],\"limit\":4,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":4,\"options\":[]},{\"name\":\"AIDA 2\",\"duration\":120,\"cost\":40000,\"cost_exclusive\":40000,\"times\":[\"08:00\"],\"limit\":4,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":4,\"options\":[]},{\"name\":\"AIDA 3\",\"duration\":120,\"cost\":50000,\"cost_exclusive\":50000,\"times\":[\"08:00\"],\"limit\":4,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":4,\"options\":[]},{\"name\":\"\\ud504\\ub9ac\\ub2e4\\uc774\\ube59 \\ucf54\\uce6d \\uc138\\uc158\",\"duration\":120,\"cost\":10000,\"cost_exclusive\":12000,\"times\":[\"08:00\",\"10:00\",\"13:00\"],\"limit\":4,\"start_date\":\"2025-03-01\",\"end_date\":\"2025-10-31\",\"service_type\":\"both\",\"max_attendees\":4,\"options\":[]}] || [];\n            var $attendeesContainer = $('#attendees-container');\n            var $modeContainer = $('#mode-container');\n            var $calendarContainer = $('#calendar-container');\n            var $detailsContainer = $('#details-container');\n            var $attendeesDetails = $('#attendees-details');\n            var $timeSelectionContainer = $('#time-selection-container');\n            var $bookingDetails = $('#booking-details');\n            var calendar = null;\n            var selectedDates = [];\n            var selectedTimesByDate = {};\n            var availableSlotsData = [];\n\n            $('#service-select').on('change', function() {\n                var serviceIndex = $(this).val();\n                resetFormBelowService();\n                $('#selected-service').val(serviceIndex);\n\n                if (serviceIndex !== '' && services[serviceIndex]) {\n                    var service = services[serviceIndex];\n                    $attendeesContainer.show();\n                    updateAttendees(service);\n                } else {\n                    $attendeesContainer.hide();\n                }\n            });\n\n            $('#attendees').on('change', function() {\n                var attendees = parseInt($(this).val()) || 0;\n                var serviceIndex = $('#service-select').val();\n                resetFormBelowAttendees();\n\n                if (attendees > 0 && serviceIndex !== '' && services[serviceIndex]) {\n                    var service = services[serviceIndex];\n                    $modeContainer.show();\n                    var $serviceMode = $('#service-mode');\n                    $serviceMode.empty();\n                    $serviceMode.append('<option value=\"\">' + translations.select_mode + '<\/option>');\n                    if (service.service_type === 'exclusive') {\n                        $serviceMode.append('<option value=\"exclusive\">' + translations.exclusive + '<\/option>');\n                    } else if (service.service_type === 'group') {\n                        $serviceMode.append('<option value=\"group\">' + translations.group + '<\/option>');\n                    } else if (service.service_type === 'both') {\n                        $serviceMode.append('<option value=\"exclusive\">' + translations.exclusive + '<\/option>');\n                        $serviceMode.append('<option value=\"group\">' + translations.group + '<\/option>');\n                    }\n                    updateAttendeesDetails(attendees, service);\n                } else {\n                    $modeContainer.hide();\n                }\n            });\n\n            $('#service-mode').on('change', async function() {\n                var serviceIndex = $('#service-select').val();\n                var mode = $(this).val();\n                var attendees = parseInt($('#attendees').val()) || 0;\n                resetFormBelowMode();\n\n                if (serviceIndex !== '' && mode !== '' && attendees > 0 && services[serviceIndex]) {\n                    var service = services[serviceIndex];\n                    $calendarContainer.show();\n                    $('#slot-selection-message').text(translations.select_date);\n                    try {\n                        if (calendar) {\n                            calendar.destroy();\n                        }\n                        await initCalendar(service, mode);\n                        console.log('Calendar initialized successfully');\n                    } catch (error) {\n                        console.error('Error initializing calendar:', error);\n                        $('#slot-selection-message').text(translations.failed_calendar);\n                    }\n                }\n            });\n\n            function updateAttendees(service) {\n                var $attendeesSelect = $('#attendees');\n                $attendeesSelect.empty().prop('disabled', false);\n                $attendeesSelect.append('<option value=\"\">' + translations.select_people + '<\/option>');\n                var limit = parseInt(service.limit) || 0;\n                var maxAttendees = parseInt(service.max_attendees) || 10;\n                for (var i = 1; i <= Math.min(limit, maxAttendees); i++) {\n                    $attendeesSelect.append('<option value=\"' + i + '\">' + i + ' ' + translations.person_s + '<\/option>');\n                }\n            }\n\n            function updateAttendeesDetails(attendees, service) {\n                var $attendeesDetailsList = $('#attendees-details-list');\n                $attendeesDetailsList.empty();\n                $attendeesDetails.toggle(attendees > 0);\n\n                var $optionsContainer = $('#options-container');\n                var $optionsList = $('#options-list');\n\n                if (attendees > 0) {\n                    for (var i = 0; i < attendees; i++) {\n                        $attendeesDetailsList.append(\n                            '<div class=\"attendee-detail\">' +\n                                '<h4>\ucc38\uc11d\uc790 ' + (i + 1) + '<\/h4>' +\n                                '<input type=\"number\" name=\"attendee_' + i + '_age\" placeholder=\"\ub098\uc774\" min=\"0\">' +\n                                '<input type=\"number\" name=\"attendee_' + i + '_height\" placeholder=\"\ud0a4 (cm)\" min=\"0\" step=\"0.1\">' +\n                                '<input type=\"number\" name=\"attendee_' + i + '_weight\" placeholder=\"\uccb4\uc911 (kg)\" min=\"0\" step=\"0.1\">' +\n                                '<input type=\"number\" name=\"attendee_' + i + '_shoe_size\" placeholder=\"\uc2e0\ubc1c \ud06c\uae30 (cm)\" min=\"0\" step=\"0.1\">' +\n                            '<\/div>'\n                        );\n                    }\n\n                    if (service.options && service.options.length > 0) {\n                        $optionsContainer.show();\n                        $.each(service.options, function(optIndex, option) {\n                            $optionsList.append(\n                                '<div>' +\n                                    '<label>' + (option.name || '\uc54c \uc218 \uc5c6\uc74c') + ' (' + (option.cost || 0) + ' ' + translations.yen + '):<\/label>' +\n                                    '<select name=\"option_' + optIndex + '\" data-cost=\"' + (option.cost || 0) + '\" class=\"option-select\">' +\n                                        '<option value=\"0\">0<\/option>' +\n                                    '<\/select>' +\n                                '<\/div>'\n                            );\n                            var $this = $optionsList.find('select[name=\"option_' + optIndex + '\"]');\n                            for (var j = 0; j <= attendees; j++) {\n                                $this.append('<option value=\"' + j + '\">' + j + '<\/option>');\n                            }\n                        });\n                    }\n                } else {\n                    $('.option-select').each(function() {\n                        $(this).empty().append('<option value=\"0\">0<\/option>').prop('disabled', true);\n                    });\n                }\n                updateTotalCost();\n            }\n\n            async function initCalendar(service, mode) {\n                var calendarEl = document.getElementById('shunsaku-booking-calendar');\n                var closedDays = [\"2025-02-25\"];\n                var today = new Date();\n                today.setHours(0, 0, 0, 0);\n                var duration = parseInt(service.duration) || 60;\n                var numSlots = duration > 120 ? Math.ceil(duration \/ 120) : 1;\n                console.log('Service duration:', duration, 'Number of slots:', numSlots);\n\n                availableSlotsData = await getAvailableSlots(service, mode, closedDays);\n                console.log('Available slots:', availableSlotsData);\n\n                calendar = new FullCalendar.Calendar(calendarEl, {\n                    initialView: 'dayGridMonth',\n                    headerToolbar: {\n                        left: 'prev,next today',\n                        center: 'title',\n                        right: ''\n                    },\n                    height: 'auto',\n                    dayMaxEvents: 1,\n                    selectable: true,\n                    locale: shunsaku_booking.lang, \/\/ \u9078\u629e\u3055\u308c\u305f\u8a00\u8a9e\u3092\u9069\u7528\n                    events: [],\n                    dateClick: function(info) {\n                        var dateStr = info.dateStr;\n                        var diffDays = Math.ceil((info.date - today) \/ (1000 * 60 * 60 * 24));\n                        var isClosed = closedDays.includes(dateStr);\n                        var hasAvailability = availableSlotsData.some(slot => slot.start.startsWith(dateStr));\n\n                        if (!isClosed && diffDays >= 0 && hasAvailability) {\n                            var index = selectedDates.indexOf(dateStr);\n                            if (index === -1) {\n                                selectedDates.push(dateStr);\n                                info.dayEl.style.backgroundColor = '#ffcccc';\n                            } else {\n                                selectedDates.splice(index, 1);\n                                info.dayEl.style.backgroundColor = '#cce5ff';\n                                delete selectedTimesByDate[dateStr];\n                            }\n\n                            $('#selected-dates').val(JSON.stringify(selectedDates));\n                            console.log('Selected dates:', selectedDates);\n                            updateTimeSelection(service, mode, numSlots);\n                        }\n                    },\n                    dayCellDidMount: function(info) {\n                        var dateStr = info.date.toISOString().split('T')[0];\n                        var diffDays = Math.ceil((info.date - today) \/ (1000 * 60 * 60 * 24));\n                        var isClosed = closedDays.includes(dateStr);\n                        var hasAvailability = availableSlotsData.some(slot => slot.start.startsWith(dateStr));\n                        if (isClosed || diffDays < 0 || !hasAvailability) {\n                            info.el.style.backgroundColor = '#f0f0f0';\n                            info.el.style.cursor = 'not-allowed';\n                            info.el.style.pointerEvents = 'none';\n                        } else {\n                            info.el.style.backgroundColor = '#cce5ff';\n                            info.el.style.cursor = 'pointer';\n                        }\n                    },\n                    validRange: {\n                        start: service.start_date || '1970-01-01',\n                        end: service.end_date ? new Date(service.end_date).setDate(new Date(service.end_date).getDate() + 1) : '9999-12-31'\n                    },\n                    timeZone: 'Asia\/Tokyo'\n                });\n                calendar.render();\n            }\n\n            function updateTimeSelection(service, mode, numSlots) {\n                $timeSelectionContainer.empty().show();\n                if (selectedDates.length === 0) {\n                    $timeSelectionContainer.hide();\n                    return;\n                }\n\n                selectedDates.forEach(date => {\n                    var $dateSection = $('<div class=\"time-selection-section\" data-date=\"' + date + '\"><h4>' + date + ' \uc2dc\uac04 (\uc5ec\ub7ec \uac1c \uc120\ud0dd \uc2dc Ctrl \uc0ac\uc6a9)<\/h4><\/div>');\n                    var $timeSelect = $('<select multiple name=\"selected_times[' + date + '][]\" class=\"time-select\" style=\"width: 100%; height: 100px;\"><\/select>');\n                    var availableTimes = availableSlotsData.filter(slot => slot.date === date);\n                    availableTimes.forEach(slot => {\n                        var optionText = slot.time + (slot.available_slots && mode === 'group' ? ' (' + translations.remaining + ' ' + slot.available_slots + ' ' + translations.person_s + ')' : '');\n                        $timeSelect.append('<option value=\"' + slot.time + '\">' + optionText + '<\/option>');\n                    });\n                    $dateSection.append($timeSelect);\n                    $timeSelectionContainer.append($dateSection);\n\n                    if (selectedTimesByDate[date]) {\n                        $timeSelect.val(selectedTimesByDate[date]);\n                    }\n\n                    $timeSelect.on('change', function() {\n                        var selectedOptions = $(this).val() || [];\n                        selectedTimesByDate[date] = selectedOptions;\n                        console.log('Selected times for ' + date + ':', selectedTimesByDate[date]);\n                        updateDetailsVisibility(numSlots);\n                        updateBookingDetails();\n                    });\n                });\n\n                updateDetailsVisibility(numSlots);\n                updateBookingDetails();\n            }\n\n            function updateDetailsVisibility(numSlots) {\n                var totalSelectedTimes = Object.values(selectedTimesByDate).reduce((sum, times) => sum + times.length, 0);\n                if (totalSelectedTimes >= numSlots) {\n                    $detailsContainer.show();\n                    updateTotalCost();\n                } else {\n                    $detailsContainer.hide();\n                    $('#slot-selection-message').text(translations.select_date + ' ' + (numSlots - totalSelectedTimes) + ' ' + translations.more_slots);\n                }\n            }\n\n            function updateBookingDetails() {\n                $bookingDetails.empty();\n                var detailsHtml = '<h4>\uc608\uc57d \uc138\ubd80 \ub0b4\uc5ed<\/h4><ul>';\n                for (var date in selectedTimesByDate) {\n                    if (selectedTimesByDate[date].length > 0) {\n                        detailsHtml += '<li>' + date + ': ' + selectedTimesByDate[date].join(', ') + '<\/li>';\n                    }\n                }\n                detailsHtml += '<\/ul>';\n                $bookingDetails.html(detailsHtml);\n            }\n\n            async function getAvailableSlots(service, mode, closedDays) {\n                var times = service.times && service.times.length > 0 ? service.times : ['10:00', '14:00']; \/\/ \u30c7\u30d5\u30a9\u30eb\u30c8\u6642\u9593\u3092\u8a2d\u5b9a\n                var slots = [];\n                var startDate = new Date(service.start_date || new Date().toISOString().split('T')[0]); \/\/ \u4eca\u65e5\u3092\u30c7\u30d5\u30a9\u30eb\u30c8\n                var endDate = new Date(service.end_date || new Date(new Date().setFullYear(new Date().getFullYear() + 1)).toISOString().split('T')[0]); \/\/ 1\u5e74\u5f8c\u3092\u30c7\u30d5\u30a9\u30eb\u30c8\n                endDate.setDate(endDate.getDate() + 1);\n\n                var current = new Date(startDate);\n                var today = new Date();\n                today.setHours(0, 0, 0, 0);\n\n                while (current < endDate) {\n                    var dateStr = current.toISOString().split('T')[0];\n                    if (!closedDays.includes(dateStr) && (current - today) \/ (1000 * 60 * 60 * 24) >= 0) {\n                        times.forEach(time => {\n                            slots.push({ date: dateStr, time: time });\n                        });\n                    }\n                    current.setDate(current.getDate() + 1);\n                }\n\n                var bulkSlots = slots.map(slot => ({ date: slot.date, time: slot.time }));\n                return $.ajax({\n                    url: shunsaku_booking.ajax_url,\n                    method: 'POST',\n                    data: {\n                        action: 'check_booking_availability_bulk',\n                        slots: JSON.stringify(bulkSlots),\n                        service_index: $('#selected-service').val(),\n                        service_mode: mode\n                    },\n                    dataType: 'json',\n                    timeout: 10000\n                }).then(response => {\n                    console.log('check_booking_availability_bulk response:', response);\n                    if (response.success) {\n                        return response.data.map(slot => {\n                            var start = new Date(slot.date + 'T' + slot.time);\n                            var end = new Date(start);\n                            end.setMinutes(end.getMinutes() + (service.duration || 120));\n                            return {\n                                start: slot.date + 'T' + slot.time,\n                                end: end.toISOString().split('.')[0],\n                                time: slot.time,\n                                available_slots: slot.available_slots,\n                                date: slot.date\n                            };\n                        });\n                    }\n                    throw new Error('No valid response data');\n                }).catch(error => {\n                    console.error('AJAX error:', error);\n                    throw error;\n                });\n            }\n\n            function updateTotalCost() {\n                var $serviceSelect = $('#service-select');\n                var mode = $('#service-mode').val();\n                var baseCost = (mode === 'exclusive') ? parseInt($serviceSelect.find(':selected').data('cost-exclusive')) || 0 : parseInt($serviceSelect.find(':selected').data('cost')) || 0;\n                var attendees = parseInt($('#attendees').val()) || 0;\n                var optionsCost = 0;\n                var $optionsCost = $('#options-cost');\n                $optionsCost.empty();\n\n                $('.option-select').each(function() {\n                    var val = parseInt($(this).val()) || 0;\n                    var cost = parseInt($(this).data('cost')) || 0;\n                    var optionTotal = val * cost;\n                    optionsCost += optionTotal;\n                    if (val > 0) {\n                        $optionsCost.append('<p>' + $(this).prev('label').text() + ': ' + optionTotal + ' ' + translations.yen + '<\/p>');\n                    }\n                });\n\n                var totalSelectedTimes = Object.values(selectedTimesByDate).reduce((sum, times) => sum + times.length, 0);\n                var attendeesTotal = baseCost * attendees * totalSelectedTimes;\n                var totalCost = attendeesTotal + optionsCost;\n                $('#base-cost').text(baseCost + ' ' + translations.yen);\n                $('#attendees-cost').text(attendeesTotal + ' ' + translations.yen);\n                $('#total-cost-display').text(totalCost + ' ' + translations.yen);\n            }\n\n            $(document).on('change', '.option-select', function() {\n                updateTotalCost();\n            });\n\n            function resetFormBelowService() {\n                $attendeesContainer.hide();\n                $modeContainer.hide();\n                $calendarContainer.hide();\n                $detailsContainer.hide();\n                $timeSelectionContainer.hide();\n                $('#attendees').empty().append('<option value=\"\">' + translations.select_people + '<\/option>').prop('disabled', true);\n                $('#service-mode').empty().append('<option value=\"\">' + translations.select_mode + '<\/option>');\n                $('#options-container').hide();\n                $('#options-list').empty();\n                $attendeesDetails.hide();\n                $('#attendees-details-list').empty();\n                $('#base-cost').text('0 ' + translations.yen);\n                $('#attendees-cost').text('0 ' + translations.yen);\n                $('#options-cost').empty();\n                $('#total-cost-display').text('0 ' + translations.yen);\n                $('#thank-you-message').hide();\n                $bookingDetails.empty();\n                if (calendar) calendar.destroy();\n                calendar = null;\n                selectedDates = [];\n                selectedTimesByDate = {};\n                availableSlotsData = [];\n                $('#selected-dates').val('');\n                $('#slot-selection-message').text(translations.select_date);\n            }\n\n            function resetFormBelowAttendees() {\n                $modeContainer.hide();\n                $calendarContainer.hide();\n                $detailsContainer.hide();\n                $timeSelectionContainer.hide();\n                $('#service-mode').empty().append('<option value=\"\">' + translations.select_mode + '<\/option>');\n                $('#options-container').hide();\n                $('#options-list').empty();\n                $attendeesDetails.hide();\n                $('#attendees-details-list').empty();\n                $('#base-cost').text('0 ' + translations.yen);\n                $('#attendees-cost').text('0 ' + translations.yen);\n                $('#options-cost').empty();\n                $('#total-cost-display').text('0 ' + translations.yen);\n                $('#thank-you-message').hide();\n                $bookingDetails.empty();\n                if (calendar) calendar.destroy();\n                calendar = null;\n                selectedDates = [];\n                selectedTimesByDate = {};\n                availableSlotsData = [];\n                $('#selected-dates').val('');\n                $('#slot-selection-message').text(translations.select_date);\n            }\n\n            function resetFormBelowMode() {\n                $calendarContainer.hide();\n                $detailsContainer.hide();\n                $timeSelectionContainer.hide();\n                $('#base-cost').text('0 ' + translations.yen);\n                $('#attendees-cost').text('0 ' + translations.yen);\n                $('#options-cost').empty();\n                $('#total-cost-display').text('0 ' + translations.yen);\n                $('#thank-you-message').hide();\n                $bookingDetails.empty();\n                if (calendar) calendar.destroy();\n                calendar = null;\n                selectedDates = [];\n                selectedTimesByDate = {};\n                availableSlotsData = [];\n                $('#selected-dates').val('');\n                $('#slot-selection-message').text(translations.select_date);\n            }\n\n            $('#shunsaku-booking-form').on('submit', function(e) {\n                e.preventDefault();\n                var formData = $(this).serialize() + '&action=shunsaku_booking_save';\n                var totalCost = parseInt($('#total-cost-display').text()) || 0;\n                formData += '&total_cost=' + totalCost + '&selected_times=' + encodeURIComponent(JSON.stringify(selectedTimesByDate));\n                console.log('Form data being sent: ' + formData);\n\n                $.ajax({\n                    url: shunsaku_booking.ajax_url,\n                    method: 'POST',\n                    data: formData,\n                    dataType: 'json',\n                    success: function(response) {\n                        console.log('AJAX response: ', response);\n                        if (response.success && response.data && response.data.redirect) {\n                            var redirectUrl = response.data.redirect;\n                            if (window.location.href !== redirectUrl && !window.location.href.includes(redirectUrl.split('\/').pop())) {\n                                console.log('Redirecting to: ' + redirectUrl);\n                                window.location.href = redirectUrl;\n                            } else {\n                                console.log('Redirect skipped to avoid loop');\n                                $('#thank-you-message').text(translations.thank_you).show();\n                                $('#shunsaku-booking-form').hide();\n                            }\n                        } else if (response.success) {\n                            $('#thank-you-message').text(translations.thank_you).show();\n                            $('#shunsaku-booking-form').hide();\n                        } else {\n                            alert(translations.error + (response.data || translations.unknown_error));\n                        }\n                    },\n                    error: function(xhr, status, error) {\n                        console.error('AJAX error: ' + status + ' - ' + error);\n                        alert(translations.ajax_error + error);\n                    }\n                });\n            });\n        });\n        <\/script>\n        \n\n\n\n<p>\ubb38\uc758\ub294 \uc5ec\uae30\uc5d0\uc11c<br><\/p>\n\n\n\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f143-o1\" lang=\"ja\" dir=\"ltr\" data-wpcf7-id=\"143\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/kr\/wp-json\/wp\/v2\/pages\/514#wpcf7-f143-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"\u30b3\u30f3\u30bf\u30af\u30c8\u30d5\u30a9\u30fc\u30e0\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"143\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.5\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"ja\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f143-o1\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<p><label> \uc774\ub984<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" autocomplete=\"name\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span> <\/label>\n<\/p>\n<p><label> \uc774\uba54\uc77c \uc8fc\uc18c<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span> <\/label>\n<\/p>\n<p><label> \uc81c\ubaa9<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-subject\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-subject\" \/><\/span> <\/label>\n<\/p>\n<p><label> \uba54\uc2dc\uc9c0 \ubcf8\ubb38 (\uc120\ud0dd\uc0ac\ud56d)<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" aria-invalid=\"false\" name=\"your-message\"><\/textarea><\/span> <\/label>\n<\/p>\n<p><input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"\ubcf4\ub0b4\uae30\" \/>\n<\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\n","protected":false},"excerpt":{"rendered":"\uc608\uc57d\uc740 \uc5ec\uae30\uc5d0\uc11c \ubb38\uc758\ub294 \uc5ec\uae30\uc5d0\uc11c","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-514","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/pages\/514","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/comments?post=514"}],"version-history":[{"count":9,"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/pages\/514\/revisions"}],"predecessor-version":[{"id":690,"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/pages\/514\/revisions\/690"}],"wp:attachment":[{"href":"https:\/\/saltwater-sc.com\/kr\/wp-json\/wp\/v2\/media?parent=514"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}