(
function($)
{
//Old Analytics FIX.
try{
pageTracker;
} catch(err){
pageTracker = {
_trackPageview:function( id ){
if( booDebug )
alert( id );
_gaq.push(['_trackEvent', 'Slider', 'clicou', id]);
//_gaq.push(['_trackPageview', id]);
}
}
}
bannerController =
{
currentPos: 0,
controlPositions:
{
showing: [],
hidden : [],
main : []
},
timers:
{
animation : null, /* Controla a animação */
inactivity: null /* Controla a inatividade, retornando à animação caso o usuário não interaja por muito tempo */
},
elements: {},
config:
{
bannerAnimationSpeed : 'medium',
animationTimerSpeed : 4 * 1000, /* Intervalo da troca de animação, segundos * 1000 */
inactivityTimerSpeed : 2 * 1000, /* Intervalo de inatividade, segundos * 1000 */
thumbsInactiveOpacity: null /* Opacidade dos thumbs */,
thumbsHolderWidth : {open: 0, closed: 0} /* Largura do holder de thumbs */,
thumbsHolderHeight : 0, /* Altura do holder de thumbs */
thumbsHolderMargin : 0,/* Margem top padrão */
running : false /* Flag de execução de animações */
},
init: function()
{
bannerController.elements =
{
container : $('#banner'),
banner:
{
mainHolder: $('#banner div.images-holder'),
holder : $('#banner div.images-holder ul'),
items : $('#banner div.images-holder li'),
links : $('#banner div.images-holder a')
},
nav:
{
holder: $('#nav'),
items : $('#nav a')
},
thumbs:
{
mainHolder : $('#banner .thumbs-holder'),
holder : $('#thumbs'),
containers : $('#thumbs li'),
items : $('#thumbs a'),
close : $('#banner .thumbs-holder a.close')
}
};
/* Definição de configurações */
var status = bannerController.elements.container.hasClass('open') ? 'open' : 'closed';
bannerController.elements.container.addClass('open');
bannerController.config.thumbsInactiveOpacity =
parseFloat(bannerController.elements.thumbs.containers.eq(1).find('a').css('opacity'));
if(isNaN(bannerController.config.thumbsInactiveOpacity))
bannerController.config.thumbsInactiveOpacity = 0.2;
bannerController.config.thumbsHolderWidth.open =
parseInt(bannerController.elements.thumbs.mainHolder.css('width'));
bannerController.elements.container.removeClass('open');
bannerController.config.thumbsHolderWidth.closed=
parseInt(bannerController.elements.thumbs.mainHolder.css('width'));
bannerController.config.thumbsHolderHeight =
parseInt(bannerController.elements.thumbs.containers.eq(0).css('height'));
bannerController.config.thumbsHolderMargin =
parseInt(bannerController.elements.thumbs.containers.eq(0).css('margin-top'));
bannerController.elements.container[status == 'open' ? 'addClass' : 'removeClass']('open');
bannerController.regenerateOrderLists();
/* Preloading das imagens */
bannerController.elements.banner.links.each
(
function(pos)
{
var bgUrl = this.getAttribute('data-bg'),
target = $(this),
preloader= new Image();
preloader.onload =
function(){target.css({'background-image': 'url("' + bgUrl + '")'});};
preloader.src = bgUrl;
if(preloader.complete)preloader.onload.call(this);
return true;
}
);
/* Preloading dos thumbs */
bannerController.elements.thumbs.items.each
(
function(pos)
{
var bgUrl = this.getAttribute('data-bg'),
target = $(this),
preloader= new Image();
preloader.onload =
function(){target.css({'background-image': 'url("' + bgUrl + '")'});};
preloader.src = bgUrl;
if(preloader.complete)preloader.onload.call(this);
return true;
}
);
/* Binding de eventos */
/* Barra de thumbs, mouseover */
bannerController.elements.thumbs.mainHolder.bind
(
'mouseenter',
function(e)
{
bannerController.elements.thumbs.mainHolder.stop(true,true).animate
(
{width: bannerController.config.thumbsHolderWidth.open},
bannerController.config.bannerAnimationSpeed,
function()
{
bannerController.elements.container.addClass('open');
return true;
}
);
return true;
}
).bind
(
'mouseleave',
function(e)
{
bannerController.elements.thumbs.mainHolder.stop(true,true).animate
(
{width: bannerController.config.thumbsHolderWidth.closed},
bannerController.config.bannerAnimationSpeed,
function()
{
bannerController.elements.container.removeClass('open');
return true;
}
);
return true;
}
);
/* Botão fechar */
bannerController.elements.thumbs.close.bind
(
'click',
function(e)
{
e.preventDefault();
e.stopPropagation();
bannerController.elements.thumbs.mainHolder.stop(true,true).animate
(
{width: bannerController.config.thumbsHolderWidth.closed},
bannerController.config.bannerAnimationSpeed,
function()
{
bannerController.elements.container.removeClass('open');
return true;
}
);
return true;
}
);
/* Thumbs, ações */
bannerController.elements.thumbs.items.bind
(
'click',
function(e)
{
e.preventDefault();
e.stopPropagation();
if(bannerController.controlPositions.hidden.length <= 0)return false;
bannerController.stopInactivityTimer();
bannerController.stopAnimationTimer();
var index = this.parentNode.getAttribute('data-index') * 1,
absoluteIndex = $.inArray(index, bannerController.controlPositions.showing),
relativeIndex = bannerController.elements.thumbs.items.index(this);
bannerController.elements.thumbs.items.stop(true,true)
.css({opacity:bannerController.config.thumbsInactiveOpacity});
bannerController.elements.thumbs.containers.removeClass('active');
$(this).animate({opacity: 1}, bannerController.config.bannerAnimationSpeed).parent().addClass('active');
/* Animação do banner */
bannerController.moveBannerByIndex(bannerController.controlPositions.showing[absoluteIndex]);
bannerController.initInactivityTimer();
return true;
}
).bind
(
'mouseenter',
function(e)
{
$(this).animate({opacity: 1},
bannerController.config.bannerAnimationSpeed,
function(){$(this).find('span').addClass('visible');});
return true;
}
).bind
(
'mouseleave',
function(e, ignore)
{
if(this.parentNode.className.indexOf('active') == -1)
$(this).animate({opacity: bannerController.config.thumbsInactiveOpacity},
bannerController.config.bannerAnimationSpeed,
function(){$(this).find('span').removeClass('visible');});
return true;
}
);
/* Click nos nodes de navegação */
bannerController.elements.nav.items.bind
(
'click',
function(e)
{
e.preventDefault();
e.stopPropagation();
var index = bannerController.elements.nav.items.index(this),
relativeIndex= bannerController.elements.thumbs.containers.index(bannerController.elements.thumbs.holder.find('li[data-index="' + index + '"]')[0]),
nextValue = null;
bannerController.stopInactivityTimer();
bannerController.stopAnimationTimer();
if(!bannerController.isBeingShown(index))
{
bannerController.elements.thumbs.containers.removeClass('active');
bannerController.elements.thumbs.items.css({opacity: bannerController.config.thumbsInactiveOpacity});
var ref = bannerController.elements.thumbs.containers.eq(relativeIndex).css('display','list-item')[0],
items = bannerController.elements.thumbs.containers.stop(true,true),
upAction= function(item)
{
if(item == ref || item == null)
{
bannerController.regenerateOrderLists();
bannerController.elements.thumbs.containers.removeClass('active');
bannerController.elements.thumbs.items.css({opacity: bannerController.config.thumbsInactiveOpacity});
bannerController.elements.thumbs.items.eq(0)
.css({opacity: 1}).parent().addClass('active');
return false;
}
$(item).animate
(
{'margin-top': -bannerController.config.thumbsHolderHeight},
'fast',
function()
{
bannerController.elements.thumbs.holder
.append($(this).css({'margin-top': bannerController.config.thumbsHolderMargin})[0]);
upAction(this.parentNode.getElementsByTagName('li')[0]);
return true;
}
);
return true;
}
upAction(bannerController.elements.thumbs.containers.get(0));
}
else
{
bannerController.elements.thumbs.containers.removeClass('active');
bannerController.elements.thumbs.items.stop(true,true)
.css({opacity: bannerController.config.thumbsInactiveOpacity})
.eq(relativeIndex).animate({opacity: 1},bannerController.config.bannerAnimationSpeed).parent().addClass('active');
}
bannerController.moveBannerByIndex(index);
bannerController.initInactivityTimer();
return true;
}
);
bannerController.initAnimationTimer();
return true;
},
/* Interpretação do documento XML de origem */
requestXML: function(path)
{
$.get
(
path,
{},
function(data)
{
var banners = data.getElementsByTagName('banner'),
returnData = {banners:[],thumbs:[],nav:[]};
for(var counter = 0, size = banners.length;counter < size;counter++)
{
//var onClickCommand = 'onclick="if(pageTracker)pageTracker._trackPageview(\'' + banners[counter].getAttribute('analyticsKey') + '\')"';
var onClickCommand = 'onclick="openLinkWithEvent( \''+banners[counter].getAttribute('clickUrl')+'\', \'TV_HOME\', \'click\', \'' + banners[counter].getAttribute('analyticsKey') + '\')"';
var hrefLink = 'href="' + banners[counter].getAttribute('clickUrl') + '"';
hrefLink = 'href="javascript:void()"';
returnData.banners.push
(
'' +
''+
banners[counter].getAttribute('description') +
'' +
''
);
returnData.thumbs.push
(
'' +
'' +
''
);
returnData.nav.push
(
''
);
}
returnData.thumbs.push(returnData.thumbs.shift());
$('#banner .images-holder ul').html(returnData.banners.join(''));
$('#thumbs').html(returnData.thumbs.join(''));
$('#nav').html(returnData.nav.join(''));
bannerController.init();
return true;
},
'xml'
);
},
/* Executa as animações correspondentes para o banner */
moveByIndex: function(index, nextValue)
{
/* Sanitização da informação; ninguém quer animar para uma posição que não existe ;) */
if(index > bannerController.elements.thumbs.containers.length - 1)index = 0;
/* Localiza o próximo item não-oculto */
var totalController = 0;
while(bannerController.elements.thumbs.containers.eq(0).css('display') == 'none')
{
var hidden = bannerController.elements.thumbs.containers.eq(0);
bannerController.elements.thumbs.holder
.append(hidden.css({display:'list-item', 'margin-left': 0, 'margin-top': bannerController.config.thumbsHolderMargin}));
var current = $.inArray(hidden.attr('data-index') * 1,
bannerController.controlPositions.showing);
if(current != -1)
bannerController.controlPositions.hidden.push
(bannerController.controlPositions.showing.splice(current, 1)[0]);
/* Atualização dos alias de informação */
bannerController.elements.thumbs.containers = $('#thumbs li');
bannerController.elements.thumbs.items = $('#thumbs a');
}
while(bannerController.elements.thumbs.containers.eq(index).css('display') == 'none')
{
totalController++;
if(totalController == bannerController.elements.thumbs.containers.length - 1)break;
index++;
}
//Retira o "atualmente selecionado" da barra de navegação
bannerController.elements.nav.items.removeClass('current');
if(bannerController.isBeingShown(index))
{
var position = $.inArray(index, bannerController.controlPositions.showing),
action = function()
{
bannerController.elements.thumbs.items.eq(position).animate
(
{opacity: 1},
bannerController.config.bannerAnimationSpeed
).parent().addClass('active');
return true;
};
bannerController.elements.thumbs.holder.find('li a').stop(true,true);
if(bannerController.elements.thumbs.holder.find('li.active a').animate
(
{opacity: bannerController.config.thumbsInactiveOpacity},
bannerController.config.bannerAnimationSpeed,
action
).parent().removeClass('active').length == 0)action.apply(this);
}
else
{
/* Lógica de carrossel contínuo */
var position = $.inArray(index, bannerController.controlPositions.hidden),
absolutePosition= position + bannerController.controlPositions.showing.length;
bannerController.elements.thumbs.items.stop(true,true);
bannerController.elements.thumbs.holder.find('li.active a').stop(true,true).animate
(
{opacity: bannerController.config.thumbsInactiveOpacity},
'fast',
function()
{
bannerController.elements.thumbs.containers.eq(0).animate
(
{'margin-top': -bannerController.config.thumbsHolderHeight},
bannerController.config.bannerAnimationSpeed,
function()
{
bannerController.elements.thumbs.containers.last()
.after(bannerController.elements.thumbs.containers
.eq(0).css({'margin-top': bannerController.config.thumbsHolderMargin}));
var item = bannerController.elements.thumbs.holder.find('li[data-index=' + index + ']');
item.addClass('active');
item.find('a').css({opacity:1});
bannerController.controlPositions.hidden
.push(bannerController.controlPositions.showing.shift());
bannerController.controlPositions.showing
.push(bannerController.controlPositions.hidden.shift());
/* Atualização dos alias de informação */
bannerController.regenerateOrderLists();
bannerController.currentPos = nextValue != null ? nextValue : index;
return true;
}
);
}
).parent().removeClass('active');
}
/* Animação do banner */
bannerController.moveBannerByIndex(index);
return true;
},
moveBannerByIndex: function(index)
{
/* Animação do banner */
var bannerPosition = bannerController.elements.banner.items.eq(index).position();
bannerController.elements.banner.holder.animate
(
{top: -bannerPosition.top, left: -bannerPosition.left},
bannerController.config.bannerAnimationSpeed,
function()
{
bannerController.currentPos = index;
//Ativa o item atualmente selecionado
bannerController.elements.nav.items.removeClass('current').eq(index).addClass('current');
return true;
}
);
return true;
},
/* Seta / reseta o timer de animação */
initAnimationTimer: function()
{
if(bannerController.timers.animation != null)
window.clearInterval(bannerController.timers.animation);
bannerController.timers.animation =
window.setInterval
(
function()
{
bannerController.moveByIndex(++bannerController.currentPos);
return true;
},
bannerController.config.animationTimerSpeed
);
return true;
},
/* Pára o timer de animação */
stopAnimationTimer: function()
{
window.clearInterval(bannerController.timers.animation);
return true;
},
/* Inicializa o timer de inatividade */
initInactivityTimer: function()
{
if(bannerController.timers.inactivity != null)
window.clearTimeout(bannerController.timers.inactivity);
bannerController.timers.inactivity = window.setTimeout
(
function()
{
bannerController.initAnimationTimer();
return true;
},
bannerController.config.inactivityTimerSpeed
);
return true;
},
/* Para o timer de inatividade */
stopInactivityTimer: function()
{
window.clearTimeout(bannerController.timers.inactivity);
return true;
},
/* Verifica se uma determinada posição está sendo atualmente mostrada */
isBeingShown: function(index)
{
var found = false;
for(var counter = 0, size = bannerController.controlPositions.showing.length;counter < size;counter++)
if(bannerController.controlPositions.showing[counter] == index){found = true;break;}
return found;
},
/* Verifica se uma determinada posição está ocultada */
isHidden: function(index)
{
var found = false;
for(var counter = 0, size = bannerController.controlPositions.hidden.length;counter < size;counter++)
if(bannerController.controlPositions.hidden[counter] == index){found = true;break;}
return found;
},
/* Regera a lista de ordenação de elementos */
regenerateOrderLists: function()
{
bannerController.controlPositions.showing = [];
bannerController.controlPositions.hidden = [];
bannerController.elements.thumbs.containers = $('#thumbs li');
bannerController.elements.thumbs.items = $('#thumbs a');
for(var counter = 0, processed = 0, size = bannerController.elements.thumbs.containers.length;counter< size;counter++)
{
bannerController.controlPositions[processed < 3 ? 'showing' : 'hidden']
.push(bannerController.elements.thumbs.containers.eq(counter).attr('data-index') * 1);
if(bannerController.elements.thumbs.containers.eq(counter).is(':visible'))processed++;
}
}
};
}
)(jQuery);