/*
	Effects 1.1 for MoreCSS 1.0 Beta 3
	Developed by yellowgreen designbüro published under MIT License.
	
	http://morecss.yellowgreen.de/documentation/plugins/effects/
	http://morecss.yellowgreen.de/documentation/information/legal/
*/



// Register properties and preparing properties
MoreCSS.properties['fade-out'] = 'fadeOut';
MoreCSS.properties['fade-in'] = 'fadeIn';
MoreCSS.properties['fade-auto'] = 'fadeAuto';

MoreCSS.properties['roll-out'] = 'rollOut';
MoreCSS.properties['roll-in'] = 'rollIn';
MoreCSS.properties['roll-auto'] = 'rollAuto';

MoreCSS.properties['shake'] = 'shakeElement';

// fade-out
MoreCSS.fadeOut = function(element, properties) {
	var mode = MoreCSS.getShorthand(MoreCSS.getPropertyValue(properties, 'fade-out', 'normal'));
	
	switch(mode[0]) {
		case 'slow' : var speed = 75; break;
		case 'normal' : var speed = 50; break;
		case 'fast' : var speed = 25; break;
		default : var speed = parseFloat(mode[0]);
	}
	
	var stop = (!mode[1]) ? 0 : parseFloat(mode[1]);

	var display = MoreCSS.getStyle(element, 'display');
	var opacity = parseFloat(MoreCSS.getStyle(element, 'opacity'));

	if(display == 'none') opacity = 0;
	if(opacity == ('' || undefined) || isNaN(opacity)) opacity = 1;
	element.style.opacity = opacity;
	
	clearInterval(element.interval);
	element.interval = setInterval(function() { fadeOut(element, stop); }, speed);
	
	function fadeOut(element, stop) {
		var value = parseFloat(element.style.opacity) - 0.1;
		if(value >= stop)
			MoreCSS.opacity(element, 0, value);
		else {
			MoreCSS.opacity(element, 0, stop);
			if(element.style.opacity == 0) element.style.display = 'none';
			clearInterval(element.interval);
		}
	}
};

// fade-in
MoreCSS.fadeIn = function(element, properties) {
	var mode = MoreCSS.getShorthand(MoreCSS.getPropertyValue(properties, 'fade-in', 'normal'));

	switch(mode[0]) {
		case 'slow' : var speed = 75; break;
		case 'normal' : var speed = 50; break;
		case 'fast' : var speed = 25; break;
		default : var speed = parseFloat(mode[0]);
	}
	
	var stop = (!mode[1]) ? 1 : parseFloat(mode[1]);

	var display = MoreCSS.getStyle(element, 'display');
	var opacity = parseFloat(MoreCSS.getStyle(element, 'opacity'));

	if(display == 'none') { opacity = 0; MoreCSS.opacity(element, 0, 0); element.style.display = 'block'; }
	if(opacity == ('' || undefined) || isNaN(opacity)) opacity = 1;
	element.style.opacity = opacity;

	clearInterval(element.interval);
	element.interval = setInterval(function() { fadeIn(element, stop); }, speed);
	
	function fadeIn(element, stop) {
		var value = parseFloat(element.style.opacity) + 0.1;
		if(value <= stop)
			MoreCSS.opacity(element, 0, value);
		else {
			MoreCSS.opacity(element, 0, stop);
			clearInterval(element.interval);
		}
	}
};

// fade-auto
MoreCSS.fadeAuto = function(element, properties) {
	var mode = MoreCSS.getShorthand(MoreCSS.getPropertyValue(properties, 'fade-auto', 'normal'));

	var display = MoreCSS.getStyle(element, 'display');
	var opacity = parseFloat(MoreCSS.getStyle(element, 'opacity'));
	
	if(display == 'none') opacity = 0;
	if(opacity == ('' || undefined) || isNaN(opacity)) opacity = 1;

	var stop = (!mode[1]) ? opacity : mode[1];

	clearInterval(element.interval);

	if(opacity == 1) {
		MoreCSS.fadeOut(element, new Array('fade-out:' + mode[0] + ' ' + ((stop == opacity) ? 0 : stop)));
	} else {
		MoreCSS.fadeIn(element, new Array('fade-in:' + mode[0] + ' ' + ((stop == opacity) ? 1 : stop)));
	}
};

