Cal.com - Widget Integre (embed)

// Listener JavaScript a mettre dans un tag Custom HTML (GTM)
// Declencheur : All Pages ou Page URL contient la page avec Cal.com

<script>
  (function() {
    var lastCalEvent = "";

    window.addEventListener("message", function(e) {
      var d = e.data;

      // Cal.com envoie un objet : { type, namespace, fullType, data }
      // fullType commence toujours par "CAL:" (ex : "CAL::bookingSuccessfulV2")
      if (!d || typeof d !== "object") return;
      if (typeof d.fullType !== "string" || d.fullType.indexOf("CAL:") !== 0) return;

      // Les events qui commencent par "__" sont techniques
      // (taille de l'iframe, navigation interne) : on les ignore
      if (!d.type || d.type.indexOf("__") === 0) return;

      // availabilityLoaded se repete en rafale : on ignore
      // un event identique au precedent
      if (d.type === lastCalEvent) return;
      lastCalEvent = d.type;

      window.dataLayer.push({
        event: "calcom",
        calcom_event: d.type,
        calcom_data: d.data || {}
      });
    });
  })();
</script>

// Les events Cal.com, dans l'ordre ou ils arrivent (valeur de calcom_event) :

// navigatedToBooker  -> Le widget ouvre le calendrier
// linkReady          -> Le widget est charge et affiche
// bookerViewed       -> Le visiteur voit le calendrier
// bookerReady        -> Les creneaux sont prets
// availabilityLoaded -> Les disponibilites sont chargees
//                       (se repete souvent : pas une etape de funnel)

// bookingSuccessfulV2
//    -> CONVERSION : le rendez-vous est confirme !
//    calcom_data contient uid, title, startTime, endTime, status...

// bookingSuccessful
//    -> Ancienne version du meme event, envoyee juste avant.
//    Ne la compte pas, sinon chaque RDV compte double.

// Plus rares : rescheduleBookingSuccessfulV2 (RDV deplace),
// bookingCancelled (RDV annule), linkFailed (le widget n'a pas pu charger)

// Configuration GTM pour Cal.com :
//
// Trigger : Custom Event
// Event name : calcom
// Condition : calcom_event egal a bookingSuccessfulV2
//
// Variables Data Layer :
//   calcom_event
//   calcom_data.uid   (identifiant unique du RDV)
//
// Tag GA4 Event :
// Event name : calendar_booking
// Parametres :
//   calendar_tool = "calcom"
//   booking_id = {{DLV - calcom_data.uid}}

// Attention : n'envoie pas calcom_data.title a GA4. Par defaut, Cal.com
// y met le nom du prospect, et GA4 interdit les donnees personnelles.

// Dans GA4, marque calendar_booking comme evenement cle (conversion).