/*

 * jQuery ifixpng plugin

 * (previously known as pngfix)

 * Version 3.1.2  (2008/09/01)

 * @requires jQuery v1.2.6 or above, or a lower version with the dimensions plugin

 * 

 * Based on the plugin by Kush M., http://jquery.khurshid.com

 *

 * Background position Fixed

 * Also fixes non-visible images

 * (c) Copyright Yereth Jansen (yereth@yereth.nl)

 * personal website: http://www.yereth.nl

 * Company website: http://www.wharf.nl

 * 

 * Dual licensed under the MIT and GPL licenses:

 * http://www.opensource.org/licenses/mit-license.php

 * http://www.gnu.org/licenses/gpl.html

 *

 * For a demonstration of the background-position being fixed:

 * http://www.yereth.nl/bgpos.html

 *

 * Plugin page:

 * http://plugins.jquery.com/project/iFixPng2

 *

 */



/**

 *

 * @example

 *

 * optional if location of pixel.gif if different to default which is images/pixel.gif

 * $.ifixpng('media/pixel.gif');

 *

 * $('img[@src$=.png], #panel').ifixpng();

 *

 * @apply hack to all png images and #panel which icluded png img in its css

 *

 * @name ifixpng

 * @type jQuery

 * @cat Plugins/Image

 * @return jQuery

 * @author jQuery Community

 */

;(function($) {



	/**

	 * helper variables and function

	 */

	$.ifixpng = function(customPixel) {

		$.ifixpng.pixel = customPixel;

	};

	

	$.ifixpng.regexp = {

		bg: /^url\(["']?(.*\.png([?].*)?)["']?\)$/i,

		img: /.*\.png([?].*)?$/i

	},

	

	$.ifixpng.getPixel = function() {

		return $.ifixpng.pixel || 'images/pixel.gif';

	};

	

	var hack = {

		base	: $('base').attr('href'),

		ltie7	: $.browser.msie && $.browser.version < 7,

		filter	: function(src) {

			return "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='"+src+"')";

		}

	};

	

	/**

	 * Applies ie png hack to selected dom elements

	 *

	 * $('img[@src$=.png]').ifixpng();

	 * @desc apply hack to all images with png extensions

	 *

	 * $('#panel, img[@src$=.png]').ifixpng();

	 * @desc apply hack to element #panel and all images with png extensions

	 *

	 * @name ifixpng

	 */

	 

	$.fn.ifixpng = hack.ltie7 ? function() {

		function fixImage(image, source, width, height, hidden) {

			image.css({filter:hack.filter(source), width: width, height: height})

			  .attr({src:$.ifixpng.getPixel()})

			  .positionFix();

		}

		

    	return this.each(function() {

			var $$ = $(this);

			if ($$.is('img') || $$.is('input')) { // hack image tags present in dom

				var source, img;

				if (this.src && this.src.match($.ifixpng.regexp.img)) { // make sure it is png image

					// use source tag value if set 

					source = (hack.base && this.src.substring(0,1)!='/' && this.src.indexOf(hack.base) === -1) ? hack.base + this.src : this.src;

					// If the width is not set, we have a problem; the image is not probably visible or not loaded

					// and we need a work around.

					if (!this.width || !this.height) {

						$(new Image()).one('load', function() {

							fixImage($$, source, this.width, this.height);

							$(this).remove();

						}).attr('src', source);

					// If the image already has dimensions (it's loaded and visible) we can fix it straight away.

					} else fixImage($$, source, this.width, this.height);

				}

			} else if (this.style) { // hack png css properties present inside css

				var imageSrc = $$.css('backgroundImage');

				// Background repeated images we cannot fix unfortunately

				if (imageSrc && imageSrc.match($.ifixpng.regexp.bg) && this.currentStyle.backgroundRepeat == 'no-repeat') {

					imageSrc = RegExp.$1;

					var x = this.currentStyle.backgroundPositionX || 0, y = this.currentStyle.backgroundPositionY || 0;

					if (x || y) {

						var css = {}, img;

						if (typeof x != 'undefined') {

							if (x == 'left') css.left = 0; 

							// if right is 0, we have to check if the parent has an odd width, because of an IE bug

							else if (x == 'right') css.right = $$.width() % 2 === 1 ? -1 : 0;

							else css.left = x;

						}

						if (typeof y != 'undefined') {

							// if bottom is 0, we have to check if the parent has an odd height, because of an IE bug

							if (y == 'bottom') css.bottom = $$.height() % 2 === 1 ? -1 : 0; 

							else if (y == 'top') css.top = 0;

							else css.top = y;

						}

						img = new Image();

						$(img).one('load', function() {

							var x,y, expr = {}, prop;

							// Now the image is loaded for sure, we can see if the background position needs fixing with an expression (in case of percentages)

							if (/center|%/.test(css.top)) {

								expr.top = "(this.parentNode.offsetHeight - this.offsetHeight) * " + (css.top == 'center' ? 0.5 : (parseInt(css.top) / 100));

								delete css.top;

							}

							if (/center|%/.test(css.left)) {

								expr.left = "(this.parentNode.offsetWidth - this.offsetWidth) * " + (css.left == 'center' ? 0.5 : (parseInt(css.left) / 100));

								delete css.left;

							}

							// Let's add the helper DIV which will simulate the background image

							$$.positionFix().css({backgroundImage: 'none'}).prepend(

								$('<div></div>').css(css).css({

									width: this.width,

									height: this.height,

									position: 'absolute',

									filter: hack.filter(imageSrc)

								})

							);

							if (expr.top || expr.left) {

								var elem = $$.children(':first')[0];

								for (prop in expr) elem.style.setExpression(prop, expr[prop], 'JavaScript');

							}

							$(this).remove();

						});

						img.src = imageSrc;

					} else {

						$$.css({backgroundImage: 'none', filter:hack.filter(imageSrc)});

					}

				}

			}

		});

	} : function() { return this; };

	

	/**

	 * positions selected item relatively

	 */

	$.fn.positionFix = function() {

		return this.each(function() {

			var $$ = $(this);

			if ($$.css('position') != 'absolute') $$.css({position:'relative'});

		});

	};



})(jQuery);
