fctrlx-angular-file-reader
Version:
Angular library that helps convert file (from input[type=file]) to base64/arrayBuffer/text using FileReader API.
175 lines • 12.7 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export class Base {
/**
* @param {?} name
* @param {?} element
*/
constructor(name, element) {
this.TYPE_FILE = 'file';
this.converted = [];
this.currentIndex = 0;
this.directiveName = name;
this.element = element;
}
/**
* @return {?}
*/
ngOnInit() {
if (this.type === this.TYPE_FILE && this.isSupported) {
this.element.nativeElement.addEventListener('change', this.filesChanged.bind(this), false);
}
else {
/** @type {?} */
let 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 {?}
*/
filesChanged(event, readerHandleFn, saveKey) {
/** @type {?} */
const files = ((/** @type {?} */ (event.target))).files;
this.converted = [];
this.currentIndex = 0;
Object.keys(files).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
/** @type {?} */
const reader = new FileReader();
const { name, size, type } = files[key];
reader.onloadend = (/**
* @param {?} file
* @return {?}
*/
(file) => {
this.store(file, saveKey);
});
reader.onerror = (/**
* @param {?} event
* @return {?}
*/
(event) => {
this.handleError(event);
});
reader.onprogress = (/**
* @param {?} event
* @return {?}
*/
(event) => {
this.handleProgress(event);
});
reader.onabort = (/**
* @return {?}
*/
() => this.handleAbort());
this.converted.push({ name, size, type });
reader[readerHandleFn](files[key]);
}));
this.filesChange.next(this.isMultiple ? this.converted : this.converted[0]);
}
/**
* @param {?} event
* @return {?}
*/
handleError(event) {
this.onError.next(event.target.error.message || 'Something went wrong');
}
/**
* @param {?} event
* @return {?}
*/
handleProgress(event) {
if (event.lengthComputable) {
this.onProgress.next(Math.round((event.loaded / event.total) * 100));
}
}
/**
* @return {?}
*/
handleAbort() {
this.onAbort.next('read cancelled');
}
/**
* @param {?} file
* @param {?} key
* @return {?}
*/
store(file, key) {
this.converted[this.currentIndex][key] = file.target.result;
this.currentIndex = this.currentIndex + 1;
}
/**
* @return {?}
*/
ngOnDestroy() {
this.element.nativeElement.removeEventListener('change', this.filesChanged.bind(this), false);
}
/**
* @return {?}
*/
get isSupported() {
return !!(((/** @type {?} */ (window))).File && ((/** @type {?} */ (window))).FileReader &&
((/** @type {?} */ (window))).FileList && window.Blob);
}
/**
* @return {?}
*/
get isMultiple() {
return !(typeof this.multiple === 'undefined');
}
}
if (false) {
/** @type {?} */
Base.prototype.type;
/** @type {?} */
Base.prototype.multiple;
/** @type {?} */
Base.prototype.filesChange;
/** @type {?} */
Base.prototype.onProgress;
/** @type {?} */
Base.prototype.onError;
/** @type {?} */
Base.prototype.onAbort;
/**
* @type {?}
* @private
*/
Base.prototype.TYPE_FILE;
/**
* @type {?}
* @private
*/
Base.prototype.directiveName;
/**
* @type {?}
* @private
*/
Base.prototype.element;
/**
* @type {?}
* @private
*/
Base.prototype.converted;
/**
* @type {?}
* @private
*/
Base.prototype.currentIndex;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFzZS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL2ZjdHJseC1hbmd1bGFyLWZpbGUtcmVhZGVyLyIsInNvdXJjZXMiOlsibGliL2RpcmVjdGl2ZXMvQmFzZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBUUEsTUFBTSxPQUFPLElBQUk7Ozs7O0lBZWYsWUFBWSxJQUFZLEVBQUUsT0FBbUI7UUFQNUIsY0FBUyxHQUFXLE1BQU0sQ0FBQztRQUlwQyxjQUFTLEdBQWlCLEVBQUUsQ0FBQztRQUM3QixpQkFBWSxHQUFXLENBQUMsQ0FBQztRQUcvQixJQUFJLENBQUMsYUFBYSxHQUFHLElBQUksQ0FBQztRQUMxQixJQUFJLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQztJQUN6QixDQUFDOzs7O0lBRUQsUUFBUTtRQUNOLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxJQUFJLENBQUMsU0FBUyxJQUFJLElBQUksQ0FBQyxXQUFXLEVBQUU7WUFDcEQsSUFBSSxDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsZ0JBQWdCLENBQUMsUUFBUSxFQUFFLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxFQUFFLEtBQUssQ0FBQyxDQUFDO1NBQzVGO2FBQU07O2dCQUNELEdBQUcsR0FBVyxJQUFJLENBQUMsYUFBYTtZQUVwQyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRTtnQkFDckIsR0FBRyxJQUFJLG9DQUFvQyxDQUFDO2FBQzdDO2lCQUFNO2dCQUNMLEdBQUcsSUFBSSxxQ0FBcUMsQ0FBQzthQUM5QztZQUVELE9BQU8sQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLENBQUM7U0FDL0M7SUFDSCxDQUFDOzs7Ozs7O0lBRUQsWUFBWSxDQUFDLEtBQVksRUFBRSxjQUFzQixFQUFFLE9BQWU7O2NBQzFELEtBQUssR0FBRyxDQUFDLG1CQUFrQixLQUFLLENBQUMsTUFBTSxFQUFBLENBQUMsQ0FB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SUFBSSxDQUFDLG1CQUFBLE1BQU0sRUFBTyxDQUFDLENBQUMsVUFBVTtZQUNsRCxDQUFDLG1CQUFBLE1BQU0sRUFBTyxDQUFDLENBQUMsUUFBUSxJQUFJLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUNyRCxDQUFDOzs7O0lBRUQsSUFBSSxVQUFVO1FBQ1osT0FBTyxDQUFDLENBQUMsT0FBTyxJQUFJLENBQUMsUUFBUSxLQUFLLFdBQVcsQ0FBQyxDQUFDO0lBQ2pELENBQUM7Q0FDRjs7O0lBbEdDLG9CQUFvQjs7SUFDcEIsd0JBQXFEOztJQUNyRCwyQkFBc0M7O0lBQ3RDLDBCQUFxQzs7SUFDckMsdUJBQWtDOztJQUNsQyx1QkFBa0M7Ozs7O0lBRWxDLHlCQUE0Qzs7Ozs7SUFDNUMsNkJBQXVDOzs7OztJQUV2Qyx1QkFBNEI7Ozs7O0lBQzVCLHlCQUFxQzs7Ozs7SUFDckMsNEJBQWlDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgRWxlbWVudFJlZixcbiAgRXZlbnRFbWl0dGVyLFxuICBPbkRlc3Ryb3ksXG4gIE9uSW5pdCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb252ZXJ0ZWQgfSBmcm9tICcuLi9tb2RlbHMvY29udmVydGVkJztcblxuZXhwb3J0IGNsYXNzIEJhc2UgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gIHB1YmxpYyB0eXBlOiBzdHJpbmc7XG4gIHB1YmxpYyBtdWx0aXBsZTogdW5kZWZpbmVkIHwgbnVsbCB8IHN0cmluZyB8IGJvb2xlYW47XG4gIHB1YmxpYyBmaWxlc0NoYW5nZTogRXZlbnRFbWl0dGVyPGFueT47XG4gIHB1YmxpYyBvblByb2dyZXNzOiBFdmVudEVtaXR0ZXI8YW55PjtcbiAgcHVibGljIG9uRXJyb3I6IEV2ZW50RW1pdHRlcjxhbnk+O1xuICBwdWJsaWMgb25BYm9ydDogRXZlbnRFbWl0dGVyPGFueT47XG5cbiAgcHJpdmF0ZSByZWFkb25seSBUWVBFX0ZJTEU6IHN0cmluZyA9ICdmaWxlJztcbiAgcHJpdmF0ZSByZWFkb25seSBkaXJlY3RpdmVOYW1lOiBzdHJpbmc7XG5cbiAgcHJpdmF0ZSBlbGVtZW50OiBFbGVtZW50UmVmO1xuICBwcml2YXRlIGNvbnZlcnRlZDogQ29udmVydGVkW10gID0gW107XG4gIHByaXZhdGUgY3VycmVudEluZGV4OiBudW1iZXIgPSAwO1xuXG4gIGNvbnN0cnVjdG9yKG5hbWU6IHN0cmluZywgZWxlbWVudDogRWxlbWVudFJlZikge1xuICAgIHRoaXMuZGlyZWN0aXZlTmFtZSA9IG5hbWU7XG4gICAgdGhpcy5lbGVtZW50ID0gZWxlbWVudDtcbiAgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIGlmICh0aGlzLnR5cGUgPT09IHRoaXMuVFlQRV9GSUxFICYmIHRoaXMuaXNTdXBwb3J0ZWQpIHtcbiAgICAgIHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50LmFkZEV2ZW50TGlzdGVuZXIoJ2NoYW5nZScsIHRoaXMuZmlsZXNDaGFuZ2VkLmJpbmQodGhpcyksIGZhbHNlKTtcbiAgICB9IGVsc2Uge1xuICAgICAgbGV0IG1zZzogc3RyaW5nID0gdGhpcy5kaXJlY3RpdmVOYW1lO1xuXG4gICAgICBpZiAoIXRoaXMuaXNTdXBwb3J0ZWQpIHtcbiAgICAgICAgbXNnICs9ICcgaXMgbm90IHN1cHBvcnRlZCBieSB5b3VyIGJyb3dzZXIuJztcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIG1zZyArPSAnIHdvcmtpbmcgb25seSB3aXRoIGlucHV0IHR5cGU9ZmlsZS4nO1xuICAgICAgfVxuXG4gICAgICBjb25zb2xlLndhcm4obXNnLCB0aGlzLmVsZW1lbnQubmF0aXZlRWxlbWVudCk7XG4gICAgfVxuICB9XG5cbiAgZmlsZXNDaGFuZ2VkKGV2ZW50OiBFdmVudCwgcmVhZGVySGFuZGxlRm46IHN0cmluZywgc2F2ZUtleTogc3RyaW5nKTogdm9pZCB7XG4gICAgY29uc3QgZmlsZXMgPSAoPEhUTUxJbnB1dEVsZW1lbnQ+ZXZlbnQudGFyZ2V0KS5maWxlcztcblxuICAgIHRoaXMuY29udmVydGVkID0gW107XG4gICAgdGhpcy5jdXJyZW50SW5kZXggPSAwO1xuXG4gICAgT2JqZWN0LmtleXMoZmlsZXMpLmZvckVhY2goKGtleTogc3RyaW5nKSA9PiB7XG4gICAgICBjb25zdCByZWFkZXIgPSBuZXcgRmlsZVJlYWRlcigpO1xuICAgICAgY29uc3QgeyBuYW1lLCBzaXplLCB0eXBlIH0gPSBmaWxlc1trZXldO1xuXG4gICAgICByZWFkZXIub25sb2FkZW5kID0gKGZpbGUpID0+IHtcbiAgICAgICAgdGhpcy5zdG9yZShmaWxlLCBzYXZlS2V5KTtcbiAgICAgIH07XG5cbiAgICAgIHJlYWRlci5vbmVycm9yID0gKGV2ZW50KSA9PiB7XG4gICAgICAgIHRoaXMuaGFuZGxlRXJyb3IoZXZlbnQpO1xuICAgICAgfTtcblxuICAgICAgcmVhZGVyLm9ucHJvZ3Jlc3MgPSAoZXZlbnQpID0+IHtcbiAgICAgICAgdGhpcy5oYW5kbGVQcm9ncmVzcyhldmVudCk7XG4gICAgICB9O1xuXG4gICAgICByZWFkZXIub25hYm9ydCA9ICgpID0+IHRoaXMuaGFuZGxlQWJvcnQoKTtcblxuICAgICAgdGhpcy5jb252ZXJ0ZWQucHVzaCh7IG5hbWUsIHNpemUsIHR5cGUgfSk7XG5cbiAgICAgIHJlYWRlcltyZWFkZXJIYW5kbGVGbl0oZmlsZXNba2V5XSk7XG4gICAgfSk7XG5cbiAgICB0aGlzLmZpbGVzQ2hhbmdlLm5leHQodGhpcy5pc011bHRpcGxlID8gdGhpcy5jb252ZXJ0ZWQgOiB0aGlzLmNvbnZlcnRlZFswXSk7XG4gIH1cblxuICBoYW5kbGVFcnJvcihldmVudDogYW55KTogdm9pZCB7XG4gICAgdGhpcy5vbkVycm9yLm5leHQoZXZlbnQudGFyZ2V0LmVycm9yLm1lc3NhZ2UgfHwgJ1NvbWV0aGluZyB3ZW50IHdyb25nJyk7XG4gIH1cblxuICBoYW5kbGVQcm9ncmVzcyhldmVudDogYW55KTogdm9pZCB7XG4gICAgaWYgKGV2ZW50Lmxlbmd0aENvbXB1dGFibGUpIHtcbiAgICAgIHRoaXMub25Qcm9ncmVzcy5uZXh0KE1hdGgucm91bmQoKGV2ZW50LmxvYWRlZCAvIGV2ZW50LnRvdGFsKSAqIDEwMCkpO1xuICAgIH1cbiAgfVxuXG4gIGhhbmRsZUFib3J0KCk6IHZvaWQge1xuICAgIHRoaXMub25BYm9ydC5uZXh0KCdyZWFkIGNhbmNlbGxlZCcpO1xuICB9XG5cbiAgc3RvcmUoZmlsZTogeyB0YXJnZXQgfSwga2V5OiBzdHJpbmcpOiB2b2lkIHtcbiAgICB0aGlzLmNvbnZlcnRlZFt0aGlzLmN1cnJlbnRJbmRleF1ba2V5XSA9IGZpbGUudGFyZ2V0LnJlc3VsdDtcbiAgICB0aGlzLmN1cnJlbnRJbmRleCA9IHRoaXMuY3VycmVudEluZGV4ICsgMTtcbiAgfVxuXG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2NoYW5nZScsIHRoaXMuZmlsZXNDaGFuZ2VkLmJpbmQodGhpcyksIGZhbHNlKTtcbiAgfVxuXG4gIGdldCBpc1N1cHBvcnRlZCgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gISEoKHdpbmRvdyBhcyBhbnkpLkZpbGUgJiYgKHdpbmRvdyBhcyBhbnkpLkZpbGVSZWFkZXIgJiZcbiAgICAgICAgICAgICAgKHdpbmRvdyBhcyBhbnkpLkZpbGVMaXN0ICYmIHdpbmRvdy5CbG9iKTtcbiAgfVxuXG4gIGdldCBpc011bHRpcGxlKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiAhKHR5cGVvZiB0aGlzLm11bHRpcGxlID09PSAndW5kZWZpbmVkJyk7XG4gIH1cbn1cbiJdfQ==