ais-uploader
Version:
Simple uploader library for Angular 2+
1,345 lines (1,334 loc) • 46 kB
JavaScript
import { last, map } from 'rxjs/operators';
import { __values, __awaiter, __generator, __spread } from 'tslib';
import { Injectable, Pipe, NgModule, ComponentFactoryResolver, Directive, ElementRef, HostListener, Input, Renderer2, ViewContainerRef, defineInjectable, EventEmitter, Component, ViewEncapsulation, Inject, PLATFORM_ID, Output, ViewChild } from '@angular/core';
import { BehaviorSubject, Subscription } from 'rxjs';
import { isPlatformServer, CommonModule } from '@angular/common';
import { HttpClient, HttpEventType, HttpClientModule } from '@angular/common/http';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AisUploaderService = /** @class */ (function () {
function AisUploaderService(http) {
this.http = http;
this._uploadingProgress$ = new BehaviorSubject(0);
}
Object.defineProperty(AisUploaderService.prototype, "uploadingProgress", {
get: /**
* @return {?}
*/
function () {
return this._uploadingProgress$.asObservable();
},
enumerable: true,
configurable: true
});
/**
* @param {?} file
* @param {?} config
* @return {?}
*/
AisUploaderService.prototype.upload = /**
* @param {?} file
* @param {?} config
* @return {?}
*/
function (file, config) {
var _this = this;
if (!file)
return null;
this._uploadingProgress$.next(0);
/** @type {?} */
var formData = new FormData();
formData.append('file', file);
return this.http.post("" + config.apiUrl, formData, {
headers: config.headers,
responseType: config.responseType,
reportProgress: true,
observe: 'events',
}).pipe(map(function (event) { return _this.getEventMessage(event); }), last());
};
/**
* @param {?} files
* @param {?} config
* @return {?}
*/
AisUploaderService.prototype.uploadMultiple = /**
* @param {?} files
* @param {?} config
* @return {?}
*/
function (files, config) {
var _this = this;
var e_1, _a;
if (!files || !files.length)
return null;
/** @type {?} */
var formData = new FormData();
try {
for (var files_1 = __values(files), files_1_1 = files_1.next(); !files_1_1.done; files_1_1 = files_1.next()) {
var file = files_1_1.value;
formData.append('file', file);
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (files_1_1 && !files_1_1.done && (_a = files_1.return)) _a.call(files_1);
}
finally { if (e_1) throw e_1.error; }
}
return this.http.post("" + config.apiUrl, formData, {
headers: config.headers,
responseType: config.responseType,
reportProgress: true,
observe: 'events',
}).pipe(map(function (event) { return _this.getEventMessage(event); }), last());
};
/**
* @param {?} event
* @return {?}
*/
AisUploaderService.prototype.getEventMessage = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (event.type) {
switch (event.type) {
case HttpEventType.UploadProgress:
/** @type {?} */
var percentDone = Math.round(100 * event.loaded / event.total);
this.showProgress(percentDone);
return;
case HttpEventType.Response:
this.resetProgress();
return event.body;
default:
return 0;
}
}
};
/**
* @param {?} persentage
* @return {?}
*/
AisUploaderService.prototype.showProgress = /**
* @param {?} persentage
* @return {?}
*/
function (persentage) {
this._uploadingProgress$.next(persentage);
};
/**
* @return {?}
*/
AisUploaderService.prototype.resetProgress = /**
* @return {?}
*/
function () {
};
AisUploaderService.decorators = [
{ type: Injectable }
];
/** @nocollapse */
AisUploaderService.ctorParameters = function () { return [
{ type: HttpClient }
]; };
return AisUploaderService;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @enum {string} */
var DocumentFileType = {
DOCX: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
DOC: 'application/msword',
PDF: 'application/pdf',
XLSX: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
XLS: 'application/vnd.ms-excel',
PPTX: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
PPT: 'application/vnd.ms-powerpoint',
TXT: 'text/plain',
MP4: 'video/mp4',
AVI: 'video/avi',
MPEG: 'video/mpeg',
FLV: 'video/x-flv',
WEBM: 'video/webm',
OGG: 'video/ogg',
MOV: 'video/quicktime',
MSCSV: 'application/vnd.ms-excel',
CSV: 'text/csv',
JPEG: 'image/jpeg',
JPG: 'image/jpeg',
PNG: 'image/png',
WEBP: 'image/webp',
WBMP: 'image/vnd.wap.wbmp',
SVG: 'image/svg+xml',
TIFF: 'image/tiff',
GIF: 'image/gif',
MP3: 'audio/mpeg',
WAV: 'audio/wav',
XWAV: 'audio/x-wav',
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var UploaderTypesPipe = /** @class */ (function () {
function UploaderTypesPipe() {
this.DocumentFileType = DocumentFileType;
}
/**
* @param {?} value
* @param {?=} isAccept
* @return {?}
*/
UploaderTypesPipe.prototype.transform = /**
* @param {?} value
* @param {?=} isAccept
* @return {?}
*/
function (value, isAccept) {
if (isAccept === void 0) { isAccept = false; }
var e_1, _a;
if (!value) {
return;
}
/** @type {?} */
var keys = [];
try {
for (var value_1 = __values(value), value_1_1 = value_1.next(); !value_1_1.done; value_1_1 = value_1.next()) {
var key = value_1_1.value;
for (var i in this.DocumentFileType) {
if (key === this.DocumentFileType[i]) {
if (keys.includes("." + i.toLowerCase()) || keys.includes(i.toLowerCase())) {
continue;
}
keys.push(isAccept ? "." + i.toLowerCase() : i.toLowerCase());
}
}
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (value_1_1 && !value_1_1.done && (_a = value_1.return)) _a.call(value_1);
}
finally { if (e_1) throw e_1.error; }
}
return keys.join(', ');
};
UploaderTypesPipe.decorators = [
{ type: Injectable, args: [{
providedIn: 'root',
},] },
{ type: Pipe, args: [{
name: 'uploaderTypes',
},] }
];
/** @nocollapse */ UploaderTypesPipe.ngInjectableDef = defineInjectable({ factory: function UploaderTypesPipe_Factory() { return new UploaderTypesPipe(); }, token: UploaderTypesPipe, providedIn: "root" });
return UploaderTypesPipe;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AisUploaderComponent = /** @class */ (function () {
function AisUploaderComponent(platformId, uploderService, uploaderEnum) {
this.uploderService = uploderService;
this.uploaderEnum = uploaderEnum;
this.onChange = new EventEmitter();
this.onProgress = new EventEmitter();
this.onError = new EventEmitter();
this._allowedExtensions = [];
if (isPlatformServer(platformId) || typeof ((/** @type {?} */ (window))).MouseEvent === 'function') {
return;
}
/**
* @param {?} event
* @param {?} params
* @return {?}
*/
function CustomEvent(event, params) {
params = params || { bubbles: false, cancelable: false, detail: undefined };
/** @type {?} */
var evt = document.createEvent('CustomEvent');
evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
return evt;
}
CustomEvent.prototype = ((/** @type {?} */ (window))).Event.prototype;
((/** @type {?} */ (window))).CustomEvent = CustomEvent;
}
/**
* @return {?}
*/
AisUploaderComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
this._generateAllowedExtensions();
};
/**
* @return {?}
*/
AisUploaderComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
if (this._progressSub$) {
this._progressSub$.unsubscribe();
}
if (this._uploaderSub$) {
this._uploaderSub$.unsubscribe();
}
};
Object.defineProperty(AisUploaderComponent.prototype, "fileName", {
// return file name or arr file names if isMultiple: true
get:
// return file name or arr file names if isMultiple: true
/**
* @return {?}
*/
function () {
if (this.config.isMultiple) {
return this.filesNames;
}
if (!this._file) {
return '';
}
return this._file.name;
},
enumerable: true,
configurable: true
});
Object.defineProperty(AisUploaderComponent.prototype, "filesNames", {
// return arr file names if isMultiple: true
get:
// return arr file names if isMultiple: true
/**
* @return {?}
*/
function () {
if (!this._files || !this._files.length) {
return undefined;
}
return this._files.map(function (file) { return file.name; });
},
enumerable: true,
configurable: true
});
Object.defineProperty(AisUploaderComponent.prototype, "tooltipMessage", {
// return info message
get:
// return info message
/**
* @return {?}
*/
function () {
if (!this.config.supportedFormats.length) {
return "Max. size is " + (this.config.maxSize ? this.config.maxSize : 'unlimited') + " Mb";
}
/** @type {?} */
var formats = this.uploaderEnum.transform(this.config.supportedFormats);
return "Supported formats are " + (formats || 'All formats') + ". Max. size is " + (this.config.maxSize ?
this.config.maxSize : 'unlimited') + " Mb";
},
enumerable: true,
configurable: true
});
// open selction window
// open selction window
/**
* @return {?}
*/
AisUploaderComponent.prototype.select =
// open selction window
/**
* @return {?}
*/
function () {
/** @type {?} */
var event;
if (typeof ((/** @type {?} */ (window))).MouseEvent === 'function') {
event = new MouseEvent('click', {});
}
else {
event = new CustomEvent('click');
}
this.fileSelector.nativeElement.dispatchEvent(event);
};
// remove file from files arr
// remove file from files arr
/**
* @param {?} i
* @return {?}
*/
AisUploaderComponent.prototype.delete =
// remove file from files arr
/**
* @param {?} i
* @return {?}
*/
function (i) {
this._files.splice(i, 1);
};
// remove file or all files
// remove file or all files
/**
* @param {?=} emit
* @return {?}
*/
AisUploaderComponent.prototype.clear =
// remove file or all files
/**
* @param {?=} emit
* @return {?}
*/
function (emit) {
if (emit === void 0) { emit = true; }
this._file = undefined;
this._files = undefined;
this.fileSelector.nativeElement.value = '';
if (emit) {
this.onChange.emit('');
}
};
/**
* @param {?} event
* @return {?}
*/
AisUploaderComponent.prototype.loadFile = /**
* @param {?} event
* @return {?}
*/
function (event) {
return __awaiter(this, void 0, void 0, function () {
var e_1, _a, _files, _files_1, _files_1_1, file, isValid, e_1_1, _file, isValid, res, e_2;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
if (!this.config.isMultiple) return [3 /*break*/, 9];
_files = event.target.files;
_b.label = 1;
case 1:
_b.trys.push([1, 6, 7, 8]);
_files_1 = __values(_files), _files_1_1 = _files_1.next();
_b.label = 2;
case 2:
if (!!_files_1_1.done) return [3 /*break*/, 5];
file = _files_1_1.value;
return [4 /*yield*/, this.validate(file)];
case 3:
isValid = _b.sent();
if (!isValid) {
return [2 /*return*/];
}
_b.label = 4;
case 4:
_files_1_1 = _files_1.next();
return [3 /*break*/, 2];
case 5: return [3 /*break*/, 8];
case 6:
e_1_1 = _b.sent();
e_1 = { error: e_1_1 };
return [3 /*break*/, 8];
case 7:
try {
if (_files_1_1 && !_files_1_1.done && (_a = _files_1.return)) _a.call(_files_1);
}
finally { if (e_1) throw e_1.error; }
return [7 /*endfinally*/];
case 8:
this._files = __spread(_files);
return [3 /*break*/, 11];
case 9:
_file = event.target.files[0];
if (!_file) {
return [2 /*return*/];
}
return [4 /*yield*/, this.validate(_file)];
case 10:
isValid = _b.sent();
if (!isValid) {
return [2 /*return*/];
}
this._file = _file;
_b.label = 11;
case 11:
if (!this.config.isAutoupload) return [3 /*break*/, 16];
_b.label = 12;
case 12:
_b.trys.push([12, 14, , 15]);
return [4 /*yield*/, this.upload()];
case 13:
res = _b.sent();
this.onChange.emit(res);
return [3 /*break*/, 15];
case 14:
e_2 = _b.sent();
this.onError.emit(e_2);
return [3 /*break*/, 15];
case 15: return [2 /*return*/];
case 16:
if (!this.config.isPreviewDisabled) {
this._makePreview();
return [2 /*return*/];
}
this.onChange.emit(this._file.name);
return [2 /*return*/];
}
});
});
};
// upload to server
// upload to server
/**
* @return {?}
*/
AisUploaderComponent.prototype.upload =
// upload to server
/**
* @return {?}
*/
function () {
var _this = this;
if (this._progressSub$) {
this._progressSub$.unsubscribe();
}
this._onLoaderSub();
if (!this.config.isMultiple) {
return new Promise(function (resolve) {
_this._uploaderSub$ = _this.uploderService.upload(_this._file, _this.config).subscribe(function (res) {
_this.onProgress.emit(0);
_this.uploadingProgress = 0;
resolve(res);
}, function (err) {
_this.onError.emit('Uploading error');
_this.preventUploading();
resolve(undefined);
});
});
}
else {
return new Promise(function (resolve) {
_this._uploaderSub$ = _this.uploderService.uploadMultiple(_this._files, _this.config).subscribe(function (res) {
_this.onProgress.emit(0);
_this.uploadingProgress = 0;
resolve(res);
}, function (err) {
_this.onError.emit('Uploading error');
_this.preventUploading();
resolve(undefined);
});
});
}
};
// cancel current uploading
// cancel current uploading
/**
* @return {?}
*/
AisUploaderComponent.prototype.preventUploading =
// cancel current uploading
/**
* @return {?}
*/
function () {
if (!this.uploadingProgress) {
return;
}
if (this._progressSub$) {
this._progressSub$.unsubscribe();
}
if (this._uploaderSub$) {
this._uploaderSub$.unsubscribe();
}
this.onProgress.emit(0);
this.uploadingProgress = 0;
this.clear();
};
/**
* @private
* @param {?} file
* @return {?}
*/
AisUploaderComponent.prototype.validate = /**
* @private
* @param {?} file
* @return {?}
*/
function (file) {
return __awaiter(this, void 0, void 0, function () {
var resolution, img, e_3;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!file || !this.config) {
this.throwError('Uploader error');
return [2 /*return*/, false];
}
if (this.config.maxSize &&
file.size / 1024 / 1024 > this.config.maxSize) {
this.throwError("File size should be no more than " + this.config.maxSize + "Mb");
return [2 /*return*/, false];
}
if (this.config.supportedFormats.length && file.type &&
!this.config.supportedFormats.includes(file.type)) {
this.throwError("Unsupported file format");
return [2 /*return*/, false];
}
if (this.config.supportedFormats.length && !file.type &&
!this._validateFormat(file.name)) {
this.throwError("Unsupported file format");
return [2 /*return*/, false];
}
if (!this.config.imageResolution) return [3 /*break*/, 5];
resolution = this.config.imageResolution.split('x');
img = void 0;
if (!resolution || !resolution.length || resolution.length !== 2) {
this.throwError("Unsupported resolution format");
return [2 /*return*/, false];
}
resolution = resolution.map(function (r) { return Math.ceil(Number(r)); }).filter(function (n) { return !!n; });
if (!resolution || !resolution.length || resolution.length !== 2) {
this.throwError("Unsupported resolution format");
return [2 /*return*/, false];
}
_a.label = 1;
case 1:
_a.trys.push([1, 3, , 4]);
return [4 /*yield*/, this._addImageProcess(file)];
case 2:
img = _a.sent();
return [3 /*break*/, 4];
case 3:
e_3 = _a.sent();
console.warn('Resolution property allows only for Images - Error Skipped');
return [2 /*return*/, true];
case 4:
if (img.width !== resolution[0] || img.height !== resolution[1]) {
this.throwError("Unsupported resolution format! Correct resolution is " + this.config.imageResolution);
return [2 /*return*/, false];
}
_a.label = 5;
case 5: return [2 /*return*/, true];
}
});
});
};
/**
* @private
* @param {?} file
* @return {?}
*/
AisUploaderComponent.prototype._addImageProcess = /**
* @private
* @param {?} file
* @return {?}
*/
function (file) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
return [2 /*return*/, new Promise(function (resolve, reject) {
// @ts-ignore
/** @type {?} */
var _URL = window.URL || window.webkitURL;
/** @type {?} */
var img = new Image();
/** @type {?} */
var objectUrl = _URL.createObjectURL(file);
img.onload = function () {
_URL.revokeObjectURL(objectUrl);
return resolve({ height: img.height, width: img.width });
};
img.onerror = reject;
img.src = objectUrl;
})];
});
});
};
/**
* @private
* @return {?}
*/
AisUploaderComponent.prototype._onLoaderSub = /**
* @private
* @return {?}
*/
function () {
var _this = this;
this._progressSub$ = this.uploderService.uploadingProgress
.subscribe(function (progress) {
_this.onProgress.emit(progress);
_this.uploadingProgress = progress;
});
};
/**
* @private
* @return {?}
*/
AisUploaderComponent.prototype._makePreview = /**
* @private
* @return {?}
*/
function () {
var _this = this;
if (!this.config.isMultiple) {
/** @type {?} */
var reader = new FileReader();
reader.onload = function (event) {
_this.onChange.emit(event.target.result);
};
reader.readAsDataURL(this._file);
}
else {
/** @type {?} */
var dataArr_1 = [];
var _loop_1 = function (i) {
/** @type {?} */
var reader = new FileReader();
reader.onload = function (event) {
dataArr_1[i] = (event.target.result);
};
reader.readAsDataURL(this_1._files[i]);
if (i == this_1._files.length - 1) {
this_1.onChange.emit(dataArr_1);
}
};
var this_1 = this;
for (var i = 0; i < this._files.length; i++) {
_loop_1(i);
}
}
};
/**
* @private
* @param {?} name
* @return {?}
*/
AisUploaderComponent.prototype._validateFormat = /**
* @private
* @param {?} name
* @return {?}
*/
function (name) {
if (!this.config.supportedFormats.length) {
return true;
}
/** @type {?} */
var extension = name.split('.').pop().toLowerCase();
return this._allowedExtensions.some(function (s) { return s === extension; });
};
/**
* @private
* @param {?} message
* @return {?}
*/
AisUploaderComponent.prototype.throwError = /**
* @private
* @param {?} message
* @return {?}
*/
function (message) {
this.onError.emit(message);
this.fileSelector.nativeElement.value = '';
};
// tslint:disable-next-line:cyclomatic-complexity
// tslint:disable-next-line:cyclomatic-complexity
/**
* @private
* @return {?}
*/
AisUploaderComponent.prototype._generateAllowedExtensions =
// tslint:disable-next-line:cyclomatic-complexity
/**
* @private
* @return {?}
*/
function () {
var e_4, _a;
if (!this.config || !this.config.supportedFormats) {
return;
}
try {
for (var _b = __values(this.config.supportedFormats), _c = _b.next(); !_c.done; _c = _b.next()) {
var format = _c.value;
switch (format) {
case DocumentFileType.DOC:
this._allowedExtensions.push('doc');
break;
case DocumentFileType.DOCX:
this._allowedExtensions.push('docx');
break;
case DocumentFileType.XLSX:
this._allowedExtensions.push('xlsx');
break;
case DocumentFileType.XLS:
this._allowedExtensions.push('xls');
break;
case DocumentFileType.PDF:
this._allowedExtensions.push('pdf');
break;
case DocumentFileType.TXT:
this._allowedExtensions.push('txt');
break;
case DocumentFileType.PPTX:
this._allowedExtensions.push('pptx');
break;
case DocumentFileType.PPT:
this._allowedExtensions.push('ppt');
break;
case DocumentFileType.AVI:
this._allowedExtensions.push('avi');
break;
case DocumentFileType.FLV:
this._allowedExtensions.push('flv');
break;
case DocumentFileType.MP4:
this._allowedExtensions.push('mp4');
break;
case DocumentFileType.MPEG:
this._allowedExtensions.push('mpeg');
break;
case DocumentFileType.OGG:
this._allowedExtensions.push('ogg');
break;
case DocumentFileType.WEBM:
this._allowedExtensions.push('webm');
break;
case DocumentFileType.JPEG:
this._allowedExtensions.push('jpeg');
break;
case DocumentFileType.JPG:
this._allowedExtensions.push('jpg');
break;
case DocumentFileType.PNG:
this._allowedExtensions.push('png');
break;
case DocumentFileType.TIFF:
this._allowedExtensions.push('tiff');
break;
case DocumentFileType.WBMP:
this._allowedExtensions.push('wbmp');
break;
case DocumentFileType.WEBP:
this._allowedExtensions.push('webp');
break;
case DocumentFileType.SVG:
this._allowedExtensions.push('svg');
break;
case DocumentFileType.GIF:
this._allowedExtensions.push('gif');
break;
case DocumentFileType.CSV:
this._allowedExtensions.push('csv');
break;
case DocumentFileType.MSCSV:
this._allowedExtensions.push('csv');
break;
case DocumentFileType.MOV:
this._allowedExtensions.push('mov');
break;
case DocumentFileType.MP3:
this._allowedExtensions.push('mp3');
break;
case DocumentFileType.WAV:
this._allowedExtensions.push('wav');
break;
case DocumentFileType.XWAV:
this._allowedExtensions.push('wav');
break;
default:
break;
}
}
}
catch (e_4_1) { e_4 = { error: e_4_1 }; }
finally {
try {
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
}
finally { if (e_4) throw e_4.error; }
}
};
AisUploaderComponent.decorators = [
{ type: Component, args: [{
selector: 'ais-uploader',
template: "<input id=\"uploader_lib\" #fileSelector type=\"file\" [accept]=\"config?.supportedFormats | uploaderTypes:true\"\r\n (change)=\"loadFile($event)\">\r\n",
encapsulation: ViewEncapsulation.None,
styles: ["#uploader_lib{display:none}@keyframes blink{0%,100%{box-shadow:0 2px 2px rgba(0,0,0,.24),0 0 2px rgba(0,0,0,.12)}50%{box-shadow:none}}@-webkit-keyframes blink{0%,100%{box-shadow:0 2px 2px rgba(0,0,0,.24),0 0 2px rgba(0,0,0,.12)}50%{box-shadow:0 0 0}}.blink{-webkit-animation:3s linear infinite blink;animation:3s linear infinite blink}"]
}] }
];
/** @nocollapse */
AisUploaderComponent.ctorParameters = function () { return [
{ type: String, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },
{ type: AisUploaderService },
{ type: UploaderTypesPipe }
]; };
AisUploaderComponent.propDecorators = {
onChange: [{ type: Output }],
onProgress: [{ type: Output }],
onError: [{ type: Output }],
fileSelector: [{ type: ViewChild, args: ['fileSelector',] }]
};
return AisUploaderComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var UploaderConfig = /** @class */ (function () {
function UploaderConfig(apiUrl, formats, isMultiple, isDropAllowed, maxSize, isAutoupload, isPreviewDisabled) {
if (formats === void 0) { formats = []; }
if (isMultiple === void 0) { isMultiple = false; }
if (isDropAllowed === void 0) { isDropAllowed = false; }
if (maxSize === void 0) { maxSize = 0; }
if (isAutoupload === void 0) { isAutoupload = false; }
if (isPreviewDisabled === void 0) { isPreviewDisabled = false; }
this.apiUrl = apiUrl;
this.supportedFormats = formats;
this.isPreviewDisabled = isPreviewDisabled;
this.maxSize = maxSize;
this.isAutoupload = isAutoupload;
this.isMultiple = isMultiple;
this.isDropAllowed = isDropAllowed;
}
return UploaderConfig;
}());
var UploaderResponseType;
(function (UploaderResponseType) {
UploaderResponseType.JSON = (/** @type {?} */ ('json'));
UploaderResponseType.BUFFER = (/** @type {?} */ ('arraybuffer'));
UploaderResponseType.BLOB = (/** @type {?} */ ('blob'));
UploaderResponseType.TEXT = (/** @type {?} */ ('text'));
})(UploaderResponseType || (UploaderResponseType = {}));
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var UploaderDirective = /** @class */ (function () {
function UploaderDirective(factory, ref, viewContainerRef, renderer) {
this.factory = factory;
this.ref = ref;
this.viewContainerRef = viewContainerRef;
this.renderer = renderer;
this.onChange = new EventEmitter();
this.onProgress = new EventEmitter();
this.onError = new EventEmitter();
this._sub$ = new Subscription();
}
Object.defineProperty(UploaderDirective.prototype, "config", {
get: /**
* @return {?}
*/
function () {
return this._config;
},
set: /**
* @param {?} config
* @return {?}
*/
function (config) {
if (config === this._config) {
return;
}
this._config = config;
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
UploaderDirective.prototype.ngOnInit = /**
* @return {?}
*/
function () {
if (!this.config.apiUrl ||
!this.config.supportedFormats) {
this.onError.emit('Incorrect config!');
return;
}
this._setBtnContainer();
};
/**
* @return {?}
*/
UploaderDirective.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.viewContainerRef.clear();
if (this._clickFn) {
this._clickFn();
}
};
Object.defineProperty(UploaderDirective.prototype, "instance", {
// uploader instance
get:
// uploader instance
/**
* @return {?}
*/
function () {
if (!this._btnContainer) {
return;
}
return this._btnContainer.instance;
},
enumerable: true,
configurable: true
});
Object.defineProperty(UploaderDirective.prototype, "fileName", {
// selected file name
get:
// selected file name
/**
* @return {?}
*/
function () {
if (!this.instance) {
return;
}
return this.instance.fileName;
},
enumerable: true,
configurable: true
});
Object.defineProperty(UploaderDirective.prototype, "tooltipMessage", {
// info message
get:
// info message
/**
* @return {?}
*/
function () {
if (!this.instance) {
return;
}
return this.instance.tooltipMessage;
},
enumerable: true,
configurable: true
});
Object.defineProperty(UploaderDirective.prototype, "progress", {
// get progress
get:
// get progress
/**
* @return {?}
*/
function () {
if (!this.instance) {
return;
}
return this.instance.uploadingProgress;
},
enumerable: true,
configurable: true
});
// delete file from uploader
// delete file from uploader
/**
* @param {?} index
* @return {?}
*/
UploaderDirective.prototype.delete =
// delete file from uploader
/**
* @param {?} index
* @return {?}
*/
function (index) {
if (!this.instance) {
return;
}
this.instance.delete(index);
};
// remove file from uploader
// remove file from uploader
/**
* @param {?=} emit
* @return {?}
*/
UploaderDirective.prototype.clear =
// remove file from uploader
/**
* @param {?=} emit
* @return {?}
*/
function (emit) {
if (emit === void 0) { emit = true; }
if (!this.instance) {
return;
}
this.instance.clear(emit);
};
// cancel uploading
// cancel uploading
/**
* @return {?}
*/
UploaderDirective.prototype.preventUploading =
// cancel uploading
/**
* @return {?}
*/
function () {
if (!this.instance) {
return;
}
this.instance.preventUploading();
};
// start uploading
// start uploading
/**
* @return {?}
*/
UploaderDirective.prototype.upload =
// start uploading
/**
* @return {?}
*/
function () {
if (!this.instance) {
return;
}
return this.instance.upload();
};
// DROP
// DROP
/**
* @param {?} event
* @return {?}
*/
UploaderDirective.prototype.onDragOver =
// DROP
/**
* @param {?} event
* @return {?}
*/
function (event) {
/** @type {?} */
var transfer = this._getTransfer(event);
if (!this._haveFiles(transfer.types)) {
return;
}
transfer.dropEffect = 'copy';
this._preventAndStop(event);
};
/**
* @param {?} event
* @return {?}
*/
UploaderDirective.prototype.onDragLeave = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (((/** @type {?} */ (this))).element) {
if (event.currentTarget === ((/** @type {?} */ (this))).element[0]) {
return;
}
}
this._preventAndStop(event);
};
/**
* @param {?} event
* @return {?}
*/
UploaderDirective.prototype.onDrop = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (!this.config.isDropAllowed) {
return;
}
/** @type {?} */
var transfer = this._getTransfer(event);
if (!transfer) {
return;
}
this._preventAndStop(event);
this.instance.loadFile({ target: { files: transfer.files } });
};
/**
* @protected
* @param {?} event
* @return {?}
*/
UploaderDirective.prototype._getTransfer = /**
* @protected
* @param {?} event
* @return {?}
*/
function (event) {
return event.dataTransfer ? event.dataTransfer : event.originalEvent.dataTransfer; // jQuery fix;
};
/**
* @protected
* @param {?} event
* @return {?}
*/
UploaderDirective.prototype._preventAndStop = /**
* @protected
* @param {?} event
* @return {?}
*/
function (event) {
event.preventDefault();
event.stopPropagation();
};
/**
* @protected
* @param {?} types
* @return {?}
*/
UploaderDirective.prototype._haveFiles = /**
* @protected
* @param {?} types
* @return {?}
*/
function (types) {
if (!types) {
return false;
}
if (types.indexOf) {
return types.indexOf('Files') !== -1;
}
else if (types.contains) {
return types.contains('Files');
}
else {
return false;
}
};
// DROP END
// DROP END
/**
* @private
* @return {?}
*/
UploaderDirective.prototype._setBtnContainer =
// DROP END
/**
* @private
* @return {?}
*/
function () {
var _this = this;
/** @type {?} */
var componentFactory = this.factory.resolveComponentFactory(AisUploaderComponent);
this._btnContainer = this.viewContainerRef.createComponent(componentFactory);
this._btnContainer.instance.config = this.config;
this._clickFn = this.renderer.listen(this.ref.nativeElement, 'click', function (e) { return _this._handleClick(e); });
this._sub$.add(this._btnContainer.instance.onChange.subscribe(function (data) { return _this.onChange.emit(data); }));
this._sub$.add(this._btnContainer.instance.onError.subscribe(function (err) { return _this.onError.emit(err); }));
this._sub$.add(this._btnContainer.instance.onProgress.subscribe(function (progress) { return _this.onProgress.emit(progress); }));
};
/**
* @private
* @param {?} event
* @return {?}
*/
UploaderDirective.prototype._handleClick = /**
* @private
* @param {?} event
* @return {?}
*/
function (event) {
/** @type {?} */
var attributes = Object.values(event.target.attributes).map(function (el) { return el['name']; });
if (!!attributes.find(function (attr) { return attr == 'clear'; }) &&
this.fileName && !this.instance.uploadingProgress) {
this.clear();
return;
}
if (!!attributes.find(function (attr) { return attr == 'stop'; }) &&
this.fileName && this.instance.uploadingProgress) {
this.preventUploading();
return;
}
this._btnContainer.instance.select();
};
UploaderDirective.decorators = [
{ type: Directive, args: [{
selector: '[uploader]',
exportAs: 'uploader',
},] }
];
/** @nocollapse */
UploaderDirective.ctorParameters = function () { return [
{ type: ComponentFactoryResolver },
{ type: ElementRef },
{ type: ViewContainerRef },
{ type: Renderer2 }
]; };
UploaderDirective.propDecorators = {
config: [{ type: Input, args: ['uploader',] }],
onChange: [{ type: Output }],
onProgress: [{ type: Output }],
onError: [{ type: Output }],
onDragOver: [{ type: HostListener, args: ['dragover', ['$event'],] }],
onDragLeave: [{ type: HostListener, args: ['dragleave', ['$event'],] }],
onDrop: [{ type: HostListener, args: ['drop', ['$event'],] }]
};
return UploaderDirective;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AisUploaderModule = /** @class */ (function () {
function AisUploaderModule() {
}
/**
* @return {?}
*/
AisUploaderModule.forRoot = /**
* @return {?}
*/
function () {
return {
ngModule: AisUploaderModule,
providers: [],
};
};
AisUploaderModule.decorators = [
{ type: NgModule, args: [{
declarations: [
AisUploaderComponent,
UploaderDirective,
UploaderTypesPipe,
],
imports: [
CommonModule,
HttpClientModule,
],
exports: [
AisUploaderComponent,
UploaderDirective,
],
providers: [
AisUploaderService,
],
entryComponents: [
AisUploaderComponent,
],
},] }
];
return AisUploaderModule;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { AisUploaderService, AisUploaderComponent, AisUploaderModule, UploaderConfig, UploaderResponseType, DocumentFileType, UploaderDirective, UploaderTypesPipe as ɵa };
//# sourceMappingURL=ais-uploader.js.map