Design System

Vonigo Scheduler Module

The Vonigo module should be used for both JL and HGE sites. The module has two options:

  • The first option enables Google Tag Manager events. These custom events can be used as triggers in GTM. See the form events section below for event names.
  • The second option is used to enable form logging. This adds the functonality to listen to form input and save data to our DB as a way of capturing incomplete form data. Whenever a field is changed (and valid), it’s value gets pushed to our DB via an AJAX call.

Form Functionality

  • Check to see if your site’s domain is mapped to a Vonigo franchise ID in the franchise checker tool. This will ensure the lead gets mapped to the proper company in Portal.
  • In order for the JL address autocomplete field to work, it needs access to Google Maps API. To grant access for your domain add it to “Website Restrictions” in Google Cloud Platform. Details in task.

Form Events

Base Events

newBooking -> Fires when the data is successfully sent to Vonigo.

formError -> Fires anytime an error occurs and the error screen is shown.

formLoaded -> Fires when the Vue app is mounted (form is completely loaded).

Junkluggers Events

stepContactLoaded -> fires the first time the “Contact Information” step is accessed

stepServicesLoaded -> fires the first time the “Service Details” step is accessed.

stepSchedulerLoaded -> fires the first time the “Schedule Appointment” step is accessed.

stepReviewLoaded -> fires the first time the review screen is accessed.

formClose -> fires when the user closes the tab/window before submission.

Hello Garage Events

stepSignupLoaded -> fires when the signup form loads for out-of-service-area zips.

stepContactLoaded -> fires the first time the “Contact Information” step is accessed

stepSchedulerLoaded -> fires the first time the appointment scheduler step is accessed.

stepDetailsLoaded -> fires the first time the last screen is accessed. This is the screen where a comment can be entered.