jQuery.fn.fixate = function() {
	this.each(function(){
		var that = $(this);
		var wrapper = $("<div>").append(that.children()).appendTo(that);
		var top = that.offset().top - parseFloat(that.css("marginTop").replace(/auto/,0));
		$(window).scroll(function() {
			if($(this).scrollTop()>=top) {
				that.css("height",wrapper.height()+"px");
				wrapper.addClass("fixed").css("width",that.width()+"px");
			} else {
				that.css("height","");
				wrapper.removeClass("fixed").css("width","");
			}
		});
	});
};

jQuery.fn.makeHintedField = function() {
	this.each(function() {
		var input = $(this);
		var label = $('<input type="text">')
		label.attr("id", input.attr("id"))
		label.attr("value",input.attr("placeholder")||input.prev("span").text())
		label.addClass("hintedLabel").addClass("hinted");
		var blur = function() { if(input.val() != "") return; input.replaceWith(label); label.focus(focus); };
		var focus = function() { label.replaceWith(input); input.blur(blur); setTimeout(function() { input.focus() }, 10) };
		blur();
	});
};

jQuery.fn.inRaisedWindow = function(opt) {
	if(jQuery.fn.inRaisedWindow.lock) return;
	jQuery.fn.inRaisedWindow.lock = true;

	opt = $.extend(jQuery.fn.inRaisedWindow.defaults,opt)

	var css = {
		window: { position:"absolute",top:0,left:0,width:"100%",height:"100%" },
		shade: { position:"fixed",top:"0",left:"0",height:"100%",width:"100%", background: opt.shade},
		content: { padding: opt.extent.top+" "+opt.extent.right+" "+opt.extent.bottom+" "+opt.extent.left, position:"relative", margin: opt.position.top+" auto 0 auto"},
		close: { position: "absolute", top: opt.extent.top, left: "0", "margin-top":"-30px", width: "100%", "text-align": "center", "color": opt.closeColor||"white" },
		c: { "box-shadow": "0 0 30px #000", background: opt.background, position:"absolute", top: opt.extent.top, bottom: opt.extent.bottom, left: opt.extent.left, right: opt.extent.right },
		t: { background: "url("+(opt.shadow.horizontal||opt.shadow)+") top center repeat-x", position: "absolute", top: 0, height: opt.extent.top, left: opt.extent.left, right: opt.extent.left },
		b: { background: "url("+(opt.shadow.horizontal||opt.shadow)+") bottom center repeat-x", position: "absolute", bottom: 0, height: opt.extent.bottom, left: opt.extent.left, right: opt.extent.left },
		l: { background: "url("+(opt.shadow.vertical||opt.shadow)+") center left repeat-y", position: "absolute", left: 0, width: opt.extent.left, top: opt.extent.top, bottom: opt.extent.bottom },
		r: { background: "url("+(opt.shadow.vertical||opt.shadow)+") center right repeat-y", position: "absolute", right: 0, width: opt.extent.right, top: opt.extent.top, bottom: opt.extent.bottom },
		tl: { background: "url("+(opt.shadow.corner||opt.shadow)+") top left no-repeat", position: "absolute", left: 0, top: 0, width: opt.extent.left, height: opt.extent.top },
		tr: { background: "url("+(opt.shadow.corner||opt.shadow)+") top right no-repeat", position: "absolute", right: 0, top: 0, width: opt.extent.right, height: opt.extent.top },
		bl: { background: "url("+(opt.shadow.corner||opt.shadow)+") bottom left no-repeat", position: "absolute", left: 0, bottom: 0, width: opt.extent.left, height: opt.extent.bottom },
		br: { background: "url("+(opt.shadow.corner||opt.shadow)+") bottom right no-repeat", position: "absolute", right: 0, bottom: 0, width: opt.extent.right, height: opt.extent.bottom }
	};

	var window,content,close,shade;
	var element = opt.url?$("<iframe>").attr("src",opt.url).attr("frameBorder","0"):$(this);
	$(document.body).append(window = $("<div>").css(css.window)
		.append(shade = $("<div>").css(css.shade).css("opacity",opt.opacity.toString()))
		.append(content = $("<div>").css(css.content)
			.append($("<div>").css(css.c).append(element))
			.append(close = $("<div>")
				.css(css.close)
				.append($("<span>")
					.append(opt.closeLabel)
					.addClass("close")
				)
			)
		)
		.fadeIn("fast")
	);
	content.width(opt.width||element.width())
	if(opt.height) {
	 content.height(opt.height)
	}
	element.width(content.width()); element.height(content.height());
	if($.browser.msie){
		if($.browser.version<8) {
			shade.fadeTo(0,0.25);
		} else if($.browser.version<9) {
			content
				.append($("<div>").css(css.t)).append($("<div>").css(css.b))
				.append($("<div>").css(css.l)).append($("<div>").css(css.r))
				.append($("<div>").css(css.tl)).append($("<div>").css(css.tr))
				.append($("<div>").css(css.bl)).append($("<div>").css(css.br))
				.append(close)
		}
	}
	close.find("> span").add(shade).click(function(){
		window.fadeOut("fast",function(){
			window.remove();
			delete jQuery.fn.inRaisedWindow.lock;
		});
	});
	return window;
}
jQuery.fn.inRaisedWindow.defaults = {
	shade: "black",
	background: "white url(/static/images/spinner.gif) center center no-repeat",
	opacity: 0.25,
	position: { top: "25px" },
	shadow: {
		horizontal: "/static/images/window-shadow-h.png",
		vertical: "/static/images/window-shadow-v.png",
		corner: "/static/images/window-shadow-c.png"
	},
	closeLabel: "www.dermoshop.com",
	extent: {
		top:"50px", bottom:"50px", 
		left:"50px", right:"50px" 
	},
	scroll: false
};

