<![CDATA[
<style>
#w-o-s-external-banner-id-2 {
pointer-events: none;
}
#w-o-s-external-banner-id-2.shown {
pointer-events: auto;
}
#w-o-s-external-banner-id-2.shown .w-o-s-main-video-wrapper {
transform: scale(1);
opacity: 1;
}
#w-o-s-external-banner-id-2.shown .w-o-s-background-video-wrapper {
opacity: 1;
}
#w-o-s-external-banner-id-2.shown .w-o-s-close-overlay {
display: block;
}
.w-o-s-main-video-wrapper {
position: fixed;
width: 850px;
height: 478px;
top: 50px;
bottom: 0;
left: 0;
right: 0;
margin: auto;
z-index: 99999999;
background: #000;
-webkit-transition: all 700ms ease;
-moz-transition: all 700ms ease;
-ms-transition: all 700ms ease;
-o-transition: all 700ms ease;
transition: all 700ms ease;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
-ms-transform: scale(0.8);
-o-transform: scale(0.8);
transform: scale(0.8);
opacity: 0;
}
.w-o-s-main-video-wrapper:hover .w-o-s-mute {
opacity: 0.4;
}
.w-o-s-main-video-wrapper .w-o-s-product {
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
z-index: 10;
-webkit-transition: opacity 700ms ease;
-moz-transition: opacity 700ms ease;
-ms-transition: opacity 700ms ease;
-o-transition: opacity 700ms ease;
transition: opacity 700ms ease;
opacity: 0;
pointer-events: none;
}
.w-o-s-main-video-wrapper .w-o-s-product.shown {
opacity: 1;
pointer-events: auto;
}
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-men,
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-women {
position: absolute;
width: 160px;
height: 207px;
left: 80px;
top: 153px;
background: url(http://w-o-s.ru/richmedia/projects/nike-augmented-video-banner/images/men.png);
opacity: 0.75;
-webkit-transition: opacity 200ms ease;
-moz-transition: opacity 200ms ease;
-ms-transition: opacity 200ms ease;
-o-transition: opacity 200ms ease;
transition: opacity 200ms ease;
}
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-men:hover,
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-women:hover {
opacity: 1;
}
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-women {
left: auto;
right: 80px;
background: url(http://w-o-s.ru/richmedia/projects/nike-augmented-video-banner/images/women.png);
}
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-nike-site {
position: absolute;
width: 240px;
height: 50px;
left: 312px;
top: 326px;
background: #010001;
opacity: 0.25;
-webkit-transition: opacity 200ms ease;
-moz-transition: opacity 200ms ease;
-ms-transition: opacity 200ms ease;
-o-transition: opacity 200ms ease;
transition: opacity 200ms ease;
}
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-nike-site:hover {
opacity: 0;
}
.w-o-s-main-video-wrapper .w-o-s-product .w-o-s-yt-black {
position: absolute;
width: 100%;
height: 30px;
background: #010001;
z-index: 1;
top: 0px;
left: 0px;
}
.w-o-s-background-video-wrapper {
position: fixed;
width: 1920px;
height: 1080px;
top: 50%;
left: 50%;
margin: -520px 0 0 -960px;
z-index: 0;
-webkit-transition: all 700ms ease;
-moz-transition: all 700ms ease;
-ms-transition: all 700ms ease;
-o-transition: all 700ms ease;
transition: all 700ms ease;
opacity: 0;
}
.w-o-s-close-overlay {
display: none;
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 100000;
cursor: url(http://w-o-s.ru/richmedia/projects/nike-augmented-video-banner/images/close.png), auto;
}
.w-o-s-mute {
position: absolute;
right: 20px;
bottom: 20px;
width: 70px;
height: 70px;
cursor: pointer;
opacity: 0;
background: url(http://w-o-s.ru/richmedia/projects/nike-augmented-video-banner/images/sound_off.png);
-webkit-transition: opacity 200ms ease;
-moz-transition: opacity 200ms ease;
-ms-transition: opacity 200ms ease;
-o-transition: opacity 200ms ease;
transition: opacity 200ms ease;
z-index: 20;
}
.w-o-s-mute:hover {
opacity: 1 !important;
}
.w-o-s-mute.on {
background: url(http://w-o-s.ru/richmedia/projects/nike-augmented-video-banner/images/sound_on.png);
}
.w-o-s-main-video-wrapper .w-o-s-nike-site-big {
position: absolute;
width: 100%;
height: 100%;
left: 0px;
top: 0px;
z-index: 1;
}
#youtube-main-video, #youtube-background-video {
pointer-events: none;
}
</style>
<script>
(function (window, document) {
var WOSBanner = new function () {
var wos = this,
$dom = {},
$,
show_timer,
yt_main_video,
yt_bg_video,
current_time_timer,
current_time_timer_timeout = 900,
$window,
domain_name;
this.type = 'fullscreen';
this.id = 2;
var assign = function () {
$ = window.jQuery;
$dom.banner = $('#w-o-s-external-banner-id-' + wos.id);
$dom.close = $dom.banner.find('.w-o-s-close-overlay');
$dom.mute = $dom.banner.find('.w-o-s-mute');
$dom.pixels = $('#w-o-s-adfox-pixels');
$dom.link_men = $dom.banner.find('.w-o-s-men');
$dom.link_women = $dom.banner.find('.w-o-s-women');
$dom.link_nike = $dom.banner.find('.w-o-s-nike-site, .w-o-s-nike-site-big');
$dom.product = $dom.banner.find('.w-o-s-product');
$window = $(window);
domain_name = top.location.hostname.replace('www.', '');
};
var bind = function () {
$dom.close.on('click.w-o-s-banner-id-' + wos.id, function () {
finish();
});
$dom.mute.on('click.w-o-s-banner-id-' + wos.id, function () {
if ($dom.mute.hasClass('on')) {
$dom.mute.removeClass('on');
yt_main_video.unMute();
}else{
$dom.mute.addClass('on');
yt_main_video.mute();
}
});
$(window).bind('statechange.w-o-s-banner-id-' + wos.id, function(){
wos.hide(function () {
_postMessage('wos_banner', '*', window, {
id: wos.id,
remove: true
});
});
});
_getMessage('wos_external_banner', '*', function (data, e) {
if (data.showFullscreen) {
wos.startFullscreen();
}
});
$window.on('mousemove.w-o-s-banner-id-' + wos.id, function ( event ) {
clientX = (event.clientX || event.pageX) / $(window).width();
clientY = (event.clientY || event.pageY) / $(window).height();
_postMessage('wos_banner', '*', window, {
id: 2,
mouse: {x: clientX , y: clientY}
});
});
};
var unbind = function () {
$dom.close.off('click.w-o-s-banner-id-' + wos.id);
$window.unbind('statechange.w-o-s-banner-id-' + wos.id);
$window.off('mousemove.w-o-s-banner-id-' + wos.id);
$dom = {};
wos.startFullscreen = function () {};
};
wos.ready = function () {
assign();
bind();
};
wos.startFullscreen = function () {
// YOUTUBE API
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
window.onYouTubeIframeAPIReady = function () {
yt_main_video = new YT.Player('youtube-main-video', {
width: '850',
height: '478',
videoId: 'mRpId3egle8',
playerVars: {
controls: 0,
rel: 0
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
yt_bg_video = new YT.Player('youtube-background-video', {
width: '1920',
height: '1080',
videoId: 'nkC_Y0ObIs8',
playerVars: {
controls: 0,
rel: 0
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
aa = yt_main_video;
}
if (window.YT) {
console.trace()
setTimeout(function () {
window.onYouTubeIframeAPIReady();
}, 300);
}
checkLinks();
};
var number_of_videos = 0;
var onPlayerReady = function(event) {
number_of_videos++;
if (number_of_videos == 2) {
number_of_videos = 0;
yt_main_video.playVideo();
yt_bg_video.playVideo();
setTimeout(function () {
yt_main_video.pauseVideo();
yt_bg_video.pauseVideo();
setTimeout(function () {
yt_main_video.playVideo();
yt_bg_video.playVideo();
_postMessage('wos_banner', '*', window, {
id: wos.id,
action: {
hide: true
}
});
wos.show();
}, 300);
}, 300);
}
};
var onPlayerStateChange = function(event) {
if (yt_bg_video.getPlayerState() == 0) {
yt_main_video.stopVideo();
finish();
}
};
var finish = function () {
yt_main_video.stopVideo();
yt_bg_video.stopVideo();
stopTimer();
wos.hide(function () {
_postMessage('wos_banner', '*', window, {
id: wos.id,
action: {
show: true
},
remove: true
});
});
};
var showProduct = function () {
stopTimer();
yt_main_video.pauseVideo();
yt_bg_video.pauseVideo();
$dom.product.addClass('shown');
};
var startTimer = function () {
clearInterval(current_time_timer);
current_time_timer = setInterval(function () {
var time = parseFloat(yt_main_video.getCurrentTime());
// _log(time);
if (time > 34) {
showProduct();
}
}, current_time_timer_timeout);
};
var stopTimer = function () {
clearInterval(current_time_timer);
};
var checkLinks = function () {
switch (domain_name) {
case 'w-o-s.ru':
case 'alpha.w-o-s.ru':
$dom.link_men.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corjt&pr=[RANDOM]&puid1=');
$dom.link_women.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corju&pr=[RANDOM]&puid1=');
$dom.pixels.find('img').eq(0).attr('src', 'http://ads.adfox.ru/216820/getCode?p1=blxlk&p2=v&pe=b&pfc=yvoc&pfb=corjr&puid1=&pr=epioour');
$dom.link_nike.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corju&pr=[RANDOM]&puid1=');
break;
case 'royalcheese.ru':
$dom.link_men.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corkh&pr=[RANDOM]&puid1=');
$dom.link_women.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corki&pr=[RANDOM]&puid1=');
$dom.pixels.find('img').eq(0).attr('src', 'http://ads.adfox.ru/216820/getCode?p1=blxlk&p2=v&pe=b&pfc=yvrp&pfb=corkf&puid1=&pr=epiopmc');
$dom.link_nike.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corki&pr=[RANDOM]&puid1=');
break;
case 'siliconrus.com':
$dom.link_men.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corkn&pr=[RANDOM]&puid1=');
$dom.link_women.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corkq&pr=[RANDOM]&puid1=');
$dom.pixels.find('img').eq(0).attr('src', 'http://ads.adfox.ru/216820/getCode?p1=blxlk&p2=v&pe=b&pfc=yvse&pfb=corkl&puid1=&pr=epiopus');
$dom.link_nike.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corkq&pr=[RANDOM]&puid1=');
break;
case 'tjournal.ru':
$dom.link_men.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corka&pr=[RANDOM]&puid1=');
$dom.link_women.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corkd&pr=[RANDOM]&puid1=');
$dom.pixels.find('img').eq(0).attr('src', 'http://ads.adfox.ru/216820/getCode?p1=blxlk&p2=v&pe=b&pfc=yvsa&pfb=corjx&puid1=&pr=epiopcc');
$dom.link_nike.attr('href', 'http://ads.adfox.ru/216820/goLink?p1=blxlk&p2=v&p5=corkd&pr=[RANDOM]&puid1=');
break;
}
};
wos.show = function (callback) {
_skip(function () {
// WOS
switch (domain_name) {
case 'w-o-s.ru':
case 'alpha.w-o-s.ru':
$('.page-index').css('background-color', 'transparent');
$('.black-manifest').fadeTo(500, 0.001);
break;
case 'royalcheese.ru':
$('#contentBlock').css('background-color', 'rgba(255,255,255,0.5)');
break;
case 'siliconrus.com':
$('.b-content-w').parent().css({
'position': 'relative',
'z-index': '1',
'background': 'rgba(255,255,255,0.5)'
});
$('.b-content-w .b-main.b-main_inside, .b-content-w .b-main_inside .b-main__b2, .b-content-w .b-main__fix-bg').css({
'background': 'rgba(255,255,255,0)'
});
$('#up').hide();
break;
case 'tjournal.ru':
break;
}
$dom.banner.addClass('shown');
});
startTimer();
};
wos.hide = function (callback) {
$dom.banner.removeClass('shown');
switch (domain_name) {
case 'w-o-s.ru':
case 'alpha.w-o-s.ru':
$('.page-index').css('background-color', '#f7f7f7');
$('.black-manifest').fadeTo(500, 1);
break;
case 'royalcheese.ru':
$('#contentBlock').css('background-color', '#fff');
break;
case 'siliconrus.com':
$('.b-content-w').parent().css({
'position': '',
'z-index': '',
'background': ''
});
$('.b-content-w .b-main.b-main_inside, .b-content-w .b-main_inside .b-main__b2, .b-content-w .b-main__fix-bg').css({
'background': ''
});
$('#up').show();
break;
case 'tjournal.ru':
break;
}
setTimeout(function () {
callback && callback();
unbind();
}, 700);
};
wos.init = function () {
var scripts = ['http://w-o-s.ru/richmedia/messages.js'];
if (window._extCode === undefined) {
scripts.push('http://w-o-s.ru/richmedia/projects/nike-augmented-video-banner/core.js');
}
if (!window.jQuery) {
scripts.unshift('http://code.jquery.com/jquery-1.11.0.min.js');
}
if (document.body == null) {
document.addEventListener("DOMContentLoaded", function(event) {
wos.loadScripts(scripts, function () {
wos.ready();
});
});
}else{
wos.loadScripts(scripts, function () {
wos.ready();
});
}
};
wos.loadScripts = function(url, callback) {
if (!(url instanceof Array)) {
url = [url];
}
var url_counter = 0,
url_length = url.length,
onload = function() {
url_counter++;
if (url_counter >= url_length) {
callback();
} else {
loadScript(url[url_counter], onload);
}
};
if (url_length === 0) {
callback();
} else {
loadScript(url[0], onload);
}
}
var adfoxPixelEmitter = function(name) {
var pixels = {
'expand': '',
'collapse': ''
}
if (pixels[name]) {
var pixel = new Image();
var url = pixels[name];
if (url.substring(url.length, url.length-8) == '[RANDOM]') {
url = url.substring(0, url.length-8) + Math.round(Math.random() * 999999)
}
pixel.src = url;
document.getElementById('adfox_pixels').appendChild(pixel);
}
};
var loadScript = function(url, callback) {
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" ||
script.readyState == "complete"){
script.onreadystatechange = null;
if (callback) callback();
}
};
} else { //Others
script.onload = function(){
if (callback) callback();
};
}
script.src = url;
document.body.appendChild(script);
};
var preloadImage = function (src, callback) {
var $img = $('<img src="'+ src +'">');
$img.load(function () {
callback && callback();
}).error(function () {
_log('Error loading image:', src);
});
};
};
WOSBanner.init();
})(window, document);
</script>
<div id="w-o-s-external-banner-id-2">
<div class="w-o-s-close-overlay"></div>
<div class="w-o-s-main-video-wrapper">
<div class="w-o-s-mute"></div>
<a class="w-o-s-nike-site-big" href="http://www.nike.com/ru/ru_ru/c/sportswear" target="_blank"></a>
<div class="w-o-s-product">
<div class="w-o-s-yt-black"></div>
<a class="w-o-s-men" href="http://www.nike.com/ru/ru_ru/c/sportswear/mens-sneakerboots" target="_blank"></a>
<a class="w-o-s-nike-site" href="http://www.nike.com/ru/ru_ru/c/sportswear" target="_blank"></a>
<a class="w-o-s-women" href="http://www.nike.com/ru/ru_ru/c/sportswear/womens-sneakerboots" target="_blank"></a>
</div>
<div id="youtube-main-video"></div>
</div>
<div class="w-o-s-background-video-wrapper">
<div id="youtube-background-video"></div>
</div>
<div id="w-o-s-adfox-pixels" hidden="">
<img src="">
</div>
</div>
]]>