jQuery.extend(
{
	// popup
	popup: function(triggers, wrapper, settings)
			{
				if ((triggers.size() > 0) && (wrapper.size() > 0))
				{
					settings = jQuery.extend({
											 	top: 'auto',
												width: 600,
												height: 300,
												autoresize: true,
												opened: false
												}, settings);
					
					wrapper.each(function()
												{
													jQuery(this).css("display", "none");
												});
					
					triggers.each(function()
												{
													jQuery(this).attr("href", "javascript:;");
													jQuery(this).click(
															 function()
																{
																	mask =
																			jQuery('<div></div>')
																			.appendTo(jQuery('body'))
																			.addClass("popupMask")
																			.css({
																					position: "absolute", 
																					zIndex: 100,
																					left: "0px", 
																					top: "0px", 
																					width: jQuery(document).width(), 
																					height: jQuery('#container').height() + 15,
																					opacity: 0.37
																				});																	
																	layer =
																			jQuery("<div></div>")
																				.appendTo(jQuery('body'))
																				.html(wrapper.html())
																				.addClass("popupLayer")
																				.css({
																						width: settings.width,
																						height: (settings.autoresize)?"auto":settings.height,
																						position: "absolute",
																						zIndex: mask.css("zIndex") + 1,
																						left: Math.round((jQuery(window).width() - settings.width)/2) + "px",
																						overflow: "auto",
																						opacity: 0.5
																					});
																	layer.css({
																						top: (settings.top == 'auto')?(jQuery.scroll.top() + (jQuery.viewport.height() - layer.height())/2 + "px"):(jQuery.scroll.top() + settings.top + "px")
																						})
																			 .fadeTo("normal", 1);
																				
																	closeBtn =
																			jQuery('<a href="javascript:;">close</a>')
																				.appendTo(jQuery('body'))
																				.addClass("popupCloseButton")
																				.css({
																						position: "absolute",
																						zIndex: layer.css("zIndex") + 1,
																						left: 
																								parseInt(layer.css("left")) + 
																								layer.width() + 
																								parseInt(layer.css("padding-left")) + 
																								parseInt(layer.css("padding-right")) +
																								parseInt(layer.css("border-left-width")) +
																								- 3 + 
																								"px",
																						top: parseInt(layer.css("top")) + parseInt(layer.css("border-top-width")) + 3 + "px"
																					})
																				 .click(function()
																								{
																									jQuery('.popupCloseButton').css("display", "none");
																									layer.fadeOut("fast", function(){mask.fadeOut("normal")});
																									jQuery("body").remove(".popupMask, .popupLayer, .popupCloseButton");;
																								}
																							);
																				 
																		mask.click(function(){closeBtn.click()});
																		closeBtn.css({left: parseInt(closeBtn.css("left")) - closeBtn.width() + "px"})
																}
																)//end jQuery(this).click
												}
											 )//end triggers.each
					
					if (settings.opened)
							triggers.eq(0).click();
				}
				},
	
	// scroll
	scroll:  
		{
			top : function()	
						{
							if (self.pageYOffset) 
								return self.pageYOffset
							else if(document.documentElement && document.documentElement.scrollTop)
								return document.documentElement.scrollTop
							else if(document.body)
								return document.body.scrollTop
						},
						
			left : function()	
						{
							if (self.pageXOffset) 
								return self.pageXOffset
							else if(document.documentElement && document.documentElement.scrollLeft)
								return document.documentElement.scrollLeft
							else if(document.body)
								return document.body.scrollLeft
						}
		},
	
	// viewport
	viewport:
		{
			width : function()	
						{
							if(self.innerWidth)
								return self.innerWidth
							else if(document.documentElement && document.documentElement.clientWidth)
								return document.documentElement.clientWidth
							else if(document.body)
								return  document.body.clientWidth
						},
						
			height : function()	
						{
							if(self.innerHeight)
								return self.innerHeight
							else if(document.documentElement && document.documentElement.clientHeight)
								return document.documentElement.clientHeight
							else if(document.body)
								return  document.body.clientHeight
						}
		}
})