// http://stackoverflow.com/questions/1184624/serialize-form-to-json-with-jquery/1186309
jQuery.fn.serializeObject = function()	{
	var o = {};
	$.each(this.serializeArray(), function() {
		if(!o[this.name]) {
			o[this.name] = this.value || '';
			return;
		}	
		if (!o[this.name].push) {
			o[this.name] = [o[this.name]];
		}
		o[this.name].push(this.value || '');
	});
	return o;
};

jQuery.fn.autoTrigger = function(key,url,alwaysTrigger,options) {
	if(document.cookie.match("(^|;\\s*)popupShown_"+key+"=1")) return
	var trigger = window.location.search.match("[\?&]popup=([^&]*)");
	if(!alwaysTrigger && (!trigger || trigger[1]!=key)) return
	document.cookie = "popupShown_"+key+"=1; expires="+new Date(new Date().valueOf()+1000*60*60*24*365).toUTCString();
	jQuery.fn.inRaisedWindow(jQuery.extend({url:url},options));
}

jQuery.fn.tabify = function() {
	jQuery.each(this,function(){
		var headers = $("<div>").addClass("tabs");
		var pager = $(this).addClass("pager").prepend(headers);
		$(".page",pager).each(function(i){
			var page = $(this)
			var current =
				(i==0&&window.location.hash=="")||
				(window.location.hash=="#/"+page.attr("id"));
			page
				.addClass(current?"selected":"")
				.children("h3")
					.addClass("tab-"+page.attr("id"))
					.addClass(current?"selected":"")
					.appendTo(headers)
					.click(function(){
						$(".page",pager).removeClass("selected");
						$("h3",headers).removeClass("selected");
						page.addClass("selected");
						$(this).addClass("selected");
						window.location.hash = "#/"+page.attr("id")
					});
		});
	});
};

jQuery.fn.vimeopopup = function(options) {
	options = jQuery.extend(true,{
		width: 968, height: 544, player: { autoplay: 1 },
		close_btn: '<div class="close">Close</div>'
	},options);
	this.click(function(e){
		e.preventDefault();
		e.stopPropagation();

		/* If there is a jplayer, attempt to stop any playing music */
		if(typeof(jQuery.fn.jPlayer)=="function") {
			$(".jplayer").jPlayer("pause"); 
		}

		var playerOptions = [];
		$.each(options.player,function(k,v){
			playerOptions.push(k+"="+v);
		});
		var playerHtml = '<iframe src="http://player.vimeo.com/video/'+options.video_id+'?'+playerOptions.join("&")+'" width="'+options.width+'" height="'+options.height+'" frameborder="0"></iframe>'
		var player = $('<div class="dermoshop_popup"></div>').css({
			"width":options.width+"px",
			"height":options.height+"px",
			"position":"absolute",
			"top":"50%", "left":"50%",
			"margin":-options.height/2+"px 0 0 "+-options.width/2+"px"
		}).html(playerHtml);

		var mask = $('<div class="dermoshop_popup_mask"></div>').css({
			"position":"absolute",
			"top":"0", "left":"0", 
			"width":"100%","height":"100%"
		}).fadeTo(1).fadeTo("fast",0.75);
				
		var close = $(options.close_btn).appendTo(player);
				
		mask.add(close).click(function(){
			$([mask.get(0),player.get(0)]).fadeTo("fast",0,function(){
				$(player).remove();mask.remove();
			})
		});
		mask.attr("style",mask.attr("style")+";position:fixed");
		player.attr("style",player.attr("style")+";position:fixed");
		$(document.body).append(mask,player);
	});
	return this;
}

jQuery.fn.vimeopopuplink = function(options) {
	$.each(this,function(i,e){
		var link = $(e);
		var match = link.attr("href").match("vimeo.com/(\\w+)");
		if(match) {
			var instance_options = $.extend(true,{},options,{video_id: match[1]});
			link.vimeopopup(instance_options) 
		}
	});
}

jQuery.fn.popup = function(content,options) {
	this.click(function(e){
		e.preventDefault();
		e.stopPropagation();
		Dermoshop.popup(content,options)
	});
	return this;
}

