1 Usage
2 Event
3 Common events for Tire Widgets
- 3.1 onResultsReviseClicked
- 3.2 onTireSearchResults
- 3.3 onTireSelect
4 Order form
- 4.1 onOrderClick
- 4.2 onOrderInitiated
- 4.3 onOrder_DateClicked
- 4.4 onOrder_DateSelected
- 4.5 onOrderSubmitted
5 Appointment Request Form
- 5.1 onAppointmentClick
- 5.2 onAppointmentInitiated
- 5.3 onAppointment_DateClicked
- 5.4 onAppointment_DateSelected
- 5.5 onAppointmentSubmitted
6 Widget Locator
- 6.1 onLocationChanged
7 POS Widget
- 7.1 onSummaryInitiated
- 7.2 onSupplierOrderSubmitted
8 Service appointment widget
- 8.1 onLocationChanged
- 8.2 onVehicleSelected
- 8.3 onAppointmentServicesUpdated
- 8.4 onAppointmentLightsUpdated
- 8.5 onAppointmentSymptomsUpdated
- 8.6 onAppointmentDateSelected
- 8.7 onAppointmentContinue
- 8.8 onAppointmentSubmitted
9 Wheel Widget
- 9.1 onResultsReviseClicked
- 9.2 onTireSelect
- 9.3 onWheelSelect
- 9.4 onWheelSearchResults
- 9.5 onSummaryInitiated
- 9.6 Appointment Request Form
  - 9.6.1 onAppointmentClick
  - 9.6.2 onAppointmentInitiated
  - 9.6.3 onAppointmentSubmitted
- 9.7 Date & time selection events
  - 9.7.1 onDateFieldClicked
  - 9.7.2 onDateFieldSelected
- 9.8 Order form
  - 9.8.1 onOrderClick
  - 9.8.2 onOrderInitiated
  - 9.8.3 onOrderSubmitted

Usage

User should call method .on for TCWidget, passing an event name and a callback handler as arguments. Method can be called before and/or after the .init method. User is able to add as many callbacks as he needs.

Sample of adding a callback handler:

<script>
var widget
TCWidget.init({
    apikey: '[your apikey]',
    container: 'content',
}).then(function(widget) {
    widget.on('onOrderClick', function(event) {
        log('onOrderClick', event);
        event.resolve()
    });
});

function log(eventId, event) {
  console.log(eventId, event);
}

</script>

Full usage example might look like this:

<div id="content"></div>

<script>
var widget
TCWidget.init({
    apikey: '[your apikey]',
    container: 'content',
}).then(function(widget) {
    widget.on('onOrderClick', function(event) {
        log('onOrderClick', event);
        event.resolve()
    });
});

function log(eventId, event) {
  console.log(eventId, event);
}

</script>

NOTE: Some exceptions might be occasions where data is still unknown, so empty objects or fields will be provided.

Event

Event object, that is passed inside every callback has a structure:

{
    data: {}, // can be empty object, or contain other data
    resolve: function() { ... },
    reject: function() { ... },
}

Where data field is an immutable object possibly containing some data inside. It's read-only, and attempts to write inside it will not succeed.

resolve is a method that signals that event has succeded, and application should continue it's execution flow. It can be used to pass additional/modified data inside the application.
reject is a method that prevents usual application execution flow. Can be used to block some user-interactions or any other proceeses related to a particular event.

Effects of all those fields for particular occasions will be covered in more detail for every event below.

Common events for Tire Widgets

onResultsReviseClicked

Description

Gets triggered when user clicks on Revise search button or Find your tires button in breadcrumbs. Works for all widget types

Properties

Type	Effect

Type	Effect
resolvable	Search page will be opened as usual
rejectable	Prevents page from opening

Example

then(function(widget) {
    widget.on('onResultsReviseClicked', function(event) {
        log('onResultsReviseClicked', event);
        event.resolve()
        // event.reject();
    });
});

Data example (vary according to search method)

// Search by size

