jQuery.fn.fileUpload = function() {
        
    
	return this.each(function() {
		var wrapper = $(this);
                var btn = wrapper.find(':button');
                var hidden = wrapper.find(':hidden');
                var file_name = wrapper.find('.file_name');
                var button_delete = wrapper.find('.delete');
                
		var pos =null;
                var container= null;
                var input=null;
		var form = null;
                var offset = null;

                var metadata = btn.metadata();
                var form_action  = metadata.url;
                           
		var update = function () {
			pos = btn.offset();
			container.css({
				'top': pos.top,
				'left': pos.left,
				'width': btn.outerWidth(),
				'height': btn.outerHeight()
			});
                        
		};
		
		var resetContainer = function () {
                                    
                        container = $('<div><form method="post" encoding="multipart/form-data" enctype="multipart/form-data"></form></div>').appendTo('body').css({
                                'position': 'absolute',
                                'overflow': 'hidden',
                                '-moz-opacity': '0',
                                'filter':  'alpha(opacity: 0)',
                                'opacity': '0',
                                'z-index': '2'		
                        });

                        form = container.find('form');
                        form.attr('action', form_action);
                    
                        input = $('<input type="file" name="upload">');
                        input.appendTo(form);
                        input = form.find('input');
                        
                        form.ajaxForm({
                               dataType:  'json', 
                               beforeSubmit: function(a,f,o) {
                                    btn.trigger('choose', [input]);
                                    btn.addClass('loading');
                               },
                               success: function (data) {
                                   btn.removeClass('loading');
                                   if (data.error == true) {
                                       $.log(data.message); 
                                       btn.trigger('error', [input, data]);
                                   } else {
                                       $.log(data.name); 
                                       btn.trigger('success', [input, data]);
                                   }
                               } 
                         }); 

			input.change(function(e) {
				btn.trigger('choose', [input]);
                                form.submit();
			});
                        
                        offset = {
                            width: container.width() - 25 ,
                            height: container.height() / 2
                        };

		};

		var placer = function (e) {
			form.css('margin-left', e.pageX - pos.left - offset.width);
			form.css('margin-top', e.pageY - pos.top - offset.height);
                        btn.addClass('over');
		};

		var redirectEventContainerToBtn = function (name) {
			container[name](function(e) {
				btn.trigger(name);
			});
		};
                
                var container_mouseout = function(e) {
                    btn.removeClass('over');
                }
                
                ////////// INIT

                resetContainer();
                update();
                
                btn.mouseover(update);
                btn.mousemove(placer);
                
                container.mousemove(placer);
                container.mouseout(container_mouseout);
                    
		redirectEventContainerToBtn('mouseover');
		redirectEventContainerToBtn('mouseout');
		redirectEventContainerToBtn('mousedown');
		redirectEventContainerToBtn('mouseup');
                
                
                btn.bind('choose', function (e, input){
                })
               .bind('error', function (e, input, data){
                   alert(data.message);
                })
                .bind('success', function (e, input, data){
                   hidden.val(data.indice);
                   file_name.text(data.name);
                   button_delete.css({'display':'inline-block'}); //show inline !!
                })
               ;
               
               button_delete.bind('click', function () {
                   hidden.val('-1');
                   file_name.text('');
                   button_delete.hide();
               })
               ;
               
               if (hidden.val()>-1) {
                   button_delete.css({'display':'inline-block'}); //show inline !!
               }
               
		
	});
};

(function($) {
    $().ready(function() {
        $('.fileUpload').fileUpload();
    });
})(jQuery);