@uiowa/uiowa-mfk-material
Version:
mfk, uiowa-mfk
726 lines (717 loc) • 25 kB
JavaScript
import { InjectionToken, Injectable, ɵɵdefineInjectable, Component, Input, Output, ViewChildren, EventEmitter, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { DigitOnlyDirective, DigitOnlyModule } from '@uiowa/digit-only';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FlexLayoutModule } from '@angular/flex-layout';
import { __spread, __values } from 'tslib';
import { MatFormFieldModule, MatInputModule } from '@angular/material';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var ConfigToken = new InjectionToken('config');
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Uiowa MFK Type
*
* class type contains 10 required MFK fields and 1 optional BFR field.
* there are also several common methods ready to use.
*/
var /**
* Uiowa MFK Type
*
* class type contains 10 required MFK fields and 1 optional BFR field.
* there are also several common methods ready to use.
*/
Mfk = /** @class */ (function () {
/**
* Uiowa MFK. constructor takes a MFK string.
*
* Non-numeric characters will be stripped out automatically.
*
* Example usages:
* ```typescript
* let m1 = new Mfk();
* const m2 = new Mfk('010-11-1010-00000-00000000-6218-000-00000-00-1111');
* const m3 = new Mfk('0201210120100100000000621900000111123555');
* ```
*/
function Mfk(mfkString) {
if (mfkString === void 0) { mfkString = null; }
this.FUND = '';
this.ORG = '';
this.DEPT = '';
this.SUBDEPT = '';
this.GRANTPGM = '';
this.IACT = '';
this.OACT = '';
this.DACT = '';
this.FN = '';
this.CCTR = '';
this.BRF = '';
if (mfkString) {
this.parseString(mfkString);
}
}
/**
* cast an object to type of MFK
*
* --> plain JSON object doesn't have type at run time.
*/
/**
* cast an object to type of MFK
*
* --> plain JSON object doesn't have type at run time.
* @param {?} obj
* @return {?}
*/
Mfk.cast = /**
* cast an object to type of MFK
*
* --> plain JSON object doesn't have type at run time.
* @param {?} obj
* @return {?}
*/
function (obj) {
/** @type {?} */
var mfk = new Mfk();
Object.keys(obj).forEach((/**
* @param {?} key
* @return {?}
*/
function (key) { return (mfk[key.toUpperCase()] = obj[key]); }));
return mfk;
};
/**
* Compare values of all 10 fields
*
* @param mfk An MFK
*/
/**
* Compare values of all 10 fields
*
* @param {?} mfk An MFK
* @return {?}
*/
Mfk.prototype.equals = /**
* Compare values of all 10 fields
*
* @param {?} mfk An MFK
* @return {?}
*/
function (mfk) {
return (this.FUND === mfk.FUND &&
this.ORG === mfk.ORG &&
this.DEPT === mfk.DEPT &&
this.SUBDEPT === mfk.SUBDEPT &&
this.GRANTPGM === mfk.GRANTPGM &&
this.IACT === mfk.IACT &&
this.DACT === mfk.DACT &&
this.OACT === mfk.OACT &&
this.FN === mfk.FN &&
this.CCTR === mfk.CCTR);
};
/**
* convert MFK to a 40 digit string.
* @param separator (Optional) the separator between MFK parts. Default: "".
* @returns MFK string
*/
/**
* convert MFK to a 40 digit string.
* @param {?=} separator (Optional) the separator between MFK parts. Default: "".
* @return {?} MFK string
*/
Mfk.prototype.to40String = /**
* convert MFK to a 40 digit string.
* @param {?=} separator (Optional) the separator between MFK parts. Default: "".
* @return {?} MFK string
*/
function (separator) {
var _this = this;
if (separator === void 0) { separator = ''; }
return Object.keys(this)
.filter((/**
* @param {?} k
* @return {?}
*/
function (k) { return k !== 'BRF'; }))
.map((/**
* @param {?} k
* @return {?}
*/
function (k) { return _this[k]; }))
.join(separator);
};
/**
* Get MFK format validation message. It checkes this MFK's first 10 fields are numeric strings or not.
*/
/**
* Get MFK format validation message. It checkes this MFK's first 10 fields are numeric strings or not.
* @return {?}
*/
Mfk.prototype.validateFormat = /**
* Get MFK format validation message. It checkes this MFK's first 10 fields are numeric strings or not.
* @return {?}
*/
function () {
/** @type {?} */
var mfkString = this.to40String();
if (mfkString.length !== 40) {
return "MFK is not 40 digits long.";
}
if (isNaN(Number(mfkString))) {
return "MFK [" + mfkString + "] should be all numbers.";
}
return null;
};
/**
* check if this MFK is in an array of Favorite MFKs.
*
* @param favoriteMfks an array of Favorite MFKs.
* @returns boolean
*/
/**
* check if this MFK is in an array of Favorite MFKs.
*
* @param {?} favoriteMfks an array of Favorite MFKs.
* @return {?} boolean
*/
Mfk.prototype.isIn = /**
* check if this MFK is in an array of Favorite MFKs.
*
* @param {?} favoriteMfks an array of Favorite MFKs.
* @return {?} boolean
*/
function (favoriteMfks) {
var _this = this;
if (!favoriteMfks || favoriteMfks.length < 1) {
return false;
}
return favoriteMfks.some((/**
* @param {?} x
* @return {?}
*/
function (x) { return x.matches(_this); }));
};
/**
* MFK module internal method.
*/
/**
* MFK module internal method.
* @param {?} input
* @return {?}
*/
Mfk.prototype.parseString = /**
* MFK module internal method.
* @param {?} input
* @return {?}
*/
function (input) {
/** @type {?} */
var s = input.replace(/\D/g, '');
if (!s || s.length < 40) {
return;
}
this.FUND = s.substring(0, 3);
this.ORG = s.substring(3, 5);
this.DEPT = s.substring(5, 9);
this.SUBDEPT = s.substring(9, 14);
this.GRANTPGM = s.substring(14, 22);
this.IACT = s.substring(22, 26);
this.OACT = s.substring(26, 29);
this.DACT = s.substring(29, 34);
this.FN = s.substring(34, 36);
this.CCTR = s.substring(36, 40);
if (s.length >= 42) {
this.BRF = s.substring(40, 42);
}
};
return Mfk;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MfkFieldName = /** @class */ (function () {
function MfkFieldName() {
}
MfkFieldName.FUND = 'FUND';
MfkFieldName.ORG = 'ORG';
MfkFieldName.DEPT = 'DEPT';
MfkFieldName.SUBDEPT = 'SUBDEPT';
MfkFieldName.GRANTPGM = 'GRANTPGM';
MfkFieldName.IACT = 'IACT';
MfkFieldName.OACT = 'OACT';
MfkFieldName.DACT = 'DACT';
MfkFieldName.FN = 'FN';
MfkFieldName.CCTR = 'CCTR';
MfkFieldName.BRF = 'BRF';
return MfkFieldName;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Options for MFK field.
*
* allows to set field default value, set readonly attribute, set validation regex pattern. Example usage:
*
* ```typescript
* new MfkFieldOption(MfkFieldName.IACT, '6218')
* new MfkFieldOption(MfkFieldName.IACT, '6218', true)
* new MfkFieldOption(MfkFieldName.BRF)
* ```
*/
var /**
* Options for MFK field.
*
* allows to set field default value, set readonly attribute, set validation regex pattern. Example usage:
*
* ```typescript
* new MfkFieldOption(MfkFieldName.IACT, '6218')
* new MfkFieldOption(MfkFieldName.IACT, '6218', true)
* new MfkFieldOption(MfkFieldName.BRF)
* ```
*/
MfkFieldOption = /** @class */ (function () {
/**
* Options for MFK field.
*
* allows to set field default value, set readonly attribute, set validation regex pattern. Example usage:
*
* ```typescript
* new MfkFieldOption(MfkFieldName.IACT, '6218')
* new MfkFieldOption(MfkFieldName.IACT, '6218', true)
* new MfkFieldOption(MfkFieldName.BRF)
* ```
*
* @param name (Required) the input field name. Use MfkFieldName type to get a proper value.
* @param defaultValue (Optional) set a default value for this field. Default: ''.
* @param readonly (Optional) set to true if the input field is readonly. Default: false.
* @param valuePattern (Optional) set a regex for this field. Default: '^[0-9]+$'.
*/
function MfkFieldOption(name, defaultValue, readonly, valuePattern) {
if (defaultValue === void 0) { defaultValue = ''; }
if (readonly === void 0) { readonly = false; }
if (valuePattern === void 0) { valuePattern = '^[0-9]+$'; }
this.name = name;
this.defaultValue = defaultValue;
this.readonly = readonly;
this.valuePattern = valuePattern;
this.numericRegex = '^[0-9]+$';
this.getFieldLabelAndLength();
this.width = this.length * 0.65 + 0.75;
if (!valuePattern) {
valuePattern = this.numericRegex;
}
if (this.readonly) {
if (!this.defaultValue) {
throw new Error("Default value for readonly field [" + name + "] is required.");
}
return; // if readonly, then don't validate default value
}
if (defaultValue) {
if (defaultValue.length !== this.length) {
throw new Error("The default value [" + defaultValue + "] for " + name + " is not " + this.length + " digits long.");
}
/** @type {?} */
var reg = new RegExp(this.numericRegex);
if (!reg.test(defaultValue)) {
throw new Error("The default value [" + defaultValue + "] for " + name + " is not a number.");
}
if (valuePattern !== this.numericRegex) {
reg = new RegExp(valuePattern);
if (!reg.test(defaultValue)) {
throw new Error("The default value [" + defaultValue + "] for " + name + " doesn't match RegEx \"" + valuePattern + "\".");
}
}
}
}
/**
* @private
* @return {?}
*/
MfkFieldOption.prototype.getFieldLabelAndLength = /**
* @private
* @return {?}
*/
function () {
switch (this.name) {
case MfkFieldName.FUND:
this.label = 'Fund';
this.length = 3;
break;
case MfkFieldName.ORG:
this.label = 'Org';
this.length = 2;
break;
case MfkFieldName.DEPT:
this.label = 'Dept';
this.length = 4;
break;
case MfkFieldName.SUBDEPT:
this.label = 'Subdept';
this.length = 5;
break;
case MfkFieldName.GRANTPGM:
this.label = "Grant/Pgm";
this.length = 8;
break;
case MfkFieldName.IACT:
this.label = 'Iact';
this.length = 4;
break;
case MfkFieldName.OACT:
this.label = 'Oact';
this.length = 3;
break;
case MfkFieldName.DACT:
this.label = 'Dact';
this.length = 5;
break;
case MfkFieldName.FN:
this.label = 'Fn';
this.length = 2;
break;
case MfkFieldName.CCTR:
this.label = 'Cctr';
this.length = 4;
break;
case MfkFieldName.BRF:
this.label = 'Brf';
this.length = 2;
break;
default:
throw new Error("MFK field name [" + this.name + "] is invalid.");
}
};
return MfkFieldOption;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var UiowaMfkOptionsService = /** @class */ (function () {
function UiowaMfkOptionsService() {
this.defaultOptions = [
new MfkFieldOption(MfkFieldName.FUND),
new MfkFieldOption(MfkFieldName.ORG),
new MfkFieldOption(MfkFieldName.DEPT),
new MfkFieldOption(MfkFieldName.SUBDEPT),
new MfkFieldOption(MfkFieldName.GRANTPGM),
new MfkFieldOption(MfkFieldName.IACT),
new MfkFieldOption(MfkFieldName.OACT),
new MfkFieldOption(MfkFieldName.DACT),
new MfkFieldOption(MfkFieldName.FN),
new MfkFieldOption(MfkFieldName.CCTR)
];
}
/**
* @param {?=} options
* @return {?}
*/
UiowaMfkOptionsService.prototype.getOptions = /**
* @param {?=} options
* @return {?}
*/
function (options) {
var e_1, _a;
if (options === void 0) { options = []; }
/** @type {?} */
var result = __spread(this.defaultOptions);
if (options && options.length > 0) {
var _loop_1 = function (option) {
/** @type {?} */
var fieldOption = result.find((/**
* @param {?} o
* @return {?}
*/
function (o) { return o.name === option.name; }));
if (fieldOption) {
/** @type {?} */
var index = result.indexOf(fieldOption);
result[index] = option;
}
else {
result.push(option);
}
};
try {
for (var options_1 = __values(options), options_1_1 = options_1.next(); !options_1_1.done; options_1_1 = options_1.next()) {
var option = options_1_1.value;
_loop_1(option);
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (options_1_1 && !options_1_1.done && (_a = options_1.return)) _a.call(options_1);
}
finally { if (e_1) throw e_1.error; }
}
}
return result;
};
/**
* @return {?}
*/
UiowaMfkOptionsService.prototype.getAllOptions = /**
* @return {?}
*/
function () {
return this.defaultOptions;
};
UiowaMfkOptionsService.decorators = [
{ type: Injectable, args: [{
providedIn: 'root'
},] }
];
/** @nocollapse */ UiowaMfkOptionsService.ngInjectableDef = ɵɵdefineInjectable({ factory: function UiowaMfkOptionsService_Factory() { return new UiowaMfkOptionsService(); }, token: UiowaMfkOptionsService, providedIn: "root" });
return UiowaMfkOptionsService;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var MfkInputComponent = /** @class */ (function () {
function MfkInputComponent(optionsService) {
this.optionsService = optionsService;
this._mfk = new Mfk();
this.options = [];
this.mfkChange = new EventEmitter();
}
Object.defineProperty(MfkInputComponent.prototype, "mfk", {
get: /**
* @return {?}
*/
function () {
var _this = this;
this.options
.filter((/**
* @param {?} o
* @return {?}
*/
function (o) { return o.readonly; }))
.forEach((/**
* @param {?} o
* @return {?}
*/
function (o) {
_this._mfk[o.name] = o.defaultValue;
}));
return this._mfk;
},
set: /**
* @param {?} mfk
* @return {?}
*/
function (mfk) {
this.options
.filter((/**
* @param {?} o
* @return {?}
*/
function (o) { return o.defaultValue; }))
.forEach((/**
* @param {?} o
* @return {?}
*/
function (o) {
if (!mfk[o.name]) {
mfk[o.name] = o.defaultValue;
}
}));
this._mfk = mfk;
},
enumerable: true,
configurable: true
});
/**
* @param {?} changes
* @return {?}
*/
MfkInputComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes.mfk) {
this.mfk = changes.mfk.currentValue;
}
if (changes.options) {
this.options = changes.options.currentValue;
this.options = this.optionsService.getOptions(this.options);
}
};
/**
* @return {?}
*/
MfkInputComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
this.options = this.optionsService.getAllOptions();
console.log(this.options);
};
/**
* @return {?}
*/
MfkInputComponent.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () { };
/**
* @param {?} e
* @return {?}
*/
MfkInputComponent.prototype.paste = /**
* @param {?} e
* @return {?}
*/
function (e) {
/** @type {?} */
var pastedInput = e.clipboardData.getData('text/plain').replace(/\D/g, '');
e.preventDefault();
if (!pastedInput) {
return;
}
if (pastedInput.length < 40) {
document.execCommand('insertText', false, pastedInput);
}
else {
this.mfk.parseString(pastedInput);
}
this.mfkChange.emit(this.mfk);
};
/**
* @param {?} e
* @return {?}
*/
MfkInputComponent.prototype.onKeyup = /**
* @param {?} e
* @return {?}
*/
function (e) {
var _this = this;
this.mfkChange.emit(this.mfk);
if ((e.keyCode < 48 || e.keyCode > 57) && (e.keyCode < 96 || e.keyCode > 105)) {
return; // only numbers can trigger auto jump feature.
}
/** @type {?} */
var currentInputFieldName = e.target['name'];
if (this.mfk[currentInputFieldName].length === e.target['maxLength']) {
// auto jump to next input field when current field is full
/** @type {?} */
var currentInputFieldIndex = this.options.findIndex((/**
* @param {?} o
* @return {?}
*/
function (o) { return o.name === currentInputFieldName; }));
var _loop_1 = function (i) {
if (this_1.options[i].readonly) {
return "continue";
}
/** @type {?} */
var nextInputField = this_1.mfkInputFields.find((/**
* @param {?} v
* @return {?}
*/
function (v) { return v.el.nativeElement['name'] === _this.options[i].name; }));
nextInputField.el.nativeElement.focus();
return "break";
};
var this_1 = this;
for (var i = currentInputFieldIndex + 1; i < this.options.length; i++) {
var state_1 = _loop_1(i);
if (state_1 === "break")
break;
}
}
};
/**
* @param {?} e
* @return {?}
*/
MfkInputComponent.prototype.onKeydown = /**
* @param {?} e
* @return {?}
*/
function (e) {
// handle "tab" key --> auto fill '0's if the input field has not completed
if (e.keyCode !== 9) {
return;
}
if (e.target['readOnly']) {
return;
}
/** @type {?} */
var maxlength = e.target['maxLength'];
while (this.mfk[e.target['name']].length < maxlength) {
this.mfk[e.target['name']] = this.mfk[e.target['name']].concat('0');
}
};
MfkInputComponent.decorators = [
{ type: Component, args: [{
selector: 'uiowa-mfk-input',
template: "<div id=\"mfk-container\">\r\n <div class=\"mfk-field\" fxLayout=\"row inline\" fxLayout.xs=\"column\" fxLayoutAlign=\"start center\"\r\n *ngFor=\"let option of options\" fxLayoutWrap fxLayoutGap=\"0.5%\">\r\n <mat-form-field class=\"form-control\" [ngStyle]=\"{'width.rem': option.width+0.5}\" appearance=\"outline\"\r\n floatLabel=\"always\" style=\" font-size: 14px;\">\r\n <mat-label>{{option.label}}</mat-label>\r\n <input matInput [attr.aria-label]=\"option.name\" [attr.name]=\"option.name\" [attr.maxlength]=\"option.length\"\r\n [readOnly]=\"option.readonly\" [(ngModel)]=\"mfk[option.name]\" (paste)=\"paste($event)\" (keyup)=\"onKeyup($event)\"\r\n (keydown)=\"onKeydown($event)\" inputmode=\"numeric\" pattern=\"[0-9]*\" digitOnly>\r\n </mat-form-field>\r\n\r\n\r\n </div>\r\n</div>\r\n",
styles: [":host{display:inline-flex}.mfk-field{display:flex;flex-direction:row;flex-flow:row;vertical-align:bottom;margin-right:.25rem}.mat-form-field{padding:.375rem!important;font-size:1rem;font-weight:400;font-style:normal;font-variant:normal}.mat-label{font-size:.625rem;margin-bottom:0;white-space:nowrap}"]
}] }
];
/** @nocollapse */
MfkInputComponent.ctorParameters = function () { return [
{ type: UiowaMfkOptionsService }
]; };
MfkInputComponent.propDecorators = {
mfk: [{ type: Input }],
options: [{ type: Input }],
mfkChange: [{ type: Output }],
mfkInputFields: [{ type: ViewChildren, args: [DigitOnlyDirective,] }]
};
return MfkInputComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var UiowaMfkMaterialModule = /** @class */ (function () {
function UiowaMfkMaterialModule() {
}
/**
* @param {?=} config
* @return {?}
*/
UiowaMfkMaterialModule.forRoot = /**
* @param {?=} config
* @return {?}
*/
function (config) {
if (config === void 0) { config = {
favoriteMfksApiUrl: 'api/myFavoriteMfks'
}; }
return {
ngModule: UiowaMfkMaterialModule,
providers: [
{
provide: ConfigToken,
useValue: config
}
]
};
};
UiowaMfkMaterialModule.decorators = [
{ type: NgModule, args: [{
declarations: [MfkInputComponent],
imports: [CommonModule, FormsModule, DigitOnlyModule, MatFormFieldModule, BrowserAnimationsModule, MatInputModule, FlexLayoutModule],
exports: [MfkInputComponent]
},] }
];
return UiowaMfkMaterialModule;
}());
export { Mfk, MfkFieldName, MfkFieldOption, MfkInputComponent, UiowaMfkMaterialModule, UiowaMfkOptionsService as ɵa, ConfigToken as ɵb };
//# sourceMappingURL=uiowa-uiowa-mfk-material.js.map