jQuery(document).ready(function($) {

//
// plugin definition
//
$.fn.psCorner = function(options) {
	
	// build main options before element iteration
	var opts = $.extend({}, $.fn.psCorner.defaults, options);
	
	// iterate and reformat each matched element
	return this.each(function() {
		$this = $(this);
		// build element specific options (METADATA PLUGIN)(optional)
		var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
		
		/**
		 * $this = the main box
		 * contentBox = the content box
		 * IMG = the img
		 * set. = the variables
		 * o. = the options
		 * 
		 * - create variables
		 * - if center change top or left
		 * - put the box in position with css and wrap the content
		 * - if there is a img hide the box and show the img
		 * - if the window is resized
		 * 
		 * 
		 * ¤ top/bottom need to be fixed
		 * 
		 */
		
		
		/** variables */
		var width = $this.outerWidth(),// not needed
			height = $this.outerHeight();// not needed
		
		var set = {
					width: $this.outerWidth(),
					height: $this.outerHeight(),
					left: o.left,
					right: o.right,
					top: o.top,
					bottom: o.bottom					
					};
		
		/** if position middle */
		if(o.left == "center"){
			o.left = (($(window).width()/2) - (set.width/2));
		}
		if(o.top == "center"){
			o.top = (($(window).height()/2) - (set.height/2));
		}
		
		/** update the css */
		$this
			.css({
				"top":			o.top, 
				"right":		o.right, 
				"left":			o.left, 
				"bottom":		o.bottom,
				"width":		$this.outerWidth(),
				"height":		$this.outerHeight(),
				"position":		o.position,
				"z-index":		"90"
			})
			.wrapInner('<div id="ps_corner_js_' + o.id + '"></div>');
			
		/** the content box */
		var contentBox = $("#ps_corner_js_" + o.id);
			
			
		/** show the img and hide the box */
		if(o.img != 0){
			
			
			$this
			.append('<img src="'+ o.img +'" class="ps_corner_img" id="ps_corner_img_'+ o.id +'" />');
			$('#ps_corner_img_'+ o.id +'').load(function(){
				$this.css({
					width: $('#ps_corner_img_'+ o.id).width(),
					height: $('#ps_corner_img_'+ o.id).height(),
					
					overflow: "hidden"
				})
				.find('#ps_corner_img_'+ o.id)
				.css({
					"position": "absolute",
					"top": "0px"//,//( ($(this).height()/2) - (($('#ps_corner_img_'+ o.id).height())/2) ),
					//"left": o.left,
					//"right": o.right
				});
			});
			
			/*
			$this
			.append('<img src="'+ o.img +'" class="ps_corner_img" id="ps_corner_img_'+ o.id +'" />')
			.css({
				width: $('#ps_corner_img_'+ o.id).width(),
				height: $('#ps_corner_img_'+ o.id).height(),
				
				overflow: "hidden"
			})
			.find('#ps_corner_img_'+ o.id)
			.css({
				"position": "absolute",
				"top": "0px"//,//( ($(this).height()/2) - (($('#ps_corner_img_'+ o.id).height())/2) ),
				//"left": o.left,
				//"right": o.right
			});
			*/
			
			/** center */
			if(set.top == "center"){
				$this.css({top: ( (($(window).height())/2) - (($('#ps_corner_img_'+ o.id).outerHeight())/2) ) + 'px'});
			}
			if (set.left == "center") {
				$this.css({
					left: ((($(window).width()) / 2) - (($('#ps_corner_img_' + o.id).outerWidth()) / 2)) + 'px'
				});
			}
			
			/** the img */
			var IMG = $('#ps_corner_img_'+ o.id);
			
			/** if left */
			if(o.left == "0px" && o.fx == 0){
				o.fx = "slideRight";
			}
			
			/** if right */
			if (o.right == "0px" && o.fx == 0) {
				o.fx = "slideLeft";
			}
			/** if right */
			if (o.top == "0px" && o.fx == 0) {
				o.fx = "slideTop";
			}
			
			/** starts the fx */
			var init = $.fn.psCorner.transitions[o.fx];
			if ($.isFunction(init)) {
				init($this, contentBox, IMG, o, set);
			} else {
				debug("no " + o.fx);
			}
			
		}
			
			
		/** if the window is resized */
		$(window).resize(function(){
			if (set.top == "center") {
				$this.css({	top: (($(window).height() / 2) - ($this.outerHeight() / 2)) });
			}
			if(set.left == "center")
				$this.css({ left: (($(window).width()/2) - ($this.outerWidth()/2)) });
		});

	});
};
//
// plugin defaults
//
$.fn.psCorner.defaults = {
	top: 'auto',
	right: 'auto',
	bottom: 'auto',
	left: 'auto',
	position: 'fixed',
	img: 0,
	id: 1,
	fx: 0,
	speed: 600
};

//
// private function for debugging
//
function debug($obj) {
	if (window.console && window.console.log)
	window.console.log(' ' + $obj);
};
//
// define and expose our format function
//
$.fn.psCorner.format = function(txt) {
	return '<span>' + txt + '</span>';
};

$.fn.psCorner.boxSize = function($this, set, o){
	
	var aniHeight = (set.height < $('#ps_corner_img_'+ o.id).height()) ? $('#ps_corner_img_'+ o.id).height() : set.height;
	
	/** increase the box on hover */
	$this.hover(function(){
		$this.stop().animate({"width": ( ($('#ps_corner_img_'+ o.id).width()) + set.width) + "px", height: aniHeight}, o.speed);
	},function(){
		$this.stop().animate({"width": ($('#ps_corner_img_'+ o.id).width()) + "px", height: $('#ps_corner_img_'+ o.id).height()}, o.speed);
	});
}

/***** transitions *****/
$.fn.psCorner.transitions = {
	fade: function() {
		debug("fade");
	}
};

$.fn.psCorner.transitions.slideRight = function($this, contentBox, IMG, o, set) {
	contentBox.css({
		"position": "absolute",
		"left": "-" + set.width + 'px',
		"top": "0px",
		"overflow": "hidden"
	});
	
	IMG.css({
		left: "0px",
		right: "auto"
	});
	
	var aniHeight = (set.height < $('#ps_corner_img_'+ o.id).height()) ? $('#ps_corner_img_'+ o.id).height() : set.height;
	
	$this.hover(function(){
		$this.css({height: aniHeight});
		contentBox.stop().animate({"left": "0px"}, o.speed);
	},function(){
		contentBox.stop().animate({left: "-" + set.width + 'px'}, o.speed, function(){
			$this.css({height: $('#ps_corner_img_'+ o.id).height()});
		});
	});
	
	var aniWidth = (set.width < $('#ps_corner_img_'+ o.id).width()) ? $('#ps_corner_img_'+ o.id).width() : set.width;
	/** increase the box on hover */
	$this.hover(function(){
		$this.stop().animate({"width": aniWidth + "px"}, o.speed);
	},function(){
		$this.stop().animate({"width": ($('#ps_corner_img_'+ o.id).width()) + "px"});
	});
}

$.fn.psCorner.transitions.slideLeft = function($this, contentBox, IMG, o, set) {
	
	contentBox.css({
		"position": "absolute",
		"right": "-" + set.width + "px",
		"top": "0px",
		"left": "auto",
		"overflow": "hidden"
	});
	
	IMG.css({
		right: "0px",
		left: "auto"
	});
	
	$this.hover(function(){
		$this.css({height: set.height});
		contentBox.stop().animate({"right": "0px"}, o.speed);
	},function(){
		contentBox.stop().animate({"right": "-" + set.width + 'px'}, o.speed, function(){
			$this.css({height: $('#ps_corner_img_'+ o.id).height()});
		});
	});
	
	var aniHeight = (set.height < $('#ps_corner_img_'+ o.id).height()) ? $('#ps_corner_img_'+ o.id).height() : set.height;
	/** increase the box on hover */
	$this.hover(function(){
		$this.stop().animate({"width": set.width + "px"}, o.speed);
	},function(){
		$this.stop().animate({"width": ($('#ps_corner_img_'+ o.id).width()) + "px"});
	});
	
}

$.fn.psCorner.transitions.slideTop = function($this, contentBox, IMG, o, set) {
	contentBox.css({
		"position": "absolute",
		"top": "-" + set.height + 'px',
		"overflow": "hidden",
		"height": set.height
	});
	
	$this.css({
		"overflow": "visible"
		/* width: set.width,
		left: ( ($(window).width()/2) - (set.width/2) )
		*/
	});
	
	$this.hover(function(){
		contentBox.stop().animate({
			"top": ($('#ps_corner_img_'+ o.id).height()) + "px", 
			left: "-" + ( ((set.width)/2) - $('#ps_corner_img_'+ o.id).width()/2 ) + "px"
			}, 500);
	},function(){
		contentBox.stop().animate({"top": "-" + set.height + 'px'}, o.speed);
	});
	
	$this.hover(function(){
		$this.stop().animate({"width": set.width + "px", height: ($('#ps_corner_img_'+ o.id).height() + set.height)}, o.speed);
	},function(){
		$this.stop().animate({height: $('#ps_corner_img_'+ o.id).height()}, o.speed);
	});
	//$.fn.psCorner.boxSize($this, set, o);
	
}

//
// -- När allt är laddat
//
/*$(window).load(function() {
	
	$.fn.erbPs = function(options) {
		
		var defaults = {
			position: 'topRight', // options.slideObj
			single: false,
			verOhor: "right",
			posHor: "right", // position horizontal left or right
			width: "500"
		};
		var options = $.extend(defaults, options);
		
		return this.each(function() {
	
			// grund variabler
			var erb = $(this),
				erb_div = erb.find('.erbSlidePs'),
				erb_img = erb.find('.erbHoverPs'),
				erb_div_width = erb_div.outerWidth(),
				erb_div_height = erb_div.outerHeight();
				
			erb_img.css({position: "absolute", top: "0px"});
			// beroende på vilken sida den ska sitta
			if(options.position.match(/right/ig)){
				erb.css({left: "auto", right: "0px"});
				erb_img.css({right: "0px"});
			}else if(options.position.match(/left/ig)){
				erb.css({left: "0px"});
				erb_img.css({left: "0px"});
			}
			// vilken höjd den ska ligga
			if(options.position.match(/top/ig)){
				erb.css({top: "0px"});
			}else if(options.position.match(/bottom/ig)){
				erb.css({bottom: "0px", position: "fixed"});
				erb_img.css({bottom: "0px", top: "auto"});
			}
			
			// den är ensam så ska den ligga i mitten fixerad
			var centerHor = (($(window).width()/2) - (erb.outerWidth()/2));
			var centerVert = (($(window).height()/2) - (erb.outerHeight()/2));
			if(options.position.match(/top$/)){
				erb.css({left: centerHor});
			}
			if(options.position.match(/(right|left)$/)){
				erb.css({top: centerVert, position: "fixed"});
			}
			if(options.position.match(/bottom$/)){
				erb.css({bottom: "0px", left: centerVert});
			}
			
			if(!options.single){
				if(options.position.match(/right/)){
					//console.log(erb_div.outerWidth());
					// css inställningar
					erb.css({width: erb_img.outerHeight(), height: erb_img.outerHeight()});
					erb_div.css({width: erb_div_width, marginLeft: erb_img.outerHeight()});
					
					// nya variabler efter css inställningarna
					var erb_divOimg_width = (erb_div_width + erb_img.outerWidth());
					
					erb.hover(function(){
				        erb.stop().animate({"width": (erb_div_width), height: erb_div_height },1000);
						erb_div.stop().animate({ marginLeft: 0 },1000);
					}, function(){
						erb.stop().animate({"width": erb_img.outerHeight(), height: erb_img.outerHeight()}, 1000);
						erb_div.stop().animate({ marginLeft: erb_div_width },1000);
				}); 
				}else if(options.position.match(/left/)){
					//console.log(erb_div.outerWidth());
					// css inställningar
					erb.css({width: erb_img.outerHeight(), height: erb_img.outerHeight()});
					erb_div.css({width: erb_div_width, left: "-" + erb_div_width + "px"});
					
					// nya variabler efter css inställningarna
					var erb_divOimg_width = (erb_div_width + erb_img.outerWidth());
					
					erb.hover(function(){
				        erb.stop().animate({"width": (erb_div_width), height: erb_div_height },1000);
						erb_div.stop().animate({ left: 0 },1000);
					}, function(){
						erb.stop().animate({"width": erb_img.outerHeight(), height: erb_img.outerHeight()}, 1000);
						erb_div.stop().animate({ left: "-" + erb_div_width },1000);
					});
				}
			}
		});
	};
*/
//}); // end window onload

});