|
1
|
|
|
(function( $ ) { |
|
2
|
|
|
jQuery.fn.attachmentUpload = function(options) { |
|
3
|
|
|
var options = $.extend({ |
|
4
|
|
|
'url':"", |
|
5
|
|
|
'sortable': false, |
|
6
|
|
|
"multiple":false, |
|
7
|
|
|
"maxNumberOfFiles": 0, |
|
8
|
|
|
"maxFileSize":null, // 5 MB |
|
9
|
|
|
"acceptFileTypes": null, |
|
10
|
|
|
"files":[] |
|
11
|
|
|
}, options); |
|
12
|
|
|
|
|
13
|
|
|
var $input = this; |
|
14
|
|
|
var $container = $input.parent('div'); |
|
15
|
|
|
var $files = $('<ul>', {"class":"files"}).insertAfter($input); |
|
16
|
|
|
|
|
17
|
|
|
var methods = { |
|
18
|
|
|
init: function(){ |
|
19
|
|
|
if (options.multiple == true) { |
|
20
|
|
|
$input.attr('multiple', true); |
|
21
|
|
|
$input.attr('name', $input.attr('name') + '[]'); |
|
22
|
|
|
} |
|
23
|
|
|
|
|
24
|
|
|
if (options.sortable == true) { |
|
25
|
|
|
$files.sortable({ |
|
26
|
|
|
placeholder: "upload-kit-item sortable-placeholder", |
|
27
|
|
|
tolerance: "pointer", |
|
28
|
|
|
forcePlaceholderSize: true, |
|
29
|
|
|
update: function () { |
|
30
|
|
|
methods.updateOrder() |
|
31
|
|
|
} |
|
32
|
|
|
}) |
|
33
|
|
|
} |
|
34
|
|
|
|
|
35
|
|
|
$input.wrapAll($('<div class="upload-kit-input"></div>')) |
|
36
|
|
|
.after($('<span class="glyphicon glyphicon-plus-sign add"></span>')) |
|
37
|
|
|
.after($('<span class="glyphicon glyphicon-circle-arrow-down drag"></span>')) |
|
38
|
|
|
.after($('<span/>', {"data-toggle":"popover", "class":"glyphicon glyphicon-exclamation-sign error-popover"})) |
|
39
|
|
|
.after( |
|
40
|
|
|
'<div class="progress">'+ |
|
41
|
|
|
'<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>'+ |
|
42
|
|
|
'</div>' |
|
43
|
|
|
); |
|
44
|
|
|
$files.on('click', '.upload-kit-item .remove', methods.removeItem); |
|
45
|
|
|
methods.checkInputVisibility(); |
|
46
|
|
|
methods.fileuploadInit(); |
|
47
|
|
|
methods.dragInit(); |
|
48
|
|
|
}, |
|
49
|
|
|
fileuploadInit: function(){ |
|
50
|
|
|
var $fileupload = $input.fileupload({ |
|
51
|
|
|
url: options.url, |
|
52
|
|
|
dropZone: $input.parents('.upload-kit-input'), |
|
53
|
|
|
dataType: 'json', |
|
54
|
|
|
singleFileUploads: false, |
|
55
|
|
|
multiple: options.multiple, |
|
56
|
|
|
maxNumberOfFiles: options.maxNumberOfFiles, |
|
57
|
|
|
maxFileSize: options.maxFileSize, // 5 MB |
|
58
|
|
|
acceptFileTypes: options.acceptFileTypes |
|
59
|
|
|
? new RegExp(options.acceptFileTypes) |
|
60
|
|
|
: null, |
|
61
|
|
|
process: true, |
|
62
|
|
|
getNumberOfFiles: methods.getNumberOfFiles, |
|
63
|
|
|
start: function (e, data) { |
|
|
|
|
|
|
64
|
|
|
$container.find('.upload-kit-input') |
|
65
|
|
|
.removeClass('error') |
|
66
|
|
|
.addClass('in-progress') |
|
67
|
|
|
}, |
|
68
|
|
|
processfail: function(e, data) { |
|
69
|
|
|
if (data.files.error) { |
|
70
|
|
|
methods.showError(data.files[0].error); |
|
71
|
|
|
} |
|
72
|
|
|
}, |
|
73
|
|
|
progressall: function (e, data) { |
|
74
|
|
|
var progress = parseInt(data.loaded / data.total * 100, 10); |
|
75
|
|
|
$container.find('.progress-bar').attr('aria-valuenow', progress).css( |
|
76
|
|
|
'width', |
|
77
|
|
|
progress + '%' |
|
78
|
|
|
).text(progress + '%'); |
|
79
|
|
|
}, |
|
80
|
|
|
done: function (e, data) { |
|
81
|
|
|
$.each(data.result.files, function (index, file) { |
|
82
|
|
|
if (!file.error) { |
|
83
|
|
|
var item = methods.createItem(file); |
|
84
|
|
|
item.appendTo($files); |
|
85
|
|
|
} else { |
|
86
|
|
|
methods.showError(file.errors) |
|
87
|
|
|
} |
|
88
|
|
|
|
|
89
|
|
|
}); |
|
90
|
|
|
methods.checkInputVisibility(); |
|
91
|
|
|
if (options.sortable) { |
|
92
|
|
|
methods.updateOrder(); |
|
93
|
|
|
} |
|
94
|
|
|
}, |
|
95
|
|
|
fail: function (e, data) { |
|
96
|
|
|
methods.showError(data.errorThrown) |
|
97
|
|
|
}, |
|
98
|
|
|
always: function (e, data) { |
|
|
|
|
|
|
99
|
|
|
$container.find('.upload-kit-input').removeClass('in-progress') |
|
100
|
|
|
} |
|
101
|
|
|
|
|
102
|
|
|
}); |
|
103
|
|
|
if (options.files) { |
|
104
|
|
|
options.files.sort(function(a, b){ |
|
105
|
|
|
return parseInt(a.order) - parseInt(b.order); |
|
106
|
|
|
}); |
|
107
|
|
|
$fileupload.fileupload('option', 'done').call($fileupload, $.Event('done'), {result: {files: options.files}}); |
|
108
|
|
|
methods.checkInputVisibility(); |
|
109
|
|
|
} |
|
110
|
|
|
}, |
|
111
|
|
|
dragInit: function(){ |
|
112
|
|
|
$(document).on('dragover', function () |
|
113
|
|
|
{ |
|
114
|
|
|
$('.upload-kit-input').addClass('drag-highlight'); |
|
115
|
|
|
}); |
|
116
|
|
|
$(document).on('dragleave drop', function () |
|
117
|
|
|
{ |
|
118
|
|
|
$('.upload-kit-input').removeClass('drag-highlight'); |
|
119
|
|
|
}); |
|
120
|
|
|
}, |
|
121
|
|
|
showError: function(error){ |
|
122
|
|
|
if ($.fn.popover) { |
|
123
|
|
|
$container.find('.error-popover').attr('data-content', error).popover({html:true,trigger:"hover"}); |
|
124
|
|
|
} |
|
125
|
|
|
$container.find('.upload-kit-input').addClass('error'); |
|
126
|
|
|
}, |
|
127
|
|
|
removeItem: function(e){ //删除图片项目 |
|
|
|
|
|
|
128
|
|
|
var $this = $(this); |
|
129
|
|
|
var url = $this.data('url'); |
|
130
|
|
|
if (url) { |
|
131
|
|
|
$.ajax({ |
|
132
|
|
|
url: url, |
|
133
|
|
|
type: 'DELETE' |
|
134
|
|
|
}) |
|
135
|
|
|
} |
|
136
|
|
|
$this.parents('.upload-kit-item').remove(); |
|
137
|
|
|
methods.checkInputVisibility(); |
|
138
|
|
|
}, |
|
139
|
|
|
createItem: function(file){ //新建图片项目 |
|
140
|
|
|
var name = options.name; |
|
141
|
|
|
var index = methods.getNumberOfFiles(); |
|
142
|
|
|
if (options.multiple) { |
|
143
|
|
|
name += '[' + index + ']'; |
|
144
|
|
|
} |
|
145
|
|
|
var item = $('<li>', {"class": "upload-kit-item done"}) |
|
146
|
|
|
.append($('<input/>', {"name": name,"value": file.url, "type":"hidden"})) |
|
147
|
|
|
.append($('<span/>', {"class": "fa fa-trash remove", "data-url": file.deleteUrl})); |
|
148
|
|
|
if (!file.type || file.type.search(/image\/.*/g) !== -1) { |
|
149
|
|
|
item.removeClass('not-image').addClass('image'); |
|
150
|
|
|
item.prepend($('<img/>', {src: file.url})); |
|
151
|
|
|
item.find('span.type').text(''); |
|
152
|
|
|
} else { |
|
153
|
|
|
item.removeClass('image').addClass('not-image'); |
|
154
|
|
|
item.css('backgroundImage', ''); |
|
155
|
|
|
item.append($('<span/>', {"class": "name"}).text(file.filename)); |
|
156
|
|
|
} |
|
157
|
|
|
return item; |
|
158
|
|
|
}, |
|
159
|
|
|
checkInputVisibility: function(){ |
|
160
|
|
|
var inputContainer = $container.find('.upload-kit-input'); |
|
161
|
|
|
if (options.maxNumberOfFiles && (methods.getNumberOfFiles() >= options.maxNumberOfFiles)) { |
|
162
|
|
|
inputContainer.hide(); |
|
163
|
|
|
} else { |
|
164
|
|
|
inputContainer.show(); |
|
165
|
|
|
} |
|
166
|
|
|
}, |
|
167
|
|
|
getNumberOfFiles: function() { |
|
168
|
|
|
return $container.find('.files .upload-kit-item').length; |
|
169
|
|
|
}, |
|
170
|
|
|
updateOrder: function () { |
|
171
|
|
|
$files.find('.upload-kit-item').each(function(index, item){ |
|
172
|
|
|
$(item).find('input[data-role=order]').val(index); |
|
173
|
|
|
}) |
|
174
|
|
|
} |
|
175
|
|
|
}; |
|
176
|
|
|
|
|
177
|
|
|
methods.init.apply(this); |
|
178
|
|
|
return this; |
|
179
|
|
|
}; |
|
180
|
|
|
|
|
181
|
|
|
})(jQuery); |
yuncms /
framework
Loading history...
This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function.