Subversion Repositories Applications.papyrus

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
2150 mathias 1
if(!dojo._hasResource["dojox.widget.FileInputAuto"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
2
dojo._hasResource["dojox.widget.FileInputAuto"] = true;
3
dojo.provide("dojox.widget.FileInputAuto");
4
 
5
dojo.require("dojox.widget.FileInput");
6
dojo.require("dojo.io.iframe");
7
 
8
dojo.declare("dojox.widget.FileInputAuto",
9
	dojox.widget.FileInput,
10
	{
11
	// summary: An extension on dojox.widget.FileInput providing background upload progress
12
	//
13
	// description: An extended version of FileInput - when the user focuses away from the input
14
	//	the selected file is posted via dojo.io.iframe to the url. example implementation
15
	//	comes with PHP solution for handling upload, and returning required data.
16
	//
17
	// notes: the return data from the io.iframe is used to populate the input element with
18
	//	data regarding the results. it will be a JSON object, like:
19
	//
20
	//	results = { size: "1024", filename: "file.txt" }
21
	//
22
	//	all the parameters allowed to dojox.widget.FileInput apply
23
 
24
	// url: String
25
	// 	the URL where our background FileUpload will be sent
26
	url: "",
27
 
28
	// blurDelay: Integer
29
	//	time in ms before an un-focused widget will wait before uploading the file to the url="" specified
30
	//	default: 2 seconds
31
	blurDelay: 2000,
32
 
33
	// duration: Integer
34
	//	The time in ms to use as the generic timing mechanism for the animations
35
	//	set to 1 or 0 for "immediate respose"
36
	duration: 500,
37
 
38
	// uploadMessage: String
39
	//
40
	//	FIXME: i18n somehow?
41
	uploadMessage: "Uploading ...",
42
 
43
	_sent: false,
44
 
45
	// small template changes, new attachpoint: overlay
46
	templateString:"<div class=\"dijitFileInput\">\n\t<input class=\"dijitFileInputReal\" type=\"file\" dojoAttachPoint=\"fileInput\" />\n\t<div class=\"dijitFakeInput\" dojoAttachPoint=\"fakeNodeHolder\">\n\t\t<input class=\"dijitFileInputVisible\" type=\"text\" dojoAttachPoint=\"focusNode, inputNode\" />\n\t\t<span class=\"dijitInline dijitFileInputText\" dojoAttachPoint=\"titleNode\">${label}</span>\n\t\t<span class=\"dijitInline dijitFileInputButton\" dojoAttachPoint=\"cancelNode\" dojoAttachEvent=\"onclick:_onClick\">${cancelText}</span>\n\t</div>\n\t<div class=\"dijitProgressOverlay\" dojoAttachPoint=\"overlay\">&nbsp;</div>\n</div>\n",
47
 
48
	startup: function(){
49
		// summary: add our extra blur listeners
50
		this._blurListener = dojo.connect(this.fileInput,"onblur",this,"_onBlur");
51
		this._focusListener = dojo.connect(this.fileInput,"onfocus",this,"_onFocus");
52
		this.inherited("startup",arguments);
53
	},
54
 
55
	_onFocus: function(){
56
		// summary: clear the upload timer
57
		if(this._blurTimer){ clearTimeout(this._blurTimer); }
58
	},
59
 
60
	_onBlur: function(){
61
		// summary: start the upload timer
62
		if(this._blurTimer){ clearTimeout(this._blurTimer); }
63
		if(!this._sent){
64
			this._blurTimer = setTimeout(dojo.hitch(this,"_sendFile"),this.blurDelay);
65
		}
66
	},
67
 
68
 
69
	setMessage: function(/*String*/title){
70
		// summary: set the text of the progressbar
71
 
72
		// FIXME: this throws errors in IE?!?!?!? egads.
73
		if(!dojo.isIE){ this.overlay.innerHTML = title;	}
74
	},
75
 
76
	_sendFile: function(/* Event */e){
77
		// summary: triggers the chain of events needed to upload a file in the background.
78
		if(!this.fileInput.value || this._sent){ return; }
79
 
80
		dojo.style(this.fakeNodeHolder,"display","none");
81
		dojo.style(this.overlay,"opacity","0");
82
		dojo.style(this.overlay,"display","block");
83
 
84
		this.setMessage(this.uploadMessage);
85
 
86
		dojo.fadeIn({ node: this.overlay, duration:this.duration }).play();
87
 
88
		var _newForm = document.createElement('form');
89
		_newForm.setAttribute("enctype","multipart/form-data");
90
		var node = dojo.clone(this.fileInput);
91
		_newForm.appendChild(this.fileInput);
92
		dojo.body().appendChild(_newForm);
93
 
94
		dojo.io.iframe.send({
95
			url: this.url+"?name="+this.name,
96
			form: _newForm,
97
			handleAs: "text",
98
			handle: dojo.hitch(this,"_handleSend")
99
		});
100
	},
101
 
102
	_handleSend: function(data,ioArgs){
103
		// summary: The callback to toggle the progressbar, and fire the user-defined callback
104
 
105
		if(!dojo.isIE){
106
			// otherwise, this throws errors in ie? FIXME:
107
			this.overlay.innerHTML = "";
108
		}
109
 
110
		this._sent = true;
111
		dojo.style(this.overlay,"opacity","0");
112
		dojo.style(this.overlay,"border","none");
113
		dojo.style(this.overlay,"background","none");
114
 
115
		this.overlay.style.backgroundImage = "none";
116
		this.fileInput.style.display = "none";
117
		this.fakeNodeHolder.style.display = "none";
118
		dojo.fadeIn({ node:this.overlay, duration:this.duration }).play(250);
119
 
120
		dojo.disconnect(this._blurListener);
121
		dojo.disconnect(this._focusListener);
122
 
123
		this.onComplete(data,ioArgs,this);
124
	},
125
 
126
	_onClick: function(e){
127
		// summary: accomodate our extra focusListeners
128
		if(this._blurTimer){ clearTimeout(this._blurTimer); }
129
 
130
		dojo.disconnect(this._blurListener);
131
		dojo.disconnect(this._focusListener);
132
 
133
		this.inherited("_onClick",arguments);
134
 
135
		this._blurListener = dojo.connect(this.fileInput,"onblur",this,"_onBlur");
136
		this._focusListener = dojo.connect(this.fileInput,"onfocus",this,"_onFocus");
137
	},
138
 
139
	onComplete: function(/* Object */data, /* dojo.Deferred._ioArgs */ioArgs, /* this */widgetRef){
140
		// summary: stub function fired when an upload has finished.
141
		// data: the raw data found in the first [TEXTAREA] tag of the post url
142
		// ioArgs: the dojo.Deferred data being passed from the handle: callback
143
	}
144
});
145
 
146
dojo.declare("dojox.widget.FileInputBlind",
147
	dojox.widget.FileInputAuto,
148
	{
149
	// summary: An extended version of dojox.widget.FileInputAuto
150
	//	that does not display an input node, but rather only a button
151
	// 	and otherwise behaves just like FileInputAuto
152
 
153
	startup: function(){
154
		// summary: hide our fileInput input field
155
		this.inherited("startup",arguments);
156
		this._off = dojo.style(this.inputNode,"width");
157
		this.inputNode.style.display = "none";
158
		this._fixPosition();
159
	},
160
 
161
	_fixPosition: function(){
162
		// summary: in this case, set the button under where the visible button is
163
		if(dojo.isIE){
164
			dojo.style(this.fileInput,"width","1px");
165
			//dojo.style(this.fileInput,"height",this.overlay.scrollHeight+"px")
166
		}else{
167
			dojo.style(this.fileInput,"left","-"+(this._off)+"px");
168
		}
169
	},
170
 
171
	_onClick: function(e){
172
		// summary: onclick, we need to reposition our newly created input type="file"
173
		this.inherited("_onClick",arguments);
174
		this._fixPosition();
175
	}
176
});
177
 
178
}