// clase a modo de variable que encapsula las propiedades del growl (notificador mac os x)
// la instanciaremos para su uso a nivel global
_GrowlProperties = Class.create({
	nGrowls: 0, // privada: growls creados
	totalHeight: 0, // privada: altura acumulada de los elementos creados
	columns: 1, // privada: número de columnas

	nGrowlsClosed: 0, // cuántos growls se han eliminado
	growlMargins: 10, // márgenes entre ventana y entre growls
	growlWidth: 300, // anchura del growl (altura es dinámica)
	delays: 4, // segundos entre hightlight y fade out
	durations: 1.5, // duración de cada efecto
	color: '#ff0000' // color del hightlight
});
var GrowlProperties = new _GrowlProperties();

var Growl = Class.create({
	initialize: 
		function(msg) 
		{
			// creamos la capa
			var div = new Element('div', {
				id: 'growlNotification'+GrowlProperties.nGrowls++, 
				'class': 'growlNotification',
				'width': GrowlProperties.growlWidth + 'px'
			});
			div.update(msg); // update del html, con el mensaje
			$(document.body).insert(div); // metemos la capa creada dentro de la capa de notificaciones
			
			// sumamos el margen a la altura total
			GrowlProperties.totalHeight+=GrowlProperties.growlMargins;
					
			// no hay espacio en esta columna?
			if(document.viewport.getHeight()<(GrowlProperties.totalHeight+div.getHeight()))
			{
				var nueva = 1;
				
				// hay más de una columna?
				if(GrowlProperties.columns>1)
				{
					// cabe en alguna de las anteriores?
					var gpc = GrowlProperties.nGrowls/GrowlProperties.columns;
					if(GrowlProperties.nGrowlsClosed>(gpc-6))
					{
						GrowlProperties.columns=1;
						GrowlProperties.totalHeight = GrowlProperties.growlMargins;
						nueva = 0;
					}
				}

				// creamos una nueva si es necesario
				if(nueva)
				{
					GrowlProperties.totalHeight = GrowlProperties.growlMargins;
					GrowlProperties.columns++;
				}
			}
			
			// con los cálculos anteriores, situamos el growl en el dashboard
			div.setStyle({
				width: GrowlProperties.growlWidth+'px',
				bottom: GrowlProperties.totalHeight+'px',
				right: ((GrowlProperties.columns-1)*GrowlProperties.growlWidth) + (GrowlProperties.columns*GrowlProperties.growlMargins) + 'px'
			});
			// suma la altura actual al total de alturas
			GrowlProperties.totalHeight+=div.getHeight();

			// aparece la notificacion
			new Effect.ShowNotification(div.id);
		}
});

// nuevo efecto que se carga la capa después de hacer el fadeout, y actualiza las propiedades del growl
Effect.ShowNotification = function(element) {
	element = $(element);
	// opciones para el hightlight
	var options = Object.extend({
		startcolor: GrowlProperties.color,
		duration: GrowlProperties.durations,
		afterFinishInternal: function(effect) { 
			var options2 = Object.extend({
				duration: GrowlProperties.durations,
				delay: GrowlProperties.delays,
				afterFinishInternal: function(effect) { 
					// eliminamos el elemento
					effect.element.remove(); 
					GrowlProperties.nGrowlsClosed++;
					// si se cierran todas las notificaciones, se incializa la posición donde aparecen
					if(GrowlProperties.nGrowls==GrowlProperties.nGrowlsClosed)
					{
						GrowlProperties.nGrowls=0;
						GrowlProperties.nGrowlsClosed=0;
						GrowlProperties.totalHeight=0;
						GrowlProperties.columns=1;
					}
				}
			});
			// creamos el efecto de fadeout con sus opciones
			new Effect.Fade(element, options2);
		}
	});
	// creamos el efecto de hightlight con sus opciones
	return new Effect.Highlight(element,options);
};