﻿jQuery.fn.imageFix = function(parentWidth, parentHeight) {
    //var parentWidth = $(this).width();
    //var parentHeight = $(this).height();
    var parentAspect = parentWidth / parentHeight;

    //var img = $(this).find("img");
    var img = $(this);

    var width = img.width();
    var height = img.height();

    //`this` refers to the jQuery object, that object always is an array
    //to refer to the DOM object we need to do `this[0]`
    if (this[0].naturalWidth) { width = this[0].naturalWidth; }
    if (this[0].naturalHeight) { height = this[0].naturalHeight; }
    
    var aspect = width / height;
    var scalingFactor;

    if (aspect > parentAspect) {
        img.css('width', parentWidth).addClass("autoHeight");
        scalingFactor = parentWidth / width;
    } else {
        img.css('height', parentHeight).addClass("autoWidth");
        scalingFactor = parentHeight / height;
    }
    var newWidth = width * scalingFactor;
    var newHeight = height * scalingFactor;

    var topOffset = 0;
    if (newHeight < parentHeight) {
        topOffset = (parentHeight - newHeight) / 2;
    } else if (newHeight > parentHeight) {
        topOffset = (newHeight - parentHeight) / 2;
    }

    var leftOffset = 0;
    if (newWidth < parentWidth) {
        leftOffset = (parentWidth - newWidth) / 2;
    } else if (newWidth > parentWidth) {
        leftOffset = (newWidth - parentWidth) / 2;
    }

    img.css('position', 'absolute');
    img.css('top', parseInt(topOffset, 10) + 'px');
    img.css('left', parseInt(leftOffset, 10) + 'px');
};

function imageFix(image, parentWidth, parentHeight) {
    //var parentWidth = $(this).width();
    //var parentHeight = $(this).height();
    var parentAspect = parentWidth / parentHeight;

    //var img = $(this).find("img");
    var img = $(image);

    var width = image.width;
    var height = image.height;

    if (img.naturalWidth) { width = img.naturalWidth; }
    if (img.naturalHeight) { height = img.naturalHeight; }

    var aspect = width / height;
    var scalingFactor;

    if (aspect > parentAspect) {
        img.css('width', parentWidth).addClass('autoHeight');
        scalingFactor = parentWidth / width;
    } else {
        img.css('height', parentHeight).addClass('autoWidth');
        scalingFactor = parentHeight / height;
    }
    var newWidth = width * scalingFactor;
    var newHeight = height * scalingFactor;

    var topOffset = 0;
    if (newHeight < parentHeight) {
        topOffset = (parentHeight - newHeight) / 2;
    } else if (newHeight > parentHeight) {
        topOffset = (newHeight - parentHeight) / 2;
    }

    var leftOffset = 0;
    if (newWidth < parentWidth) {
        leftOffset = (parentWidth - newWidth) / 2;
    } else if (newWidth > parentWidth) {
        leftOffset = (newWidth - parentWidth) / 2;
    }

    img.css('position', 'absolute');
    img.css('top', parseInt(topOffset, 10) + 'px');
    img.css('left', parseInt(leftOffset, 10) + 'px');
}
