fctrlx-angular-file-reader
Version:
Angular library that helps convert file (from input[type=file]) to base64/arrayBuffer/text using FileReader API.
612 lines (595 loc) • 21.8 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs')) :
typeof define === 'function' && define.amd ? define('fctrlx-angular-file-reader', ['exports', '@angular/core', 'rxjs'], factory) :
(global = global || self, factory(global['fctrlx-angular-file-reader'] = {}, global.ng.core, global.rxjs));
}(this, function (exports, core, rxjs) { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */
/* global Reflect, Promise */
var extendStatics = function(d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
function __extends(d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
}
/**
* @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 core.EventEmitter();
_this.onProgress = new core.EventEmitter();
_this.onError = new core.EventEmitter();
_this.onAbort = new core.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: core.Directive, args: [{
selector: '[fileToBase64]',
},] }
];
/** @nocollapse */
FileToBase64.ctorParameters = function () { return [
{ type: core.ElementRef }
]; };
FileToBase64.propDecorators = {
files: [{ type: core.Input }],
type: [{ type: core.Input }],
multiple: [{ type: core.Input }],
filesChange: [{ type: core.Output }],
onProgress: [{ type: core.Output }],
onError: [{ type: core.Output }],
onAbort: [{ type: core.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 core.EventEmitter();
_this.onProgress = new core.EventEmitter();
_this.onError = new core.EventEmitter();
_this.onAbort = new core.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: core.Directive, args: [{
selector: '[fileToText]',
},] }
];
/** @nocollapse */
FileToText.ctorParameters = function () { return [
{ type: core.ElementRef }
]; };
FileToText.propDecorators = {
files: [{ type: core.Input }],
type: [{ type: core.Input }],
multiple: [{ type: core.Input }],
filesChange: [{ type: core.Output }],
onProgress: [{ type: core.Output }],
onError: [{ type: core.Output }],
onAbort: [{ type: core.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 core.EventEmitter();
_this.onProgress = new core.EventEmitter();
_this.onError = new core.EventEmitter();
_this.onAbort = new core.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: core.Directive, args: [{
selector: '[fileToArrBuf]',
},] }
];
/** @nocollapse */
FileToArrayBuffer.ctorParameters = function () { return [
{ type: core.ElementRef }
]; };
FileToArrayBuffer.propDecorators = {
files: [{ type: core.Input }],
type: [{ type: core.Input }],
multiple: [{ type: core.Input }],
filesChange: [{ type: core.Output }],
onProgress: [{ type: core.Output }],
onError: [{ type: core.Output }],
onAbort: [{ type: core.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: core.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 = rxjs.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: core.Injectable, args: [{
providedIn: 'root',
},] }
];
/** @nocollapse */
FileReaderPromiseLikeService.ctorParameters = function () { return []; };
/** @nocollapse */ FileReaderPromiseLikeService.ngInjectableDef = core.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: core.Injectable, args: [{
providedIn: 'root',
},] }
];
/** @nocollapse */
FileReaderObservableLikeService.ctorParameters = function () { return []; };
/** @nocollapse */ FileReaderObservableLikeService.ngInjectableDef = core.defineInjectable({ factory: function FileReaderObservableLikeService_Factory() { return new FileReaderObservableLikeService(); }, token: FileReaderObservableLikeService, providedIn: "root" });
return FileReaderObservableLikeService;
}(Base$1));
exports.FctrlxAngularFileReader = FctrlxAngularFileReader;
exports.FileReaderObservableLikeService = FileReaderObservableLikeService;
exports.FileReaderPromiseLikeService = FileReaderPromiseLikeService;
exports.ɵa = FileToBase64;
exports.ɵb = Base;
exports.ɵc = FileToText;
exports.ɵd = FileToArrayBuffer;
exports.ɵe = Base$1;
Object.defineProperty(exports, '__esModule', { value: true });
}));
//# sourceMappingURL=fctrlx-angular-file-reader.umd.js.map