(function($) {

	$.extend({
		add2cart: function(source_id, target_id, callback) {
    
      var source = $('#' + source_id );
      var target = $('#' + target_id );
      
      target.css('overflow','hidden');
      target.css('height',source.height());
      target.css('background','url(/images/carrinho_topo.png) #FFF');
      target.css('background-repeat','no-repeat');
      target.css('background-position','center');
      target.css('border','1px solid #333');
      target.html('');
      
      var shadow = $('#' + source_id + '_shadow');
      if( !shadow.attr('id') ) {
          $('body').prepend('<div id="'+source.attr('id')+'_shadow" style="display: none; background-color: #FFF; border: solid 1px darkgray; position: static; top: 0px; z-index: 100000;">&nbsp;</div>');
          var shadow = $('#'+source.attr('id')+'_shadow');
      }
      
      if( !shadow ) {
          alert('Cannot create the shadow div');
      }
           
      shadow.width(source.css('width')).height(source.css('height')).css('top', source.offset().top).css('left', source.offset().left).css('opacity', 0.8).css('z-index',99999).show();
      shadow.css('position', 'absolute').html($('<div>').css('width',source.width()).css('margin','auto auto auto').html(source.clone().unbind()));
      
      shadow.css('width','200px');
      
      shadow.animate( { width: target.innerWidth(), height: source.innerHeight(), top: target.offset().top, left: target.offset().left }, { duration: 500 } )
      .animate( { opacity: 0, width: 200 }, { duration: 900, complete: function(){shadow.remove();callback();} } );
      
      //shadow.animate( { width: target.innerWidth(), height: target.innerHeight(), top: target.offset().top, left: target.offset().left }, { duration: 500 } )
        //.animate( { opacity: 0, width: target.innerWidth() }, { duration: 900, complete: function(){shadow.remove();callback();} } );
        
		}
	});
})(jQuery);