1
|
define([
|
2
|
"dojo/query",
|
3
|
"dojo/NodeList-html", // NodeList::html()
|
4
|
"dojo/NodeList-traverse", // NodeList::children()
|
5
|
"dojo/NodeList-manipulate" // NodeList::val()
|
6
|
],function(query){
|
7
|
|
8
|
var d = dojo;
|
9
|
var $ = query;
|
10
|
|
11
|
var uploaders = {};
|
12
|
|
13
|
function _(str) {
|
14
|
return plupload.translate(str) || str;
|
15
|
}
|
16
|
|
17
|
function pluploadQueue(target, settings){
|
18
|
|
19
|
var uploader = window.uploader;
|
20
|
var id = d.attr(target, 'id');
|
21
|
//if(settings.loader_url){
|
22
|
// target.innerHTML = '<div style="width:100%;text-align:center"><img src="' + settings.loader_url + '" /></div>';
|
23
|
//}
|
24
|
|
25
|
if(!id){
|
26
|
id = plupload.guid();
|
27
|
d.attr(target, 'id', id);
|
28
|
}
|
29
|
|
30
|
/* uploader = new plupload.Uploader(plupload.extend({
|
31
|
dragdrop : true,
|
32
|
container : id
|
33
|
}, settings)); */
|
34
|
|
35
|
// renderUI(id, target);
|
36
|
|
37
|
// window.uploader = uploader;
|
38
|
|
39
|
// Call preinit function
|
40
|
if (settings.preinit) {
|
41
|
settings.preinit(uploader);
|
42
|
}
|
43
|
|
44
|
uploaders[id] = uploader;
|
45
|
|
46
|
function handleStatus(file) {
|
47
|
var actionClass, title;
|
48
|
|
49
|
if (file.status == plupload.DONE) {
|
50
|
actionClass = 'plupload_done';
|
51
|
title = "done";
|
52
|
}
|
53
|
|
54
|
if (file.status == plupload.FAILED) {
|
55
|
actionClass = 'plupload_failed';
|
56
|
title = "failed: " + file.error_message;
|
57
|
}
|
58
|
|
59
|
if (file.status == plupload.QUEUED) {
|
60
|
actionClass = 'plupload_delete';
|
61
|
title = "queued";
|
62
|
}
|
63
|
|
64
|
if (file.status == plupload.UPLOADING) {
|
65
|
actionClass = 'plupload_uploading';
|
66
|
title = "uploading";
|
67
|
}
|
68
|
var status_elms = $('#' + file.id).attr('class', actionClass);
|
69
|
status_elms.query('a').style('display', 'block').attr('title', title);
|
70
|
}
|
71
|
|
72
|
function updateTotalProgress() {
|
73
|
// removed target here
|
74
|
$('div.plupload_progress').style('display', 'block');
|
75
|
$('span.plupload_total_status').html(uploader.total.percent + '%');
|
76
|
$('div.plupload_progress_bar').style('width', uploader.total.percent + '%');
|
77
|
$('span.plupload_upload_status').html('Uploaded ' + uploader.total.uploaded + '/' + uploader.files.length + ' files');
|
78
|
|
79
|
// All files are uploaded
|
80
|
if (uploader.total.uploaded == uploader.files.length) {
|
81
|
uploader.stop();
|
82
|
}
|
83
|
}
|
84
|
|
85
|
function updateList() {
|
86
|
var fileList = $('ul.plupload_filelist', target),
|
87
|
inputCount = 0,
|
88
|
inputHTML,
|
89
|
hasQueuedFiles = false;
|
90
|
|
91
|
fileList.html('');
|
92
|
|
93
|
plupload.each(uploader.files, function(file) {
|
94
|
inputHTML = '';
|
95
|
|
96
|
if (file.status == plupload.DONE) {
|
97
|
if (file.target_name) {
|
98
|
inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_tmpname" value="' + plupload.xmlEncode(file.target_name) + '" />';
|
99
|
}
|
100
|
inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_name" value="' + plupload.xmlEncode(file.name) + '" />';
|
101
|
inputHTML += '<input type="hidden" name="' + id + '_' + inputCount + '_status" value="' + (file.status == plupload.DONE ? 'done' : 'failed') + '" />';
|
102
|
inputCount++;
|
103
|
$('#' + id + '_count').val(inputCount);
|
104
|
} else if(file.status == plupload.QUEUED){
|
105
|
hasQueuedFiles = true;
|
106
|
}
|
107
|
|
108
|
fileList.addContent(
|
109
|
'<li id="' + file.id + '">' +
|
110
|
'<div class="plupload_file_name"><span>' + file.name + '</span></div>' +
|
111
|
'<div class="plupload_file_action"><a href="#images"></a></div>' +
|
112
|
'<div class="plupload_file_status">' + file.percent + '%</div>' +
|
113
|
'<div class="plupload_file_size">' + plupload.formatSize(file.size) + '</div>' +
|
114
|
'<div class="plupload_clearer"> </div>' +
|
115
|
inputHTML +
|
116
|
'</li>');
|
117
|
|
118
|
handleStatus(file);
|
119
|
|
120
|
$('#' + file.id + '.plupload_delete a').onclick(function(e) {
|
121
|
$('#' + file.id).empty();
|
122
|
uploader.removeFile(file);
|
123
|
e.preventDefault();
|
124
|
});
|
125
|
});
|
126
|
|
127
|
$('a.plupload_start', target).toggleClass('disabled', !hasQueuedFiles || uploader.state === plupload.STARTED);
|
128
|
$('span.plupload_total_file_size', target).html(plupload.formatSize(uploader.total.size));
|
129
|
|
130
|
// What plupload_add_text?
|
131
|
// if (uploader.total.queued === 0) {
|
132
|
// $('span.plupload_add_text', target).text(_('Add files.'));
|
133
|
// } else {
|
134
|
// $('span.plupload_add_text', target).text(uploader.total.queued + ' files queued.');
|
135
|
// }
|
136
|
|
137
|
// Scroll to end of file list
|
138
|
fileList[0].scrollTop = fileList[0].scrollHeight;
|
139
|
|
140
|
updateTotalProgress();
|
141
|
|
142
|
// Re-add drag message if there is no files
|
143
|
if (!uploader.files.length && uploader.features.dragdrop && uploader.settings.dragdrop) {
|
144
|
d.place('<li class="plupload_droptext" ondrop="uploader.drop(event)" ondragover="uploader.dragover(event);" ondragleave="uploader.dragleave(event);">' + _("Drag image file here.") + '</li>', id + '_filelist', 'last');
|
145
|
}
|
146
|
}//updateList
|
147
|
|
148
|
// Drag and drop not possible with Java due to JS security. Below just for fun...
|
149
|
uploader.dragover = function(ev) {
|
150
|
ev.preventDefault();
|
151
|
$("#uploadDialogDiv_filelist").addClass("dragdrop_active");
|
152
|
}
|
153
|
uploader.dragleave = function(ev) {
|
154
|
ev.preventDefault();
|
155
|
$("#uploadDialogDiv_filelist").removeClass("dragdrop_active");
|
156
|
}
|
157
|
uploader.drop = function(ev) {
|
158
|
ev.preventDefault();
|
159
|
console.log("dropped", ev, ev.dataTransfer.files);
|
160
|
}
|
161
|
|
162
|
|
163
|
uploader.myInit = function(up, res) {
|
164
|
|
165
|
// renderUI(id, target);
|
166
|
|
167
|
$('a.plupload_add', target).attr('id', id + '_browse');
|
168
|
|
169
|
up.settings.browse_button = id + '_browse';
|
170
|
|
171
|
// Enable drag/drop
|
172
|
if (up.features.dragdrop && up.settings.dragdrop) {
|
173
|
console.log('drag drop');
|
174
|
up.settings.drop_element = id + '_filelist';
|
175
|
d.place('<li class="plupload_droptext">' + _("Drag image file here.") + '</li>', id + '_filelist', 'last');
|
176
|
}
|
177
|
//$('#' + id + '_container').attr('title', 'Using runtime: ' + res.runtime);
|
178
|
|
179
|
$('a.plupload_add', target).onclick(function(e){
|
180
|
var old_files = [];
|
181
|
plupload.each(uploader.files, function(file){
|
182
|
if(file.status == plupload.DONE || file.status == plupload.FAILED){
|
183
|
old_files.push(file);
|
184
|
}
|
185
|
});
|
186
|
plupload.each(old_files, function(file){
|
187
|
$('#' + file.id).empty();
|
188
|
uploader.removeFile(file);
|
189
|
});
|
190
|
//uploader.trigger('SelectFiles');
|
191
|
//e.preventDefault();
|
192
|
});
|
193
|
$('#urlupload', target).onfocus(function(e){
|
194
|
// Commented out to allow upload without Java
|
195
|
//if (uploader.initialized) {
|
196
|
jQuery('a.plupload_add_url').show();
|
197
|
jQuery('a.plupload_add').hide();
|
198
|
//}
|
199
|
});
|
200
|
$('#urlupload', target).onblur(function(e){
|
201
|
// if (uploader.initialized && !$("#urlupload").val()) {
|
202
|
if (!$("#urlupload").val()) {
|
203
|
jQuery('a.plupload_add_url').hide();
|
204
|
jQuery('a.plupload_add').show();
|
205
|
}
|
206
|
});
|
207
|
$('a.plupload_add_url', target).onclick(function(e){
|
208
|
var old_files = [];
|
209
|
plupload.each(uploader.files, function(file){
|
210
|
if(file.status == plupload.DONE || file.status == plupload.FAILED){
|
211
|
old_files.push(file);
|
212
|
}
|
213
|
});
|
214
|
plupload.each(old_files, function(file){
|
215
|
$('#' + file.id).empty();
|
216
|
uploader.removeFile(file);
|
217
|
});
|
218
|
if ($("#urlupload").val()) {
|
219
|
var urlfile = $("#urlupload").val();
|
220
|
if(/^(http|https):\/\/[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/i.test(urlfile)) {
|
221
|
$(".plupload_add_url").toggleClass('disabled', true);
|
222
|
jQuery.get("/stabile/images?action=urlupload\&url=" + encodeURIComponent(urlfile) + "\&probe=1",
|
223
|
function(data) {
|
224
|
if (data.status == 'OK') {
|
225
|
var match = false;
|
226
|
jQuery.each(uploader.files, function(i, val) {if (val.name == data.name) match=true;});
|
227
|
if (match) {
|
228
|
IRIGO.toast("You have already added a file with that name");
|
229
|
} else {
|
230
|
uploader.files.push({id: 'url_' + Date.now(), name: data.name, size: data.size, status:1, loaded:0, percent:0, url: urlfile, path: data.path});
|
231
|
updateList();
|
232
|
}
|
233
|
$("#urlupload").val('');
|
234
|
} else {
|
235
|
IRIGO.toast("The file could not be downloaded. " + data.message);
|
236
|
}
|
237
|
$(".plupload_add_url").toggleClass('disabled', false);
|
238
|
jQuery('a.plupload_add_url').hide();
|
239
|
jQuery('a.plupload_add').show();
|
240
|
});
|
241
|
} else {
|
242
|
IRIGO.toast("That's not a valid URL. Please type in a http(s) URL which points to the image you want to upload.");
|
243
|
}
|
244
|
}
|
245
|
e.preventDefault();
|
246
|
});
|
247
|
|
248
|
$('a.plupload_start', target).onclick(function(e) {
|
249
|
if (!d.hasClass(target, 'disabled')) {
|
250
|
uploader.start();
|
251
|
$('a.plupload_start', target).toggleClass('disabled', true);
|
252
|
}
|
253
|
e.preventDefault();
|
254
|
});
|
255
|
|
256
|
$('a.plupload_stop', target).onclick(function(e) {
|
257
|
var finished = true;
|
258
|
uploader.stop();
|
259
|
$('a.plupload_start', target).toggleClass('disabled', !finished);
|
260
|
e.preventDefault();
|
261
|
});
|
262
|
|
263
|
// Initially start button is disabled.
|
264
|
$('a.plupload_start', target).addClass('disabled');
|
265
|
|
266
|
}
|
267
|
|
268
|
uploader.myInit(uploader);
|
269
|
|
270
|
// Event handlers
|
271
|
//uploader.bind('Init', uploader.myInit);// end uploader.bind('Init',...
|
272
|
uploader.bind('Init', function(){
|
273
|
if (!$("#urlupload").val()) {
|
274
|
jQuery('a.plupload_add_url').hide();
|
275
|
jQuery('a.plupload_add').show();
|
276
|
}
|
277
|
updateList();
|
278
|
});
|
279
|
|
280
|
uploader.bind('StateChanged', function() {
|
281
|
if (uploader.state === plupload.STARTED) {
|
282
|
// $('li.plupload_delete a,div.plupload_buttons', target).style('display', 'none');
|
283
|
// removed target so we can have the progressbar several place
|
284
|
$('span.plupload_upload_status,div.plupload_progress,a.plupload_stop', target).style('display', 'block');
|
285
|
$('span.plupload_upload_status', target).html('Uploaded 0/' + uploader.files.length + ' files');
|
286
|
}
|
287
|
else {
|
288
|
$('a.plupload_stop,div.plupload_progress', target).style('display', 'none');
|
289
|
$('a.plupload_delete', target).style('display', 'block');
|
290
|
}
|
291
|
});
|
292
|
|
293
|
uploader.bind('QueueChanged', updateList);
|
294
|
|
295
|
uploader.bind('StateChanged', function(up) {
|
296
|
if (up.state == plupload.STOPPED) {
|
297
|
updateList();
|
298
|
}
|
299
|
});
|
300
|
|
301
|
uploader.bind('FileUploaded', function(up, file) {
|
302
|
handleStatus(file);
|
303
|
});
|
304
|
|
305
|
uploader.bind("UploadProgress", function(up, file) {
|
306
|
// Set file specific progress
|
307
|
$('#' + file.id + ' div.plupload_file_status', target).html(file.percent + '%');
|
308
|
|
309
|
handleStatus(file);
|
310
|
updateTotalProgress();
|
311
|
});
|
312
|
|
313
|
uploader.bind('FileUploaded',
|
314
|
function(up, file){
|
315
|
dojo.publish(upload.FILE_UPLOADED);
|
316
|
});
|
317
|
|
318
|
uploader.bind("UploadFile", function(up, file) {
|
319
|
console.log('UploadFile...', up, file);
|
320
|
var settings = up.settings,
|
321
|
abs_url = location.protocol + '//' + location.host;
|
322
|
|
323
|
if(settings.url.charAt(0) === "/"){
|
324
|
abs_url += settings.url;
|
325
|
}
|
326
|
else if(settings.url.slice(0,4) === "http"){
|
327
|
abs_url = settings.url;
|
328
|
}
|
329
|
else{
|
330
|
// relative
|
331
|
abs_url += location.pathname.slice(0, location.pathname.lastIndexOf('/')) + '/' + settings.url;
|
332
|
}
|
333
|
if(file.url) {
|
334
|
var download = new plupload.Downloader(file);
|
335
|
download.start();
|
336
|
} else {
|
337
|
console.log("uploading file", up, file);
|
338
|
}
|
339
|
});
|
340
|
|
341
|
|
342
|
|
343
|
}//pluploadQueue
|
344
|
|
345
|
dojo.extend(dojo.NodeList, {
|
346
|
pluploadQueue: dojo.NodeList._adaptAsForEach(pluploadQueue)
|
347
|
});
|
348
|
|
349
|
});
|
350
|
|
351
|
|