Skip to content

Commit 5564f8b

Browse files
SunLnSunLn
committed
update multiple.html
1 parent 645bde2 commit 5564f8b

File tree

7 files changed

+578
-19
lines changed

7 files changed

+578
-19
lines changed

‎demo/js/main.js‎

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,13 @@
55

66

77
$(function() {
8+
var Qiniu = new QiniuJsSDK();
89
var uploader = Qiniu.uploader({
910
runtimes: 'html5,flash,html4',
1011
browse_button: 'pickfiles',
1112
container: 'container',
1213
drop_element: 'container',
13-
max_file_size: '100mb',
14+
max_file_size: '500mb',
1415
flash_swf_url: 'js/plupload/Moxie.swf',
1516
dragdrop: true,
1617
chunk_size: '4mb',
@@ -58,17 +59,17 @@ $(function() {
5859
progress.setComplete(up, info);
5960
},
6061
'Error': function(up, err, errTip) {
61-
$('table').show();
62-
var progress = new FileProgress(err.file, 'fsUploadProgress');
63-
progress.setError();
64-
progress.setStatus(errTip);
65-
}
66-
// ,
67-
// 'Key': function(up, file) {
68-
// var key = "";
69-
// // do something with key
70-
// return key
71-
// }
62+
$('table').show();
63+
var progress = new FileProgress(err.file, 'fsUploadProgress');
64+
progress.setError();
65+
progress.setStatus(errTip);
66+
}
67+
// ,
68+
// 'Key': function(up, file) {
69+
// var key = "";
70+
// // do something with key
71+
// return key
72+
// }
7273
}
7374
});
7475

‎demo/js/multiple.js‎

Lines changed: 302 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,302 @@
1+
/*global Qiniu */
2+
/*global plupload */
3+
/*global FileProgress */
4+
/*global hljs */
5+
6+
7+
$(function() {
8+
var Qiniu = new QiniuJsSDK();
9+
var uploader = Qiniu.uploader({
10+
runtimes: 'html5,flash,html4',
11+
browse_button: 'pickfiles',
12+
container: 'container',
13+
drop_element: 'container',
14+
max_file_size: '500mb',
15+
flash_swf_url: 'js/plupload/Moxie.swf',
16+
dragdrop: true,
17+
chunk_size: '4mb',
18+
uptoken_url: $('#uptoken_url').val(),
19+
domain: $('#domain').val(),
20+
// downtoken_url: '/downtoken',
21+
// unique_names: true,
22+
// save_key: true,
23+
// x_vars: {
24+
// 'id': '1234',
25+
// 'time': function(up, file) {
26+
// var time = (new Date()).getTime();
27+
// // do something with 'time'
28+
// return time;
29+
// },
30+
// },
31+
auto_start: true,
32+
init: {
33+
'FilesAdded': function(up, files) {
34+
$('table').show();
35+
$('#success').hide();
36+
plupload.each(files, function(file) {
37+
var progress = new FileProgress(file, 'fsUploadProgress');
38+
progress.setStatus("等待...");
39+
});
40+
},
41+
'BeforeUpload': function(up, file) {
42+
var progress = new FileProgress(file, 'fsUploadProgress');
43+
var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
44+
if (up.runtime === 'html5' && chunk_size) {
45+
progress.setChunkProgess(chunk_size);
46+
}
47+
},
48+
'UploadProgress': function(up, file) {
49+
var progress = new FileProgress(file, 'fsUploadProgress');
50+
var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
51+
52+
progress.setProgress(file.percent + "%", file.speed, chunk_size);
53+
},
54+
'UploadComplete': function() {
55+
$('#success').show();
56+
},
57+
'FileUploaded': function(up, file, info) {
58+
var progress = new FileProgress(file, 'fsUploadProgress');
59+
progress.setComplete(up, info);
60+
},
61+
'Error': function(up, err, errTip) {
62+
$('table').show();
63+
var progress = new FileProgress(err.file, 'fsUploadProgress');
64+
progress.setError();
65+
progress.setStatus(errTip);
66+
}
67+
// ,
68+
// 'Key': function(up, file) {
69+
// var key = "";
70+
// // do something with key
71+
// return key
72+
// }
73+
}
74+
});
75+
76+
uploader.bind('FileUploaded', function() {
77+
console.log('hello man,a file is uploaded');
78+
});
79+
80+
var Qiniu2 = new QiniuJsSDK();
81+
var uploader2 = Qiniu2.uploader({
82+
runtimes: 'html5,flash,html4',
83+
browse_button: 'pickfiles2',
84+
container: 'container2',
85+
drop_element: 'container2',
86+
max_file_size: '500mb',
87+
flash_swf_url: 'js/plupload/Moxie.swf',
88+
dragdrop: true,
89+
chunk_size: '4mb',
90+
uptoken_url: $('#uptoken_url').val(),
91+
domain: $('#domain').val(),
92+
// downtoken_url: '/downtoken',
93+
// unique_names: true,
94+
// save_key: true,
95+
// x_vars: {
96+
// 'id': '1234',
97+
// 'time': function(up, file) {
98+
// var time = (new Date()).getTime();
99+
// // do something with 'time'
100+
// return time;
101+
// },
102+
// },
103+
auto_start: true,
104+
init: {
105+
'FilesAdded': function(up, files) {
106+
$('table').show();
107+
$('#success').hide();
108+
plupload.each(files, function(file) {
109+
var progress = new FileProgress(file, 'fsUploadProgress');
110+
progress.setStatus("等待...");
111+
});
112+
},
113+
'BeforeUpload': function(up, file) {
114+
var progress = new FileProgress(file, 'fsUploadProgress');
115+
var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
116+
if (up.runtime === 'html5' && chunk_size) {
117+
progress.setChunkProgess(chunk_size);
118+
}
119+
},
120+
'UploadProgress': function(up, file) {
121+
var progress = new FileProgress(file, 'fsUploadProgress');
122+
var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
123+
124+
progress.setProgress(file.percent + "%", file.speed, chunk_size);
125+
},
126+
'UploadComplete': function() {
127+
$('#success').show();
128+
},
129+
'FileUploaded': function(up, file, info) {
130+
var progress = new FileProgress(file, 'fsUploadProgress');
131+
progress.setComplete(up, info);
132+
},
133+
'Error': function(up, err, errTip) {
134+
$('table').show();
135+
var progress = new FileProgress(err.file, 'fsUploadProgress');
136+
progress.setError();
137+
progress.setStatus(errTip);
138+
}
139+
// ,
140+
// 'Key': function(up, file) {
141+
// var key = "";
142+
// // do something with key
143+
// return key
144+
// }
145+
}
146+
});
147+
148+
uploader2.bind('FileUploaded', function() {
149+
console.log('hello man,a file is uploaded');
150+
});
151+
152+
$('#container').on(
153+
'dragenter',
154+
function(e) {
155+
e.preventDefault();
156+
$('#container').addClass('draging');
157+
e.stopPropagation();
158+
}
159+
).on('drop', function(e) {
160+
e.preventDefault();
161+
$('#container').removeClass('draging');
162+
e.stopPropagation();
163+
}).on('dragleave', function(e) {
164+
e.preventDefault();
165+
$('#container').removeClass('draging');
166+
e.stopPropagation();
167+
}).on('dragover', function(e) {
168+
e.preventDefault();
169+
$('#container').addClass('draging');
170+
e.stopPropagation();
171+
});
172+
173+
174+
175+
$('#show_code').on('click', function() {
176+
$('#myModal-code').modal();
177+
$('pre code').each(function(i, e) {
178+
hljs.highlightBlock(e);
179+
});
180+
});
181+
182+
183+
$('body').on('click', 'table button.btn', function() {
184+
$(this).parents('tr').next().toggle();
185+
});
186+
187+
188+
var getRotate = function(url) {
189+
if (!url) {
190+
return 0;
191+
}
192+
var arr = url.split('/');
193+
for (var i = 0, len = arr.length; i < len; i++) {
194+
if (arr[i] === 'rotate') {
195+
return parseInt(arr[i + 1], 10);
196+
}
197+
}
198+
return 0;
199+
};
200+
201+
$('#myModal-img .modal-body-footer').find('a').on('click', function() {
202+
var img = $('#myModal-img').find('.modal-body img');
203+
var key = img.data('key');
204+
var oldUrl = img.attr('src');
205+
var originHeight = parseInt(img.data('h'), 10);
206+
var fopArr = [];
207+
var rotate = getRotate(oldUrl);
208+
if (!$(this).hasClass('no-disable-click')) {
209+
$(this).addClass('disabled').siblings().removeClass('disabled');
210+
if ($(this).data('imagemogr') !== 'no-rotate') {
211+
fopArr.push({
212+
'fop': 'imageMogr2',
213+
'auto-orient': true,
214+
'strip': true,
215+
'rotate': rotate,
216+
'format': 'png'
217+
});
218+
}
219+
} else {
220+
$(this).siblings().removeClass('disabled');
221+
var imageMogr = $(this).data('imagemogr');
222+
if (imageMogr === 'left') {
223+
rotate = rotate - 90 < 0 ? rotate + 270 : rotate - 90;
224+
} else if (imageMogr === 'right') {
225+
rotate = rotate + 90 > 360 ? rotate - 270 : rotate + 90;
226+
}
227+
fopArr.push({
228+
'fop': 'imageMogr2',
229+
'auto-orient': true,
230+
'strip': true,
231+
'rotate': rotate,
232+
'format': 'png'
233+
});
234+
}
235+
236+
$('#myModal-img .modal-body-footer').find('a.disabled').each(function() {
237+
238+
var watermark = $(this).data('watermark');
239+
var imageView = $(this).data('imageview');
240+
var imageMogr = $(this).data('imagemogr');
241+
242+
if (watermark) {
243+
fopArr.push({
244+
fop: 'watermark',
245+
mode: 1,
246+
image: 'http://www.b1.qiniudn.com/images/logo-2.png',
247+
dissolve: 100,
248+
gravity: watermark,
249+
dx: 100,
250+
dy: 100
251+
});
252+
}
253+
254+
if (imageView) {
255+
var height;
256+
switch (imageView) {
257+
case 'large':
258+
height = originHeight;
259+
break;
260+
case 'middle':
261+
height = originHeight * 0.5;
262+
break;
263+
case 'small':
264+
height = originHeight * 0.1;
265+
break;
266+
default:
267+
height = originHeight;
268+
break;
269+
}
270+
fopArr.push({
271+
fop: 'imageView2',
272+
mode: 3,
273+
h: parseInt(height, 10),
274+
q: 100,
275+
format: 'png'
276+
});
277+
}
278+
279+
if (imageMogr === 'no-rotate') {
280+
fopArr.push({
281+
'fop': 'imageMogr2',
282+
'auto-orient': true,
283+
'strip': true,
284+
'rotate': 0,
285+
'format': 'png'
286+
});
287+
}
288+
});
289+
290+
var newUrl = Qiniu.pipeline(fopArr, key);
291+
292+
var newImg = new Image();
293+
img.attr('src', 'loading.gif');
294+
newImg.onload = function() {
295+
img.attr('src', newUrl);
296+
img.parent('a').attr('href', newUrl);
297+
};
298+
newImg.src = newUrl;
299+
return false;
300+
});
301+
302+
});

‎demo/js/qiniu.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*global plupload ,mOxie*/
22
/*global ActiveXObject */
3-
/*exported Qiniu */
3+
/*exported QiniuJsSDK */
44

55
function QiniuJsSDK() {
66

@@ -855,5 +855,3 @@ function QiniuJsSDK() {
855855
};
856856

857857
}
858-
859-
var Qiniu = new QiniuJsSDK();

‎demo/server.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,13 @@ app.get('/', function(req, res) {
6666
});
6767
});
6868

69+
app.get('/multiple', function(req, res) {
70+
res.render('multiple.html', {
71+
domain: config.Domain,
72+
uptoken_url: config.Uptoken_Url
73+
});
74+
});
75+
6976
qiniu.conf.ACCESS_KEY = config.ACCESS_KEY;
7077
qiniu.conf.SECRET_KEY = config.SECRET_KEY;
7178

0 commit comments

Comments
 (0)