Timatic Widget Implementation Guide

1. Language Configuration

Set the language for the widget on the window object using the property "timaticWidgetLanguage.languageCode". The languageCode is a string with one of the following values:

• EN - English
• DE - German
• ES - Spanish
• FR - French
• PT - Portuguese
• TR - Turkish

If not set, the widget defaults to English.

// Example: Set the widget language to French
window.timaticWidgetLanguage.languageCode = 'FR';

2. Detailed search mode

Timatic widget v2 supports detailed search view mode. This is intended only for internal testing. Set the widget in detailed search mode by setting the property "timaticWidgetModes.openInDetailedSearch" on true. It's default value is false.

// Example: Open in detailed view
window.timaticWidgetModes.openInDetailedSearch = true;

3. Default Trip Type Configuration

To configure the default trip type for the widget, utilize the window property timaticDefaultTripType.defaultTripType. The defaultTripType is represented by a numerical value corresponding to the desired trip type. The available options are:

• 1 - Roundtrip
• 2 - One-Way
• 3 - Multi-City

// Example: Set the default trip type to One-Way
window.timaticDefaultTripType.defaultTripType = 2;

Ensure that these configurations are applied before the widget is loaded to guarantee that the settings take effect.

4. Toggle content groupings

To manage the visibility of content groupings, use the window property timaticVisibleSectionOrder.visibleSectionOrder. This property is an array of string values, each representing a section you wish to display, in your specified order. It's important to note that configuring this property is optional, but if you choose to use it, it must contain at least one section and cannot be an empty array. The available sections are listed below:

• C1 - Visa and other border measures
• C2 - Passport and other travel documents
• C3 - Public Health and Vaccinations
• C4 - Travelling with Pets
• C5 - Customs, Currencies and Airport Tax

// Example: See the first five sections
window.timaticVisibleSectionOrder.visibleSectionOrder = ["C1", "C2", "C3", "C4", "C5"];

 // Example:  the first three sections in a specific order (C3, C1, C2):
window.timaticVisibleSectionOrder.visibleSectionOrder = ["C3", "C2", "C1"];

Ensure that these configurations are applied before the widget is loaded to guarantee that the settings take effect.

5. External Data Input Configuration

The widget supports external data inputs via "timaticWidgetInputData" on the window object. This property contains an object with the following fields:

{
    tripType: number,
    journeyLegs: [{
        departureAirportCode: string,
        arrivalAirportCode: string,
        durationOfStay: number
    }],
    travelerDetails: {
        countryCodeOfNationality: string,
        countryCodeOfResidency: string,
        documentType: number,
        countryCodeOfIssuing: string,
        travelDocumentCode: string
    }
}

Where:

• "tripType" - a number with one of the following values:
  • 1 - Roundtrip
  • 2 - One-Way
  • 3 - Multi-City
• "journeyLegs" - an array of objects with the following fields:
  • "departureAirportCode" - a string representing a 3-letter airport code (e.g., "AMS", "CLJ", "MUC")
  • "arrivalAirportCode" - a string representing a 3-letter airport code (e.g., "AMS", "CLJ", "MUC")
  • "durationOfStay" - a number with one of the following values:
    • 1 - Transit (only for MultiCity)
    • 2 - Up to 7 days
    • 3 - Up to 14 days
    • 4 - Up to 30 days
    • 5 - Over 30 days
    • 6 - Less than 1 day (only for Round trip and Multicity)

  The default value is option 2 - Up to 7 days

• "travelerDetails" - an object with the following fields:
  • "countryCodeOfNationality" - a string representing a 2-letter country code (e.g., "NL", "RO", "DE")
  • "countryCodeOfResidency" - a string representing a 2-letter country code (e.g., "NL", "RO", "DE")
  • "documentType" - a number with one of the following values. Note that the value 8 is missing:
    • 1 - Tourist/Vacation
    • 2 - Business
    • 3 - Airline Crew (On Duty)
    • 4 - Government personnel (Off Duty)
    • 5 - Government personnel (On Duty)
    • 6 - Seafarer
    • 7 - Military personnel (On Duty)
    • 9 - Stateless/Refugee
  • !"countryCodeOfIssuing" and "travelDocumentCode" are needed only when the documentType is not Tourist (1) or Business (2)
    • "countryCodeOfIssuing" - a string representing a 2-letter country code where the travel document was issued (e.g., "NL", "RO", "DE")
    • "travelDocumentCode" - required and varies based on "documentType":
      • 3: CREWMEMBERLICENCE, CREWMEMBERIDCARD, CREWMEMBERCERTIFICATE, CREWGENERALDECLARATIONFORM
      • 4: CONSULARPASSPORT, DIPLOMATICPASSPORT, OFFICIALPASSPORT, SERVICEPASSPORT, SPECIALPASSPORT, LAISSEZ-PASSER
      • 5: CONSULARPASSPORT, DIPLOMATICPASSPORT, OFFICIALPASSPORT, SERVICEPASSPORT, SPECIALPASSPORT, LAISSEZ-PASSER
      • 6: SEAMANBOOK, SEAFARERID
      • 7: MILITARYIDENTITYDOCUMENT, MILITARYIDCARD
      • 9: TITREDEVOYAGE, ALIENSPASSPORT, CTD1951, CTD1954, FORMI571

Observations:

• A one-way trip should contain only one element in the journeyLegs array, a round trip should contain 2 elements, and a multi-city trip should contain at least one element and a maximum of 5 elements.
• This object is reactive; every time you change one of these fields, the updated values will be available for the widget to perform an API call.
• If external data parameters are needed, all of them are mandatory.

1. Widget is not loading

• Check if the script is included at the end of the <body> HTML element or use the "defer" attribute with the script.
• Ensure the <div> element with id "iata-timatic-widget" is present.
• Verify the CSS file is correctly included.
• Check for JavaScript errors in the console.
• Check for network errors in the console.

2. CORS error

• Check the console for error details.
• If the error is to Access-Control-Allow-Origin, contact us to include the origin URL in the whitelist.