The widget allows the user to pass a custom user situation and a licene plate so a TCO calculation can be returned. The returned fields are set by the developer / marketer in the field key. Example widget at: https://codepen.io/rkuyper/full/JeemYm/. Not using NPM? There is also a minified script available at: https://apimgmtstpkjajbaaynnlsuh.blob.core.windows.net/content/MediaLibrary/files/js/wheely.tco.min.js.
##What's new in Version 1.1.4 State management implemented that holds user situation and reduces the amount of API requests.
##Usage
const wheelyTCO = require('wheely-tco');
wheelyTCO.tcoWidget(
{
api : 'api_key',
id: 'target_element',
options : {
tracking : 'GTM-XXXXX', // writes user behaviour to Google Tag Managers DataLayer
height: 'height_of_widget', // leave empty if using wheely default height
width : 'width_of_widget', // leave empty if using wheely default width
style : 'stylesheet_of_choice', // leave empty if using wheely default style
color : 'button_color', // leave empty if using wheely default color
fields : [MAP_OBJECT] // Returns the values you want to receive. See field values for explanation. Default is nothing.
}
}
);
##Cached data Each request is cached inside the global dataLayer namespace. You can search the cached data by listening to 'vehicleSearch' event.
let cachedData = window.dataLayer;
##Fields values For the example object returned below, map fields by parentKey '-' key. Example:
{
name : 'make-name',
isVisible : true,
isCurrency : false,
language : {
nl : 'Merk'
}
}
Example of returned car object.
"data": [{
"id": 0, // returns response id
"kenteken": "string", // Returns kenteken
"make": {
"id": 0, // make id
"name": "string" // make name (i.e. Fiat)
},
"model": {
"id": 0, // model name (i.e. Punto)
"name": "string"
},
"cataloguePrice": 0.0, // catalogue price of the car (US-based)
"deliveryFee": 0.0, // Delivery fee of the car (US-based)
"bpm": 0.0, // BPM of the car (US-based)
"bodyType": {
"id": 0, // Body type ID (API use only)
"name": "string" //Body type description (i.e. hatchback, MPV)
},
"engineType": {
"id": 0, // Engine type ID (API use only)
"name": "string" // Engine type name (i.e. Diesel)
},
"transmissionType": {
"id": 0, // Transmission type ID (API use only)
"name": "string" // Transmission type name (i.e. automatisch, handgeschakeld)
},
"taxLiabilityType": {
"year": 0, // Tax year
"tariff": 0.00, // Tax tariff (US-based)
"isCalculatedTariff": false // boolean
},
"discountValue": 0.0, // Discount value (US-based)
"doors": 0, // Number of doors
"nettoPrice": 0.0, // Netto price (US-based)
"weight": 0, // Weight of the car
"year": 2011, // Manufacturing year
"totalInvestment": 0.00, // Total investment (US-based)
"residualValue": 0.0, // Residual value (US-based)
"monthlyCosts": {
"installment": 0.00, // Monthly installment cost (US-based)
"writeOff": 0.00, // Monthly write off cost (US-based)
"insurance": {
"liabilityInsurance": 0.00, // Liability insurance cost (US-based)
"personalLiability": 0.00 // Personal Liability cost (US-based)
},
"maintenance": 0.00, // Maintainance cost (US-based)
"fuel": 0.00, // Fuel cost (US-based)
"roadTax": 0.0, // Road tax (US-based)
"subTotal": 0.00, // Subtotal of all cost (US-based)
"total": 0.00 // Total of all cost plus taxes (US-based)
},
"monthlyTaxEffects": {
"bijtelling": 0.00, // Monthly bijtelling (US-based)
"deductionMIA": 0.0, // Monthly deducation MIA (US-based)
"deductionMonthlyCosts": 0.0, // Monthly deducation cost (US-based)
"taxPrivateUse": 0.00 // Monthly tax private use (US-based)
},
"monthlyCostBusiness": 0.00, // Monthly total business cost (US-based)
"monthlyCostPrivate": 0.00, // Monthly total private cost (US-based)
"tco": 0.0, // Monthly TCO (US-based)
"fiscalPrice": 0.00, // Fiscal price (US-based)
"recommendedPrice": 0.00, // Recommended price (US-based)
"recommendedPriceEx": 0.00, // Recommended price excl VAT (US-based)
"odometer": 0, // Odometer in KM
"isOwner": false, // Boolean
"isMarginVehicle": false, // Boolean
"registrationDate": "YYYY-MM-DDTHH:MM:SS", // Registration date
"segment": "string" // Segment of cars
}]