Вызов GP-пикселя из баннера по custom-событию

Описывается порядок вызова gp-пикселя по custom-событию на баннере

1. Добавление GP-пикселя

Сначала необходимо добавить новый GP-пиксель, который собираемся вызывать по кастомному событию (например, наведение курсора мыши на баннер).
Добавить GP-пиксель можно в сервисе http://sitecatalog.rtbads.com/

2. Вызов GP-пикселя

  1. Определить переменную var link = {LINK_UNESC} в коде баннера.
<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8">
    <script>
    	var link = "{LINK_UNESC}";
    </script>
  </head>
  <body>
    ...
    <script src="путь_до_файла_с_обработчиком_кастомных_событий"> </script>
  </body>
</html>
  1. Для вызова пикселя по кастомному событию можно использовать следующий пример JS-кода.

📘

Важно

JS-код обработчика кастомных событий рекомендуется вынести в отдельный файл и подключать в HTML-коде баннера как внешний js-файл

var LOG_URL = "http://sync.bumlam.com/?src=gp3&cmp=pepsidlyabannera&act=hover&cid=A2D4FF";

function bannerInit(bannerID) {

    var block = document.getElementById(bannerID),
        interval = {},
        time = 0;

    var encodesafebase64 = function(data2encode) {
        var retdata = window.btoa(data2encode)
            .replace(/\//g, "_")
            .replace(/\+/g, "-")
            .replace(/=/g, "*");
        return retdata;
    };

    var postVisit = function(act, customdata) {

        if (typeof act != 'string' || act == '') {
            return;
        }

        var data64 = '',
            r = /s_trk=([^&]+)/,
            url = decodeURIComponent(window.link),
            arr = url.match(r),
            s_trk = '';

        if (!!arr) {
            s_trk = arr[arr.length - 1];
        }


        if (!!customdata) {
            data64 = "&data64=" + encodesafebase64("{'act':'" + act + "','s_trk':'" + s_trk + "'," + customdata + "}");
        } else {
            data64 = "&data64=" + encodesafebase64("{'act':'" + act + "','s_trk':'" + s_trk + "'}");
        }

		var img = document.createElement('img');
        img.src = LOG_URL + "&act=" + act + "&r64=" +
            encodesafebase64(document.referrer) + data64 + "&cb=" + Math.random();
    };

    block.addEventListener('mouseenter', function() {
        postVisit("hover");
        interval = setInterval(function() {
			var timestring = "";
			if(isHover(bannerID)) {
				time += 1;
				timestring = "'time':'" + time + "'";
				postVisit("hover_duration", timestring);
			} else {
				clearInterval(interval);
				time = 0;
			}            
        }, 1000);
    });   
}

function isHover(blockID) {
	var hBlock = document.querySelector("#"+blockID+":hover");
	return !!hBlock && document.visibilityState === "visible";
}

bannerInit('b');

Ниже указано описание GET-параметров, с которыми вызывается пиксель
http://sync.bumlam.com/?src=gp3&cmp=pepsidlyabannera&act=hover&cid=A2D4FF

Название параметраОписание
cmpНазвание кампании. Задается в админке http://sitecatalog.rtbads.com/
actНазвание действия.Задается в админке http://sitecatalog.rtbads.com/
cidId кампании в админке http://sitecatalog.rtbads.com/