Image centering js

image_fit.js

function fitImage(image_container, image_url, el, callback) {

  //hide image until loaded
  $(image_container,el).html('<img src="'+image_url+'"/>');
  var image = $(image_container+' img',el);
  $(image,el).css({
    'display':'none'
  })
  //set a spinner animation in the background of the container
  $(image_container,el).css({
    'background':"#fff url('/images/spinner2.gif') no-repeat center center",
    'position':'relative'
  });

  if ($(image,el).height()) {
      doFitting(image_container, image, el, callback);
  } else {
    $(image, el).load(function(){
        doFitting(image_container, image, el, callback);  
    });
  }
}

function fitPortrait(image_el,containerH,containerW,imageRatioWH,imageRatioHW) {
  image_el.css({
    'height': containerH,
    'width': parseInt(containerH * imageRatioWH)
  });    
  
  //the image could still be too wide
  if(image_el.width() > containerW) {
    image_el.css({
      'width': containerW,
      'height': parseInt(containerW * imageRatioHW)
    });      
  }
}

function fitLandscape(image_el,containerH,containerW,imageRatioWH,imageRatioHW) {
  image_el.css({
    'width': containerW,
    'height': parseInt(containerW * imageRatioHW)
  }); 
  
  //the image could still be too tall
  if(image_el.height() > containerH) {
    image_el.css({
      'height': containerH,
      'width': parseInt(containerH * imageRatioWH)
    });      
  }
}

function centerImage(image_el) {
  var mainImageH = image_el.height();
  var mainImageW = image_el.width();

  //center the image vertically and horizontally with absolute positioning
  image_el.css({
    'position': 'absolute',
    'left': '50%',
    'margin-left': -(parseInt(mainImageW/2)),
    'top': '50%',
    'margin-top':-(parseInt(mainImageH/2)),
    'display':'block'
  });   
}

function doFitting(image_container, image, el, callback) {

  var mainImageContainerH = $(image_container,el).height();
  var mainImageContainerW = $(image_container,el).width();

  var image_el = $(image, el);
  var mainImageH = image_el.height();
  var mainImageW = image_el.width();
  var mainImageRatioWH = mainImageW / mainImageH;
  var mainImageRatioHW = mainImageH / mainImageW;

  //portrait
  if(mainImageH > mainImageW) {
    fitPortrait(image_el,mainImageContainerH,mainImageContainerW,mainImageRatioWH,mainImageRatioHW);
  //landscape
  } else {
    fitLandscape(image_el,mainImageContainerH,mainImageContainerW,mainImageRatioWH,mainImageRatioHW);     
  }
  //center the image
  centerImage(image_el);
  //callback if it exists
  callback && callback();
}