ng2-file-size
Version:
Angular input file size directive
243 lines (242 loc) • 7.69 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var forms_1 = require("@angular/forms");
var file_size_restrictions_interface_1 = require("./file-size-restrictions.interface");
var Ng2FileSizeDirective = (function () {
/**
*
* @param {ElementRef} element
* @return {void}
* @public
*/
function Ng2FileSizeDirective(element) {
/**
* @type {string}
* @public
*/
this.fileSizeErrorMsg = 'File size is invalid';
/**
* @type {boolean}
* @private
*/
this._multiple = false;
/**
*
* @type {{}}
* @private
*/
this._oldValues = {
min: 0,
max: 0
};
this._element = element;
}
Object.defineProperty(Ng2FileSizeDirective.prototype, "multiple", {
/**
* @return {boolean}
*/
get: function () {
return this._multiple;
},
/**
* @type {boolean}
* @private
*/
set: function (value) {
this._multiple = value === '' || !!value;
},
enumerable: true,
configurable: true
});
;
/**
*
* @return {void}
* @public
*/
Ng2FileSizeDirective.prototype.ngOnInit = function () {
this._validateElement();
};
/**
*
* @return {void}
* @param {SimpleChanges} changes
*/
Ng2FileSizeDirective.prototype.ngOnChanges = function (changes) {
// error message has been changed
if (changes.fileSizeErrorMsg && !changes.fileSizeErrorMsg.firstChange) {
this._setValidity(this._getInputValue(this._element.nativeElement));
}
};
/**
*
* @public
* @returns {void}
*/
Ng2FileSizeDirective.prototype.ngDoCheck = function () {
if (this._control && this.ng2FileSize) {
var changeDetected = false;
if (file_size_restrictions_interface_1.isMinFileSizeRestrictions(this.ng2FileSize) && file_size_restrictions_interface_1.isMinFileSizeRestrictions(this._oldValues)
&&
this.ng2FileSize.min !== this._oldValues.min) {
changeDetected = true;
this._oldValues.min = this.ng2FileSize.min;
}
if (file_size_restrictions_interface_1.isMaxFileSizeRestrictions(this.ng2FileSize) && file_size_restrictions_interface_1.isMaxFileSizeRestrictions(this._oldValues)
&&
this.ng2FileSize.max !== this._oldValues.max) {
changeDetected = true;
this._oldValues.max = this.ng2FileSize.max;
}
if (changeDetected) {
this._setValidity(this._getInputValue(this._element.nativeElement));
}
}
};
/**
*
* @param {FormControl} control
* @return {ValidationErrors}
* @private
*/
Ng2FileSizeDirective.prototype.validate = function (control) {
if (!this._control) {
this._control = control;
}
if (this._hasError(this._control.value)) {
return {
size: this.fileSizeErrorMsg
};
}
};
/**
*
* @param {EventTarget} eventTarget
* @return {void}
*/
Ng2FileSizeDirective.prototype.onChange = function (eventTarget) {
var value = this._getInputValue(eventTarget);
this._setValidity(value);
};
/**
*
* @param value
* @private
*/
Ng2FileSizeDirective.prototype._setValidity = function (value) {
var errors = Object.assign({}, this._control.errors);
if (this._hasError(value)) {
errors.size = this.fileSizeErrorMsg;
}
else {
if (this._control.hasError('size')) {
delete errors.size;
}
}
this._control.setErrors(Object.keys(errors).length ? errors : null);
};
/**
*
* @param {File|FileList|undefined} value
* @return {boolean}
* @private
*/
Ng2FileSizeDirective.prototype._hasError = function (value) {
return this.ng2FileSize && !this._hasValidSize(value);
};
/**
*
* @param {File|FileList} value
* @return {boolean}
* @private
*/
Ng2FileSizeDirective.prototype._hasValidSize = function (value) {
var valid = true;
if (value) {
if (this.multiple && !!value.length) {
value = value;
// tslint:disable-next-line
for (var i = 0, length_1 = value.length; i < length_1; i++) {
var file = value.item(i);
if (!this._validateSize(file)) {
valid = false;
break;
}
}
}
else {
valid = this._validateSize(value);
}
}
return valid;
};
;
/**
*
* @param value
* @returns {boolean}
* @private
*/
Ng2FileSizeDirective.prototype._validateSize = function (value) {
var valid = true;
if (value) {
var isMin = file_size_restrictions_interface_1.isMinFileSizeRestrictions(this.ng2FileSize) && this.ng2FileSize.min ?
value.size >= this.ng2FileSize.min : true;
var isMax = file_size_restrictions_interface_1.isMaxFileSizeRestrictions(this.ng2FileSize) && this.ng2FileSize.max ?
value.size <= this.ng2FileSize.max : true;
valid = isMin && isMax;
}
return valid;
};
/**
*
* @param {FileInputEventTarget} eventTarget
* @return {File|FileList|undefined}
* @private
*/
Ng2FileSizeDirective.prototype._getInputValue = function (eventTarget) {
return this.multiple ? eventTarget.files : eventTarget.files.item(0);
};
/**
*
* @throws {Error}
* @private
*/
Ng2FileSizeDirective.prototype._validateElement = function () {
var elemType = this._element.nativeElement.tagName;
var inputType = this._element.nativeElement.getAttribute('type');
if (elemType !== 'INPUT') {
throw new Error("Ng2FileSizeDirective: DOM element must be input, not " + elemType);
}
if (inputType !== 'file') {
throw new Error("Ng2FileSizeDirective: input must be type of \"file\", not \"" + inputType + "\"");
}
};
;
Ng2FileSizeDirective.decorators = [
{ type: core_1.Directive, args: [{
selector: '[ng2FileSize][formControlName],[ng2FileSize][formControl],[ng2FileSize][ngModel]',
exportAs: 'ng2FileSizeDirective',
providers: [
{
provide: forms_1.NG_VALIDATORS,
useExisting: Ng2FileSizeDirective,
multi: true
}
]
},] },
];
/** @nocollapse */
Ng2FileSizeDirective.ctorParameters = function () { return [
{ type: core_1.ElementRef, },
]; };
Ng2FileSizeDirective.propDecorators = {
'ng2FileSize': [{ type: core_1.Input },],
'fileSizeErrorMsg': [{ type: core_1.Input },],
'multiple': [{ type: core_1.Input },],
'onChange': [{ type: core_1.HostListener, args: ['change', ['$event.target'],] },],
};
return Ng2FileSizeDirective;
}());
exports.Ng2FileSizeDirective = Ng2FileSizeDirective;