{
  "searchBy": "size",
  "searchParams": {
    "width": "205",
    "height": "55",
    "rim": "16",
    "loadIndex": "",
    "speedRating": "",
    "acesId": "",
    "baseAcesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  }
}


// Search by Size Double

{
  "searchBy": "size",
  "searchParams": {
    "width": {
      "f": "205",
      "r": "215"
    },
    "height": {
      "f": "55",
      "r": "45"
    },
    "rim": {
      "f": "16",
      "r": "17"
    },
    "loadIndex": "",
    "speedRating": "",
    "acesId": "",
    "baseAcesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "minQuantity": 1,
    "suppliers": []
  }
}

// Search by vehicle

{
  "searchBy": "vehicle",
  "searchParams": {
    "year": "2020",
    "make": "BMW",
    "model": "230i",
    "trim": "Coupe",
    "carTireId": "162340",
    "acesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  }
}

// Search by Vehicle with staggered fitment sizes

{
  "searchBy": "vehicle",
  "searchParams": {
    "year": "2016",
    "make": "BMW",
    "model": "320i",
    "trim": "Base",
    "carTireId": "141550||141551",
    "acesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "minQuantity": 1,
    "suppliers": []
  }
}

// Search by Raw Size

{
  "searchBy": "rawSize",
  "searchParams": {
    "size": "2055516",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "minQuantity": 1,
    "suppliers": []
  }
}

// Search by Part Number

{
  "searchBy": "partNumber",
  "searchParams": {
    "partNumbers": [
      "000240"
    ],
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "minQuantity": 1,
    "suppliers": [
      "km"
    ]
  }
}

// Search by VIN

{
  "searchBy": "vin",
  "searchParams": {
    "year": "2012",
    "make": "Kia",
    "model": "Rondo",
    "trim": "EX Premium",
    "carTireId": "103728",
    "acesId": "193299",
    "vin": "KNAHH8A82C7398318",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "minQuantity": 4,
    "suppliers": [
      "communitywholesaletire",
      "km"
    ]
  }
}

// Search by State & License Plate

{
  "searchBy": "license",
  "searchParams": {
    "year": "2013",
    "make": "Volkswagen",
    "model": "Tiguan",
    "trim": "S",
    "carTireId": "114435",
    "acesId": "200209",
    "license": "12345",
    "state": "SD",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "minQuantity": 4,
    "suppliers": [
      "communitywholesaletire",
      "km"
    ]
  }
}

onTireSearchResults

Description

Gets triggered when user clicks on Find your Tires now and there was a search. Works for all widget types

Properties

Type	Effect

Type	Effect
resolvable	Results page will be opened as usual and user will see all matching tires

Example

then(function(widget) {
    widget.on('onTireSearchResults', function(event) {
        log('onTireSearchResults', event);
        event.resolve()
    });
});

Data example (vary according to search method)

// Search by size

{
  "searchBy": "size",
  "searchParams": {
    "width": "205",
    "height": "55",
    "rim": "16",
    "loadIndex": "",
    "speedRating": "",
    "acesId": "",
    "baseAcesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  },
  "vehicle": {},
  "totalTireResults": 109
}


// Search by Size Double

{
  "searchBy": "size",
  "searchParams": {
    "width": {
      "f": "205",
      "r": "215"
    },
    "height": {
      "f": "55",
      "r": "45"
    },
    "rim": {
      "f": "16",
      "r": "17"
    },
    "loadIndex": "",
    "speedRating": "",
    "acesId": "",
    "baseAcesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  },
  "vehicle": {},
  "totalTireResults": 58
}

// Search by vehicle

{
  "searchBy": "vehicle",
  "searchParams": {
    "year": "2020",
    "make": "Audi",
    "model": "A3",
    "trim": "Premium Plus Sedan",
    "carTireId": "165316",
    "acesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  },
  "vehicle": {
    "make": "Audi",
    "model": "A3",
    "year": "2020",
    "trim": "Premium Plus Sedan"
  },
  "totalTireResults": 54
}

// Search by Vehicle with staggered fitment sizes

{
  "searchBy": "vehicle",
  "searchParams": {
    "year": "2020",
    "make": "BMW",
    "model": "330i",
    "trim": "Base",
    "carTireId": "166271||166272",
    "acesId": "",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  },
  "vehicle": {
    "make": "BMW",
    "model": "330i",
    "year": "2020",
    "trim": "Base"
  },
  "totalTireResults": 10
}

// Search by Raw Size

{
  "searchBy": "rawSize",
  "searchParams": {
    "size": "2055516",
    "locationId": 22592,
    "searchBy": "rawSize",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "suppliers": []
  },
  "vehicle": {},
  "totalTireResults": 109
}

// Search by Part Number

{
  "searchBy": "partNumber",
  "searchParams": {
    "partNumbers": [
      "000240"
    ],
    "locationId": 22592,
    "searchBy": "partNumber",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "suppliers": []
  },
  "vehicle": {},
  "totalTireResults": 1
}

// Search by VIN

{
  "searchBy": "vin",
  "searchParams": {
    "year": "2012",
    "make": "Kia",
    "model": "Rondo",
    "trim": "LX",
    "carTireId": "103725",
    "acesId": "193171",
    "vin": "KNAHH8A82C7398318",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  },
  "vehicle": {
    "make": "Kia",
    "model": "Rondo",
    "year": "2012",
    "trim": "LX"
  },
  "totalTireResults": 62
}

// Search by State & License Plate

{
  "searchBy": "license",
  "searchParams": {
    "year": "2013",
    "make": "Volkswagen",
    "model": "Tiguan",
    "trim": "S",
    "carTireId": "114435",
    "acesId": "200209",
    "license": "12345",
    "state": "SD",
    "orderBy": "best_match",
    "filters": {},
    "display": "full",
    "locationId": 22592,
    "suppliers": []
  },
  "vehicle": {
    "make": "Volkswagen",
    "model": "Tiguan",
    "year": "2013",
    "trim": "S"
  },
  "totalTireResults": 43
}

onTireSelect

Description

Gets triggered when user clicks on Select tire (See out-the-door-price) button. Works for all widget types

Properties

Type	Effect

Type	Effect
resolvable	Summary page will be opened as usual
rejectable	Prevents page from opening

Example

then(function(widget) {
    widget.on('onTireSelect', function(event) {
        log('onTireSelect', event);
        event.resolve()
        // event.reject();
    });
});

Data example

{
  "tires": [
    {
      "id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
      "brand": "Bridgestone",
      "model": "Potenza RE 760 Sport w/UNI-T",
      "modelLegal": "Potenza RE 760 Sport w/UNI-T",
      "partNumber": "079212",
      "partNumberOriginal": "79212",
      "size": "215/45R17 91W XL",
      "sizeShort": "215/45R17/XL",
      "sizeW": 215,
      "sizeH": 45,
      "sizeR": 17,
      "prefix": null,
      "suffix": null,
      "utqg": {
        "wear": "340",
        "traction": "A",
        "temp": "A"
      },
      "speedRating": "W",
      "loadIndex": 91,
      "loadIndexDual": null,
      "category": "Performance",
      "categoryLabel": "Performance Summer",
      "runFlat": false,
      "price": 144.32,
      "tax": 5.7728,
      "fet": 31.28,
      "fetSource": "vendor",
      "quantity": 25,
      "isInStock": false,
      "stock": [
        {
          "branch": "Test Branch 01",
          "id": "Test Branch 01",
          "quantity": 6,
          "name": "Test Branch 01",
          "branchType": null,
          "delivery_date_time":{
                     "date":"2024-04-24",
                     "time":"17:00:00",
                     "timezone":"-07:00",
                     "notes":null
                  },
                  "cutoff":{
                     "date":"2024-04-17",
                     "time":"07:00:00",
                     "timezone":"-07:00"
                  }
        },
        {
          "branch": "Test Branch 02",
          "id": "Test Branch 02",
          "quantity": 7,
          "name": "Test Branch 02",
          "branchType": null,
          "deliveryDateTime": null,
          "cutoff": null
        }
      ],
      "mileageRating": null,
      "kilometerRating": null,
      "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
      "marketing": {
        "features": [
          {
            "feature": "Designed for sports, passenger and compact tuner cars",
            "benefit": "Semi-slick shoulder design maximizes cornering grip"
          },
          {
            "feature": "Technologies for handling, response and control",
            "benefit": "Wide straight grooves to maximize wet weather traction"
          },
          {
            "feature": "W Speed Rating",
            "benefit": "3D Center Block increases contact with the road"
          }
        ],
        "marketingStatement": null
      },
      "supplier": {
        "price": 144.32,
        "cost": null,
        "quantity": 25,
        "tireId": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
        "supplier": {
          "name": "testfeed"
        },
        "isInStock": false
      },
      "altSuppliers": [],
      "orderingType": null,
      "mS": false,
      "3Pmsf": false,
      "position": null,
      "application": [],
      "extraCharacteristics": [],
      "deliveryDateTime": null,
      "treadDepth": "10.0",
      "locationId": 22592,
      "dealerId": 13542,
      "layoutType": "any",
      "loadRange": "XL",
      "sideWallStyle": "BSW",
      "sizeType": "Eurometric",
      "categoryId": 12,
      "lightTruck": false,
      "minAdvertizedPrice": null,
      "season": "Summer",
      "seasonId": 3,
      "tireType": "Passenger",
      "cost": null,
      "euTyreLabel": null,
      "media": {
        "images": [],
        "videos": [],
        "syndigoId": 189558
      },
      "brandLogo": "https://wl.tireconnect.ca/uploads/brand/968102cd18d8351db8fc35f7a148146d7957abad.png",
      "discount": null,
      "rebates": [],
      "isOem": false,
      "isTop": false,
      "gradeType": null,
      "externalInfo": {
        "marketing": {
          "statement": "The Bridgestone RE760 Sport is designed to enhance your ride with impressive grip and stability in wet and dry conditions. You’ll be sure to have a comfortable ride with this tire.",
          "features": [],
          "images": [
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/tread.png",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/large.jpg",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/quick-look.png",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/front.jpg",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/tilted.jpg",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/hero.png",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/side.jpg",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/bottom-tread.jpg",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/trio.png",
            "https://www.bridgestonetire.com:443/tireimage/potenza-re760-sport/360.jpg"
          ],
          "warranties": "https://www.bridgestonetire.com/customer-care/tire-warranties/full-warranty"
        },
        "rating": {
          "averageRating": 4.3,
          "totalReviews": 351
        }
      },
      "selectedQuantity": 4
    }
  ],
  "vehicle": {
    "carTireId": "524765",
    "make": "Acura",
    "model": "ILX",
    "trim": "Base",
    "year": "2020"
  }
}

Order form

Pretty much all order events share the same data structure, as provided below

{
  "location": {
    "external_id": "111111"
  },
  "quote": {
    "tax": 47.7091,
    "price": 1290.44,
    "sub_total": 1192.73,
    "tires": [
      {
        "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
        "layout_type": "any",
        "supplier": "testfeed",
        "brand": "Bridgestone",
        "model": "Potenza RE 760 Sport w/UNI-T",
        "part_number": "079212",
        "category": {
          "id": 12,
          "value": "Performance",
          "label": "Performance Summer"
        },
        "season": {
          "id": 3,
          "value": "Summer"
        },
        "size_h": 45,
        "size_r": 17,
        "size_w": 215,
        "size": "215/45R17 91W XL",
        "size_type": "Eurometric",
        "tire_type": "Passenger",
        "load_range": "XL",
        "supplier_details": {
          "id": "testfeed",
          "name": "Test Feed",
          "stock": [
            {
              "branch": "Test Branch 01",
              "id": "Test Branch 01",
              "quantity": 6,
              "name": "Test Branch 01",
              "branchType": null,
              "delivery_date_time":{
                     "date":"2024-04-24",
                     "time":"17:00:00",
                     "timezone":"-07:00",
                     "notes":null
                  },
                  "cutoff":{
                     "date":"2024-04-17",
                     "time":"07:00:00",
                     "timezone":"-07:00"
                  }
            },
            {
              "branch": "Test Branch 02",
              "id": "Test Branch 02",
              "quantity": 7,
              "name": "Test Branch 02",
              "branchType": null,
              "deliveryDateTime": null,
              "cutoff": null
            }
          ]
        },
        "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
        "quantity": 4,
        "price": 144.32,
        "fet": 30.29,
        "fet_source": "vendor",
        "tread_depth": "10.0"
      }
    ],
    "services": [
      {
        "key": "wheel_alignment",
        "name": "Wheel Alignment",
        "total_price": 57.73
      },
      {
        "key": "nitrogen_fill",
        "name": "Nitrogen Fill",
        "total_price": 100
      },
      {
        "key": "supply_fee",
        "name": "Shop Supply Fee",
        "total_price": 50
      },
      {
        "key": "steel_wheel",
        "name": "Steel Wheel",
        "total_price": 400
      },
      {
        "key": "seasonal_tire_storage",
        "name": "Seasonal Tire Storage",
        "total_price": 57.72
      }
    ],
    "discount": null
  },
  "customer": {
    "address_line_1": "",
    "address_line_2": "",
    "postal_code": "",
    "province": "",
    "city": "",
    "name": "",
    "email": "",
    "phone": "",
    "notes": "",
    "vehicle": {
      "year": "2020",
      "make": "Acura",
      "model": "ILX",
      "trim": "Base"
    },
    "way_to_contact": "",
    "preferred_time": ""
  }
}

onOrderClick

Description

Gets triggered when user clicks on Order button, on summary page

Properties

Type	Effect

Type	Effect
rejectable	prevents page from opening

onOrderInitiated

Description

Gets triggered when page gets initiated.

onOrder_DateClicked

Description

Gets triggered when user clicks on Order button, on summary page

Properties

Type	Effect

Type	Effect
resolvable	Opens calendar, but user can inject custom `customer.preferred_time`
rejectable	Pevents calendar from opening, user also can inject custom `customer.preferred_time`

Example

// reject event, and push custom data
then(function(widget) {
    widget.on('onOrder_DateClicked', function(event) {
        showMyCustomCalendar({
        onDateSelected: function(date) {
            // make sure to format date like this: '2018-02-23 02:30'
            event.reject({ customer: { preferred_time: date }})
        }
    });
});

onOrder_DateSelected

Description

Gets triggered when user clicks on Order button, on summary page

Properties

Type	Effect

Type	Effect
resolvable	User can inject custom `customer.preferred_time` (overriding)

Example

// listen to event, and override to a provided date
then(function(widget) {
    widget.on('onOrder_DateSelected', function(event) {
        event.resolve({ customer: { preferred_time: '2018-02-23 02:30' }})
    });
});

onOrderSubmitted

Description

Gets triggered when user clicks on Order button, on summary page

Properties

None

Appointment Request Form

Same as with orders, all appointment events share the same data structure, as provided below

{
  "location": {
    "external_id": "111111"
  },
  "quote": {
    "tax": 47.7091,
    "price": 1290.44,
    "sub_total": 1192.73,
    "tires": [
      {
        "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
        "layout_type": "any",
        "supplier": "testfeed",
        "brand": "Bridgestone",
        "model": "Potenza RE 760 Sport w/UNI-T",
        "part_number": "079212",
        "category": {
          "id": 12,
          "value": "Performance",
          "label": "Performance Summer"
        },
        "season": {
          "id": 3,
          "value": "Summer"
        },
        "size_h": 45,
        "size_r": 17,
        "size_w": 215,
        "size": "215/45R17 91W XL",
        "size_type": "Eurometric",
        "tire_type": "Passenger",
        "load_range": "XL",
        "supplier_details": {
          "id": "testfeed",
          "name": "Test Feed",
          "stock": [
            {
              "branch": "Test Branch 01",
              "id": "Test Branch 01",
              "quantity": 6,
              "name": "Test Branch 01",
              "branchType": null,
              "delivery_date_time":{
                     "date":"2024-04-24",
                     "time":"17:00:00",
                     "timezone":"-07:00",
                     "notes":null
                  },
                  "cutoff":{
                     "date":"2024-04-17",
                     "time":"07:00:00",
                     "timezone":"-07:00"
                  }
            },
            {
              "branch": "Test Branch 02",
              "id": "Test Branch 02",
              "quantity": 7,
              "name": "Test Branch 02",
              "branchType": null,
              "deliveryDateTime": null,
              "cutoff": null
            }
          ]
        },
        "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
        "quantity": 4,
        "price": 144.32,
        "fet": 29.29,
        "fet_source": "vendor",
        "tread_depth": "10.0"
      }
    ],
    "services": [
      {
        "key": "wheel_alignment",
        "name": "Wheel Alignment",
        "total_price": 57.73
      },
      {
        "key": "nitrogen_fill",
        "name": "Nitrogen Fill",
        "total_price": 100
      },
      {
        "key": "supply_fee",
        "name": "Shop Supply Fee",
        "total_price": 50
      },
      {
        "key": "steel_wheel",
        "name": "Steel Wheel",
        "total_price": 400
      },
      {
        "key": "seasonal_tire_storage",
        "name": "Seasonal Tire Storage",
        "total_price": 57.72
      }
    ],
    "discount": null,
    "appointment_number": null
  },
  "customer": {
    "name": "",
    "email": "",
    "phone": "",
    "notes": "",
    "vehicle": {
      "year": "2020",
      "make": "Acura",
      "model": "ILX",
      "trim": "Base"
    },
    "way_to_contact": "",
    "preferred_time": ""
  }
}

NOTE: Some exceptions might be occasions where data is still unknown, so empty objects or fields will be provided.

onAppointmentClick

Description

Gets triggered when user clicks on Appointment button, on summary page

Properties

Type	Effect

Type	Effect
rejectable	prevents page from opening

onAppointmentInitiated

Description

Gets triggered when page gets initiated.

onAppointment_DateClicked

Description

Gets triggered when user clicks on preferred date field on the form.

Properties

Type	Effect

Type	Effect
resolvable	Opens calendar, but user can inject custom `customer.preferred_time`
rejectable	Pevents calendar from opening, user also can inject custom `customer.preferred_time`

Example

// reject event, and push custom data
then(function(widget) {
    widget.on('onAppointment_DateClicked', function(event) {
        showMyCustomCalendar({
        onDateSelected: function(date) {
            // make sure to format date like this: '2018-02-23 02:30'
            event.reject({ customer: { preferred_time: date }})
        }
    })
});

onAppointment_DateSelected

Description

Gets triggered when user selected a date in preferred date field.

Properties

Type	Effect

Type	Effect
resolvable	User can inject custom `customer.preferred_time` (overriding)

Example

// listen to event, and override to a provided date
then(function(widget) {
    widget.on('onResultsReviseClicked', function(event) {
        event.resolve({ customer: { preferred_time: '2018-02-23 02:30' }})
});

onAppointmentSubmitted

Description

Gets triggered when user selected a date in preferred date field.

Properties

None

Widget Locator

onLocationChanged

Description

Gets triggered when user selects a location in wiget locator.

Properties

None

Data example

{
  "location": {
    "id": 22592,
    "external_id": "111111",
    "is_active": true,
    "name": "Demo Location #1",
    "address_line_1": "725 5th Ave",
    "address_line_2": "",
    "city": "New York",
    "latitude": 40.7625,
    "longitude": -73.9739,
    "province": "New York",
    "province_code": "NY",
    "postal_code": "10022",
    "phone": "1111111111",
    "contact_name": "John Doe",
    "email": "t@t.com"
  }
}

POS Widget

onSummaryInitiated

Description

Gets triggered when page gets initiated.

Properties

None

Data example

{
   "tires":[
      {
         "id":"QnJpZGdlc3RvbmV8fDEzOTAxOHx8a218fDIyNTkyfHxC",
         "brand":"Bridgestone",
         "model":"Blizzak LM-32",
         "part_number":"139018",
         "price":150,
         "tax":6,
         "quantity":2,
         "image":"https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_blizzak_lm32_l.jpg",
         "supplier":"km",
         "speed_rating":"V",
         "load_index":91,
         "size":"215/45R17 91V XL",
         "size_w":215,
         "size_h":45,
         "size_r":17,
         "size_type":"Eurometric",
         "tire_type":"Passenger",
         "load_range":"XL",
         "category":{
            "id":9,
            "value":"Winter",
            "label":"Winter"
         },
         "season":{
            "id":4,
            "value":"Winter"
         },
         "supplier_details":{
            "id":"km",
            "name":"K&M",
            "stock":[
               {
                  "branch":"Primary",
                  "id":"Primary",
                  "quantity":1,
                  "name":"Primary",
                  "branch_type":"primary",
                  "delivery_date_time":{
                     "date":"2024-04-24",
                     "time":"17:00:00",
                     "timezone":"-07:00",
                     "notes":null
                  },
                  "cutoff":{
                     "date":"2024-04-17",
                     "time":"07:00:00",
                     "timezone":"-07:00"
                  }
               },
               {
                  "branch":"National",
                  "id":"National",
                  "quantity":1,
                  "name":"National",
                  "branch_type":"other",
                  "delivery_date_time":null,
                  "cutoff":null
               }
            ]
         },
         "fet":21.21,
         "fet_source":"tireconnect",
         "tread_depth":"11.0",
         "selected_quantity":2,
         "cost":105
      }
   ],
   "services":[
      {
         "key":"wheel_alignment",
         "name":"Wheel Alignment",
         "type":"Service",
         "total_price":30,
         "total_tax":1.2
      },
      {
         "key":"nitrogen_fill",
         "name":"Nitrogen Fill",
         "type":"Service",
         "total_price":100,
         "total_tax":4
      },
      {
         "key":"supply_fee",
         "name":"Shop Supply Fee",
         "type":"Fee",
         "total_price":50,
         "total_tax":0
      },
      {
         "key":"steel_wheel",
         "name":"Steel Wheel",
         "type":"Product",
         "total_price":200,
         "total_tax":8
      },
      {
         "key":"seasonal_tire_storage",
         "name":"Seasonal Tire Storage",
         "type":"Service",
         "total_price":30,
         "total_tax":1.2
      }
   ],
   "discount":null,
   "vehicle":{
      "car_tire_id":"524765",
      "make":"Acura",
      "model":"ILX",
      "trim":"Base",
      "year":"2020"
   }
}

onSupplierOrderSubmitted

Description

Gets triggered when supplier order submitted. Works both for successful and failed order.

Properties

None

Data example

{
  "branches_status": [
    {
      "branch_name": "TLC 167 SEATTLE (04/24/2024 05:00pm)",
      "status": "success", //can be "fail" for failed order
      "invoice": "22585607",
      "order_id": 1055808,
      "shipping_cost": 21.11,
      "cost": 24.77,
      "quantity": 1,
      "delivery_date_time": {
        "date": "2024-04-25",
        "time": "17:00:00",
        "timezone": "-04:00"
      }
    }
  ],
  "order_info": {
    "cost": 24.77,
    "quantity": 1,
    "total_cost": 24.77,
    "shipping_cost": 21.11,
    "total_order": 45.88,
    "vendor_total_order": 46.88 //can be null in case supplier didn't provide this info
  },
  "supplier_order_fields": {
    "po_number": "test from TireConnect"
  },
  "supplier": {
    "name": "tirehub",
    "nice_name": "TireHub",
    "cid": "TH"
  },
  "tire": {
    "brand": "Bridgestone",
    "model": "Blizzak WS80",
    "part_number": "013006",
    "size_h": 55,
    "size_r": 16,
    "size_w": 205,
    "size": "205/55R16 91H",
    "size_type": "Eurometric",
    "tire_type": "Passenger",
    "load_range": "SL",
    "image": "https://devdemo.tireconnect.ca/uploads/tires/pre_up/1/Bridgestone/images/bs_blizzak_ws80_l.jpg",
    "category": {
      "id": 9,
      "value": "Winter",
      "label": "Winter"
    },
    "season": {
      "id": 4,
      "value": "Winter"
    },
    "supplier_details": {
      "id": "tirehub",
      "name": "TireHub",
      "stock": [
        {
          "branch": "167",
          "id": "167",
          "quantity": 9980,
          "name": "TLC 167 SEATTLE (04/24/2024 05:00pm)",
          "branchType": "other",
          "deliveryDateTime": {
            "date": "2024-04-24",
            "time": "17:00:00",
            "timezone": "-07:00",
            "notes": null
          },
          "cutoff": {
            "date": "2024-04-17",
            "time": "07:00:00",
            "timezone": "-07:00"
          }
        }
      ]
    },
    "fet": 0,
    "fet_source": "tireconnect",
    "tread_depth": "11.0"
  }
}

Service appointment widget

Full usage example might look like this:

<script>
var widget
TCWidget.initServices({
    apikey: '[your apikey]',
    container: 'content',
}).then(function(widget) {
    widget.on('onLocationChanged', function(event) {
        log('onLocationChanged', event);
        event.resolve()
    });

    widget.on('onVehicleSelected', function(event) {
        log('onVehicleSelected', event);
        event.resolve()
    });

    widget.on('onAppointmentServicesUpdated', function(event) {
        log('onAppointmentServicesUpdated', event);
        event.resolve()
    });

    widget.on('onAppointmentLightsUpdated', function(event) {
        log('onAppointmentLightsUpdated', event);
        event.resolve()
    });

    widget.on('onAppointmentSymptomsUpdated', function(event) {
        log('onAppointmentSymptomsUpdated', event);
        event.resolve()
    });

    widget.on('onAppointmentDateSelected', function(event) {
        log('onAppointmentDateSelected', event);
        event.resolve()
    });

    widget.on('onAppointmentContinue', function(event) {
        log('onAppointmentContinue', event);
        event.resolve()
    });


   widget.on('onAppointmentSubmitted', function(event) {
        log('onAppointmentSubmitted', event);
        event.resolve()
    });
});

function log(eventId, event) {
  console.log(eventId, event);
}

</script>

onLocationChanged

Description

Gets triggered when user select/change location.

Response of this event different that for other events. Please see an example of event response below.

Data example

{
  "location": {
    "id": 22592,
    "external_id": "111111",
    "is_active": true,
    "name": "Demo Location #1",
    "address_line_1": "725 5th Ave",
    "address_line_2": "",
    "city": "New York",
    "latitude": 40.7625,
    "longitude": -73.9739,
    "province": "New York",
    "province_code": "NY",
    "postal_code": "10022",
    "phone": "1111111111",
    "contact_name": "John Doe",
    "email": "t@t.com"
  }
}

Main events

Has different response structure that onLocationChanged event. An example you can find below.

Pretty much all service events share the same data structure, as provided below

{
	location {
		external_id : 111111
	},
	service_appointment: {
		vehicle: {
			year: 2016,
			make: "Bentley",
			model: "Continental",
			trim: "GT"
		},
		services: [
			{
				id: 1,
				category_id: 1,
				category_name: "Brake Services",
				name: "Brake and Rotor Services",
				description: "Brake check is really important for your safety",
				link: "https://learnmore.com",
				link_label: "Learn More",
				price: {
					is_free: false,
					free_service_label: "Free",
					labor_price_type: "fixed",
					labor_price: 99.99,
					labor_price_range_from: 1,
					labor_price_range_to: 100
				}
			}
		],
		symptoms: [
			{
				name: "shaking",
				title: "Shaking"
			}
		],
		lights: [
			{
				name: "airbag",
				title: "Airbag"
			}
		],
		additional_information: "I need my car on Monday"
	}
	customer: {
		name: "John Doe",
		preffered_way_of_contact: "phone",
		email: "email@email.com",
		phone: "1234567890",
		address: "30 Via Renzo Drive",
		city: "Richmond Hill",
		state: "Ontario",
		zip: "L4S0B8",
		notes: "Call me",
		preffered_time: 1586447435, //timestamp
		time_selection: "mid-day",
		drop_off: "drop",
		towing: true
	},
	"tire_quote": {
    	"sub_total": 529.02,
    	"tax": 21.18,
    	"tire_total": 610.2,
    	"services": [
      	{
        	"name": "Tire Protection Plan",
        	"price": 10
      	},
      	{
        	"name": "Wheel Alignment",
        	"price": 26.58
      	},
      	{
        	"name": "Nitrogen Fill",
        	"price": 100
     	},
      	{
    	    "name": "Tire Recycling Fee",
    	    "price": 10
    	},
    	{
       		 "name": "Shop Supply Fee",
      		 "price": 50
    	},
		{
        	 "name": "Seasonal Tire Storage",
        	 "price": 26.6
      	},
      	{
        	 "name": "Valve Stem or TPMS Part Kit",
        	 "price": 100
      	}
    ],
    "tires": [
      {
        "name": "Westlake SA07",
        "category": "Performance Summer",
        "size": "205/50R17 89W",
        "part_number": "24385008",
        "utqg": "460 A A",
        "quantity": 4
      }
    ]
  }
}

onVehicleSelected

Description

Gets triggered when user select/change Year, Make & Model of vehicle

onAppointmentServicesUpdated

Description

Gets triggered when user select/change services

onAppointmentLightsUpdated

Description

Gets triggered when user select/change My Lights are On in symptoms widget under Tell us the symptoms category

onAppointmentSymptomsUpdated

Description

Gets triggered when user select/change My Car Symptoms in symptoms widget under Tell us the symptoms category

onAppointmentDateSelected

Description

Gets triggered when user selected a date in preferred date/time field

onAppointmentContinue

Description

Gets triggered when user click on Continue button on services page

onAppointmentSubmitted

Description

Gets triggered when user click on Request Appointment button on summary page

Wheel Widget

onResultsReviseClicked

Description

Gets triggered when user clicks on Revise search button.

Properties

Type	Effect

Type	Effect
resolvable	Search page will be opened as usual
rejectable	Prevents page from opening

Example

then(function(widget) {
    widget.on('onResultsReviseClicked', function(event) {
        log('onResultsReviseClicked', event);
        event.resolve()
        // event.reject();
    });
});

Data example (vary according to search method)

{
  "search_by": "vehicle",
  "search_by_vehicle": {
    "year": 2020,
    "make": "Acura",
    "model": "ILX",
    "body_type": "Sedan",
    "sub_model": "Base",
    "option": "Base",
    "diameter": "17",
    "opened_field": ""
  }
}

onTireSelect

Description

Gets triggered when user clicks on Add to package button.

Properties

Type	Effect

Type	Effect
resolvable	Summary page will be opened as usual
rejectable	Prevents page from opening

Example

then(function(widget) {
    widget.on('onTireSelect', function(event) {
        log('onTireSelect', event);
        event.resolve()
        // event.reject();
    });
});

Data example

{
  "tires": [
    {
      "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
      "layout_type": "any",
      "supplier": "testfeed",
      "brand": "Bridgestone",
      "model": "Potenza RE760 Sport",
      "part_number": "079212",
      "category": {
        "id": 12,
        "value": "Performance",
        "label": "Performance Summer"
      },
      "season": {
        "id": 3,
        "value": "Summer"
      },
      "size_h": 45,
      "size_r": 17,
      "size_w": 215,
      "size": "215/45R17 91W XL",
      "size_type": "Eurometric",
      "tire_type": "Passenger",
      "load_range": "XL",
      "fet": 11.11,
      "fet_source": "vendor",
      "tread_depth": "10.0",
      "supplier_details": {
        "id": "testfeed",
        "name": "testfeed",
        "stock": [
          {
            "branch": "Test Branch 01",
            "quantity": 6
          }
        ]
      },
      "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
      "quantity": 25,
      "price": 144.32
    }
  ],
  "vehicle": {
    "year": 2020,
    "make": "Acura",
    "model": "ILX",
    "body_type": "Sedan",
    "sub_model": "Base",
    "option": "Base"
  }
}

onWheelSelect

Description

Gets triggered when user clicks on View Details button.

Properties

Type	Effect

Type	Effect
resolvable	Summary page will be opened as usual
rejectable	Prevents page from opening

Example

then(function(widget) {
    widget.on('onWheelSelect', function(event) {
        log('onWheelSelect', event);
        event.resolve()
        // event.reject();
    });
});

Data example

{
  "wheels": [
    {
      "brand": "Pacer",
      "model": "793B Sequence",
      "part_number": "793B-7751842",
      "price": 114.04,
      "size": "17x7.5 5x100/5x114.3 ET42"
    }
  ],
  "vehicle": {
    "year": 2020,
    "make": "Acura",
    "model": "ILX",
    "body_type": "Sedan",
    "sub_model": "Base",
    "option": "Base"
  }
}

onWheelSearchResults

Description

Gets triggered when user clicks on Find your Wheels now and there was a search.

Properties

Type	Effect

Type	Effect
resolvable	Results page will be opened as usual and user will see all matching tires

Example

then(function(widget) {
    widget.on('onWheelSearchResults', function(event) {
        log('onWheelSearchResults', event);
        event.resolve()
    });
});

Data example

{
  "search_by": "vehicle",
  "search_params": {
    "year": 2020,
    "make": "Acura",
    "model": "ILX",
    "body_type": "Sedan",
    "sub_model": "Base",
    "option": "Base",
    "diameter": "17"
  },
  "vehicle": {
    "year": 2020,
    "make": "Acura",
    "model": "ILX",
    "body_type": "Sedan",
    "sub_model": "Base",
    "option": "Base"
  },
  "total_wheel_results": 37
}

onSummaryInitiated

Description

Gets triggered when page gets initiated.

Properties

None

Data example

{
  "tires": [
    {
      "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
      "layout_type": "any",
      "supplier": "testfeed",
      "brand": "Bridgestone",
      "model": "Potenza RE760 Sport",
      "part_number": "079212",
      "category": {
        "id": 12,
        "value": "Performance",
        "label": "Performance Summer"
      },
      "season": {
        "id": 3,
        "value": "Summer"
      },
      "size_h": 45,
      "size_r": 17,
      "size_w": 215,
      "size": "215/45R17 91W XL",
      "size_type": "Eurometric",
      "tire_type": "Passenger",
      "load_range": "XL",
      "fet": 0,
      "fet_source": "tireconnect",
      "tread_depth": "10.0",
      "supplier_details": {
        "id": "testfeed",
        "name": "testfeed",
        "stock": [
          {
            "branch": "Test Branch 01",
            "quantity": 6
          }
        ]
      },
      "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
      "quantity": 25,
      "price": 144.32
    }
  ],
  "wheels": [
    {
      "wheel_id": "13542|680|motiv|435g-7751840",
      "bolt_pattern": "5x100/5x114.3",
      "bore_max": "73.1",
      "bore_min": null,
      "brand_name": "Motiv",
      "color": "ANTHRACITE",
      "connection_id": 680,
      "dealer_id": 13542,
      "diameter": "17",
      "et": "40",
      "id": "13542|680|motiv|435g-7751840",
      "image_original": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94.jpg",
      "image_thumbnail": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94_200x300.jpg",
      "image_angle_original": null,
      "image_angle_thumbnail": null,
      "material": "Alloy",
      "model": "435G Foil",
      "part_number": "435G-7751840",
      "price": 115.46,
      "quantity": 12,
      "stock_branches": [
        {
          "address": null,
          "branch_id": "TB03",
          "name": "Test Branch 03",
          "quantity": 2
        }
      ],
      "supplier_part_number": null,
      "width": "7.5"
    }
  ],
  "services": [
    {
      "key": "seasonal_tire_storage",
      "name": "Seasonal Tire Storage",
      "total_price": 57.73
    },
    {
      "key": "wheel_alignment",
      "name": "Wheel Alignment",
      "total_price": 57.73
    },
    {
      "key": "nitrogen_fill",
      "name": "Nitrogen Fill",
      "total_price": 100
    },
    {
      "key": "supply_fee",
      "name": "Shop Supply Fee",
      "total_price": 50
    },
    {
      "key": "steel_wheel",
      "name": "Steel Wheel",
      "total_price": 400
    }
  ],
  "vehicle": {
    "year": 2020,
    "make": "Acura",
    "model": "ILX",
    "body_type": "Sedan",
    "sub_model": "Base",
    "option": "Base"
  }
}

Note: tires can be empty array in case it’s no tire in quote

Appointment Request Form

Same as with orders, all appointment events share the same data structure, as provided below

{
  "location": {
    "external_id": "111111"
  },
  "customer": {
    "first_name": "",
    "last_name": "",
    "phone_number": "",
    "email": "",
    "way_to_contact": "",
    "preferred_date_time": "",
    "notes": "",
    "address": {
      "country": "",
      "address_1": "",
      "address_2": "",
      "city": "",
      "province": "",
      "postal_code": ""
    },
    "vehicle": {
      "year": 2020,
      "make": "Acura",
      "model": "ILX",
      "body_type": "Sedan",
      "sub_model": "Base",
      "option": "Base"
    }
  },
  "quote": {
    "tax": 66.183,
    "price": 1770.76,
    "sub_total": 1654.58,
    "status": "not submitted",
    "order_number": "",
    "deposit_payment": 0,
    "outstanding_blance": 0,
    "wheels": [
      {
        "wheel_id": "13542|680|motiv|435g-7751840",
        "bolt_pattern": "5x100/5x114.3",
        "bore_max": "73.1",
        "bore_min": null,
        "brand_name": "Motiv",
        "color": "ANTHRACITE",
        "connection_id": 680,
        "dealer_id": 13542,
        "diameter": "17",
        "et": "40",
        "id": "13542|680|motiv|435g-7751840",
        "image_original": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94.jpg",
        "image_thumbnail": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94_200x300.jpg",
        "image_angle_original": null,
        "image_angle_thumbnail": null,
        "material": "Alloy",
        "model": "435G Foil",
        "part_number": "435G-7751840",
        "price": 115.46,
        "quantity": 12,
        "stock_branches": [
          {
            "address": null,
            "branch_id": "TB03",
            "name": "Test Branch 03",
            "quantity": 2
          }
        ],
        "supplier_part_number": null,
        "width": "7.5"
      }
    ],
    "tires": [
      {
        "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
        "layout_type": "any",
        "supplier": "testfeed",
        "brand": "Bridgestone",
        "model": "Potenza RE760 Sport",
        "part_number": "079212",
        "category": {
          "id": 12,
          "value": "Performance",
          "label": "Performance Summer"
        },
        "season": {
          "id": 3,
          "value": "Summer"
        },
        "size_h": 45,
        "size_r": 17,
        "size_w": 215,
        "size": "215/45R17 91W XL",
        "size_type": "Eurometric",
        "tire_type": "Passenger",
        "load_range": "XL",
        "fet": 0,
        "fet_source": "tireconnect",
        "tread_depth": "10.0",
        "supplier_details": {
          "id": "testfeed",
          "name": "testfeed",
          "stock": [
            {
              "branch": "Test Branch 01",
              "quantity": 6
            }
          ]
        },
        "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
        "quantity": 25,
        "price": 144.32
      }
    ],
    "services": [
      {
        "key": "seasonal_tire_storage",
        "name": "Seasonal Tire Storage",
        "total_price": 57.73
      },
      {
        "key": "wheel_alignment",
        "name": "Wheel Alignment",
        "total_price": 57.73
      },
      {
        "key": "nitrogen_fill",
        "name": "Nitrogen Fill",
        "total_price": 100
      },
      {
        "key": "supply_fee",
        "name": "Shop Supply Fee",
        "total_price": 50
      },
      {
        "key": "steel_wheel",
        "name": "Steel Wheel",
        "total_price": 400
      }
    ]
  }
}

onAppointmentClick

Description

Gets triggered when user clicks on Appointment button, on summary page

Properties

Type	Effect

Type	Effect
rejectable	prevents page from opening

onAppointmentInitiated

Description

Gets triggered when page gets initiated.

onAppointmentSubmitted

Description

Gets triggered when user submits an appointment

Properties

None

Date & time selection events

It will be same structure for Date & Time selection on Appointment and Order forms

{
  "location": {
    "external_id": "111111"
  },
  "customer": {
    "first_name": "",
    "last_name": "",
    "phone_number": "",
    "email": "",
    "way_to_contact": "",
    "preferred_date_time": "2024-04-30 09:00:00",
    "notes": "",
    "address": {
      "country": "",
      "address_1": "",
      "address_2": "",
      "city": "",
      "province": "",
      "postal_code": ""
    },
    "vehicle": {
      "year": 2020,
      "make": "Acura",
      "model": "ILX",
      "body_type": "Sedan",
      "sub_model": "Base",
      "option": "Base"
    }
  },
  "quote": {
    "tax": 66.183,
    "price": 1770.76,
    "sub_total": 1654.58,
    "status": "not submitted",
    "order_number": "",
    "deposit_payment": 0,
    "outstanding_blance": 0,
    "wheels": [
      {
        "wheel_id": "13542|680|motiv|435g-7751840",
        "bolt_pattern": "5x100/5x114.3",
        "bore_max": "73.1",
        "bore_min": null,
        "brand_name": "Motiv",
        "color": "ANTHRACITE",
        "connection_id": 680,
        "dealer_id": 13542,
        "diameter": "17",
        "et": "40",
        "id": "13542|680|motiv|435g-7751840",
        "image_original": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94.jpg",
        "image_thumbnail": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94_200x300.jpg",
        "image_angle_original": null,
        "image_angle_thumbnail": null,
        "material": "Alloy",
        "model": "435G Foil",
        "part_number": "435G-7751840",
        "price": 115.46,
        "quantity": 12,
        "stock_branches": [
          {
            "address": null,
            "branch_id": "TB03",
            "name": "Test Branch 03",
            "quantity": 2
          }
        ],
        "supplier_part_number": null,
        "width": "7.5"
      }
    ],
    "tires": [
      {
        "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
        "layout_type": "any",
        "supplier": "testfeed",
        "brand": "Bridgestone",
        "model": "Potenza RE760 Sport",
        "part_number": "079212",
        "category": {
          "id": 12,
          "value": "Performance",
          "label": "Performance Summer"
        },
        "season": {
          "id": 3,
          "value": "Summer"
        },
        "size_h": 45,
        "size_r": 17,
        "size_w": 215,
        "size": "215/45R17 91W XL",
        "size_type": "Eurometric",
        "tire_type": "Passenger",
        "load_range": "XL",
        "fet": 0,
        "fet_source": "tireconnect",
        "tread_depth": "10.0",
        "supplier_details": {
          "id": "testfeed",
          "name": "testfeed",
          "stock": [
            {
              "branch": "Test Branch 01",
              "quantity": 6
            }
          ]
        },
        "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
        "quantity": 25,
        "price": 144.32
      }
    ],
    "services": [
      {
        "key": "seasonal_tire_storage",
        "name": "Seasonal Tire Storage",
        "total_price": 57.73
      },
      {
        "key": "wheel_alignment",
        "name": "Wheel Alignment",
        "total_price": 57.73
      },
      {
        "key": "nitrogen_fill",
        "name": "Nitrogen Fill",
        "total_price": 100
      },
      {
        "key": "supply_fee",
        "name": "Shop Supply Fee",
        "total_price": 50
      },
      {
        "key": "steel_wheel",
        "name": "Steel Wheel",
        "total_price": 400
      }
    ]
  }
}

onDateFieldClicked

Description

Gets triggered when user clicks on preferred date field on the form.

Properties

Type	Effect

Type	Effect
resolvable	Opens calendar, but user can inject custom `customer.preferred_time`
rejectable	Pevents calendar from opening, user also can inject custom `customer.preferred_time`

Example

// reject event, and push custom data
then(function(widget) {
    widget.on('onOrder_DateClicked', function(event) {
        showMyCustomCalendar({
        onDateSelected: function(date) {
            // make sure to format date like this: '2018-02-23 02:30'
            event.reject({ customer: { preferred_time: date }})
        }
    })
});

onDateFieldSelected

Description

Gets triggered when user selected a date in preferred date field.

Properties

Type	Effect

Type	Effect
resolvable	User can inject custom `customer.preferred_time` (overriding)

Order form

Pretty much all order events share the same data structure, as provided below

{
  "location": {
    "external_id": "111111"
  },
  "customer": {
    "first_name": "",
    "last_name": "",
    "phone_number": "",
    "email": "",
    "way_to_contact": "",
    "preferred_date_time": "2024-04-30 09:00:00",
    "notes": "",
    "address": {
      "country": "",
      "address_1": "",
      "address_2": "",
      "city": "",
      "province": "",
      "postal_code": ""
    },
    "vehicle": {
      "year": 2020,
      "make": "Acura",
      "model": "ILX",
      "body_type": "Sedan",
      "sub_model": "Base",
      "option": "Base"
    }
  },
  "quote": {
    "tax": 66.183,
    "price": 1770.76,
    "sub_total": 1654.58,
    "status": "not submitted",
    "order_number": "",
    "deposit_payment": 0,
    "outstanding_blance": 0,
    "wheels": [
      {
        "wheel_id": "13542|680|motiv|435g-7751840",
        "bolt_pattern": "5x100/5x114.3",
        "bore_max": "73.1",
        "bore_min": null,
        "brand_name": "Motiv",
        "color": "ANTHRACITE",
        "connection_id": 680,
        "dealer_id": 13542,
        "diameter": "17",
        "et": "40",
        "id": "13542|680|motiv|435g-7751840",
        "image_original": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94.jpg",
        "image_thumbnail": "https://wl.tireconnect.ca/uploads/wheels/1cda1e58344c7a270d83526041161b94_200x300.jpg",
        "image_angle_original": null,
        "image_angle_thumbnail": null,
        "material": "Alloy",
        "model": "435G Foil",
        "part_number": "435G-7751840",
        "price": 115.46,
        "quantity": 12,
        "stock_branches": [
          {
            "address": null,
            "branch_id": "TB03",
            "name": "Test Branch 03",
            "quantity": 2
          }
        ],
        "supplier_part_number": null,
        "width": "7.5"
      }
    ],
    "tires": [
      {
        "tire_id": "QnJpZGdlc3RvbmV8fDA3OTIxMnx8dGVzdGZlZWR8fDIyNTkyfHxC",
        "layout_type": "any",
        "supplier": "testfeed",
        "brand": "Bridgestone",
        "model": "Potenza RE760 Sport",
        "part_number": "079212",
        "category": {
          "id": 12,
          "value": "Performance",
          "label": "Performance Summer"
        },
        "season": {
          "id": 3,
          "value": "Summer"
        },
        "size_h": 45,
        "size_r": 17,
        "size_w": 215,
        "size": "215/45R17 91W XL",
        "size_type": "Eurometric",
        "tire_type": "Passenger",
        "load_range": "XL",
        "fet": 0,
        "fet_source": "tireconnect",
        "tread_depth": "10.0",
        "supplier_details": {
          "id": "testfeed",
          "name": "testfeed",
          "stock": [
            {
              "branch": "Test Branch 01",
              "quantity": 6
            },
            {
              "branch": "Test Branch 02",
              "quantity": 7
            }
          ]
        },
        "image": "https://wl.tireconnect.ca/uploads/tires/pre_up/4/Bridgestone/images/bs_potenza_re760_sport_l.jpg",
        "quantity": 25,
        "price": 144.32
      }
    ],
    "services": [
      {
        "key": "seasonal_tire_storage",
        "name": "Seasonal Tire Storage",
        "total_price": 57.73
      },
      {
        "key": "wheel_alignment",
        "name": "Wheel Alignment",
        "total_price": 57.73
      },
      {
        "key": "nitrogen_fill",
        "name": "Nitrogen Fill",
        "total_price": 100
      },
      {
        "key": "supply_fee",
        "name": "Shop Supply Fee",
        "total_price": 50
      },
      {
        "key": "steel_wheel",
        "name": "Steel Wheel",
        "total_price": 400
      }
    ],
    "order_status": "Not Completed",
    "prices_deposit_payment": 0,
    "prices_outstanding_balance": 0
  }
}

onOrderClick

Description

Gets triggered when user clicks on Order button, on summary page

Properties

Type	Effect

Type	Effect
rejectable	prevents page from opening

onOrderInitiated

Description

Gets triggered when page gets initiated.

onOrderSubmitted

Description

Gets triggered when user submits an order

Properties

None

TC Widget Callbacks

Usage

Event

Common events for Tire Widgets

onResultsReviseClicked

onTireSearchResults

onTireSelect

Order form

onOrderClick

onOrderInitiated

onOrder_DateClicked

onOrder_DateSelected

onOrderSubmitted

Appointment Request Form

onAppointmentClick

onAppointmentInitiated

onAppointment_DateClicked

onAppointment_DateSelected

onAppointmentSubmitted

Widget Locator

onLocationChanged

POS Widget

onSummaryInitiated

onSupplierOrderSubmitted

Service appointment widget

onLocationChanged

onVehicleSelected

onAppointmentServicesUpdated

onAppointmentLightsUpdated

onAppointmentSymptomsUpdated

onAppointmentDateSelected

onAppointmentContinue

onAppointmentSubmitted

Wheel Widget

onResultsReviseClicked

onTireSelect

onWheelSelect

onWheelSearchResults

onSummaryInitiated

Appointment Request Form

onAppointmentClick

onAppointmentInitiated

onAppointmentSubmitted

Date & time selection events

onDateFieldClicked

onDateFieldSelected

Order form

onOrderClick

onOrderInitiated

onOrderSubmitted

Related content