SideKick из Rich-Media



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

Описание:
баннер Rich-Media, при наведении курсором мыши на который сдвигается контент сайта.
Тип кода:
Ajax.
Подробнее:
SideKick представляет собой несколько Flash-роликов, взаимодействующих по определённому сценарию. На странице размещается баннер Rich-Media. По наведению на него курсора мыши, появляется большой Flash-ролик, который сдвигает контент сайта влево. После того, как ролик проиграется, контент сайта возвращается на прежнее место. SideKick — это вариант баннера MPU. Мастер загружается первым и постоянно находится на экране, обеспечивая синхронизацию сценария ролика. Взаимодействие панелей происходит через мастер, относительно которого они позиционируются. В первом кадре панели проводится инициализация и отправка мастеру сообщения о том, что панель загружена и готова принимать команды. После этого панель останавливается. Панели взаимодействуют друг с другом только через мастера. Для этого используется команда sendSync (метка синхронизации). Диспетчер сценария мастера отслеживает команды от панелей и выполняет необходимые действия. Первая панель — это Flash-ролик любого размера. Вторая панель — это большой Flash-ролик, сдвигающий контент.
Обсчёт внешними системами:

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

2.1. Мастер

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

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

#include "master1.as"

function startScene(panel, sync) {
	 switch (sync) {
	    case "showPanel2":
	      sendToJS("slide_up","panel2");
	      sendToPanel("panel2","go","start");
	      break;
	    case "hidePanel2":
	      sendToJS("slide_down","panel2");
	      break;
    }
}

function initDone() {
	 sendEvent(0);

	 showPanel("panel1");
	 sendToPanel("panel1","go","start");
}

registerMaster(initDone,startScene,["panel1", "panel2"]);
stop();

Описание:

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

2.2. Панели

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

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

В файле panel1 необходимо прописать в первом кадре следующий код:

#include "rich.adriver.as"
#include "panels1.as"
registerPanel("panel1");
stop();

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

#include "panels1.as"

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

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

Для перехода на сайт по клику необходимо в actions кликовой кнопки прописать код:

В файле panel1 пропишите код:

on (release) {
	richClick();
}

В файле panel2 пропишите код:

 on (release) {
 makeClick()
}

Эта функция может также использоваться с параметром — альтернативным адресом перехода: makeClick(«http://www.example.com»). Подробнее см. Мультипанельные баннеры (MPU, FlyScreen, OverLay).

Для открытия большой панели необходимо вызвать команду:

sendSync("showPanel2");

Для возвращения SideKick в исходное состояние необходимо в нужном месте вызвать команду sendSync(«hidePanel2»);

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

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

_root.ar_comppath + 'flash_name.swf'

Размер загружаемых файлов должен соответствовать спецификации.

3. Подготовка скрипта

Откройте текстовым редактором файл script.js.

При необходимости, внесите изменения в верхнюю часть скрипта, отмеченную как Editable block:

var ar_gif	     = '0.gif';
var ar_gif_href	 = '';     
var ar_pix	     = '';     
var ar_time	     = 2;   
var panels       =
 [
    {swf: 'panel1.swf', width: '350', height: '350', x: '0.5', y: '0.5', abs_x: '0', abs_y: '0', wmode: 'transparent'}
 ];      

Описание переменных:

ar_gif
имя заглушки. Укажите ваше имя файла. Может быть загружена со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://» или «https://»
ar_gif_href
альтернативный клик по заглушке. Если не нужен, оставьте пустым
ar_pix
вызов стороннего счётчика, если необходимо
ar_time
время (в сек.), за которое сдвигается вторая панель
panels
параметры первой панели: название ролика, ширина и высота, относительные координаты на странице, абсолютные координаты на странице (при необходимости)

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

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

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

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