1 Widget Demo
2 Usage
3 Searches
- 3.1 Filters
  - 3.1.1 Tire filters
  - 3.1.2 Wheel filters
- 3.2 Options
- 3.3 Search Tires by Vehicle
  - 3.3.1 Example
- 3.4 Search Wheels by vehicle
  - 3.4.1 Example
- 3.5 Search Tires by Size
  - 3.5.1 Example
- 3.6 Search Tires by Raw Size
  - 3.6.1 Example
- 3.7 Search Tires by Part numbers
  - 3.7.1 Example
- 3.8 Search Tires by State & License Plate
  - 3.8.1 Example
- 3.9 Search Wheels by State & License Plate
  - 3.9.1 Example
- 3.10 Search Tires by VIN
  - 3.10.1 Example
- 3.11 Search Wheels by VIN
  - 3.11.1 Example
- 3.12 Search Tires by Aces
  - 3.12.1 Example
- 3.13 Search Wheels by Aces
  - 3.13.1 Example
- 3.14 JS Functions
  - 3.14.1 addCustomerInfo
    - 3.14.1.1 Example
  - 3.14.2 addSupplierOrderInfo
    - 3.14.2.1 Example
  - 3.14.3 changeLocation
    - 3.14.3.1 Example

Widget Demo

NOTE:

For ordering Demo Supplier #1 can be used both for Tires and Wheels.

PIN: 416905

Usage

The widget function should be invoked by passing a search method along with its corresponding search parameters. The method can be called immediately after the .init() method has been executed.

Multiple search methods can be defined and utilized as required by the implementation.

Each search method accepts a single argument - an object containing the search parameters. The structure of these parameters corresponds to the format used in URL query strings.

Upon invocation, the widget executes a search operation based on the provided parameters and returns the results accordingly.

Searches

Note: Parameters highlighted bold - required.

Filters

You can add filters to any of search methods.

Tire filters

price - object {from: int, to:int}
brand_id - array [int]
category_id - array [int]
season_id - array [int]
light_truck - boolean
run_flat - boolean
speed_rating - array [string]
load_index - array [int]
load_range - array [string]
position - array [string]
application - array [string]
utqg_wear - object {from: int, to:int}
utqg_traction - array [string]
utqg_temp - array [string]
tread_depth - array [string]
stud - array [string]
ev - boolean
offers - array [int]

Example

filters: {
    price: {
        from: 150,
        to: 250
    },
    brand_id: [24],
    category_id: [12],
    season_id: [3],
    light_truck: false,
    run_flat: true,
    speed_rating: ["S"],
    load_index: [94],
    load_range: ["XL"],
    position: ["Steer/All Position", "Drive"],
    application: ["Trailer"],
    utqg_wear: {
        from: 150,
        to: 250
    },
    utqg_traction: ["AA"],
    utqg_temp: ["B"],
    tread_depth: ["10.5"],
    stud: ["studdable"],
    ev: true,
    offers: [238329]
}

Wheel filters

brand_name - array [string]
bore_max - array [string]
color - array [string]
width - array [string]
price - object {from: int, to:int}
material - array [string]

filters: {
    brand_name: [
        "Motiv"
      ],
    bore_max: ["73.1"],
    color: ["BLACK"],
    width: ["7.5"],
    material: ["CAST ALUMINUM"],
    price: {
        from: 109,
        to: 160
      }
  }

Options

Also you can add search options to any of search methods.

Full list of options:

default_selected_qty - provide default selected Qty
min_qty_in_results - provide minimum searched Qty
auto_redirect_to_tummary - flag, which will say widget to go to summary page if results have only 1 item

Example

{
   default_selected_qty: 4,
   min_qty_in_results: 4,
   auto_redirect_to_tummary: true
}

Full usage of filters and options example might look like this

<script>
	TCWidget.init({
		apikey: '[your apikey]',
		container: 'tireconnect',
	}).then(function(widget) {
		widget.searchTiresByVIN({
		vin: '[VIN_code]',
		location_id: [somelocation],
		filters: {
                brand_id: [24],
                load_index: [94],
                speed_rating: ["S"],
                price: {
                    from: 100,
                    to: 160
                },
                run_flat: true,
                light_truck: false,
                category_id: [12],
                season_id: [1],
                offers: [293]
            } 
		},
		{
           default_selected_qty: 4,
           min_qty_in_results: 4,
           auto_redirect_to_tummary: true
})
	});
</script>

Search Tires by Vehicle

year - Year of vehicle manufacture

make - Make of vehicle

model - Model of vehicle

submodel - Submodel of vehicle

body_type - Body type of vehicle

option - Option of vehicle

drive_type - Drive type of vehicle

location_id - Dealer's location ID

size - Tire size

NOTE: rear size optional and used for staggered fitment

Example

searchTiresByVehicle ({
    year: '2016',
    make: 'BMW',
    model: '228i xDrive',
    submodel: 'Base',
    body_type: 'Coupe',
    option: 'Base 18" option',
    location_id: 33714,
    size: {
        front: {
            size_part_1: "225",
            size_part_2: "40",
            size_part_3: "18",
        },
        rear: {
            size_part_1: "245",
            size_part_2: "35",
            size_part_3: "18"
        }
    }
});

Search Wheels by vehicle

year - Year of vehicle manufacture

make - Make of vehicle

model - Model of vehicle

