var mySlider = {
config : {
slider : '.slider-content',
activeSlide : '.slide.active',
button: '.next-button',
transition: 500,
delay: function() {return this.transition;},
navigation : '.control-nav'
},
init : function(config) {
this.createNav();
$(mySlider.config.button).
click(function() {
mySlider.animateSlide($(this));
});
var self=this;
this.config.cycle_stopped=false;
this.config.__cycle_timeout=false;
this.startCycle=function(triggered){
if(!triggered)
self.config.cycle_stopped=false;
if(self.config.__cycle_timeout)
clearTimeout(__cycle_timeout);
if(!self.config.cycle_stopped)
return;
self.config.__cycle_timeout=setTimeout(function(){
self.startCycle(true);
},self.config.transition)
return self;
}
this.stopCycle=function(){
self.config.cycle_stopped=true;
return self;
}
this.startCycle();
},
getActiveSlide : function() {
return $(mySlider.config.activeSlide);
},
getNextSlide : function() {
var nextSlide = mySlider.getActiveSlide().next();
if ( nextSlide.length === 0 ){
nextSlide = $(mySlider.config.slider).find('.slide').eq(0);
}
return nextSlide;
},
getNextSlideColorAndName : function() {
var colorAndName = {};
var nextSlidenext = mySlider.getNextSlide().next();
var nextSlideColor = nextSlidenext.data('color');
var nextSlideName = nextSlidenext.data('name');
colorAndName.color = nextSlideColor;
colorAndName.name = nextSlideName;
if ( nextSlidenext.length === 0 ) {
nextSlidenext = $(mySlider.config.slider).find('.slide').eq(0);
nextSlideColor = nextSlidenext.data('color');
nextSlideName = nextSlidenext.data('name');
colorAndName.color = nextSlideColor;
colorAndName.name = nextSlideName;
}
return colorAndName;
},
createNav : function() {
var totalSlides = $(mySlider.config.slider).find('.slide').length;
var controlNav = $(mySlider.config.navigation).find('ul');
var nav;
for( var i=0; i < totalSlides; i++ ){
var active = "";
if(i === 0){
active = 'active';
}
controlNav.append('<li class="slider-nav nav-'+i+' '+active+' "></li>')
}
},
animateNav : function() {
var activeNav = $('li.active');
var nextNav = activeNav.next();
if(nextNav.length === 0){
nextNav = $('.control-nav li').eq(0);
}
activeNav.removeClass('active');
nextNav.addClass('active');
},
animateSlide : function(button) {
var activeSlide = mySlider.getActiveSlide();
var nextSlide = mySlider.getNextSlide();
var delay = mySlider.config.delay();
var clipPath = $('.clip-svg');
clipPath.css('transition-duration', mySlider.config.transition+'ms');
button.css('pointer-events', 'none');
nextSlide.css('z-index',10);
button.css('background', mySlider.getNextSlideColorAndName().color);
button.prev().find('.color').html(mySlider.getNextSlideColorAndName().name);
nextSlide.addClass('active').css('opacity', 1);
setTimeout(function() {
activeSlide.removeClass('active').css('opacity', 0);
}, delay);
setTimeout(function() {
nextSlide.css('z-index','');
button.css('pointer-events', 'auto');
}, delay + 300);
mySlider.animateNav();
},
activateRandSlide:function(){
$('.slide').removeClass('active').eq(Math.floor(Math.random()*slides.length)).addClass('active');
return this;
}
}
$(document).ready(function() { mySlider.init(); });
