(function(){
    function ElementArray(str,obj){

        /**
         * Creates new Class including array of matching elements to selector provided
         * 
         * loop() -method iterates trough each element of array, 
         * call (element, index) in function to access these variables
         */
        
        this.elements = (function(){
            if(obj && 'host' in obj)
                return obj.host.querySelectorAll(str)
                    else
                        return document.querySelectorAll(str)
        })();
    
        this.length = this.elements.length;
    
        this.loop = function(data){
            for(var k =0; k<this.length; k++){
                //Execute / assing functions included in data
                data.call(null,this.elements[k],k);
            }
            return true;
        }
    }
    
    var carouselFrame = document.querySelector('.BREAKING-list');
    var breakingArticles = new ElementArray('a', {host:carouselFrame})
    var carouselMaxLength = breakingArticles.length - 1;
    carouselFrame.setAttribute('carousel-index',0);
    
    setTimeout(function(){
        carouselFrame.classList.add('animating')
    },1800)
    
    setInterval(function(){
        var currentIndex = parseInt(carouselFrame.getAttribute('carousel-index'));
        var newIndex = currentIndex +1;
        
        setTimeout(function(){
            carouselFrame.classList.add('animating')
        },4800)
    
        carouselFrame.classList.remove('animating')
    
        if(newIndex == breakingArticles.length){
            carouselFrame.style.cssText += "transform:translateX(0%)";
            carouselFrame.setAttribute('carousel-index',0);
            
        }else{
            carouselFrame.style.cssText += "transform:translateX(-"+newIndex+"00%)";
            carouselFrame.setAttribute('carousel-index',newIndex);
        }
    },5000)
})();