events.html
8.29 KB
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
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Plupload - Events example</title>
<!-- production -->
<script type="text/javascript" src="../js/plupload.full.min.js"></script>
<!-- debug
<script type="text/javascript" src="../js/moxie.js"></script>
<script type="text/javascript" src="../js/plupload.dev.js"></script>
-->
</head>
<body style="font: 13px Verdana; background: #eee; color: #333">
<h1>Events example</h1>
<div id="container">
<a id="pickfiles" href="javascript:;">[Select files]</a>
<a id="uploadfiles" href="javascript:;">[Upload files]</a>
</div>
<br />
<pre id="console"></pre>
<script type="text/javascript">
var uploader = new plupload.Uploader({
// General settings
runtimes : 'silverlight,html4',
browse_button : 'pickfiles', // you can pass in id...
url : 'upload.php',
chunk_size : '1mb',
unique_names : true,
// Resize images on client-side if we can
resize : { width : 320, height : 240, quality : 90 },
filters : {
max_file_size : '10mb',
// Specify what files to browse for
mime_types: [
{title : "Image files", extensions : "jpg,gif,png"},
{title : "Zip files", extensions : "zip"}
]
},
flash_swf_url : '../js/Moxie.swf',
silverlight_xap_url : '../js/Moxie.xap',
// PreInit events, bound before the internal events
preinit : {
Init: function(up, info) {
log('[Init]', 'Info:', info, 'Features:', up.features);
},
UploadFile: function(up, file) {
log('[UploadFile]', file);
// You can override settings before the file is uploaded
// up.setOption('url', 'upload.php?id=' + file.id);
// up.setOption('multipart_params', {param1 : 'value1', param2 : 'value2'});
}
},
// Post init events, bound after the internal events
init : {
PostInit: function() {
// Called after initialization is finished and internal event handlers bound
log('[PostInit]');
document.getElementById('uploadfiles').onclick = function() {
uploader.start();
return false;
};
},
Browse: function(up) {
// Called when file picker is clicked
log('[Browse]');
},
Refresh: function(up) {
// Called when the position or dimensions of the picker change
log('[Refresh]');
},
StateChanged: function(up) {
// Called when the state of the queue is changed
log('[StateChanged]', up.state == plupload.STARTED ? "STARTED" : "STOPPED");
},
QueueChanged: function(up) {
// Called when queue is changed by adding or removing files
log('[QueueChanged]');
},
OptionChanged: function(up, name, value, oldValue) {
// Called when one of the configuration options is changed
log('[OptionChanged]', 'Option Name: ', name, 'Value: ', value, 'Old Value: ', oldValue);
},
BeforeUpload: function(up, file) {
// Called right before the upload for a given file starts, can be used to cancel it if required
log('[BeforeUpload]', 'File: ', file);
},
UploadProgress: function(up, file) {
// Called while file is being uploaded
log('[UploadProgress]', 'File:', file, "Total:", up.total);
},
FileFiltered: function(up, file) {
// Called when file successfully files all the filters
log('[FileFiltered]', 'File:', file);
},
FilesAdded: function(up, files) {
// Called when files are added to queue
log('[FilesAdded]');
plupload.each(files, function(file) {
log(' File:', file);
});
},
FilesRemoved: function(up, files) {
// Called when files are removed from queue
log('[FilesRemoved]');
plupload.each(files, function(file) {
log(' File:', file);
});
},
FileUploaded: function(up, file, info) {
// Called when file has finished uploading
log('[FileUploaded] File:', file, "Info:", info);
},
ChunkUploaded: function(up, file, info) {
// Called when file chunk has finished uploading
log('[ChunkUploaded] File:', file, "Info:", info);
},
UploadComplete: function(up, files) {
// Called when all files are either uploaded or failed
log('[UploadComplete]');
},
Destroy: function(up) {
// Called when uploader is destroyed
log('[Destroy] ');
},
Error: function(up, args) {
// Called when error occurs
log('[Error] ', args);
}
}
});
function log() {
var str = "";
plupload.each(arguments, function(arg) {
var row = "";
if (typeof(arg) != "string") {
plupload.each(arg, function(value, key) {
// Convert items in File objects to human readable form
if (arg instanceof plupload.File) {
// Convert status to human readable
switch (value) {
case plupload.QUEUED:
value = 'QUEUED';
break;
case plupload.UPLOADING:
value = 'UPLOADING';
break;
case plupload.FAILED:
value = 'FAILED';
break;
case plupload.DONE:
value = 'DONE';
break;
}
}
if (typeof(value) != "function") {
row += (row ? ', ' : '') + key + '=' + value;
}
});
str += row + " ";
} else {
str += arg + " ";
}
});
var log = document.getElementById('console');
log.innerHTML += str + "\n";
}
uploader.init();
</script>
</body>
</html>