Skip to content

Fetching Data

Use haven.fetch to retrieve products and events from the Haven API. This is useful for custom layouts, curated lists, or pre-loading data before render.

Availability

haven.fetch is created during haven.init(). It is only available after haven.ready() returns true.

Query types

All list methods accept a queryType parameter:

TypeDescription
pluginPlugin-optimized response (recommended for embeds)
nameName-based query (default fallback)
idsFetch by product IDs

Products

Get all products

javascript
haven.fetch.getProducts(function (response) {
  console.log(response);
}, 'plugin');

Get products by IDs

javascript
haven.fetch.getProducts(function (response) {
  // use response in .directory.init({ data: response })
}, 'plugin', { ids: [1234, 5678, 9012] });

Or use the dedicated method:

javascript
haven.fetch.getProductsById([1234, 5678], function (response) {
  console.log(response);
}, 'plugin');

Get products by category

javascript
haven.fetch.getProductsByCategory('YOUR_CATEGORY_ID', function (response) {
  var products = response[0];
  var category = response[1];
}, 'plugin');

Get single product

javascript
haven.fetch.getProductById(1234, function (response) {
  console.log(response);
});

haven.fetch.getProductByNicename('product-name', function (response) {
  console.log(response);
});

Events

javascript
haven.fetch.getEvents(function (response) {
  console.log(response);
}, 'plugin');

Categories and types

javascript
haven.fetch.getCategories(function (response) {
  console.log(response);
});

haven.fetch.getCategoryById('CATEGORY_ID', function (response) {
  console.log(response);
});

haven.fetch.getCategoryByNicename('food-drink', function (response) {
  console.log(response);
});

haven.fetch.getTypes(function (response) {
  console.log(response);
});

Parent feed

Switch to a parent feed ID for shared product data:

javascript
haven.fetch.useParentFeedId(true);
haven.fetch.getProducts(function (response) {
  // products from parent feed
}, 'plugin');

Curated itinerary pattern

Fetch specific products, then render as an itinerary:

javascript
haven.fetch.getProducts(function (response) {
  haven.config({
    templatePath: 'https://YOUR_TEMPLATE_HOST/haven-templates/',
    userTemplates: [
      'haven-directory-itinerary-item.html',
      'haven-directory-detail.html',
    ],
    useMapBox: false,
    useFontAwesome: false,
  })
  .directory.init({
    format: 'itinerary',
    data: response,
    routing: {
      path: '/directory/',
      type: 'hash',
      doPathChange: false,
    },
    options: {
      sort: 'ids',
      cols: 1,
      includeLightbox: true,
    },
  })
  .render();
}, 'plugin', { ids: [1234, 5678, 9012] });

See Itinerary Sidebar.

Generic render

Pass fetched data directly to haven.render():

javascript
haven.fetch.getProducts(function (response) {
  haven.render({
    data: response,
    type: 'product',
    format: 'list',
    selector: '#haven-app',
  });
}, 'plugin');

API reference

See Fetch API for the complete method list.

Callback-based API

All haven.fetch methods use callbacks, not Promises. Always handle data inside the callback function.

Haven Destinations integration documentation