/**
 * Newmedia jQuery-Resize Plugin.
 * 
 * @author Reto Zahner <reto.zahner@newmedia.ch>
 * 
 * Plugin-Usage: (Minimal Example)
 * -------------------------------
 * Javascript:
 * jQuery(document).ready(function() {
 *		jQuery("#header_image").nm_resize({
 * 			image_width:1398, // Picture's original width
 *			image_height:400  // Picture's original height
 * 		});
 * });
 * 
 * HTML:
 * <div id="header_image"><img src="img/header/summer/bild.jpg" /></div> 
 *	
 * CSS:
 * #header_image {
 * 	position:absolute;
 * 	overflow: hidden;	
 * 	width:100%; height:400px;
 * }
 * 
 * #header_image img {
 * 	position: absolute;
 * 	top: 0px; left: 0px;
 * 	width: 100%; height:400px;
 * }
 * 
 */

//Variablen für Headerbildslide
var activeSlide = false;

(function(jQuery) {
	
	jQuery.fn.nm_resize = function(options) {
		
		// Weitere Optionen
		
		var options = jQuery.extend({}, jQuery.fn.nm_resize.defaults, options);
		
		var images = [];
		
		// Pre-Fill the image structure. (I prepared the structure already to allow multiple containers containing multiple images => Planned slideshow functionality) 
		// I assume that will be faster to process the resize event. (TODO: Profile that code)  
		this.each(function(index, element) {
			
			var imageContainer = jQuery(element);
			var image = jQuery("img", element);
			
			image.each(function(index, element) {
				var imageElement = $(element);
				
				var width = parseInt(options.image_width);
				width = (width > 0) ? width : parseInt(imageElement.width());
				
				var height = parseInt(options.image_height);
				height = (height > 0) ? height : parseInt(imageElement.height());
				
				images[images.length] = {
						image: image,
						imageContainer: imageContainer,
						width_orig: width,
						height_orig: height,
						ratio: width/height
				};
			});
		});
		
		// Resize first
		jQuery.fn.nm_resize.doResize(options, jQuery(images));
		
		// Initialize the resize event
		jQuery(window).bind("resize", {options: options, images: jQuery(images)}, function(event) {
			jQuery.fn.nm_resize.doResize(event.data.options, event.data.images);
		});
		
		
		//Cookie Steuerung für Headerslide
		if(jQuery.cookie('nm_resize_position') == 'bigger') {
			
			//Divs verschieben
			var selectors = jQuery(options.image_resize_selector);
			jQuery(selectors).each(function(index) {
				newheight = jQuery(this).height() - Math.abs(options.image_resize_delta);
				jQuery(this).css('height',newheight);
			 });
			 
			 //Position ermitteln für Firefox
			backgroundPosition = jQuery('body').css('background-position')
			//Position ermitteln für Internet Explorer
			if(backgroundPosition == null) {
				backgroundPosition = jQuery('body').css('background-position-x')+' '+jQuery('body').css('background-position-y');
			}
			
			//Background-Position - Y Wert bestimmen
			backgroundSplit = backgroundPosition.split(' ');
			var yPos = parseFloat(backgroundSplit[1]);
			
			var sumPos = yPos - Math.abs(options.image_resize_delta);
			var newPosition = '0px '+sumPos+'px';
			jQuery('body').css('background-position',newPosition);
			 
			jQuery(options.image_resize_trigger).html('Bild vergrössern');	
		} else {
			jQuery.cookie('nm_resize_position','smaller');
		}
		
		
		//Klickfuntion zum verkleinern des Headerbildes hinzufügen
		jQuery(options.image_resize_trigger).click(function() {
  			jQuery.fn.nm_resize.doSlide(options);
		});
		
		
	};
	
	/**
	 * Default Options of the Resize-Plugin.
	 */
	jQuery.fn.nm_resize.defaults = {
		image_width:  1024,
		image_height: 768 
	};
	
	/**
	 * Resize-Method, the real craftsmen of the plugin.
	 */
	jQuery.fn.nm_resize.doResize = function(options, images) {
	
		images.each(function(index, element) {
			var imageContainer = element.imageContainer;
			var imageContainerOffset = imageContainer.offset();
			var imageContainerWidth = parseInt(imageContainer.innerWidth());
			var imageContainerHeight = parseInt(imageContainer.innerHeight());
			
			var image = element.image;
			
			// Calculate the new image size 
			var newWidth = imageContainerWidth;
			var newHeight = Math.ceil(newWidth / element.ratio);
			if (newHeight < imageContainerHeight) {
				newHeight = imageContainerHeight;
				newWidth = Math.ceil(newHeight * element.ratio);
			}
			
			// Set the new imagesize
			image.width(newWidth);
			image.css("width", newWidth+"px");
			
			image.height(newHeight);
			image.css("height", newHeight+"px");
			
			// Set the new position (center image)
			var top = Math.ceil((imageContainerHeight - newHeight) / 2);
			top+=imageContainerOffset.top;
			
			var left = Math.ceil((imageContainerWidth - newWidth) / 2);
			left+=imageContainerOffset.left;
			
			image.offset({
				top: top,
				left: left
			});
		});
		
	};
	


	
	//Initialisierung der Slidefunktion
	jQuery.fn.nm_resize.doSlide = function(options) {
		//Elemente die verkleinert werden
		var selectors = jQuery(options.image_resize_selector);
		//Verkleinerung in Pixel
		var delta = options.image_resize_delta;
		//Initialwert
		var actualDelta = 0;
		
		if(activeSlide != true) {
			jQuery.fn.nm_resize.loopSlide(actualDelta,Math.abs(delta),selectors);
		}
			
	}
	
	jQuery.fn.nm_resize.loopSlide = function(actualDelta,delta,selectors) {	
		
		//Editierbare Variablen
		var pixelSpeed = -10			//Anzahl Pixel die innerhalb eines Intervals geslidet werden
		var timeInterval = 20;		//Interval in Millisekunden
		
		//Konstante Variablen
		activeSlide = true;	
		var newheight = 0;
		var newposition = ''
		var backgroundPosition = '';
		var yPos = 0;
		var sumPos = 0;
		
		//pixelSpeed negieren
		if(jQuery.cookie('nm_resize_position') == 'bigger') {
			pixelSpeed = Math.abs(pixelSpeed);
		} 
		
		//Divs verschieben
		jQuery(selectors).each(function(index) {
			newheight = jQuery(this).height() +  pixelSpeed;
			jQuery(this).css('height',newheight);
		 });
		 
		 
		//Background Image - Position verändern
		
		//Position ermitteln für Firefox
		backgroundPosition = jQuery('body').css('background-position')
		//Position ermitteln für Internet Explorer
		if(backgroundPosition == null) {
			backgroundPosition = jQuery('body').css('background-position-x')+' '+jQuery('body').css('background-position-y');
		}
		
		//Background-Position - Y Wert bestimmen
		backgroundSplit = backgroundPosition.split(' ');
		yPos = parseFloat(backgroundSplit[1]);
		
		sumPos = yPos + pixelSpeed;
		newPosition = '0px '+sumPos+'px';
		jQuery('body').css('background-position',newPosition);
		 
		//Parameter neu berechnen
		actualDelta = actualDelta + Math.abs(pixelSpeed);
		
		//Steuerung der Loop-Funktion
		if(actualDelta < delta) {
			setTimeout(function callFunc() { jQuery.fn.nm_resize.loopSlide(actualDelta,delta,selectors); }, timeInterval);
		} else {
			if(jQuery.cookie('nm_resize_position') == 'smaller') {
				jQuery('.trigger a').html('Bild vergrössern');	
				jQuery.cookie('nm_resize_position','bigger', { expires: 7 });
			} else {
				jQuery('.trigger a').html('Bild verkleinern');
				jQuery.cookie('nm_resize_position','smaller', { expires: 7 });
			}
			activeSlide = false;
		}	
	}
	
})(jQuery);


