Hi ,
We are having a issue with youtube videos while playing the videos some times we are able to see the rule getting triggered but some time the rule is not getting triggered. we are using the custom code.
The custom code is
var n = 0;
var eFrameFlag = {};
document.querySelectorAll('iframe').forEach(function(el) {
var src=el.getAttribute('src');
if (src) {
if (src.indexOf('youtube') > -1) {
if (src.indexOf('?') > -1) {
if (src.indexOf('enablejsapi') == -1) {
src=src + '&enablejsapi=1';
}
} else {
src=src + '?enablejsapi=1';
}
el.setAttribute('src', src);
el.setAttribute('id', 'player' + n);
var frameId = 'player' + n;
eFrameFlag[frameId] = 0;
n++;
return el;
}
}
});
try {
var addYoutubeEventListener = (function() {
var callbacks = [];
var iframeId = 0;
return function(iframe, callback) {
// init message listener that will receive messages from youtube iframes
if (iframeId === 0) {
window.addEventListener("message", function(e) {
if ((e.origin !== "https://www.youtube-nocookie.com" || e.data === undefined) && (e.origin !== "https://www.youtube.com" || e.data === undefined)){
return;
}
try {
var data = JSON.parse(e.data);
var callback = callbacks[data.id];
callback(data);
}
catch (e) {}
});
}
// store callback
iframeId++;
callbacks[iframeId] = callback;
var currentFrameId = iframeId;
// sendMessage to frame to start receiving messages
iframe.addEventListener("load", function() {
var message = JSON.stringify({
event: 'listening',
id: currentFrameId,
channel: 'channelnameofyourchoice'
});
iframe.contentWindow.postMessage(message, 'https://www.youtube-nocookie.com');
iframe.contentWindow.postMessage(message, 'https://www.youtube.com');
message = JSON.stringify({
event: "command",
func: "addEventListener",
args: ["onStateChange"],
id: currentFrameId,
channel: "channelnameofyourchoice"
});
iframe.contentWindow.postMessage(message, 'https://www.youtube-nocookie.com');
iframe.contentWindow.postMessage(message, 'https://www.youtube.com');
});
}
})();
document.querySelectorAll('iframe').forEach(function(els) {
var newid = els.getAttribute('id');
var twentyfivePercent = false;
var fiftyPercent = false;
var seventyfivePercent = false;
var urlclicked;
addYoutubeEventListener(document.getElementById(newid), function(e) {
switch (e.info) {
case 1:
if (eFrameFlag[newid] == 0) {
urlclicked = window.frames[newid].src.split("?")[0];
_satellite.setVar('mediaName',urlclicked);
_satellite.track('YTvideoStart');
}
eFrameFlag[newid] = 1;
break;
case 0:
_satellite.track('videoCompleted');
break;
case 2:
_satellite.track('videoPause');
}
if(e.info.duration !== undefined && e.info.duration != null) {
_satellite.setVar("vidDuration",e.info.duration);
}
if(_satellite.getVar("vidDuration") !== undefined && e.info.currentTime !== undefined) {
var currentTime, duration;
currentTime = e.info.currentTime;
duration = _satellite.getVar("vidDuration");
if((currentTime >= (duration / 4)) && twentyfivePercent == false) {
_satellite.track('video25');
twentyfivePercent = true;
} else if((currentTime >= (duration / 2)) && fiftyPercent == false) {
_satellite.track('video50');
fiftyPercent = true;
} else if((currentTime >= (0.75 * duration)) && seventyfivePercent == false) {
_satellite.track('video75');
seventyfivePercent = true;
}
}
}
);
return els;
});
} catch (err) {
console.log("Video Tracking Not Present");
}
we are able to see the enablejsapi in the iframe sometimes we couldnt see that value whnever that value is present youtube video gets triggered.
Any Suggestion or Help Required.
Thanks..
