{"id":587,"date":"2016-09-14T09:11:06","date_gmt":"2016-09-14T09:11:06","guid":{"rendered":"https:\/\/devovh.bustoque.fr\/reservation\/"},"modified":"2021-04-12T11:35:50","modified_gmt":"2021-04-12T09:35:50","slug":"booking","status":"publish","type":"page","link":"https:\/\/devovh.bustoque.fr\/en\/booking\/","title":{"rendered":"Booking"},"content":{"rendered":"<div\n\tclass=\"cwv5\"\n\tx-data=\"cwv5Tunnel({&quot;ajaxUrl&quot;:&quot;https:\\\/\\\/devovh.bustoque.fr\\\/wp-admin\\\/admin-ajax.php&quot;,&quot;nonce&quot;:&quot;d9fdc42195&quot;,&quot;state&quot;:{&quot;date&quot;:null,&quot;guests&quot;:2,&quot;busId&quot;:null,&quot;busName&quot;:null,&quot;serviceId&quot;:null,&quot;serviceLabel&quot;:null},&quot;checkoutUrl&quot;:&quot;https:\\\/\\\/devovh.bustoque.fr\\\/en\\\/commande-2\\\/&quot;,&quot;cartUrl&quot;:&quot;https:\\\/\\\/devovh.bustoque.fr\\\/en\\\/cart-2\\\/&quot;,&quot;buses&quot;:[{&quot;id&quot;:1,&quot;name&quot;:&quot;Bus Saint-Germain&quot;,&quot;places&quot;:38,&quot;color&quot;:&quot;#BF9B3D&quot;},{&quot;id&quot;:2,&quot;name&quot;:&quot;Bus Champs-\\u00c9lys\\u00e9es&quot;,&quot;places&quot;:38,&quot;color&quot;:&quot;#EB3B98&quot;}],&quot;blockedDays&quot;:[]})\"\n\tx-cloak>\n\n\t<div class=\"cwv5__layout\">\n\t\t<div class=\"cwv5__main\">\n\n\t\t\t<!-- ==================== \u00c9TAPE 1 : CONVIVES ==================== -->\n\t\t\t<section class=\"cwv5__step\" :class=\"{ 'is-done': step > 1, 'is-active': step === 1, 'is-locked': step < 1 }\">\n\t\t\t\t<!-- R\u00e9sum\u00e9 pli\u00e9 -->\n\t\t\t\t<div class=\"cwv5__step-summary\" @click=\"goToStep(1)\">\n\t\t\t\t\t<span class=\"cwv5__step-check\">\u2713<\/span>\n\t\t\t\t\t<span class=\"cwv5__step-num\">1<\/span>\n\t\t\t\t\t<span x-text=\"stepSummary(1)\"><\/span>\n\t\t\t\t\t<button type=\"button\" class=\"cwv5__step-edit\">Modifier<\/button>\n\t\t\t\t<\/div>\n\t\t\t\t<!-- Corps -->\n\t\t\t\t<div class=\"cwv5__step-body\">\n\t\t\t\t\t<h2 class=\"cwv5__step-title\"><span class=\"cwv5__step-num\">1<\/span> Number of guests<\/h2>\n\n\t\t\t\t\t<div class=\"cwv5__guests\">\n\t\t\t\t\t\t<div class=\"cwv5__guests-row\">\n\t\t\t\t\t\t\t<span>Adultes<\/span>\n\t\t\t\t\t\t\t<div class=\"cwv5__stepper\">\n\t\t\t\t\t\t\t\t<button type=\"button\" @click=\"adults = Math.max(1, adults - 1)\">\u2212<\/button>\n\t\t\t\t\t\t\t\t<span x-text=\"adults\"><\/span>\n\t\t\t\t\t\t\t\t<button type=\"button\" @click=\"adults++\">+<\/button>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"cwv5__guests-row\">\n\t\t\t\t\t\t\t<span>Enfants (-12 ans)<\/span>\n\t\t\t\t\t\t\t<div class=\"cwv5__stepper\">\n\t\t\t\t\t\t\t\t<button type=\"button\" @click=\"children = Math.max(0, children - 1)\">\u2212<\/button>\n\t\t\t\t\t\t\t\t<span x-text=\"children\"><\/span>\n\t\t\t\t\t\t\t\t<button type=\"button\" @click=\"children++\">+<\/button>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<button type=\"button\" class=\"cwv5__btn cwv5__btn--primary cwv5__btn--block\" @click=\"goToStep(2)\">\n\t\t\t\t\t\tContinuer\t\t\t\t\t<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\n\t\t\t<!-- ==================== \u00c9TAPE 2 : DATE ==================== -->\n\t\t\t<section class=\"cwv5__step\" :class=\"{ 'is-done': step > 2, 'is-active': step === 2, 'is-locked': step < 2 }\">\n\t\t\t\t<div class=\"cwv5__step-summary\" @click=\"goToStep(2)\">\n\t\t\t\t\t<span class=\"cwv5__step-check\">\u2713<\/span>\n\t\t\t\t\t<span class=\"cwv5__step-num\">2<\/span>\n\t\t\t\t\t<span x-text=\"stepSummary(2)\"><\/span>\n\t\t\t\t\t<button type=\"button\" class=\"cwv5__step-edit\">Modifier<\/button>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"cwv5__step-locked-title\">\n\t\t\t\t\t<span class=\"cwv5__step-num\">2<\/span>\n\t\t\t\t\t<span>Choisissez votre date<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"cwv5__step-body\">\n\t\t\t\t\t<h2 class=\"cwv5__step-title\"><span class=\"cwv5__step-num\">2<\/span> Choisissez votre date<\/h2>\n\t\t\t\t\t<div class=\"cwv5__datepicker\" x-ref=\"datepicker\"><\/div>\n\t\t\t\t\t<input type=\"hidden\" x-model=\"date\">\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\n\t\t\t<!-- ==================== \u00c9TAPE 3 : BUS + CR\u00c9NEAU (fusionn\u00e9) ==================== -->\n\t\t\t<section class=\"cwv5__step\" :class=\"{ 'is-done': step > 3, 'is-active': step === 3, 'is-locked': step < 3 }\">\n\t\t\t\t<div class=\"cwv5__step-summary\" @click=\"goToStep(3)\">\n\t\t\t\t\t<span class=\"cwv5__step-check\">\u2713<\/span>\n\t\t\t\t\t<span class=\"cwv5__step-num\">3<\/span>\n\t\t\t\t\t<span x-text=\"stepSummary(3)\"><\/span>\n\t\t\t\t\t<button type=\"button\" class=\"cwv5__step-edit\">Modifier<\/button>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"cwv5__step-locked-title\">\n\t\t\t\t\t<span class=\"cwv5__step-num\">3<\/span>\n\t\t\t\t\t<span>Choisissez votre bus et votre cr\u00e9neau<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"cwv5__step-body\">\n\t\t\t\t\t<h2 class=\"cwv5__step-title\"><span class=\"cwv5__step-num\">3<\/span> Choisissez votre bus et votre cr\u00e9neau<\/h2>\n\n\t\t\t\t\t<template x-if=\"loading\">\n\t\t\t\t\t\t<p class=\"cwv5__hint\">Chargement\u2026<\/p>\n\t\t\t\t\t<\/template>\n\n\t\t\t\t\t<template x-if=\"!loading && availableBuses.every(b => !b.hasSlots)\">\n\t\t\t\t\t\t<p class=\"cwv5__hint\">Aucun cr\u00e9neau disponible \u00e0 cette date.<\/p>\n\t\t\t\t\t<\/template>\n\n\t\t\t\t\t<div class=\"cwv5__bus-blocks\" x-show=\"!loading\">\n\t\t\t\t\t\t<template x-for=\"bus in availableBuses\" :key=\"bus.id\">\n\t\t\t\t\t\t\t<div class=\"cwv5__bus-block\" x-show=\"bus.hasSlots\" :style=\"'--bus-color:' + bus.color\">\n\t\t\t\t\t\t\t\t<div class=\"cwv5__bus-header\">\n\t\t\t\t\t\t\t\t\t<strong x-text=\"bus.name\"><\/strong>\n\t\t\t\t\t\t\t\t\t<span class=\"cwv5__bus-places\" x-text=\"bus.places + ' places'\"><\/span>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"cwv5__slot-list\">\n\t\t\t\t\t\t\t\t\t<template x-for=\"slot in slotsForBusId(bus.id)\" :key=\"slot.serviceId\">\n\t\t\t\t\t\t\t\t\t\t<button type=\"button\"\n\t\t\t\t\t\t\t\t\t\t        class=\"cwv5__slot\"\n\t\t\t\t\t\t\t\t\t\t        :class=\"{ 'is-active': selectedSlot && selectedSlot.serviceId === slot.serviceId && selectedBusId === bus.id }\"\n\t\t\t\t\t\t\t\t\t\t        @click=\"selectBusAndSlot(bus, slot)\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"cwv5__slot-time\" x-text=\"slot.heureDebut\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"cwv5__slot-label\" x-text=\"slot.serviceLabel\"><\/span>\n\t\t\t\t\t\t\t\t\t\t<\/button>\n\t\t\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/template>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\n\t\t\t<!-- ==================== \u00c9TAPE 4 : MENUS ==================== -->\n\t\t\t<section class=\"cwv5__step\"\n\t\t\t         :class=\"{ 'is-active': step === 4, 'is-done': step > 4, 'is-locked': step < 4 }\"\n\t\t\t         x-data=\"cwv5Carousel()\">\n\t\t\t\t<!-- Fl\u00e8ches du carousel POS\u00c9ES \u00c0 LA RACINE DE LA SECTION\n\t\t\t\t     (cf. demande Matthieu) : leur d\u00e9bordement\n\t\t\t\t     `left\/right: -13px` se calcule sur la largeur de la\n\t\t\t\t     section = colonne main, pas sur le carousel-wrap qui\n\t\t\t\t     est \u00e9touff\u00e9 par le padding du step-body. La position\n\t\t\t\t     verticale est `top: 50%` (= centre vertical du contenu\n\t\t\t\t     d\u00e9ploy\u00e9 de la section). x-show=&&step pour ne pas\n\t\t\t\t     les afficher quand l'\u00e9tape est collapsed. -->\n\t\t\t\t<button type=\"button\"\n\t\t\t\t        class=\"cwv5__carousel-arrow cwv5__carousel-arrow--prev\"\n\t\t\t\t        x-show=\"canPrev && step === 4\"\n\t\t\t\t        @click=\"scrollPrev()\"\n\t\t\t\t        aria-label=\"Voir les pr\u00e9c\u00e9dents\">\u2039<\/button>\n\t\t\t\t<button type=\"button\"\n\t\t\t\t        class=\"cwv5__carousel-arrow cwv5__carousel-arrow--next\"\n\t\t\t\t        x-show=\"canNext && step === 4\"\n\t\t\t\t        @click=\"scrollNext()\"\n\t\t\t\t        aria-label=\"Voir les suivants\">\u203a<\/button>\n\t\t\t\t<div class=\"cwv5__step-locked-title\">\n\t\t\t\t\t<span class=\"cwv5__step-num\">4<\/span>\n\t\t\t\t\t<span>Composez votre repas<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"cwv5__step-summary\" @click=\"goToStep(4)\">\n\t\t\t\t\t<span class=\"cwv5__step-check\">\u2713<\/span>\n\t\t\t\t\t<span class=\"cwv5__step-num\">4<\/span>\n\t\t\t\t\t<span x-text=\"stepSummary(4)\"><\/span>\n\t\t\t\t\t<button type=\"button\" class=\"cwv5__step-edit\">Modifier<\/button>\n\t\t\t\t<\/div>\n\n\t\t\t\t<div class=\"cwv5__step-body\">\n\t\t\t\t\t<h2 class=\"cwv5__step-title\"><span class=\"cwv5__step-num\">4<\/span> Composez votre repas<\/h2>\n\n\t\t\t\t\t<template x-if=\"loadingProducts\">\n\t\t\t\t\t\t<p class=\"cwv5__hint\">Chargement des menus\u2026<\/p>\n\t\t\t\t\t<\/template>\n\n\t\t\t\t\t<div class=\"cwv5__carousel-wrap\"\n\t\t\t\t\t     x-show=\"!loadingProducts && products.length > 0\"\n\t\t\t\t\t     @mouseleave=\"hoveredProductId = null\"\n\t\t\t\t\t     @click.outside=\"hoveredProductId = null\">\n\t\t\t\t\t\t<div class=\"cwv5__carousel\" x-ref=\"scroller\" @scroll.passive=\"update()\">\n\t\t\t\t\t\t\t<template x-for=\"p in products\" :key=\"p.id\">\n\t\t\t\t\t\t\t\t<div class=\"cwv5__card\"\n\t\t\t\t\t\t\t\t     :class=\"{ 'is-info-open': hoveredProductId === p.id }\"\n\t\t\t\t\t\t\t\t     :data-cwv5-card-id=\"p.id\"\n\t\t\t\t\t\t\t\t     @mouseenter=\"hoveredProductId = p.id\">\n\t\t\t\t\t\t\t\t\t<button type=\"button\"\n\t\t\t\t\t\t\t\t\t        class=\"cwv5__card-info-btn\"\n\t\t\t\t\t\t\t\t\t        x-show=\"p.description\"\n\t\t\t\t\t\t\t\t\t        @click.stop=\"hoveredProductId = (hoveredProductId === p.id ? null : p.id)\"\n\t\t\t\t\t\t\t\t\t        :aria-expanded=\"hoveredProductId === p.id\"\n\t\t\t\t\t\t\t\t\t        aria-label=\"D\u00e9tail\">i<\/button>\n\t\t\t\t\t\t\t\t\t<div class=\"cwv5__card-body\">\n\t\t\t\t\t\t\t\t\t\t<strong x-text=\"p.name\"><\/strong>\n\t\t\t\t\t\t\t\t\t\t<p class=\"cwv5__card-price\" x-text=\"formatPrice(p.price)\"><\/p>\n\t\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__btn cwv5__btn--primary cwv5__btn--small cwv5__btn--block\" @click=\"addProduct(p)\">\n\t\t\t\t\t\t\t\t\t\t\tAjouter\t\t\t\t\t\t\t\t\t\t<\/button>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<template x-if=\"!loadingProducts && products.length === 0 && step === 4\">\n\t\t\t\t\t\t<p class=\"cwv5__hint\">Aucun menu disponible pour ce cr\u00e9neau.<\/p>\n\t\t\t\t\t<\/template>\n\n\t\t\t\t\t<button type=\"button\"\n\t\t\t\t\t        class=\"cwv5__btn cwv5__btn--primary cwv5__btn--block\"\n\t\t\t\t\t        @click=\"goToStep(5)\"\n\t\t\t\t\t        :disabled=\"menuMismatch || items.length === 0\">\n\t\t\t\t\t\tContinuer vers les options \u2192\t\t\t\t\t<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\n\t\t\t<!-- ==================== \u00c9TAPE 5 : BOISSONS & OPTIONS ==================== -->\n\t\t\t<section class=\"cwv5__step\"\n\t\t\t         :class=\"{ 'is-active': step === 5, 'is-done': step > 5, 'is-locked': step < 5 }\"\n\t\t\t         x-data=\"cwv5Carousel()\">\n\t\t\t\t<button type=\"button\"\n\t\t\t\t        class=\"cwv5__carousel-arrow cwv5__carousel-arrow--prev\"\n\t\t\t\t        x-show=\"canPrev && step === 5\"\n\t\t\t\t        @click=\"scrollPrev()\"\n\t\t\t\t        aria-label=\"Voir les pr\u00e9c\u00e9dents\">\u2039<\/button>\n\t\t\t\t<button type=\"button\"\n\t\t\t\t        class=\"cwv5__carousel-arrow cwv5__carousel-arrow--next\"\n\t\t\t\t        x-show=\"canNext && step === 5\"\n\t\t\t\t        @click=\"scrollNext()\"\n\t\t\t\t        aria-label=\"Voir les suivants\">\u203a<\/button>\n\t\t\t\t<div class=\"cwv5__step-locked-title\">\n\t\t\t\t\t<span class=\"cwv5__step-num\">5<\/span>\n\t\t\t\t\t<span>Boissons et options<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"cwv5__step-summary\" @click=\"goToStep(5)\">\n\t\t\t\t\t<span class=\"cwv5__step-check\">\u2713<\/span>\n\t\t\t\t\t<span class=\"cwv5__step-num\">5<\/span>\n\t\t\t\t\t<span x-text=\"stepSummary(5)\"><\/span>\n\t\t\t\t\t<button type=\"button\" class=\"cwv5__step-edit\">Modifier<\/button>\n\t\t\t\t<\/div>\n\n\t\t\t\t<div class=\"cwv5__step-body\">\n\t\t\t\t\t<h2 class=\"cwv5__step-title\"><span class=\"cwv5__step-num\">5<\/span> Boissons et options<\/h2>\n\n\t\t\t\t\t<template x-if=\"loadingDrinks\">\n\t\t\t\t\t\t<p class=\"cwv5__hint\">Chargement des boissons\u2026<\/p>\n\t\t\t\t\t<\/template>\n\n\t\t\t\t\t<div class=\"cwv5__carousel-wrap\"\n\t\t\t\t\t     x-show=\"!loadingDrinks && drinks.length > 0\"\n\t\t\t\t\t     @mouseleave=\"hoveredProductId = null\"\n\t\t\t\t\t     @click.outside=\"hoveredProductId = null\">\n\t\t\t\t\t\t<div class=\"cwv5__carousel\" x-ref=\"scroller\" @scroll.passive=\"update()\">\n\t\t\t\t\t\t\t<template x-for=\"p in drinks\" :key=\"p.id\">\n\t\t\t\t\t\t\t\t<div class=\"cwv5__card\"\n\t\t\t\t\t\t\t\t     :class=\"{ 'is-info-open': hoveredProductId === p.id }\"\n\t\t\t\t\t\t\t\t     :data-cwv5-card-id=\"p.id\"\n\t\t\t\t\t\t\t\t     @mouseenter=\"hoveredProductId = p.id\">\n\t\t\t\t\t\t\t\t\t<button type=\"button\"\n\t\t\t\t\t\t\t\t\t        class=\"cwv5__card-info-btn\"\n\t\t\t\t\t\t\t\t\t        x-show=\"p.description\"\n\t\t\t\t\t\t\t\t\t        @click.stop=\"hoveredProductId = (hoveredProductId === p.id ? null : p.id)\"\n\t\t\t\t\t\t\t\t\t        :aria-expanded=\"hoveredProductId === p.id\"\n\t\t\t\t\t\t\t\t\t        aria-label=\"D\u00e9tail\">i<\/button>\n\t\t\t\t\t\t\t\t\t<div class=\"cwv5__card-body\">\n\t\t\t\t\t\t\t\t\t\t<strong x-text=\"p.name\"><\/strong>\n\t\t\t\t\t\t\t\t\t\t<p class=\"cwv5__card-price\" x-text=\"p.priceHtml\"><\/p>\n\t\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__btn cwv5__btn--outline cwv5__btn--small cwv5__btn--block\" @click=\"addProduct(p)\">\n\t\t\t\t\t\t\t\t\t\t\tAjouter\t\t\t\t\t\t\t\t\t\t<\/button>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<template x-if=\"!loadingDrinks && drinks.length === 0 && step === 5\">\n\t\t\t\t\t\t<p class=\"cwv5__hint\">Aucune boisson disponible pour ce cr\u00e9neau.<\/p>\n\t\t\t\t\t<\/template>\n\n\t\t\t\t\t<button type=\"button\"\n\t\t\t\t\t        class=\"cwv5__btn cwv5__btn--primary cwv5__btn--block\"\n\t\t\t\t\t        @click=\"goToCheckout()\"\n\t\t\t\t\t        :disabled=\"!canCheckout\">\n\t\t\t\t\t\tContinuer vers vos coordonn\u00e9es \u2192\t\t\t\t\t<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\n\t\t\t<!-- ============== \u00c9TAPES 6 (coordonn\u00e9es) + 7 (paiement) ==============\n\t\t\t     ARCHITECTURE :\n\t\t\t       - Tant que step < 6, on affiche deux placeholders \u00ab locked \u00bb\n\t\t\t         (vraies sections accord\u00e9on) pour que l'utilisateur voie la\n\t\t\t         file compl\u00e8te des \u00e9tapes.\n\t\t\t       - D\u00e8s l'entr\u00e9e en step 6, on charge en AJAX le form WC dans\n\t\t\t         le h\u00f4te ci-dessous, puis JS le restructure en deux vraies\n\t\t\t         `.cwv5__step` (une \u00ab Vos coordonn\u00e9es \u00bb, une \u00ab Paiement \u00bb)\n\t\t\t         POS\u00c9ES \u00c0 L'INT\u00c9RIEUR DU M\u00caME `<form>` \u2192 POST intact, mais\n\t\t\t         chaque sous-section a ses propres classes is-active \/\n\t\t\t         is-done \/ is-locked \u2192 vrai accord\u00e9on, comme \u00e9tapes 1 \u00e0 5. -->\n\t\t\t<section class=\"cwv5__step is-locked cwv5__step--placeholder-6\"\n\t\t\t         x-show=\"step < 6\"\n\t\t\t         x-cloak>\n\t\t\t\t<div class=\"cwv5__step-locked-title\">\n\t\t\t\t\t<span class=\"cwv5__step-num\">6<\/span>\n\t\t\t\t\t<span>Vos coordonn\u00e9es<\/span>\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\t\t\t<section class=\"cwv5__step is-locked cwv5__step--placeholder-7\"\n\t\t\t         x-show=\"step < 6\"\n\t\t\t         x-cloak>\n\t\t\t\t<div class=\"cwv5__step-locked-title\">\n\t\t\t\t\t<span class=\"cwv5__step-num\">7<\/span>\n\t\t\t\t\t<span>Paiement<\/span>\n\t\t\t\t<\/div>\n\t\t\t<\/section>\n\n\t\t\t<!-- H\u00f4te du form WC : visible d\u00e8s step 6.\n\t\t\t     - chargement async via goToCheckout() \u2192 res.html inject\u00e9 ici\n\t\t\t     - puis restructureCheckoutAccordion() cr\u00e9e les 2 sections internes\n\t\t\t     - les classes is-active\/is-done\/is-locked y sont appliqu\u00e9es en JS\n\t\t\t       (Alpine ne peut pas binder sur du DOM cr\u00e9\u00e9 apr\u00e8s mount). -->\n\t\t\t<div class=\"cwv5__checkout-wrap\"\n\t\t\t     x-ref=\"stepCheckout\"\n\t\t\t     x-show=\"step === 6 || step === 7\"\n\t\t\t     x-cloak>\n\t\t\t\t<div class=\"cwv5__checkout\" x-ref=\"checkoutContainer\"><\/div>\n\t\t\t<\/div>\n\n\t\t<\/div><!-- .cwv5__main -->\n\n\t\t<!-- ==================== PANIER (sidebar desktop \/ drawer mobile) ==================== -->\n\t\t<aside id=\"cwv5-cart-drawer\"\n\t\t       class=\"cwv5__cart\"\n\t\t       :class=\"{ 'is-open': cartOpen }\"\n\t\t       aria-label=\"Votre panier\">\n\t\t\t<div class=\"cwv5__cart-inner\">\n\t\t\t\t<button type=\"button\" class=\"cwv5__cart-close\" @click=\"closeCart()\" aria-label=\"Fermer le panier\">\u00d7<\/button>\n\t\t\t\t<h2 class=\"cwv5__cart-title\">Mon panier<\/h2>\n\n\t\t\t\t<template x-if=\"items.length === 0\">\n\t\t\t\t\t<p class=\"cwv5__cart-empty\">Votre panier est vide.<\/p>\n\t\t\t\t<\/template>\n\n\t\t\t\t<template x-if=\"items.length > 0\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<div class=\"cwv5__cart-summary\" x-show=\"selectedSlot\">\n\t\t\t\t\t\t\t<p><strong x-text=\"selectedBusName\"><\/strong><\/p>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<span x-text=\"formatDateShort(date)\"><\/span> \u00b7\n\t\t\t\t\t\t\t\t<span x-text=\"selectedSlot ? selectedSlot.heureDebut : ''\"><\/span> \u00b7\n\t\t\t\t\t\t\t\t<span x-text=\"totalGuests\"><\/span> convives\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<ul class=\"cwv5__cart-items\">\n\t\t\t\t\t\t\t<template x-for=\"(item, i) in items\" :key=\"i\">\n\t\t\t\t\t\t\t\t<li class=\"cwv5__cart-item\">\n\t\t\t\t\t\t\t\t\t<div class=\"cwv5__cart-item-main\">\n\t\t\t\t\t\t\t\t\t\t<strong x-text=\"item.label\"><\/strong>\n\t\t\t\t\t\t\t\t\t\t<div class=\"cwv5__cart-item-qty-ctrl\">\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__qty-btn\" @click=\"decItem(i)\" aria-label=\"\u2212\">\u2212<\/button>\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"cwv5__qty-val\" x-text=\"item.qty\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__qty-btn\" @click=\"incItem(i)\" aria-label=\"+\">+<\/button>\n\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<div class=\"cwv5__cart-item-side\">\n\t\t\t\t\t\t\t\t\t\t<span x-text=\"formatPrice(item.price * item.qty)\"><\/span>\n\t\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__cart-item-remove\" @click=\"removeItem(i)\" aria-label=\"Retirer\">\u00d7<\/button>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<\/ul>\n\n\t\t\t\t\t\t<div class=\"cwv5__cart-promo\">\n\t\t\t\t\t\t\t<template x-if=\"!appliedCode\">\n\t\t\t\t\t\t\t\t<div class=\"cwv5__cart-promo-form\">\n\t\t\t\t\t\t\t\t\t<input type=\"text\" x-model=\"discountCode\" placeholder=\"Code de r\u00e9duction\" @keyup.enter=\"applyDiscountCode()\">\n\t\t\t\t\t\t\t\t\t<template x-if=\"needEmail\">\n\t\t\t\t\t\t\t\t\t\t<input type=\"email\" x-model=\"discountEmail\" placeholder=\"Email parrain\" @keyup.enter=\"applyDiscountCode()\">\n\t\t\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__btn cwv5__btn--outline cwv5__btn--small\" @click=\"applyDiscountCode()\" :disabled=\"applyingCode\">\n\t\t\t\t\t\t\t\t\t\t<span x-text=\"applyingCode ? '\u2026' : 'OK'\"><\/span>\n\t\t\t\t\t\t\t\t\t<\/button>\n\t\t\t\t\t\t\t\t\t<template x-if=\"discountError\">\n\t\t\t\t\t\t\t\t\t\t<p class=\"cwv5__cart-promo-error\" x-text=\"discountError\"><\/p>\n\t\t\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t<template x-if=\"appliedCode\">\n\t\t\t\t\t\t\t\t<div class=\"cwv5__cart-promo-applied\">\n\t\t\t\t\t\t\t\t\t<span x-text=\"'\u2713 ' + appliedCode.code + ' (' + appliedCode.label + ')'\"><\/span>\n\t\t\t\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__btn cwv5__btn--small cwv5__btn--ghost\" @click=\"removeDiscountCode()\">\u00d7<\/button>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<!-- Sous-total visible d\u00e8s qu'au moins une remise existe (coupon, parrainage ou carte cadeau) -->\n\t\t\t\t\t\t<template x-if=\"discountAmount > 0 || giftCardAmount > 0\">\n\t\t\t\t\t\t\t<div class=\"cwv5__cart-subtotal\">\n\t\t\t\t\t\t\t\t<span>Sous-total<\/span>\n\t\t\t\t\t\t\t\t<span x-text=\"formatPrice(subtotal)\"><\/span>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<!-- Coupons WC + parrainage : ligne discount agr\u00e9g\u00e9e -->\n\t\t\t\t\t\t<template x-if=\"discountAmount > 0\">\n\t\t\t\t\t\t\t<div class=\"cwv5__cart-discount\">\n\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t<template x-if=\"appliedCode && (appliedCode.type === 'coupon' || appliedCode.type === 'parrainage')\">\n\t\t\t\t\t\t\t\t\t\t<span>R\u00e9duction <small x-text=\"appliedCode.code\"><\/small><\/span>\n\t\t\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t\t\t<template x-if=\"!appliedCode || (appliedCode.type !== 'coupon' && appliedCode.type !== 'parrainage')\">\n\t\t\t\t\t\t\t\t\t\t<span>R\u00e9duction<\/span>\n\t\t\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<span x-text=\"'\u2212 ' + formatPrice(discountAmount)\"><\/span>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<template x-if=\"giftCardAmount > 0\">\n\t\t\t\t\t\t\t<div class=\"cwv5__cart-discount\">\n\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\tCarte cadeau\t\t\t\t\t\t\t\t\t<template x-if=\"appliedCode && appliedCode.type === 'giftcard'\">\n\t\t\t\t\t\t\t\t\t\t<small x-text=\"appliedCode.code\"><\/small>\n\t\t\t\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t<span x-text=\"'\u2212 ' + formatPrice(giftCardAmount)\"><\/span>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<div class=\"cwv5__cart-total\">\n\t\t\t\t\t\t\t<span>Total<\/span>\n\t\t\t\t\t\t\t<strong x-text=\"formatPrice(total)\"><\/strong>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<template x-if=\"menuMismatch\">\n\t\t\t\t\t\t\t<p class=\"cwv5__cart-warn\" x-text=\"checkoutHint\"><\/p>\n\t\t\t\t\t\t<\/template>\n\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__btn cwv5__btn--primary cwv5__btn--block\" :disabled=\"!canCheckout\" @click=\"goToCheckout()\">\n\t\t\t\t\t\t\tCommander\t\t\t\t\t\t<\/button>\n\n\t\t\t\t\t\t<button type=\"button\" class=\"cwv5__cart-clear\" @click=\"clearCart()\">\n\t\t\t\t\t\t\tVider le panier\t\t\t\t\t\t<\/button>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/template>\n\t\t\t<\/div>\n\t\t<\/aside>\n\n\t<\/div><!-- .cwv5__layout -->\n\n\t<!-- Barre panier sticky mobile + backdrop (cach\u00e9s en desktop via CSS) -->\n\t<div class=\"cwv5__cart-backdrop\"\n\t     x-show=\"cartOpen\"\n\t     x-transition.opacity\n\t     @click=\"closeCart()\"\n\t     aria-hidden=\"true\"\n\t     style=\"display:none\"><\/div>\n\n\t<button type=\"button\"\n\t        class=\"cwv5__cart-bar\"\n\t        @click=\"toggleCart()\"\n\t        :aria-expanded=\"cartOpen.toString()\"\n\t        aria-controls=\"cwv5-cart-drawer\">\n\t\t<span class=\"cwv5__cart-bar-icon\" aria-hidden=\"true\">\n\t\t\t<svg width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t<circle cx=\"9\" cy=\"21\" r=\"1\"><\/circle>\n\t\t\t\t<circle cx=\"20\" cy=\"21\" r=\"1\"><\/circle>\n\t\t\t\t<path d=\"M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/span>\n\t\t<span class=\"cwv5__cart-bar-count\" x-show=\"items.length > 0\" x-text=\"itemCount\"><\/span>\n\t\t<span class=\"cwv5__cart-bar-label\" x-show=\"items.length === 0\">Panier vide<\/span>\n\t\t<span class=\"cwv5__cart-bar-total\" x-show=\"items.length > 0\" x-text=\"formatPrice(total)\"><\/span>\n\t\t<span class=\"cwv5__cart-bar-cta\" x-text=\"cartOpen ? 'Fermer' : 'Voir'\"><\/span>\n\t<\/button>\n\n\t<!-- Popup d\u00e9tail produit, partag\u00e9 entre les 2 carousels (menus + boissons).\n\t     Position: fixed \u2192 pas clipp\u00e9 par l'overflow du carousel. Affich\u00e9 au-dessus\n\t     de la card actuellement \u00ab hovered \u00bb (desktop) ou ouverte via le bouton\n\t     \u00ab i \u00bb (mobile). Le contenu = image (si dispo) + nom + description.\n\t     `pointer-events: none` pour que le curseur passe au-travers (= ne pas\n\t     interf\u00e9rer avec le hover sur la card en-dessous). -->\n\t<div class=\"cwv5__popup-detail\"\n\t     x-show=\"hoveredProduct() !== null\"\n\t     :style=\"popupDetailStyle()\"\n\t     x-cloak>\n\t\t<template x-if=\"hoveredProduct() && hoveredProduct().image\">\n\t\t\t<img class=\"cwv5__popup-detail-img\" :src=\"hoveredProduct().image\" :alt=\"hoveredProduct().name\">\n\t\t<\/template>\n\t\t<strong class=\"cwv5__popup-detail-title\" x-text=\"(hoveredProduct() || {}).name || ''\"><\/strong>\n\t\t<p class=\"cwv5__popup-detail-desc\" x-html=\"(hoveredProduct() || {}).description || ''\"><\/p>\n\t<\/div>\n<\/div>\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-reservation.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-587","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Booking - Bus Toqu\u00e9 restaurant - 4 options to choose from<\/title>\n<meta name=\"description\" content=\"Would you like to make a booking on the Toqu\u00e9 Bus? Nothing could be easier, just visit our website or call us at 06 21 40 20 41.\" \/>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Booking - Bus Toqu\u00e9 restaurant - 4 options to choose from\" \/>\n<meta property=\"og:description\" content=\"Would you like to make a booking on the Toqu\u00e9 Bus? Nothing could be easier, just visit our website or call us at 06 21 40 20 41.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/devovh.bustoque.fr\/en\/booking\/\" \/>\n<meta property=\"og:site_name\" content=\"Bus Toqu\u00e9\" \/>\n<meta property=\"article:modified_time\" content=\"2021-04-12T09:35:50+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/devovh.bustoque.fr\/en\/booking\/\",\"url\":\"https:\/\/devovh.bustoque.fr\/en\/booking\/\",\"name\":\"Booking - Bus Toqu\u00e9 restaurant - 4 options to choose from\",\"isPartOf\":{\"@id\":\"https:\/\/devovh.bustoque.fr\/#website\"},\"datePublished\":\"2016-09-14T09:11:06+00:00\",\"dateModified\":\"2021-04-12T09:35:50+00:00\",\"description\":\"Would you like to make a booking on the Toqu\u00e9 Bus? Nothing could be easier, just visit our website or call us at 06 21 40 20 41.\",\"breadcrumb\":{\"@id\":\"https:\/\/devovh.bustoque.fr\/en\/booking\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/devovh.bustoque.fr\/en\/booking\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/devovh.bustoque.fr\/en\/booking\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/devovh.bustoque.fr\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Booking\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/devovh.bustoque.fr\/#website\",\"url\":\"https:\/\/devovh.bustoque.fr\/\",\"name\":\"Bus Toqu\u00e9\",\"description\":\"La table la mieux situ\u00e9e de Paris\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/devovh.bustoque.fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Booking - Bus Toqu\u00e9 restaurant - 4 options to choose from","description":"Would you like to make a booking on the Toqu\u00e9 Bus? Nothing could be easier, just visit our website or call us at 06 21 40 20 41.","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"Booking - Bus Toqu\u00e9 restaurant - 4 options to choose from","og_description":"Would you like to make a booking on the Toqu\u00e9 Bus? Nothing could be easier, just visit our website or call us at 06 21 40 20 41.","og_url":"https:\/\/devovh.bustoque.fr\/en\/booking\/","og_site_name":"Bus Toqu\u00e9","article_modified_time":"2021-04-12T09:35:50+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/devovh.bustoque.fr\/en\/booking\/","url":"https:\/\/devovh.bustoque.fr\/en\/booking\/","name":"Booking - Bus Toqu\u00e9 restaurant - 4 options to choose from","isPartOf":{"@id":"https:\/\/devovh.bustoque.fr\/#website"},"datePublished":"2016-09-14T09:11:06+00:00","dateModified":"2021-04-12T09:35:50+00:00","description":"Would you like to make a booking on the Toqu\u00e9 Bus? Nothing could be easier, just visit our website or call us at 06 21 40 20 41.","breadcrumb":{"@id":"https:\/\/devovh.bustoque.fr\/en\/booking\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/devovh.bustoque.fr\/en\/booking\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/devovh.bustoque.fr\/en\/booking\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/devovh.bustoque.fr\/en\/"},{"@type":"ListItem","position":2,"name":"Booking"}]},{"@type":"WebSite","@id":"https:\/\/devovh.bustoque.fr\/#website","url":"https:\/\/devovh.bustoque.fr\/","name":"Bus Toqu\u00e9","description":"La table la mieux situ\u00e9e de Paris","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/devovh.bustoque.fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/pages\/587","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/comments?post=587"}],"version-history":[{"count":1,"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/pages\/587\/revisions"}],"predecessor-version":[{"id":588,"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/pages\/587\/revisions\/588"}],"wp:attachment":[{"href":"https:\/\/devovh.bustoque.fr\/en\/wp-json\/wp\/v2\/media?parent=587"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}