AdRiver - система управления интернет-рекламой
О компании Справочное руководство Вход в систему
Рекламным агентствам  AdRiver DSP 
Владельцам сайтов  AdRiver SSP 
Управление рекламой

FlashFull

1. Карточка баннера

Описание:
Flash-баннер раскрывается в FullScreen по наведению на него курсора мыши.
Тип кода:
Ajax.
Примеры:
Подробнее:
FlashFull представляет собой размерный Flash-баннер, который раскрывается в FullScreen по наведению на него курсора мыши. Баннер состоит из нескольких Flash-роликов, один из которых мастер (master) управляет взаимодействием панелей (panel), и скрипта
Обсчёт внешними системами:

2. Подготовка баннера

2.1. Мастер

Скачайте пример исходников для Flash-роликов. Сохраните в одну папку файл master1.as и исходники мастера.

В первый фрейм мастера пропишите следующий код:

#include "master1.as"

_root.deb.text = "";

function debug(txt){
    trace(txt);
    _root.deb.text += txt + "\n";     
}
function startScene(panel, sync){
     debug ("received: " + sync + " from: " + panel);
     switch (sync){
	case "showPanel2": 		//пришла метка showPanel2
	     showPanel("panel2");	//показать второй элемент panel
	     sendToPanel("panel2","go","start"); //просим второй элемент panel перейти к метке start
		     break;
        case "playPanel1": 
             sendToPanel("panel1", "go", "continue");
             break;
        case "hidePanel2":		//пришла метка hidePanel2
             hidePanel("panel2");	//прячем второй элемент panel
	      break;
	}	
}
function initDone(){
       debug ("initDone");
	sendEvent(0);		//сообщить системе AdRiver, что ролик полностью загружен

	hidePanel("panel2");	//спрятать элемент panel2
	showPanel("panel1");	//открыть элемент panel1
	sendToPanel("panel1","go","start");	//просим первый элемент panel перейти к метке start. 
}
registerMaster(initDone, startScene, ["panel1", "panel2"]);
stop(); //Останавливаемся и ждем, пока все панели загрузятся

Описание:

function startScene(panel, sync)
диспетчер сценария. Реализует сценарий взаимодействия панелей
function initDone()
выполняет первичную инициализацию ролика. Выполняется автоматически, когда все панели загружены
sync
метка синхронизации, с помощью неё мастер получает отчёты от панелей. Панель, отправившая команду sync может остановиться, а может продолжать выполнение команд
showPanel
открыть панель
hidePanel
закрыть панель
sendToPanel
отправить панели команду перейти к определённой метке
sendEvent
сообщить AdRiver о событии
registerMaster(initDone, startScene, ["panel1", "panel2"])
регистрация мастера и ожидание подтверждения о загрузке панелей. В качестве аргументов указываются:
initDone
функция инициализации
startScene
функция диспетчера сценария
["panel1", "panel2"]
список панелей с идентификаторами

Для создания собственного сценария взаимодействия панелей, используйте команды showPanel, hidePanel, sendToPanel.

Иногда требуется учитывать разные события в баннере, например, загрузку видео, открытие вкладки и т.д. Всего доступно 10 событий с номерами от 0 до; 9. Событие ноль (0) является служебным и сообщает о том, что ролик готов к воспроизведению. Перед тем, как регистрировать события 1 — 9, необходимо зарегистрировать событие ноль (0). Обычно это делается в функции initDone. Для регистрации событий используется команда sendEvent(eventId). Если учитывать события не планируется, то команду sendEvent(0) в функции initDone можно не использовать.

Подробнее об учёте событий в баннерах.

2.2. Панели

Сохраните в одну папку файл panels1.as и исходники всех панелей.

При начальной загрузке панелей слои, в которые они загружены, открыты (значение visible), поэтому первый кадр панели обычно делается пустым.

В первом кадре Flash-ролика для каждой панели пропишите команды:

#include "panels1.as"

registerPanel("panel1");	// регистрируем панель, сообщая мастеру её id
stop();				// останавливаемся и ждем дальнейших команд от мастера

panel1 — это имя панели, которое указывается в script.js и в мастере для отправки команд этой панели.

Для того, чтобы сообщить мастеру о том, что нужно переходить к следующему этапу, пропишите в нужном кадре панели следующий код:

sendSync("showPanel2"); // перейти ко второй панели 
stop();

Для того, чтобы определить, сколько раз за демонстрацию всего баннера могут появляться панели, в первом кадре мастера пропишите следующий код:

#include "master1.as"

