1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113

/**
 * Copyright (c) 2009, Jardel Weyrich <jweyrich@gmail.com>
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 */

/*
 * Author note:
 *   This code is based on the idea used by WebToolkit AJAX file upload
 *   (http://www.webtoolkit.info/ajax-file-upload.html)
 *
 * Usage:
 *   $(selector).uploadForm('url', {
 *       'timeout' : 5000
 *       'onError' : errorCallback,
 *       'onStart' : startCallback,
 *       'onComplete' : completeCallback,
 *   });
 */

(function($) {

	var _defaults = {
		timeout: 5000,
		onError: function(cause) {},
		onStart: function() { return true; },
		onComplete: function(data) {}
	};

	var _properties = {
		eventTimeout: null,
		ontimeout: function() {
			// TODO how to stop the iframe's page loading process?
			this.onError('timeout');
		},
		onload: function(obj) {
			var doc;
			if (this.contentDocument) {
				doc = this.contentDocument;
			} else if (this.contentWindow) {
				doc = this.contentWindow.document;
			} else {
				doc = window.frames[this].document;
			}
			if (doc.location.href == 'about:blank')
				return;
			clearTimeout(this.eventTimeout);
			this.onComplete(doc.body.innerHTML);
		}
	};

	function addFrame(c) {
		var frameId = 'ajaxFrame' + new Date().getTime();
		var div = document.createElement('DIV');
		div.innerHTML = '<iframe style="display:none" src="about:blank" '
			+'id="'+frameId+'" name="'+frameId+'"></iframe>';
		document.body.appendChild(div);
		return document.getElementById(frameId);
	}

	function setFormAttributes(form, action, target) {
		form.action = action;
		form.target = target;
		form.method = 'POST';
		if (form.encoding)
			form.encoding = 'multipart/form-data';
		else
			form.enctype = 'multipart/form-data';
	}

	function submit(form, action, config) {
		var iframe = addFrame(config);
		$.extend(iframe, _defaults);
		$.extend(iframe, _properties);
		$.extend(iframe, config);
		setFormAttributes(form, action, iframe.id);
		var result = iframe.onStart();
		if (result && iframe.timeout) {
			iframe.eventTimeout = setTimeout(
				'document.getElementById("'+iframe.id+'").ontimeout()',
				iframe.timeout
			);
		}
		return result;
	}

	$.fn.extend({
		uploadForm: function(url, config) {
			return this.each(function() {
				$(this).bind('submit', function() {
					return submit(this, url, config);
				});
			});
		}
	});

})(jQuery);