{"id":71,"date":"2026-02-28T05:02:33","date_gmt":"2026-02-28T05:02:33","guid":{"rendered":"https:\/\/manman.my\/vinylclub\/?page_id=71"},"modified":"2026-04-14T19:06:17","modified_gmt":"2026-04-14T11:06:17","slug":"71-2","status":"publish","type":"page","link":"https:\/\/manman.my\/vinylclub\/71-2\/","title":{"rendered":""},"content":{"rendered":"\n\n        <div id=\"manman-booking-app\" class=\"manman-booking-wrapper manman-layout-split\"\n            data-layout=\"split\">\n\n            \n            <div class=\"manman-form-container\">\n\n                <!-- COLUMN 1: Selections -->\n                <div class=\"manman-left-column\">\n                    <!-- Step 1: Pax -->\n                    <div class=\"manman-step-section active\" id=\"step-pax\" data-step=\"1\">\n                        <h2>Party Size<\/h2>\n                        <div class=\"manman-pax-selector\">\n                            <button type=\"button\" class=\"btn-pax-minus\">-<\/button>\n                            <input type=\"number\" id=\"booking-pax\" value=\"2\" min=\"1\" max=\"20\" readonly>\n                            <button type=\"button\" class=\"btn-pax-plus\">+<\/button>\n                        <\/div>\n\n                                            <\/div>\n\n                    <!-- Step 2: Date & Time -->\n                    <div class=\"manman-step-section active\"\n                        id=\"step-datetime\" data-step=\"2\">\n                        <h2>Date & Time<\/h2>\n                        <div class=\"manman-datetime-wrapper\">\n                            <div class=\"manman-date-picker\">\n                                <!-- Hidden input to store selected date for JS flow -->\n                                <input type=\"hidden\" id=\"booking-date\" value=\"\">\n\n                                <div class=\"manman-calendar\" id=\"manman-calendar\">\n                                    <div class=\"calendar-header\">\n                                        <button type=\"button\" class=\"cal-nav\" id=\"cal-prev\">&lt;<\/button>\n                                        <span id=\"cal-month-year\"><\/span>\n                                        <button type=\"button\" class=\"cal-nav\" id=\"cal-next\">&gt;<\/button>\n                                    <\/div>\n                                    <div class=\"calendar-weekdays\">\n                                        <div>Sun<\/div>\n                                        <div>Mon<\/div>\n                                        <div>Tue<\/div>\n                                        <div>Wed<\/div>\n                                        <div>Thu<\/div>\n                                        <div>Fri<\/div>\n                                        <div>Sat<\/div>\n                                    <\/div>\n                                    <div class=\"calendar-days-grid\" id=\"cal-days-grid\"><\/div>\n                                <\/div>\n\n                                <div class=\"manman-calendar-notice\">\n                                    <strong>\u26a0\ufe0f Before you book:<\/strong> By booking a session you agree to our <a href=\"https:\/\/manman.my\/vinylclub\/terms-conditions\/\" target=\"_blank\" rel=\"noopener\">Terms &amp; Conditions<\/a> and <a href=\"https:\/\/manman.my\/vinylclub\/refund-policy\/\" target=\"_blank\" rel=\"noopener\">Refund &amp; Cancellation Policy<\/a>. Rescheduling is free with at least <strong>48 hours<\/strong>' notice; cancellations in that window are refunded less an <strong>RM5 processing fee<\/strong>. Changes made less than 48 hours ahead are non-refundable.\n                                <\/div>\n                            <\/div>\n\n                            <div class=\"manman-time-slots\" id=\"time-slots-container\">\n                                <p class=\"manman-hint\">Select a date to view available times.<\/p>\n                                <div class=\"slots-grid\" id=\"slots-grid\"><\/div>\n                            <\/div>\n                        <\/div>\n\n                                            <\/div>\n\n                    <!-- Step 3: Details (If Single or Wizard Layout) -->\n                                    <\/div>\n\n                <!-- COLUMN 2: Split Layout Right Column OR Summary -->\n                                    <div class=\"manman-right-column\" id=\"step-details\" data-step=\"3\">\n                        <div class=\"manman-summary-ticket\">\n                            <h2>Booking Ticket<\/h2>\n                            <div class=\"ticket-info\">\n                                <p><strong>Pax:<\/strong> <span id=\"summary-pax\">2<\/span><\/p>\n                                <p><strong>Date:<\/strong> <span id=\"summary-date\">-<\/span><\/p>\n                                <p><strong>Time:<\/strong> <span id=\"summary-time\">-<\/span><\/p>\n                                <p class=\"manman-time-note\">* Please check your confirmation email for your exact table time.<\/p>\n                            <\/div>\n                                    <div class=\"manman-contact-form\">\n            <div class=\"form-row\">\n                <label>Name<\/label>\n                <input type=\"text\" id=\"contact-name\" placeholder=\"John Doe\">\n            <\/div>\n            <div class=\"form-row\">\n                <label>Phone<\/label>\n                <div class=\"manman-phone-group\">\n                    <select id=\"contact-phone-code\" class=\"manman-phone-code\">\n                        <option value=\"+60\" selected>\ud83c\uddf2\ud83c\uddfe +60<\/option>\n                        <option value=\"+1\">\ud83c\uddfa\ud83c\uddf8 +1<\/option>\n                        <option value=\"+44\">\ud83c\uddec\ud83c\udde7 +44<\/option>\n                        <option value=\"+61\">\ud83c\udde6\ud83c\uddfa +61<\/option>\n                        <option value=\"+65\">\ud83c\uddf8\ud83c\uddec +65<\/option>\n                        <option value=\"+62\">\ud83c\uddee\ud83c\udde9 +62<\/option>\n                        <option value=\"+63\">\ud83c\uddf5\ud83c\udded +63<\/option>\n                        <option value=\"+66\">\ud83c\uddf9\ud83c\udded +66<\/option>\n                        <option value=\"+84\">\ud83c\uddfb\ud83c\uddf3 +84<\/option>\n                        <option value=\"+91\">\ud83c\uddee\ud83c\uddf3 +91<\/option>\n                        <option value=\"+86\">\ud83c\udde8\ud83c\uddf3 +86<\/option>\n                        <option value=\"+81\">\ud83c\uddef\ud83c\uddf5 +81<\/option>\n                        <option value=\"+82\">\ud83c\uddf0\ud83c\uddf7 +82<\/option>\n                        <option value=\"+971\">\ud83c\udde6\ud83c\uddea +971<\/option>\n                        <option value=\"+966\">\ud83c\uddf8\ud83c\udde6 +966<\/option>\n                        <option value=\"+49\">\ud83c\udde9\ud83c\uddea +49<\/option>\n                        <option value=\"+33\">\ud83c\uddeb\ud83c\uddf7 +33<\/option>\n                    <\/select>\n                    <input type=\"tel\" id=\"contact-phone\" placeholder=\"11-2345678\" class=\"manman-phone-number\">\n                <\/div>\n            <\/div>\n            <div class=\"form-row\">\n                <label>Email<\/label>\n                <input type=\"email\" id=\"contact-email\" placeholder=\"john@example.com\">\n            <\/div>\n            \n            <!-- Pricing & Payment Method (shown dynamically by JS when cover_charge > 0) -->\n            <div id=\"manman-pricing-section\" class=\"manman-hidden\" style=\"margin:16px 0;\">\n                <div id=\"manman-price-display\"\n                    style=\"background:var(--manman-primary, #C85A17); color:#fff; padding:12px 16px; border-radius:8px; text-align:center; font-size:1rem; font-weight:600; margin-bottom:12px;\">\n                    Total: RM <span id=\"price-total\">0.00<\/span>\n                    <small id=\"price-breakdown\" style=\"display:block; font-weight:400; opacity:.8; font-size:.8em;\"><\/small>\n                    <small id=\"price-fee-line\" style=\"display:none; font-weight:400; opacity:.8; font-size:.8em; font-style:italic; margin-top:4px;\">\n                        + Processing fee: RM <span id=\"price-fee-amount\">0.00<\/span>\n                    <\/small>\n                <\/div>\n                                <div id=\"manman-payment-methods\" style=\"margin-bottom:12px;\">\n                    <p style=\"font-weight:600; margin-bottom:8px;\">Payment Method<\/p>\n                    <label id=\"manman-payonsite-option\"\n                        style=\"display:flex; align-items:center; gap:6px; margin-bottom:6px; cursor:pointer;\"\n                        class=\"manman-hidden\">\n                        <input type=\"radio\" name=\"payment_method\" value=\"on_site\" checked> \ud83d\udcb5 Pay on Site\n                    <\/label>\n                    <label id=\"manman-bizappay-option\"\n                        style=\"display:flex; align-items:center; gap:6px; margin-bottom:6px; cursor:pointer;\"\n                        class=\"manman-hidden\">\n                        <input type=\"radio\" name=\"payment_method\" value=\"bizappay\"> \ud83d\udcb3 Pay Online (Bizappay)\n                    <\/label>\n                    <label id=\"manman-billplz-option\" style=\"display:flex; align-items:center; gap:6px; cursor:pointer;\"\n                        class=\"manman-hidden\">\n                        <input type=\"radio\" name=\"payment_method\" value=\"billplz\"> \ud83c\udfe6 Pay Online (Billplz)\n                    <\/label>\n                <\/div>\n            <\/div>\n\n            <button type=\"button\" id=\"btn-confirm-booking\" class=\"manman-btn-primary\" disabled>Confirm Booking<\/button>\n            <div id=\"booking-error-msg\" class=\"manman-error-msg\"><\/div>\n        <\/div>\n                                <\/div>\n                    <\/div>\n                \n            <\/div> <!-- row ends -->\n\n            <!-- Success Overlay -->\n            <div id=\"manman-success-overlay\" class=\"manman-hidden\">\n                <div class=\"success-box\">\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" class=\"success-icon\">\n                        <path d=\"M20 6L9 17l-5-5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n                            stroke-linejoin=\"round\" \/>\n                    <\/svg>\n                    <h2>Booking Confirmed!<\/h2>\n                    <p>We look forward to hosting you at Man Man Vinyl Club.<\/p>\n                    <div id=\"manman-success-details\" style=\"display:none; margin-top:12px; font-size:0.92rem; color:var(--manman-text-muted);\">\n                        <p id=\"manman-success-date\" style=\"margin:4px 0;\"><\/p>\n                        <p id=\"manman-success-time\" style=\"margin:4px 0;\"><\/p>\n                        <p style=\"margin:4px 0;\">\ud83d\udccd <a href=\"https:\/\/www.google.com\/maps?q=5\u00b020'27.1%22N+100\u00b017'34.2%22E\" target=\"_blank\" rel=\"noopener\" style=\"color:inherit;\">5\u00b020'27.1\"N 100\u00b017'34.2\"E<\/a><\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <!-- Booking Confirmation Modal -->\n            <div id=\"manman-confirm-modal\" class=\"manman-modal-overlay manman-hidden\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"manman-confirm-title\">\n                <div class=\"manman-modal-box\">\n                    <h3 id=\"manman-confirm-title\" style=\"margin-top: 0;\">Confirm Booking Details<\/h3>\n                    <div class=\"manman-modal-body\" id=\"manman-confirm-body\">\n                        <!-- Will be populated dynamically by JS -->\n                    <\/div>\n                    <div class=\"manman-modal-footer\">\n                        <button id=\"manman-confirm-proceed\" class=\"manman-btn-primary\">Proceed to House Rules<\/button>\n                        <button id=\"manman-confirm-cancel\" class=\"btn-prev-step\" style=\"margin-top: 0;\">Back to Edit<\/button>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- House Rules Modal -->\n            <div id=\"manman-rules-modal\" class=\"manman-modal-overlay manman-hidden\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"manman-rules-title\">\n                <div class=\"manman-modal-box\">\n                    <h3 id=\"manman-rules-title\" style=\"margin-top: 0;\">House Rules & Terms<\/h3>\n                    <div class=\"manman-modal-body\" id=\"manman-rules-body\">\n                        <p style=\"text-align: center; color: var(--manman-text-muted);\">Loading house rules...<\/p>\n                    <\/div>\n                    <div class=\"manman-modal-footer\">\n                        <span id=\"manman-rules-timer\" class=\"manman-timer-label\">\n                            Please read \u2014 you may agree in <strong id=\"manman-rules-countdown\">15<\/strong>s\n                        <\/span>\n                        <button id=\"manman-rules-agree\" class=\"manman-btn-primary\" disabled>I Agree<\/button>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n        <\/div>\n        \n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-71","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/pages\/71","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/comments?post=71"}],"version-history":[{"count":11,"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/pages\/71\/revisions"}],"predecessor-version":[{"id":116,"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/pages\/71\/revisions\/116"}],"wp:attachment":[{"href":"https:\/\/manman.my\/vinylclub\/wp-json\/wp\/v2\/media?parent=71"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}