Skip to content

Commit 6c76a59

Browse files
PauloPeresPauloPeres
committed
Improving the Chunk Method
1 parent 4ead005 commit 6c76a59

3 files changed

Lines changed: 276 additions & 5 deletions

File tree

‎src/file-upload/file-chunk.class.ts‎

Lines changed: 244 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,244 @@
1+
export class FileChunk {
2+
public stepSize:number = 1024 * 1024 * 3;
3+
public rawFile:any = null;
4+
public uploadProgress:number = null;
5+
public uploading:boolean = null;
6+
public uploadComplete:boolean = null;
7+
public byteStepSize:number = null;
8+
public totalSize:number = null;
9+
public startByte:number = null;
10+
public endByte:number = null;
11+
public currentChunk:number = 0;
12+
public totalChunks:number = null;
13+
public uniqueIdentifier:string = null;
14+
public totalSent:number = null;
15+
public extraData:any = {};
16+
constructor(rawFile:any, options:any = {}) {
17+
18+
if (typeof options !== 'undefined'){
19+
if (typeof options.byteStepSize !== 'undefined'){
20+
this.setByteStepSize(options.byteStepSize);
21+
}
22+
}
23+
this.setRawFile(rawFile)
24+
25+
this.setRawFile(rawFile);
26+
this.setUploadProgress(0);
27+
this.setUploading(false);
28+
this.setUploadComplete(false);
29+
this.setTotalSize(this.getRawFile().size);
30+
this.setStartByte(0);
31+
this.setEndByte(this.getByteStepSize());
32+
this.setCurrentChunk(0);
33+
if (!this.getBrowserSliceMethod()){
34+
this.setTotalChunks(1);
35+
}
36+
else{
37+
this.setTotalChunks(Math.ceil(this.totalSize / this.byteStepSize));
38+
}
39+
this.setUniqueIdenfier(this.generateUniqueIdentifier());
40+
this.setTotalSent(0);
41+
}
42+
43+
public setExtraData(index:any, value:any){
44+
this.extraData[index] = value;
45+
}
46+
47+
public getExtraData(index:any){
48+
return this.extraData[index];
49+
}
50+
51+
//getters and setters
52+
public setProgress(v:any){
53+
this.uploadProgress = v;
54+
}
55+
56+
public getProgress(){
57+
return this.uploadProgress;
58+
}
59+
60+
public setUploading(v:boolean){
61+
this.uploading = v;
62+
}
63+
64+
public getUploading(){
65+
return this.uploading;
66+
}
67+
68+
public getUploadComplete(){
69+
return this.uploadComplete;
70+
}
71+
72+
public setUploadComplete(v:boolean){
73+
this.uploadComplete = v;
74+
}
75+
76+
public setUploadProgress(v:number){
77+
this.uploadProgress = v;
78+
}
79+
80+
public getUploadProgress(){
81+
return this.uploadProgress;
82+
}
83+
84+
public getStartByte(){
85+
return this.startByte;
86+
}
87+
88+
public setStartByte(v:number){
89+
this.startByte = v;
90+
}
91+
92+
public getEndByte(){
93+
return this.endByte;
94+
}
95+
96+
public setEndByte(v:number){
97+
this.endByte = v;
98+
}
99+
100+
public getByteStepSize(){
101+
return this.byteStepSize;
102+
}
103+
104+
public setByteStepSize(v:number){
105+
this.byteStepSize = v;
106+
}
107+
108+
public setTotalSize(v:number){
109+
this.totalSize = v;
110+
}
111+
112+
public getTotalSize(){
113+
return this.totalSize;
114+
}
115+
116+
public getRawFile(){
117+
return this.rawFile;
118+
}
119+
120+
public setRawFile(v:File){
121+
this.rawFile = v;
122+
}
123+
124+
public getCurrentChunk(){
125+
return this.currentChunk;
126+
}
127+
128+
public setCurrentChunk(v:number){
129+
this.currentChunk = v;
130+
}
131+
132+
public getTotalChunks(){
133+
return this.totalChunks;
134+
}
135+
136+
public setTotalChunks(v:number){
137+
this.totalChunks = v;
138+
}
139+
140+
public setUniqueIdenfier(v:string){
141+
this.uniqueIdentifier = v;
142+
}
143+
144+
public getUniqueIdenfier(){
145+
return this.uniqueIdentifier;
146+
}
147+
148+
public getRawFileExtension(){
149+
const extension = this.getRawFileName().split('.');
150+
return extension[extension.length - 1];
151+
}
152+
153+
public getRawFileName(){
154+
return this.getRawFile().name;
155+
}
156+
157+
public getContentType(){
158+
return this.getRawFile().type;
159+
}
160+
161+
public getTotalSent(){
162+
return this.totalSent;
163+
}
164+
165+
public setTotalSent(v:number){
166+
this.totalSent = v;
167+
}
168+
169+
public getCurrentRawFileChunk(){
170+
if (!this.getBrowserSliceMethod()){
171+
return this.getRawFile();
172+
}
173+
else{
174+
return this.getRawFile()[this.getBrowserSliceMethod()](this.getStartByte(), this.getEndByte());
175+
}
176+
}
177+
178+
public retrocedeChunk(){
179+
if (!this.getBrowserSliceMethod()){
180+
return false;
181+
}
182+
183+
this.setEndByte(this.getStartByte());
184+
this.setStartByte(this.getStartByte() - this.getByteStepSize());
185+
this.setCurrentChunk(this.getCurrentChunk() - 1);
186+
187+
if (this.getTotalSent() != 0){
188+
this.setTotalSent(this.getTotalSent() - this.getByteStepSize());
189+
}
190+
}
191+
192+
public prepareNextChunk(){
193+
if (!this.getBrowserSliceMethod()){
194+
return false;
195+
}
196+
197+
if (this.getEndByte() > this.getTotalSize()){ //finished
198+
return false;
199+
}
200+
201+
this.setStartByte(this.getEndByte());
202+
this.setEndByte(this.getEndByte() + this.getByteStepSize());
203+
this.setCurrentChunk(this.getCurrentChunk() + 1);
204+
205+
return true;
206+
}
207+
208+
public getBrowserSliceMethod():string{
209+
if (this.rawFile && typeof this.rawFile !== 'undefined'){
210+
if (this.rawFile.slice && typeof this.rawFile.slice == 'function'){
211+
return 'slice';
212+
}
213+
else if(this.rawFile.mozSlice && typeof this.rawFile.mozSlice == 'function'){
214+
return 'mozSlice';
215+
}
216+
else if(this.rawFile.webkitSlice && typeof this.rawFile.webkitSlice == 'function'){
217+
return 'webkitSlice';
218+
}
219+
}
220+
else{
221+
return null;
222+
}
223+
}//getBrowserSliceMethod() ends here
224+
225+
226+
public generateUniqueIdentifier():string{
227+
var d = new Date().getTime();
228+
229+
if (typeof performance !== 'undefined' && typeof performance.now === 'function'){
230+
d += performance.now(); //use high-precision timer if available
231+
}
232+
233+
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
234+
var r = (d + Math.random() * 16) % 16 | 0;
235+
d = Math.floor(d / 16);
236+
return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16);
237+
});
238+
}
239+
240+
}
241+
242+
243+
244+