submodel - Submodel of vehicle

body_type - Body type of vehicle

option - Option of vehicle

drive_type - Drive type of vehicle

location_id - Dealer's location ID

size - Wheel size

NOTE: rear size optional and used for staggered fitment

Example

searchWheelsByVehicle({
    year: '2016',
    make: 'BMW',
    model: '228i xDrive',
    submodel: 'Base',
    body_type: 'Coupe',
    option: 'Base 18" option',
    location_id: 33714,
    size: {
        front: {
            diameter: 17
        },
        rear: {
            diameter: 18
        }
    }
});

Search Tires by Size

size_part_1 - Tire size part 1

size_part_2 - Tire size part 2

size_part_3 - Tire size part 3

location_id - Dealer's location ID

season_id - Tire season

load_index - Load index

speed_rating - Speed rating

NOTE: rear size optional and used for staggered fitment

Example

searchTiresBySize({
    size: {
        front: {
            size_part_1: "205",
            size_part_2: "55",
            size_part_3: "16",
            load_index: 91,
            speed_rating: "H"
        },
        rear: {
            size_part_1: "215",
            size_part_2: "50",
            size_part_3: "17",
            load_index: 91,
            speed_rating: "T"
        }
    },
    season_id: 2, // "all" must be passed to search all tires
    location_id: 33714
});

Search Tires by Raw Size

size - Raw Size

location_id - Dealer's location ID

Example

searchTiresByRawSize(
  {
    size: "1956515",
    location_id: 33714
  }
);

Search Tires by Part numbers

part_numbers - Array of part numbers

location_id - Dealer's location ID

Example

 searchTiresByPartNumbers(
 {
    part_numbers: ['9','90000003278','240','8501','15494650000','402542073','100A1524','1014241','78380','84671','72016','90000007446','38076','sdfsdf'],
    location_id: 33714
  }
);

Search Tires by State & License Plate

state - State

license - Licence Plate

location_id - Dealer's location ID

Example

searchTiresByLicense(
  {
    state: 'AZ', 
    license: '5S64450',
    location_id: 33714
  }
);

Search Wheels by State & License Plate

state - State

license - Licence Plate

location_id - Dealer's location ID

Example

searchWheelsByLicense(
  {
    state: 'AZ', 
    license: '5S64450',
    location_id: 33714
  }
);

Search Tires by VIN

vin - Vin

location_id - Dealer's location ID

Example

searchTiresByVIN(
  {
    vin: "1C3CCCDG6FN589178",
    location_id: 33714
  }
);

Search Wheels by VIN

vin - Vehicle VIN code

location_id - Dealer's location ID

Example

searchWheelsByVIN(
  {
    vin: "1C3CCCDG6FN589178",
    location_id: 33714
  }
);

Search Tires by Aces

aces_id - Vehicle Aces ID

location_id - Dealer's location ID

Example

searchTiresByVehicle(
  {
    aces_id: 268647,
    location_id: 33714
  }
);

Search Wheels by Aces

aces_id - Vehicle Aces ID

location_id - Dealer's location ID

Example

searchWheelsByVehicle(
 {
    aces_id: 268647,
    location_id: 33714
  }
);

JS Functions

addCustomerInfo

Example

addCustomerInfo({
    first_name: 'John',
    last_name: 'Doe',
    phone_number: '18887927072',
    email: 'johndoe@gmail.com',
    way_to_contact: 'phone',
    preferred_date_time: '2026-01-01 17:15',
    notes: 'Some customer note',
    address: {
        country: 'CA',
        address_1: '30 Via Renzo Drive',
        address_2: 'Suite 254',
        city: 'Richmond HIll',
        province: 'ON',
        postal_code: 'L4S0B8',
    },
    vehicle: {
        year: '2020',
        make: 'Honda',
        model: 'CR-V',
        submodel: 'EX',
        body_type: "Sport Utility",
        option: "EX",
        drive_type: "AWD"
            }
});

addSupplierOrderInfo

editable: true/false (optional with true being default)
single_use: true/false (optional with false being default)

Example

addSupplierOrderInfo(
  {
    po_number: 
      {
        value: 'test_PO',
        editable: true,
        single_use: false
      }
  }
);

changeLocation

Method of widget instance, that allow you to change location externally. It receive only location id.

For better understanding please see example and embedding documentation: Link

Example

function changelocation() {
    if (Widget) {
      Widget.changeLocation('location_id to change to');
    }
  }
  TCWidget.init({
    apikey: 'SUBSTITUTE_YOUR_API_KEY_HERE',
    container: 'tireconnect',
    location_id: 'location_id widget init with',
    location_lock: true,
  }).then(function(widget) {
    Widget = widget;
  });

TC Widget JS Searches & JS functions (universal widget)

Widget Demo

Usage

Searches

Filters

Tire filters

Wheel filters

Options

Search Tires by Vehicle

Example

Search Wheels by vehicle

Example

Search Tires by Size

Example

Search Tires by Raw Size

Example

Search Tires by Part numbers

Example

Search Tires by State & License Plate

Example

Search Wheels by State & License Plate

Example

Search Tires by VIN

Example

Search Wheels by VIN

Example

Search Tires by Aces

Example

Search Wheels by Aces

Example

JS Functions

addCustomerInfo

Example

addSupplierOrderInfo

Example

changeLocation

Example