_root.deb.text = "";

var k=3; // количество показов
var i=0; function debug(txt){ trace(txt); _root.deb.text += txt + "\n"; } function startScene(panel, sync){ debug ("received: " + sync + " from: " + panel); switch (sync){ case "showPanel2": //пришла метка showPanel2 if (i<k)
{ showPanel("panel2"); //показать второй элемент panel
sendToPanel("panel2","go","start"); //просим второй элемент panel перейти к метке start
}
i++; break; case "playPanel1": sendToPanel("panel1", "go", "continue"); break; case "hidePanel2": //пришла метка hidePanel2 hidePanel("panel2"); //прячем второй элемент panel break; } } function initDone(){ debug ("initDone"); sendEvent(0); //сообщить системе AdRiver, что ролик полностью загружен hidePanel("panel2"); //спрятать элемент panel2 showPanel("panel1"); //открыть элемент panel1 sendToPanel("panel1","go","start"); //просим первый элемент panel перейти к метке start. } registerMaster(initDone, startScene, ["panel1", "panel2"]); stop(); //Останавливаемся и ждем, пока все панели загрузятся

Для учёта клика создайте в нужном кадре flash-ролика элемент button, для которого напишите следующий код:

on (release) {
 makeClick()
}

Эта функция может также использоваться с параметром — альтернативным адресом перехода: makeClick("http://www.example.com").

Если вы хотите подгружать в flash-ролик дополнительные части, загруженные в баннер, то надо дописать к имени подгружаемого компонента перeменную _root.ar_comppath.

Например, для .swf файлов:

_root.ar_comppath + 'flash_name.swf'

2.3. Скрипт

Откройте текстовым редактором файл script.js. Аккуратно внесите изменения в верхнюю часть скрипта, отмеченную как Editable block:

var ar_gif	 = 0.gif';
var ar_gif_href	 = '';
var ar_pix 	 = '';

Переменные:

ar_gif
имя заглушки. Укажите ваше имя файла. Может быть загружена со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://»
ar_gif_href
альтернативный клик по заглушке. Если не нужен, оставьте пустым
ar_pix
вызов стороннего счётчика для баннера. Если не нужен, оставьте пустым
var m_html = a.makeFlash('master.swf', {menu:true}),
     p1_html = a.makeFlash('panel1.swf', {menu:true}),
     p2_html = a.makeFlash('panel2.swf', {menu:true, wmode: 'transparent'});

	a.MPU.addPanel("master", {width:"240px", height:"400px"}, m_html);
	a.MPU.addPanel("panel1", {width:"240px", height:"400px", position:"absolute", left:"0px", top:"0px", zIndex:2}, p1_html);
	a.MPU.addPanel("panel2", {width:"100%", height: a.normalize(a.getScreenGeometry().ch || '100%'), position:"absolute", left:"0px", top:"0px", zIndex:65000}, p2_html, document.body);
	a.addEvent(window, 'resize', function(){a.MPU.panels['panel2'].style.height = a.normalize(a.getScreenGeometry().ch || '100%')});

	a.MPU.start();
		}
	else if (ar_gif) {
		a.p.innerHTML = a.makeImage(ar_gif, ar_gif_href, 240, 400);
        }

Переменные:

m_html
имя мастера. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://»
p1_html
имя первой панели — размерного flash-ролика. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://»
p2_html
имя второй панели — FullScreen. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://»

Размеры заглушки должны совпадать с размерами малой панели. При необходимости, укажите положение панелей на странице: position, left, top, zIndex.

Сохраните файл script.js, баннер готов к загрузке.

3. Загрузка баннера

  1. Подготовьте баннер согласно п. 2 инструкции.
  2. Добавьте баннер special--->AjaxJS--->Generic-AjaxJS
  3. Укажите ссылку на сайт рекламодателя в поле Линк Баннера. При необходимости, укажите другие параметры.
  4. Нажмите на кнопку Добавить баннер. Вы попадете на страницу редактирования параметров баннера.
  5. Включите баннер (галочка Вкл.), укажите распределение в течение дня, задайте необходимые ограничения по количеству показов/кликов. При необходимости, настройте другие параметры. Для сохранения введенных настроек нажмите на кнопку Сохранить.
  6. Кликните по ссылке Загрузить баннер.
  7. Выберите с помощью кнопки Обзор все файлы баннера.
  8. Нажмите на кнопку Загрузить.

4. Ограничения на размер загружаемых файлов в системе AdRiver

5. Полезные ссылки

Последнее обновление: 20.04.2016