var template = 
				'<div class="date">{publishedDate}</div>'
					+'<a href="{link}" class="excerpt">{title}</a>'
				+'</div>';
			
var newsFeed = $('newsArticles')
	, kids = null
	;

var myJSONP = new Request.JSONP({
    url: 'https://ajax.googleapis.com/ajax/services/feed/load',
    data: {
        v: '1.0',
        q: 'http://distractionnews.nhtsawebserver.com/feed.php',
        num: '80'
    },
    onRequest: function(url) {
        // a script tag is created with a src attribute equal to url
    },
    onComplete: function(data) {
        var docFrag = document.createDocumentFragment();
        Array.from(data.responseData.feed.entries).each(function(item) {
        	var elem = new Element('DIV.newsArticle');
        	item.publishedDate = new Date(item.publishedDate).format('%x');
        	elem.set('html', template.substitute(item));
            docFrag.appendChild(elem);
        });
        newsFeed.appendChild(docFrag);
        setupFeedAnimation();
        cycle.periodical(5000);
    }
}).send();

function setupFeedAnimation(){
	kids = newsFeed.getChildren();
	kids.set('morph',{
	    onComplete: function(){
	       swap();
	    } 
	});
}
function swap(){
  var _kids = kids.slice(0,1);
  newsFeed.adopt(_kids,'bottom');
  kids = newsFeed.getChildren();
  $$(_kids).setStyles({height:95,opacity:1}); 
}

function cycle(){
    var _kids = kids.slice(0,1);
    $$(_kids).morph({height:0,opacity:0});
}