Product Click Behavior Control

You can define the desired behavior—such as navigating to the product page in the current window or opening it in a new tab—using the sauceflexMoveProduct event when a user clicks a product in the player.

Navigating to the Product Page

window.addEventListener("message", (e) => {
  if (typeof e.data !== "string") return;
  let jsonData = JSON.parse(e.data);

  switch (jsonData.key) {
    // If you only need to handle the product click event (e.g., to redirect to the product page), simply add or modify the following code:
     ....
    case "sauceflexMoveProduct":
      if(!jsonData.params.linkUrl) return
       window.location.href = jsonData.params.linkUrl
      break;
    ...
  }
});

Opening the Product Page in a New Tab

window.addEventListener("message", (e) => {
  if (typeof e.data !== "string") return;
  let jsonData = JSON.parse(e.data);

  switch (jsonData.key) {
    // If you want the product page to open in a new tab, you can update the logic as shown below:
     ....
    case "sauceflexMoveProduct":
      if(!jsonData.params.linkUrl) return
       window.open(jsonData.params.linkUrl)
      break;
    ...
  }
});

Redirecting Using a Custom Product Code

window.addEventListener("message", (e) => {
  if (typeof e.data !== "string") return;
  let jsonData = JSON.parse(e.data);

  switch (jsonData.key) {
    // If you want to redirect users to a custom link using a separate product code, and only need to handle the product click event, simply add or update the following code:
     ....
    case "sauceflexMoveProduct":
      const externalProductId = jsonData.params.externalProductId
       if(!externalProductId) return
         window.location.href = `/event?productId=${externalProductId}`
     break;
    ...
  }
});