Untitled

 avatar
unknown
plain_text
3 years ago
5.0 kB
4
Indexable
// PDP AllTRICKS
// Sdk Push
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "https://sdk.teester.com/loader.js";
document.getElementsByTagName("head")[0].appendChild(script);
var dataLayer = window.dataLayer || [];
var playerKey = "755f7c90-7434-44cc-8c81-e06156183f31";
var productId = dataLayer[0].product_id;
window.onTeesterReady = window.onTeesterReady || [];
window.onTeesterReady.push(function (SDK) {
SDK.getVideos(playerKey, productId, function (videos) {
    var urlOverlay = videos[0].thumbnails.overlay_low;
    var videoId = videos[0].id;

// Call To Action
var ctaCont = document.createElement("div");
ctaCont.setAttribute("id", "SkeepersCta")
ctaCont.style.cursor= "pointer";
ctaCont.style.marginTop = "1%"

var divIcon = document.createElement("img");
divIcon.setAttribute("id", "iconCta");
divIcon.src = "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzIgMzIiPjxwYXRoIGQ9Ik0xNiAwQzcuMTY0IDAgMCA3LjE2NCAwIDE2czcuMTY0IDE2IDE2IDE2IDE2LTcuMTY0IDE2LTE2UzI0LjgzNiAwIDE2IDB6bS02IDI0VjhsMTYuMDA4IDhMMTAgMjR6IiBmaWxsPSIjZmYwMDAwIiBjbGFzcz0iZmlsbC00ZTRlNTAgZmlsbC1kYzJmMmYiPjwvcGF0aD48L3N2Zz4="
divIcon.style.width = "15px";
divIcon.style.top= '-1.5px';
divIcon.style.position= 'relative';
var ctaT = document.createElement("p");
ctaT.style.display = "inline-block";
ctaT.style.color = "red";
ctaT.innerHTML = "Le produit testé en vidéo";
ctaT.style.marginTop = "0.3rem";
ctaT.style.marginLeft = "0.3rem";
ctaCont.appendChild(divIcon)
ctaCont.appendChild(ctaT)
document.querySelector("#product-header-order-form").prepend(ctaCont);
ctaCont.addEventListener("click", function (e) {
    var scroll = document.querySelector("#teesterPlayer");
    scroll.scrollIntoView({block: "end"});
    //top of the player
  });

// Thumbs

var ThumbsMain = document.createElement("div");
ThumbsMain.setAttribute("class", "swiper-slide swiper-slide-visible");

var img = document.createElement("img");
img.src = urlOverlay;
img.style.objectFit = "cover";
img.style.minHeight = "100%";
img.style.maxWidth = "100%";
var playIcon = document.createElement("img");
playIcon.style.position = "absolute";
playIcon.style.zIndex = "10";
playIcon.style.top = "50%";
playIcon.style.left = "50%";
playIcon.style.cursor = "pointer";
playIcon.style.transform = "translate3d(-50%, -50%, 0)";
playIcon.style.transition = ".2s ease";
playIcon.src =
    "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzIgMzIiPjxwYXRoIGQ9Ik0xNiAwQzcuMTY0IDAgMCA3LjE2NCAwIDE2czcuMTY0IDE2IDE2IDE2IDE2LTcuMTY0IDE2LTE2UzI0LjgzNiAwIDE2IDB6bS02IDI0VjhsMTYuMDA4IDhMMTAgMjR6IiBmaWxsPSIjZmZmZmZmIiBjbGFzcz0iZmlsbC00ZTRlNTAiPjwvcGF0aD48L3N2Zz4=";
//ThumbsMain.appendChild(ThumbsZoom)
ThumbsMain.appendChild(playIcon)
ThumbsMain.appendChild(img)
document.querySelector("#product-header-pictures > div > div.media-slider > div > div > div:nth-child(2) > div > div > div").prepend(ThumbsMain);
ThumbsMain.addEventListener("mouseover", mOver, false);
ThumbsMain.addEventListener("mouseout", mOut, false);
function mOver() {
  playIcon.style.transform = "scale(1.5) translate3d(-30%, -30%, 0)";
}
function mOut() {
  playIcon.style.transform = "translate3d(-50%, -50%, 0)";
}
playIcon.addEventListener("click", function (e) {
    SDK.init({
      type: "player-modal",
      args: {
        key: playerKey,
        product: productId,
      },
    });
  });


// Player
    // Container
    var divPlayer = document.createElement("div");
    divPlayer.setAttribute("id", "teesterPlayer")
    divPlayer.style.position = "relative";
    divPlayer.style.marginBottom = "1rem";
    divPlayer.style.maxWidth = "50%";
    // Layout Title
    var descTitlePlayer = document.createElement("p")
    descTitlePlayer.setAttribute("id", "descteester")
    descTitlePlayer.style.color = "#018bd3";
    descTitlePlayer.innerHTML = "Découvrez la vidéo test du produit :";
    // Player init
    var videoPlayer = document.createElement("div");
    videoPlayer.setAttribute("id", "teesterPlayer");
    videoPlayer.style.aspectRatio = "16/9";
    videoPlayer.style.width = "500px";
    videoPlayer.style.marginTop = "0.8rem";
    videoPlayer.style.paddingBottom = "56.25%";
    
    SDK.init(
        {
           type: "player",
           args: {
                product: productId,
                key: playerKey,
                width: '100%',
                height: "inherit",
            },
        },
        videoPlayer
    );
    divPlayer.appendChild(descTitlePlayer);
    divPlayer.appendChild(videoPlayer);
    document.querySelector("#product-description > div.product-description-text").prepend(divPlayer);
// Tracking
var trackProduct = SDK.init({
  type: 'tracking',
  args: {
  key: "4ceb6fe9-f650-440b-9cf1-890b2953b6c2",
  product: productId,
  event: 'PRODUCT_PAGE_VIEW'
  }
  });
})
})
Editor is loading...