/*
 * 	Images fit-fill - jQuery plugin
 * 	Sets width, height and margin attributes of IMG elements so that they either
 * 	fit entirely inside the parent element (fit) or
 * 	fill the entire space of the parent element (fill)
 * 	In both cases the image is centered horizontally and vertically using
 * 	margins (assuming the image element is aligned to the left)
 * 	
 * 	Update: added getHiddenDimensions to allow this pluging to work on hidden content as well. (yacine 08/02/2011)
 *
 * 	@author Gilad Dayagi
 *
 *	Copyright (c) 2009 HighGearMedia (http://www.highgearmedia.com)
 */
(function($) {
    $.fn.getHiddenDimensions = function(boolOuter) {
        var $item = this;
        var props = { position: "absolute", visibility: "hidden", display: "block" };
        var dim = { "width":0, "height":0 };
        var $hiddenParents = $item.parents().andSelf().not(":visible");
        
        var oldProps = [];
        $hiddenParents.each(function() {
            var old = {};
            for ( var name in props ) {
                old[ name ] = this.style[ name ];
                this.style[ name ] = props[ name ];
            }
            oldProps.push(old);
        });
        
        dim.width = (boolOuter === true) ? $item.outerWidth() : $item.width();
        dim.height = (boolOuter === true) ? $item.outerHeight() : $item.height();
        
        $hiddenParents.each(function(i) {
            var old = oldProps[i];
            for ( var name in props ) {
                this.style[ name ] = old[ name ];
            }
        });
        return dim;
    }
})(jQuery);

(function($) {
	$.fn.imgFitFill = function(opts){

		// default configuration properties
		var defaults = {
			mode: 'fill'
		};
		var options = $.extend(defaults, opts);

        //fit an image inside a fixed-sized container
        function fitImageAttribs(boxWidth, boxHeight, imgWidth, imgHeight){
            var width = boxWidth;
            var height = boxHeight;
            if (imgWidth>width || imgHeight>height){
                if ((imgWidth/width) > (imgHeight/height)){
                    height = Math.round(width/imgWidth*imgHeight);
                }
                else{
                    width = Math.round(height/imgHeight*imgWidth);
                }
            }
            else {
                width = imgWidth;
                height = imgHeight;
            }
            return {
                width:width,
                height:height,
                hMargin:Math.floor((boxWidth-width)/2),
                vMargin:Math.floor((boxHeight-height)/2)};
        }
        //fill an image inside a fixed-sized container
        function fillImageAttribs(boxWidth, boxHeight, imgWidth, imgHeight){
            var width = boxWidth;
            var height = boxHeight;
            if ((imgWidth/width) > (imgHeight/height)){
                width = Math.round(height/imgHeight*imgWidth);
            }
            else{
                height = Math.round(width/imgWidth*imgHeight);
            }
            return {
                width:width,
                height:height,
                hMargin:Math.floor((boxWidth-width)/2),
                vMargin:Math.floor((boxHeight-height)/2)};
        }
        //do the actual resizing
        function doResize(element){
            var obj = $(element);
            obj.removeAttr("width").removeAttr("height").css('width', '').css('height', '');
            var container = obj.parent();
            var attribs;
            var contDims = container.getHiddenDimensions();
            var itemDims = obj.getHiddenDimensions();
            if (options.mode == 'fit'){
                attribs = fitImageAttribs(contDims.width, contDims.height, itemDims.width, itemDims.height);
            }
            else {
                attribs = fillImageAttribs(contDims.width, contDims.height, itemDims.width, itemDims.height);
            }

            obj.width(attribs.width);
            obj.height(attribs.height);
            obj.css('margin', ''+attribs.vMargin+'px 0 0 '+attribs.hMargin+'px');
        }

        return this.filter("img").each(function() {
            if (!this.complete || (!$.browser.msie && (typeof this.naturalWidth == "undefined" || this.naturalWidth == 0))){
                //console.log('onLoad');
                $(this).load(function(){
                    doResize(this);
                });
            }
            else {
                //console.log('direct');
                doResize(this);
            }
        });
	};

})(jQuery);