// roll-out
MoreCSS.rollOut = function(element, properties) {
	var mode = MoreCSS.getShorthand(MoreCSS.getPropertyValue(properties, 'roll-out', 'normal'));

	switch(mode[0]) {
		case 'slow' : var speed = 25; break;
		case 'normal' : var speed = 15; break;
		case 'fast' : var speed = 10; break;
		default : var speed = parseFloat(mode[0]);
	}
	
	var stop = (!mode[1]) ? '100%' : mode[1];
	stop = MoreCSS.getSize('height', stop, 'element', element);
	
	var currentHeight = element.offsetHeight;
	var fullHeight = MoreCSS.getSize('height', '100%', 'element', element);
	
	if(MoreCSS.getStyle(element, 'display') == 'none') { element.style.display = 'block'; element.style.height = '0'; }
	element.style.overflow = 'hidden';
	
	clearTimeout(element.timer);
	element.timer = 0;
			
	function rollOut(element, fullHeight, toHeight){
		var height = element.offsetHeight;
 		var change = toHeight - height;
 		var total = height + Math.ceil(change / speed);
 		
 		element.style.height = total + 'px';
 
 		function rollGo() { rollOut(element, fullHeight, toHeight); }
 		if(change <= 0) { clearTimeout(element.timer); if(toHeight == fullHeight) element.style.height = '100%'; return; }
 		element.timer = setTimeout(rollGo, speed);
    }
    
    rollOut(element, fullHeight, stop);
};

// roll-in
MoreCSS.rollIn = function(element, properties) {
	var mode = MoreCSS.getShorthand(MoreCSS.getPropertyValue(properties, 'roll-in', 'normal'));

	switch(mode[0]) {
		case 'slow' : var speed = 25; break;
		case 'normal' : var speed = 15; break;
		case 'fast' : var speed = 10; break;
		default : var speed = parseFloat(mode[0]);
	}
	
	var stop = (!mode[1]) ? '0' : mode[1];
	stop = MoreCSS.getSize('height', stop, 'element', element);
	
	if(MoreCSS.getStyle(element, 'display') == 'none') { element.style.display = 'block'; element.style.height = '0'; }
	element.style.overflow = 'hidden';

	clearTimeout(element.timer);
	element.timer = 0;
			
	function rollIn(element, toHeight){
 		var height  = element.offsetHeight;
 		var change = height - toHeight;
 		var total = height - Math.ceil(change / speed);
 		
 		element.style.height = total + 'px';
 
 		function rollGo() { rollIn(element, toHeight); }
 		if(change == 0) { clearTimeout(element.timer); return; }
 		element.timer = setTimeout(rollGo, speed);
    }
    
	rollIn(element, stop);
};

// roll-auto
MoreCSS.rollAuto = function(element, properties) {
	var mode = MoreCSS.getShorthand(MoreCSS.getPropertyValue(properties, 'roll-auto', 'normal'));
	
	if(MoreCSS.getStyle(element, 'display') == 'none') { element.style.display = 'block'; element.style.height = '0'; }
	
	var height = element.offsetHeight;
	var stop = (!mode[1]) ? height : MoreCSS.getSize('height', mode[1], 'element', element);
	
	if(height == 0 || (height < stop && stop > 0)) {
		MoreCSS.rollOut(element, new Array('roll-out:' + mode[0] + " " + ((height == stop) ? '100%' : stop)));
	} else {
		MoreCSS.rollIn(element, new Array('roll-in:' + mode[0] + " " + ((height == stop) ? '0' : stop)));
	}
};

// shake
MoreCSS.shakeElement = function(element, properties) {
	var mode = MoreCSS.getPropertyValue(properties, 'shake', "medium");
	
	switch(mode) {
		case 'soft' :
			var speed = 30;
			var duration = 10;
			var position = new Array('1px', '-1px');
			break;
		case 'medium' :
			var speed = 20;
			var duration = 15;
			var position = new Array('2px', '-2px');
			break;
		case 'strong' :
			var speed = 10;
			var duration = 25;
			var position = new Array('3px', '-3px');
			break;
	}
	
	clearTimeout(element.shaker);
	element.style.position = "relative";
			
	function shakeElement(element){
 		element.style.left = position[(duration%2 == 0) ? 0 : 1];
 		duration--;
 
 		function shakeGo() { shakeElement(element); }
 		if(duration == 0) { clearTimeout(element.shaker); element.style.left = 0; return; }
 		element.shaker = setTimeout(shakeGo, speed);
    }
    
	shakeElement(element);
};