poodle

Beagle Services Poodle Scheduler Launcher

How

yarn add -E @beagleservices/poodle

OR

npm install -E @beagleservices/poodle

import { launchPoodleInPage } from "@beagleservices/poodle";

// "my-css-selector" is any valid document.querySelector but it
// MUST ALREADY BE IN THE DOM. Poodle will be embedded into this element.
//
// Your partner code is given to you by Beagle Services.
// Customer and Address IDs are optional and are used to inform your system.
// Beagle Services does not consume your IDs for any purpose.

// To launch Poodle in the page with no pre-filled information
launchPoodleInPage("my-css-selector", "MY-BEAGLE-PARTNER-CODE");

// To launch Poodle in the page with pre-filled information for a Customer and Address
launchPoodleInPage("my-css-selector", "MY-BEAGLE-PARTNER-CODE", {
  customer: {
    id: "YOUR-SYSTEM-CUSTOMER-ID",
    firstName: "John",
    lastName: "Doe",
    email: "[email protected]",
    phoneNumber: "1234567890",
  },
  address: {
    id: "YOUR-SYSTEM-ADDRESS-ID",
    address1: "123 Test Street",
    address2: "Unit 12",
    city: "Los Angeles",
    zipCode: "12345",
  },
});

import { addJobBookingPreparedListener, PoodleJobBooking } from "@beagleservices/poodle";

onComponentMounted() {
    // Under-the-hood uses window.addEventListener("message")
    // be aware of this implementation detail in case your code
    // is doing interesting things with window messages.
    const jobPreparedListener = addJobBookingPreparedListener(
      (data: PoodleJobBooking /*, fullMessage: PoodleMessage<PoodleJobBooking> */) => {
        const { customer, address, jobName, timeslot } = data;
        ...

        // An optional second parameter exists which provides the full message
        // as a PoodleMessage<PoodleJobBooking> type
      }
    );
}

onComponentUnmounted() {
    jobPreparedListener.remove();
}

import { addJobBookingCompletedListener, PoodleJobBooking } from "@beagleservices/poodle";

onComponentMounted() {
    // Under-the-hood uses window.addEventListener("message")
    // be aware of this implementation detail in case your code
    // is doing interesting things with window messages.
    const jobBookedListener = addJobBookingCompletedListener(
      (data: PoodleJobBooking /*, fullMessage: PoodleMessage<PoodleJobBooking> */) => {
        const { customer, address, jobName, timeslot } = data;
        ...

        // An optional second parameter exists which provides the full message
        // as a PoodleMessage<PoodleJobBooking> type
      }
    );
}

onComponentUnmounted() {
    jobBookedListener.remove();
}