window.Dermoshop = (function() {
	function popup(content,options) {
		options = jQuery.extend(true,{
			width: 968, height: 544, 
			close_btn: '<div class="close">Close</div>'
		},options);

		// Wrap URL content in <iframe>
		if(typeof(content)=="string" && content.match(/^https?:\/\//)) {
			content = $('<iframe src="'+content+'"></iframe>').css({"width":"100%","height":"100%"}).attr("frameBorder","0").attr("scrolling","no")
		}

		var player = $('<div class="dermoshop_popup"></div>').css({
			"width":options.width+"px",
			"height":options.height+"px",
			"position":"absolute",
			"top":"50%", "left":"50%",
			"margin":-options.height/2+"px 0 0 "+-options.width/2+"px"
		}).append($(content));

		var mask = $('<div class="dermoshop_popup_mask"></div>').css({
			"position":"absolute",
			"top":"0", "left":"0", 
			"width":"100%","height":"100%"
		}).fadeTo(1).fadeTo("fast",0.75);
				
		var close = $(options.close_btn).appendTo(player);
				
		mask.add(close).click(function(){
			$([mask.get(0),player.get(0)]).fadeTo("fast",0,function(){
				$(player).remove();mask.remove();
			})
		});
		mask.attr("style",mask.attr("style")+";position:fixed");
		player.attr("style",player.attr("style")+";position:fixed");
		$(document.body).append(mask,player);
	}
	return {
		popup: popup
	}
})()

jQuery.fn.zoom = function() {
	var command;
	var options;
	if(typeof(arguments[0])=="string") {
		command = arguments[0];
	} else {
		options = $.extend({ transform: function(s){ return s } },arguments[0]);
		$(this).data("zoom",options);
	}
	$.each(this,function(){
		var canvas = $(this);
		var image = canvas.find("img");
		if(command=="refresh") {
			refresh();
			stop();
			return;
		}
		var icon = $("<span/>").css({
			"display":"block","position":"absolute",
			"width":"100%","height":"100%",
			"top":"0","left":"0"
		});
		canvas
			.css("display","block")	
			.css("position","relative")
			.append(icon)
			.width(image.width())
			.height(image.height());
		$(icon).click(function(evt){
			evt.preventDefault();
			evt.stopPropagation();
			if(canvas.hasClass("active")) {
				stop();
			} else {
				start();
				move(evt);
			}
		});
			
		/* Functions */
		function move(evt){
			canvas.stop().animate({"backgroundPosition":
				(evt.offsetX/canvas.width()*100)+"% "+
				(evt.offsetY/canvas.height()*100)+"%"
			},10);
		}
		function refresh() {
			var transform = canvas.data("zoom").transform;
			canvas.css("background-image","url("+transform(image.attr("src"))+")");
			canvas.css("background-repeat","no-repeat");
		}
		function stop() {
			image.show();
			canvas.removeClass("active");
			canvas.css({background:"none"});
			canvas.unbind("mousemove",move);
		}
		function start() {
			image.hide();
			canvas.addClass("active");
			canvas.mousemove(move)
			refresh();
		}						
	});
};

/**
 * @author Alexander Farkas
 * v. 1.22
 */


(function($) {
	if(!document.defaultView || !document.defaultView.getComputedStyle){ // IE6-IE8
		var oldCurCSS = $.curCSS;
		$.curCSS = function(elem, name, force){
			if(name === 'background-position'){
				name = 'backgroundPosition';
			}
			if(name !== 'backgroundPosition' || !elem.currentStyle || elem.currentStyle[ name ]){
				return oldCurCSS.apply(this, arguments);
			}
			var style = elem.style;
			if ( !force && style && style[ name ] ){
				return style[ name ];
			}
			return oldCurCSS(elem, 'backgroundPositionX', force) +' '+ oldCurCSS(elem, 'backgroundPositionY', force);
		};
	}
	
	var oldAnim = $.fn.animate;
	$.fn.animate = function(prop){
		if('background-position' in prop){
			prop.backgroundPosition = prop['background-position'];
			delete prop['background-position'];
		}
		if('backgroundPosition' in prop){
			prop.backgroundPosition = '('+ prop.backgroundPosition;
		}
		return oldAnim.apply(this, arguments);
	};
	
	function toArray(strg){
		strg = strg.replace(/left|top/g,'0px');
		strg = strg.replace(/right|bottom/g,'100%');
		strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g,"$1px$2");
		var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
		return [parseFloat(res[1],10),res[2],parseFloat(res[3],10),res[4]];
	}
	
	$.fx.step. backgroundPosition = function(fx) {
		if (!fx.bgPosReady) {
			var start = $.curCSS(fx.elem,'backgroundPosition');
			if(!start){//FF2 no inline-style fallback
				start = '0px 0px';
			}
			
			start = toArray(start);
			fx.start = [start[0],start[2]];
			var end = toArray(fx.end);
			fx.end = [end[0],end[2]];
			
			fx.unit = [end[1],end[3]];
			fx.bgPosReady = true;
		}
		//return;
		var nowPosX = [];
		nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
		nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];           
		fx.elem.style.backgroundPosition = nowPosX[0]+' '+nowPosX[1];

	};
})(jQuery);