Realtime delivery indication

In case you want to display a realtime stock message, you can make that happen using the twn.*.success hooks:

  • twn.request.success for search
  • twn.request.navigation.success for lister pages

Before you start:

  • Make sure you marked an element in your product tile for the message to show.

Example

This example applies custom stock messages to search results and lister pages:

interface RequestSuccessEvent {
  // see https://docs.tweakwise.com/reference/tweakwise-js-typescript for full object typings
  data: IApiNavigation;
}

function getStockMessage(now, item){ 
  if(item.stock < 1){        
    return '3-5 days';
  }

  const isAfter22 = now.getHours() > 22;
  if(isAfter22){
		const bezorgdag = now.addDays(2);
    const weekday = bezorgdag.toLocaleString('nl', { weekday: 'long' });
		return `${weekday} bezorgd`;
	}

  return "Tomorrow";
}

function tw__applyStock(data){ 
  const now = new Date()    
  data.items.forEach(function(item) {
    var element = document.querySelector('[data-item-id="' + item.itemno + '"] .tw__delivery');
    element.innerText = getStockMessage(now, item);
  })    
}

window["twn-starter-config"].on = {
  // ...
  'twn.request.success': function (event: RequestSuccessEvent) {
  	tw__applyStock(event.data);
  },
  'twn.request.navigation.success': function (event: RequestSuccessEvent) {
  	tw__applyStock(event.data);
  }
});