TripIt Web Plugins

Index

Add-to-TripIt Plugin

Overview

The Add-to-TripIt plugin allows you to quickly import travel objects into TripIt without the need for a full TripIt API integration utilizing OAuth.

Currently the following travel objects are supported:

Other features of the plugin include:

Loading the Add-to-TripIt plugin

Step 1

Step 2

Step 3

Example 1: Creating a hotel reservation (Lodging) object

  1. Add the TripIt JavaScript SDK and your custom code in your page once, ideally right after the beginning of the <body> tag:
    window.tiAsyncInit = function() {
        TripIt.init({
            'api_key':'YOUR_API_KEY',
            'domain':'YOUR_DOMAIN'
        });
    
        // Your code that uses the TripIt SDK goes here...
        
        // Creating an AddToTripIt plugin object
        var a2t = TripIt.create('addToTripIt')
    
        // Creating a Lodging Object inside AddToTripIt object
        var lodging = a2t.create('lodging');
        
        // Check-in and check-out date/time
        var startDateTime = new Date(2012, 07, 14, 11, 00); // On 08/14/2012, 11:00
        lodging.setStartDateTime(startDateTime);
        var endDateTime = new Date(2012, 07, 16, 19, 00); // On 08/16/2012, 19:00
        lodging.setEndDateTime(endDateTime);
        
        // Supplier
        lodging.setSupplierName('San Francisco Hotels');
    
        // Hotel address
        var address1 = a2t.create('address');
        address1.setAddrLine1('500 Treat Ave');
        address1.setAddrLine2('Suite 100');
        address1.setCity('San Francisco');
        address1.setState('CA');
        address1.setCountry('USA');
        lodging.setAddress(address1);
        
        // Guests
        var person1 = a2t.create('traveler');
        person1.setFirstName('Andy');
        person1.setLastName('Denmark');
        var person2 = a2t.create('traveler');
        person2.setFirstName('Thor');
        lodging.addGuest(person1);
        lodging.addGuest(person2);
    
        lodging.setNumberGuests('2');
        lodging.setNumberRooms('1');
        lodging.setRoomType('suite');
    
        // All done, so now initialize the A2T button to be rendered; pass callback function as well.
        TripIt.initializePlugin(a2t, function(data) {
            console.log('CLIENT: status obtained: ');
            console.log(data);
        });
    
    };
    
    (function(d){
        var js, id = 'tripit-jssdk', ref = d.getElementsByTagName('script')[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement('script'); js.id = id; js.async = true;
        js.src = "//www.tripit.com/js/sdk/tripit_sdk.js";
        ref.parentNode.insertBefore(js, ref);
    }(document));
  2. Place the following code wherever you want the plugin to appear on your purchase confirmation page.
    <div id="add-to-tripit-plugin"></div>

Example 2: Creating multiple plugin buttons on the same page

  1. Add the TripIt JavaScript SDK and your custom code in your page once, ideally right after the beginning of the <body> tag:
    window.tiAsyncInit = function() {
        TripIt.init({
            'api_key':'YOUR_API_KEY',
            'domain':'YOUR_DOMAIN'
        });
    
        // Your code that uses the TripIt SDK goes here...
        
        //******* FIRST PLUGIN BUTTON *******
    
        // Creating an AddToTripIt plugin object
        var a2t = TripIt.create('addToTripIt', 'add-to-tripit-plugin');
    
        // Transport Object
        var transport = a2t.create('transport');
    
        // Shuttle start and end date/time
        var startDateTime = new Date(2012, 08, 14, 11, 00); // On 09/14/2012, 11:00
        transport.setStartDateTime(startDateTime);
        var endDateTime = new Date(2012, 08, 16, 19, 00); // On 09/16/2012, 19:00
        transport.setEndDateTime(endDateTime);
    
        // Shuttle pick-up/start location address
        var address1 = a2t.create('address');
        address1.setAddrLine1('Oakland International Airport');
        address1.setAddrLine2('100 Airport Rd');
        address1.setCity('Oakland');
        address1.setState('CA');
        address1.setCountry('USA');
        transport.setStartLocationAddress(address1);
        
        // Shuttle drop-off/end location address
        var address2 = a2t.create('address');
        address2.setAddrLine1('San Francisco International Airport');
        address2.setCity('San Francisco');
        address2.setState('CA');
        address2.setCountry('USA');
        transport.setEndLocationAddress(address2);
        
        // start/end Location Name
        transport.setStartLocationName('Oakland International Airport');
        transport.setEndLocationName('San Francisco International Airport');
        
        // transport.setConfirmationNumber('6');
    
        // All done, so now initialize the A2T button to be rendered.
        TripIt.initializePlugin(a2t, function(data) {
            console.log('CLIENT: status obtained: ');
            console.log(data);
        });
    
        //******* SECOND PLUGIN BUTTON *******
    
        // Your code that uses the TripIt SDK goes here...
        var a2t2 = TripIt.create('addToTripIt', 'add-to-tripit-plugin-2'); // The second parameter is the div id that will hold this plugin
    
        var car = a2t2.create('car');
        var start = new Date(2013, 07, 14, 11, 01, 02); // The month is actually August (08), since Javascript accepts month from 0-11
        var end = new Date(2013, 08, 14, 12, 05, 07); // The month is actually Sept (09), since Javascript accepts month from 0-11
        car.setDisplayName('Avis rental');
        car.setBookingRate('$50');
        car.setBookingSiteConfirmationNumber("DEF");
        car.setBookingSiteName("bk");
        car.setSupplierName("supplier");
        car.setNotes('booking notes');
        car.setTotalCost('$150');
        car.setStartDateTime(start);
        car.setEndDateTime(end);
        var address1 = a2t2.create('address');
        address1.setAddrLine1('500 Treat Ave');
        address1.setCity('San Francisco');
        address1.setCountry('USA');
        address1.setZip('94110')
        var address2 = a2t2.create('address');
        address2.setAddrLine1('1000 Market Ave');
        address2.setCity('San Francisco');
        address2.setCountry('USA');
        address2.setZip('94110')
        car.setStartLocationAddress(address1);
        car.setEndLocationAddress(address2);
        car.setStartLocationName("start");
        car.setEndLocationName("end");
        car.setSupplierConfirmationNumber("123");
        car.setCarDescription('description');
        car.setCarType('type');
        var person1 = a2t2.create('traveler');
        person1.setFirstName('Tariq'); 
        person1.setLastName('Islam');
        car.setDriver(person1);
        car.setMileageCharges('$10');
    
       TripIt.initializePlugin(a2t2, function(data) {
            console.log('2 CLIENT: status obtained: ');
            console.log(data);
        });
    };
    
    (function(d){
        var js, id = 'tripit-jssdk', ref = d.getElementsByTagName('script')[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement('script'); js.id = id; js.async = true;
        js.src = "//www.tripit.com/js/sdk/tripit_sdk.js";
        ref.parentNode.insertBefore(js, ref);
    }(document));
  2. Place the following code wherever you want the first plugin to appear on your purchase confirmation page.
    <div id="add-to-tripit-plugin"></div>
  3. Place the following code wherever you want the second plugin to appear on your purchase confirmation page.
    <div id="add-to-tripit-plugin-2"></div>

JavaScript API

Below is the JavaScript API to use for the Add-to-TripIt plugin.

Plugin & SDK
AddToTripit
TripIt


All travel objects
Activity
Address
Car
Lodging
Restaurant
Transport
Traveler