fctrlx-angular-file-reader
Version:
Angular library that helps convert file (from input[type=file]) to base64/arrayBuffer/text using FileReader API.
580 lines (568 loc) • 17.8 kB
JavaScript
import { EventEmitter, Directive, ElementRef, Input, Output, NgModule, Injectable, defineInjectable } from '@angular/core';
import { __extends } from 'tslib';
import { Observable } from 'rxjs';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var Base = /** @class */ (function () {
function Base(name, element) {
this.TYPE_FILE = 'file';
this.converted = [];
this.currentIndex = 0;
this.directiveName = name;
this.element = element;
}
/**
* @return {?}
*/
Base.prototype.ngOnInit = /**
* @return {?}
*/
function () {
if (this.type === this.TYPE_FILE && this.isSupported) {
this.element.nativeElement.addEventListener('change', this.filesChanged.bind(this), false);
}
else {
/** @type {?} */
var msg = this.directiveName;
if (!this.isSupported) {
msg += ' is not supported by your browser.';
}
else {
msg += ' working only with input type=file.';
}
console.warn(msg, this.element.nativeElement);
}
};
/**
* @param {?} event
* @param {?} readerHandleFn
* @param {?} saveKey
* @return {?}
*/
Base.prototype.filesChanged = /**
* @param {?} event
* @param {?} readerHandleFn
* @param {?} saveKey
* @return {?}
*/
function (event, readerHandleFn, saveKey) {
var _this = this;
/** @type {?} */
var files = ((/** @type {?} */ (event.target))).files;
this.converted = [];
this.currentIndex = 0;
Object.keys(files).forEach((/**
* @param {?} key
* @return {?}
*/
function (key) {
/** @type {?} */
var reader = new FileReader();
var _a = files[key], name = _a.name, size = _a.size, type = _a.type;
reader.onloadend = (/**
* @param {?} file
* @return {?}
*/
function (file) {
_this.store(file, saveKey);
});
reader.onerror = (/**
* @param {?} event
* @return {?}
*/
function (event) {
_this.handleError(event);
});
reader.onprogress = (/**
* @param {?} event
* @return {?}
*/
function (event) {
_this.handleProgress(event);
});
reader.onabort = (/**
* @return {?}
*/
function () { return _this.handleAbort(); });
_this.converted.push({ name: name, size: size, type: type });
reader[readerHandleFn](files[key]);
}));
this.filesChange.next(this.isMultiple ? this.converted : this.converted[0]);
};
/**
* @param {?} event
* @return {?}
*/
Base.prototype.handleError = /**
* @param {?} event
* @return {?}
*/
function (event) {
this.onError.next(event.target.error.message || 'Something went wrong');
};
/**
* @param {?} event
* @return {?}
*/
Base.prototype.handleProgress = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (event.lengthComputable) {
this.onProgress.next(Math.round((event.loaded / event.total) * 100));
}
};
/**
* @return {?}
*/
Base.prototype.handleAbort = /**
* @return {?}
*/
function () {
this.onAbort.next('read cancelled');
};
/**
* @param {?} file
* @param {?} key
* @return {?}
*/
Base.prototype.store = /**
* @param {?} file
* @param {?} key
* @return {?}
*/
function (file, key) {
this.converted[this.currentIndex][key] = file.target.result;
this.currentIndex = this.currentIndex + 1;
};
/**
* @return {?}
*/
Base.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.element.nativeElement.removeEventListener('change', this.filesChanged.bind(this), false);
};
Object.defineProperty(Base.prototype, "isSupported", {
get: /**
* @return {?}
*/
function () {
return !!(((/** @type {?} */ (window))).File && ((/** @type {?} */ (window))).FileReader &&
((/** @type {?} */ (window))).FileList && window.Blob);
},
enumerable: true,
configurable: true
});
Object.defineProperty(Base.prototype, "isMultiple", {
get: /**
* @return {?}
*/
function () {
return !(typeof this.multiple === 'undefined');
},
enumerable: true,
configurable: true
});
return Base;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var FileToBase64 = /** @class */ (function (_super) {
__extends(FileToBase64, _super);
function FileToBase64(element) {
var _this = _super.call(this, FileToBase64.config.name, element) || this;
_this.filesChange = new EventEmitter();
_this.onProgress = new EventEmitter();
_this.onError = new EventEmitter();
_this.onAbort = new EventEmitter();
return _this;
}
/**
* @param {?} event
* @return {?}
*/
FileToBase64.prototype.filesChanged = /**
* @param {?} event
* @return {?}
*/
function (event) {
_super.prototype.filesChanged.call(this, event, FileToBase64.config.method, FileToBase64.config.storeKey);
};
FileToBase64.config = {
name: 'fileToBase64',
method: 'readAsDataURL',
storeKey: 'base64',
};
FileToBase64.decorators = [
{ type: Directive, args: [{
selector: '[fileToBase64]',
},] }
];
/** @nocollapse */
FileToBase64.ctorParameters = function () { return [
{ type: ElementRef }
]; };
FileToBase64.propDecorators = {
files: [{ type: Input }],
type: [{ type: Input }],
multiple: [{ type: Input }],
filesChange: [{ type: Output }],
onProgress: [{ type: Output }],
onError: [{ type: Output }],
onAbort: [{ type: Output }]
};
return FileToBase64;
}(Base));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var FileToText = /** @class */ (function (_super) {
__extends(FileToText, _super);
function FileToText(element) {
var _this = _super.call(this, FileToText.config.name, element) || this;
_this.filesChange = new EventEmitter();
_this.onProgress = new EventEmitter();
_this.onError = new EventEmitter();
_this.onAbort = new EventEmitter();
return _this;
}
/**
* @param {?} event
* @return {?}
*/
FileToText.prototype.filesChanged = /**
* @param {?} event
* @return {?}
*/
function (event) {
_super.prototype.filesChanged.call(this, event, FileToText.config.method, FileToText.config.storeKey);
};
FileToText.config = {
name: 'fileToText',
method: 'readAsText',
storeKey: 'text',
};
FileToText.decorators = [
{ type: Directive, args: [{
selector: '[fileToText]',
},] }
];
/** @nocollapse */
FileToText.ctorParameters = function () { return [
{ type: ElementRef }
]; };
FileToText.propDecorators = {
files: [{ type: Input }],
type: [{ type: Input }],
multiple: [{ type: Input }],
filesChange: [{ type: Output }],
onProgress: [{ type: Output }],
onError: [{ type: Output }],
onAbort: [{ type: Output }]
};
return FileToText;
}(Base));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var FileToArrayBuffer = /** @class */ (function (_super) {
__extends(FileToArrayBuffer, _super);
function FileToArrayBuffer(element) {
var _this = _super.call(this, FileToArrayBuffer.config.name, element) || this;
_this.filesChange = new EventEmitter();
_this.onProgress = new EventEmitter();
_this.onError = new EventEmitter();
_this.onAbort = new EventEmitter();
return _this;
}
/**
* @param {?} event
* @return {?}
*/
FileToArrayBuffer.prototype.filesChanged = /**
* @param {?} event
* @return {?}
*/
function (event) {
_super.prototype.filesChanged.call(this, event, FileToArrayBuffer.config.method, FileToArrayBuffer.config.storeKey);
};
FileToArrayBuffer.config = {
name: 'fileToArrBuf',
method: 'readAsArrayBuffer',
storeKey: 'arrBuf',
};
FileToArrayBuffer.decorators = [
{ type: Directive, args: [{
selector: '[fileToArrBuf]',
},] }
];
/** @nocollapse */
FileToArrayBuffer.ctorParameters = function () { return [
{ type: ElementRef }
]; };
FileToArrayBuffer.propDecorators = {
files: [{ type: Input }],
type: [{ type: Input }],
multiple: [{ type: Input }],
filesChange: [{ type: Output }],
onProgress: [{ type: Output }],
onError: [{ type: Output }],
onAbort: [{ type: Output }]
};
return FileToArrayBuffer;
}(Base));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var FctrlxAngularFileReader = /** @class */ (function () {
function FctrlxAngularFileReader() {
}
FctrlxAngularFileReader.decorators = [
{ type: NgModule, args: [{
imports: [],
declarations: [
FileToBase64,
FileToText,
FileToArrayBuffer,
],
exports: [
FileToBase64,
FileToText,
FileToArrayBuffer,
],
},] }
];
return FctrlxAngularFileReader;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var Base$1 = /** @class */ (function () {
function Base(returnType) {
this.TYPE_PROMISE = 'PROMISE';
this.TYPE_SUBSCRIBER = 'OBSERVABLE';
this.returnType = returnType;
}
/**
* @param {?} file
* @return {?}
*/
Base.prototype.toBase64 = /**
* @param {?} file
* @return {?}
*/
function (file) {
/** @type {?} */
var reader = new FileReader();
reader.readAsDataURL(file);
return this.response(reader);
};
/**
* @param {?} file
* @return {?}
*/
Base.prototype.toText = /**
* @param {?} file
* @return {?}
*/
function (file) {
/** @type {?} */
var reader = new FileReader();
reader.readAsText(file);
return this.response(reader);
};
/**
* @param {?} file
* @return {?}
*/
Base.prototype.toArrBuf = /**
* @param {?} file
* @return {?}
*/
function (file) {
/** @type {?} */
var reader = new FileReader();
reader.readAsArrayBuffer(file);
return this.response(reader);
};
/**
* @param {?} reader
* @return {?}
*/
Base.prototype.response = /**
* @param {?} reader
* @return {?}
*/
function (reader) {
/** @type {?} */
var response;
if (this.returnType === this.TYPE_SUBSCRIBER) {
response = Observable.create((/**
* @param {?} observer
* @return {?}
*/
function (observer) {
reader.onloadend = (/**
* @return {?}
*/
function () {
observer.next((/** @type {?} */ (reader.result)));
observer.complete();
});
reader.onerror = (/**
* @param {?} error
* @return {?}
*/
function (error) {
observer.next((/** @type {?} */ (error)));
observer.complete();
});
}));
}
else if (this.returnType === this.TYPE_PROMISE) {
response = new Promise((/**
* @param {?} resolve
* @param {?} reject
* @return {?}
*/
function (resolve, reject) {
reader.onloadend = (/**
* @return {?}
*/
function () { return resolve((/** @type {?} */ (reader.result))); });
reader.onerror = (/**
* @param {?} error
* @return {?}
*/
function (error) { return reject((/** @type {?} */ (error))); });
}));
}
return response;
};
return Base;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var FileReaderPromiseLikeService = /** @class */ (function (_super) {
__extends(FileReaderPromiseLikeService, _super);
function FileReaderPromiseLikeService() {
return _super.call(this, 'PROMISE') || this;
}
/**
* @param {?} file
* @return {?}
*/
FileReaderPromiseLikeService.prototype.toBase64 = /**
* @param {?} file
* @return {?}
*/
function (file) {
return (/** @type {?} */ (_super.prototype.toBase64.call(this, file)));
};
/**
* @param {?} file
* @return {?}
*/
FileReaderPromiseLikeService.prototype.toText = /**
* @param {?} file
* @return {?}
*/
function (file) {
return (/** @type {?} */ (_super.prototype.toText.call(this, file)));
};
/**
* @param {?} file
* @return {?}
*/
FileReaderPromiseLikeService.prototype.toArrBuf = /**
* @param {?} file
* @return {?}
*/
function (file) {
return (/** @type {?} */ (_super.prototype.toArrBuf.call(this, file)));
};
FileReaderPromiseLikeService.decorators = [
{ type: Injectable, args: [{
providedIn: 'root',
},] }
];
/** @nocollapse */
FileReaderPromiseLikeService.ctorParameters = function () { return []; };
/** @nocollapse */ FileReaderPromiseLikeService.ngInjectableDef = defineInjectable({ factory: function FileReaderPromiseLikeService_Factory() { return new FileReaderPromiseLikeService(); }, token: FileReaderPromiseLikeService, providedIn: "root" });
return FileReaderPromiseLikeService;
}(Base$1));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var FileReaderObservableLikeService = /** @class */ (function (_super) {
__extends(FileReaderObservableLikeService, _super);
function FileReaderObservableLikeService() {
return _super.call(this, 'OBSERVABLE') || this;
}
/**
* @param {?} file
* @return {?}
*/
FileReaderObservableLikeService.prototype.toBase64 = /**
* @param {?} file
* @return {?}
*/
function (file) {
return (/** @type {?} */ (_super.prototype.toBase64.call(this, file)));
};
/**
* @param {?} file
* @return {?}
*/
FileReaderObservableLikeService.prototype.toText = /**
* @param {?} file
* @return {?}
*/
function (file) {
return (/** @type {?} */ (_super.prototype.toText.call(this, file)));
};
/**
* @param {?} file
* @return {?}
*/
FileReaderObservableLikeService.prototype.toArrBuf = /**
* @param {?} file
* @return {?}
*/
function (file) {
return (/** @type {?} */ (_super.prototype.toArrBuf.call(this, file)));
};
FileReaderObservableLikeService.decorators = [
{ type: Injectable, args: [{
providedIn: 'root',
},] }
];
/** @nocollapse */
FileReaderObservableLikeService.ctorParameters = function () { return []; };
/** @nocollapse */ FileReaderObservableLikeService.ngInjectableDef = defineInjectable({ factory: function FileReaderObservableLikeService_Factory() { return new FileReaderObservableLikeService(); }, token: FileReaderObservableLikeService, providedIn: "root" });
return FileReaderObservableLikeService;
}(Base$1));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { FctrlxAngularFileReader, FileReaderObservableLikeService, FileReaderPromiseLikeService, FileToBase64 as ɵa, Base as ɵb, FileToText as ɵc, FileToArrayBuffer as ɵd, Base$1 as ɵe };
//# sourceMappingURL=fctrlx-angular-file-reader.js.map