‎src/file-upload/file-item.class.ts‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { FileLikeObject } from './file-like-object.class';
22
import { FileUploader, ParsedResponseHeaders, FileUploaderOptions } from './file-uploader.class';
3-
3+
import { FileChunk } from './file-chunk.class'
44
export class FileItem {
55
public file: FileLikeObject;
66
public _file: File;
@@ -21,6 +21,7 @@ export class FileItem {
2121
public _xhr: XMLHttpRequest;
2222
public _form: any;
2323
public _chunkUploaders: any = [];
24+
public _fileChunks: FileChunk;
2425
public _currentChunk: number = 0;
2526
public _totalChunks: number = 0;
2627

@@ -50,7 +51,28 @@ export class FileItem {
5051
this.uploader._onErrorItem(this, '', 0, {});
5152
}
5253
}
54+
public createFileChunk(chunkSize: number): void{
55+
this.fileChunks = new FileChunk(this._file,{byteStepSize:chunkSize});
56+
this._currentChunk = this.fileChunks.currentChunk;
57+
this._totalChunks = this.fileChunks.totalChunks;
58+
}
59+
public getNextChunk():any{
60+
this.fileChunks.prepareNextChunk()
61+
return this.fileChunks.getCurrentRawFileChunk();
62+
}
63+
public setIsUploading(val:boolean){
64+
this.isUploading = val;
65+
if(this.fileChunks){
66+
this.fileChunks.setUploading(val)
67+
}
68+
}
5369

70+
public set fileChunks(val: FileChunk){
71+
this._fileChunks = val;
72+
}
73+
public get fileChunks(): FileChunk{
74+
return this._fileChunks;
75+
}
5476
public cancel(): void {
5577
this.uploader.cancelItem(this);
5678
}

‎src/file-upload/file-uploader.class.ts‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { EventEmitter } from '@angular/core';
22
import { FileLikeObject } from './file-like-object.class';
33
import { FileItem } from './file-item.class';
44
import { FileType } from './file-type.class';
5-
5+
import { FileChunk } from './file-chunk.class';
66
function isFile(value: any): boolean {
77
return (File && value instanceof File);
88
}
@@ -389,9 +389,12 @@ export class FileUploader {
389389
let sendable: FormData;
390390
sendable = new FormData();
391391
this._onBuildItemForm(item, sendable);
392-
let file: any = item._file;
393-
if( start && end ){
394-
file = file.slice(start,end);
392+
let file: any = null;
393+
if(this.options.chunkSize > 0){
394+
395+
file = item.getNextChunk();
396+
}else{
397+
file = item._file;
395398
}
396399
const appendFile = () => sendable.append(item.alias, file, item.file.name);
397400
if (!this.options.parametersBeforeFiles) {
@@ -461,6 +464,8 @@ export class FileUploader {
461464
start = end;
462465
end = start + chunkSize;
463466
}
467+
item.createFileChunk(this.options.chunkSize)
468+
item.setIsUploading(true)
464469
item._onCompleteChunkCallnext();
465470
this._render();
466471
return;

0 commit comments

Comments
 (0)
⚡