var myMessages = ['info','warning','error','success'];

function hideAllMessages() {
	var messagesHeights = new Array(); // this array will store height for each

	for (i=0; i<myMessages.length; i++)	{
		messagesHeights[i] = $('.' + myMessages[i]).outerHeight(); // fill array
		$('.' + myMessages[i]).css('top', -messagesHeights[i]); //move element outside viewport
	}
}

function showMessage(type) {
	$('.'+ type +'-trigger').click(function(){
			  hideAllMessages();
			  $('.'+type).animate({top:"0"}, 500);
	});
}

$(document).ready(function(){
	//hideAllMessages();
		for(var i=0;i<myMessages.length;i++) {
		showMessage(myMessages[i]);
	}
	// When message is clicked, hide it
	$('.message').click(function(){
		$(this).animate({top: -$(this).outerHeight()}, 500);
	});
//	setTimeout(function(){$('.message').animate({top: -$('.message').outerHeight()}, 500);},15000);


	$("i").each(function(){
		var classname = $(this).attr("class");
		if (classname == undefined) classname = '';
		else classname = "class='" + classname +"'" +"";
		$(this).replaceWith("<a " + classname + "href='" + $(this).attr("title") + "'>" +$(this).text() + "</a>");
	});
	$('.anchor').click(function(){
		return false;
	});
});