readme.md

Title: Event: spending a lot of time on an iframe | Событие: проведение кол-ва времени на iframe | fbpixel ymetrika gtag

Version: 1.0 - 08.10.2021

Cacher: https://snippets.cacher.io/snippet/dc37946455cea699dbea

Gist: https://gist.github.com/artemijeka/916f386651c8ef1bb73b00aadf027f24

Contact: web.master-artem.ru

Usage: add custom event at 34 line:

fbq('trackCustom', 'startFormFill');

script.js

(function () {
  document.addEventListener('DOMContentLoaded', function () {

    console.log('test');

    /**
    * Title: Event: spending a lot of time on an iframe | Событие: проведение кол-ва времени на iframe | fbpixel ymetrika gtag
    * Version: 1.0 - 08.10.2021
    * Cacher: https://snippets.cacher.io/snippet/dc37946455cea699dbea
    * Gist: https://gist.github.com/artemijeka/6ac2d21781995547dee3c3145ded0f78
    * Contact: web.master-artem.ru
    **/
    var clock = 0;//ms
    var interval = null;
    var buttons = document.querySelectorAll('[id*="timepad_twf_register"]');
    for (var item of buttons) {
      item.addEventListener('click', function (e) {

        clearInterval(interval);
        clock = 0;

        setTimeout(function () {
          
          var iframe = document.querySelector('[id$="_popup"][name$="_popup"]');
          var twfPopupClose = document.querySelector('.twf-popup-close');
          setTimeout(function () {
            iframe.addEventListener('mouseover', function (e) {
              console.log('mouseover');
              interval = setInterval(function () {
                if (document.querySelector('.twf-popup-container')) {
                  clock += 100;
                  console.log(clock);
                  if (clock === 3000) {
                    console.log('form=3s');
                    fbq('trackCustom', 'startFormFill');
                    clearInterval(interval);
                  } else if (clock > 3000) {
                    clearInterval(interval);
                  }
                } else {
                  clearInterval(interval);
                  clock = 0;
                }
              }, 100);
            });
            iframe.addEventListener('mouseout', function (e) {
              console.log('mouseout');
              clearInterval(interval);
            });
            twfPopupClose.addEventListener('mouseover', function (e) {
              clearInterval(interval);
            });
            twfPopupClose.addEventListener('click', function (e) {
              clearInterval(interval);
              clock = -3000;
            });

          }, 1);

        }, 1);
      });
    }



  });
})();