angular2-json-schema-form
Version:
Angular 2 JSON Schema Form builder
455 lines • 21.1 kB
JavaScript
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = require("@angular/core");
var Subject_1 = require("rxjs/Subject");
var Ajv = require("ajv");
var _ = require("lodash");
var index_1 = require("./utilities/index");
var JsonSchemaFormService = (function () {
function JsonSchemaFormService() {
this.JsonFormCompatibility = false;
this.ReactJsonSchemaFormCompatibility = false;
this.AngularSchemaFormCompatibility = false;
this.tpldata = {};
this.ajv = new Ajv({ allErrors: true });
this.validateFormData = null;
this.initialValues = {};
this.schema = {};
this.layout = [];
this.formGroupTemplate = {};
this.formGroup = null;
this.framework = null;
this.data = {};
this.validData = null;
this.isValid = null;
this.validationErrors = null;
this.formValueSubscription = null;
this.dataChanges = new Subject_1.Subject();
this.isValidChanges = new Subject_1.Subject();
this.validationErrorChanges = new Subject_1.Subject();
this.arrayMap = new Map();
this.dataMap = new Map();
this.dataRecursiveRefMap = new Map();
this.schemaRecursiveRefMap = new Map();
this.layoutRefLibrary = {};
this.schemaRefLibrary = {};
this.templateRefLibrary = {};
this.globalOptionDefaults = {
addSubmit: 'auto',
debug: false,
fieldsRequired: false,
framework: 'bootstrap-3',
widgets: {},
loadExternalAssets: false,
pristine: { errors: true, success: true },
supressPropertyTitles: false,
setSchemaDefaults: true,
validateOnRender: false,
formDefaults: {
addable: true,
orderable: true,
removable: true,
allowExponents: false,
enableErrorState: true,
enableSuccessState: true,
feedback: false,
notitle: false,
readonly: false,
},
};
this.globalOptions = _.cloneDeep(this.globalOptionDefaults);
}
JsonSchemaFormService.prototype.getData = function () { return this.data; };
JsonSchemaFormService.prototype.getSchema = function () { return this.schema; };
JsonSchemaFormService.prototype.getLayout = function () { return this.layout; };
JsonSchemaFormService.prototype.resetAllValues = function () {
this.JsonFormCompatibility = false;
this.ReactJsonSchemaFormCompatibility = false;
this.AngularSchemaFormCompatibility = false;
this.tpldata = {};
this.validateFormData = null;
this.initialValues = {};
this.schema = {};
this.layout = [];
this.formGroupTemplate = {};
this.formGroup = null;
this.framework = null;
this.data = {};
this.validData = null;
this.isValid = null;
this.validationErrors = null;
this.arrayMap = new Map();
this.dataMap = new Map();
this.dataRecursiveRefMap = new Map();
this.schemaRecursiveRefMap = new Map();
this.layoutRefLibrary = {};
this.schemaRefLibrary = {};
this.templateRefLibrary = {};
this.globalOptions = _.cloneDeep(this.globalOptionDefaults);
};
JsonSchemaFormService.prototype.convertJsonSchema3to4 = function () {
this.schema = index_1.convertJsonSchema3to4(this.schema);
};
JsonSchemaFormService.prototype.fixJsonFormOptions = function (layout) {
return index_1.fixJsonFormOptions(layout);
};
JsonSchemaFormService.prototype.buildFormGroupTemplate = function (setValues) {
if (setValues === void 0) { setValues = true; }
this.formGroupTemplate =
index_1.buildFormGroupTemplate(this, this.initialValues, setValues);
};
JsonSchemaFormService.prototype.validateData = function (newValue, updateSubscriptions) {
if (updateSubscriptions === void 0) { updateSubscriptions = true; }
this.data = index_1.formatFormData(newValue, this.dataMap, this.dataRecursiveRefMap, this.arrayMap);
this.isValid = this.validateFormData(this.data);
this.validData = this.isValid ? this.data : null;
this.validationErrors = this.validateFormData.errors;
if (updateSubscriptions) {
if (this.dataChanges.observers.length) {
this.dataChanges.next(this.data);
}
if (this.isValidChanges.observers.length) {
this.isValidChanges.next(this.isValid);
}
if (this.validationErrorChanges.observers.length) {
this.validationErrorChanges.next(this.validationErrors);
}
}
};
JsonSchemaFormService.prototype.buildFormGroup = function () {
var _this = this;
this.formGroup = index_1.buildFormGroup(this.formGroupTemplate);
if (this.formGroup) {
this.compileAjvSchema();
this.validateData(this.formGroup.value, false);
if (this.formValueSubscription) {
this.formValueSubscription.unsubscribe();
}
this.formValueSubscription = this.formGroup.valueChanges.subscribe(function (formValue) { return _this.validateData(formValue); });
}
};
JsonSchemaFormService.prototype.buildLayout = function (widgetLibrary) {
this.layout = index_1.buildLayout(this, widgetLibrary);
};
JsonSchemaFormService.prototype.setOptions = function (newOptions) {
if (typeof newOptions === 'object') {
Object.assign(this.globalOptions, newOptions);
}
if (index_1.hasOwn(this.globalOptions.formDefaults, 'disableErrorState')) {
this.globalOptions.formDefaults.enableErrorState =
!this.globalOptions.formDefaults.disableErrorState;
delete this.globalOptions.formDefaults.disableErrorState;
}
if (index_1.hasOwn(this.globalOptions.formDefaults, 'disableSuccessState')) {
this.globalOptions.formDefaults.enableSuccessState =
!this.globalOptions.formDefaults.disableSuccessState;
delete this.globalOptions.formDefaults.disableSuccessState;
}
};
JsonSchemaFormService.prototype.compileAjvSchema = function () {
if (!this.validateFormData) {
this.validateFormData = this.ajv.compile(this.schema);
}
};
JsonSchemaFormService.prototype.resolveSchemaRefLinks = function () {
var _this = this;
index_1.JsonPointer.forEachDeep(this.schema, function (value, pointer) {
if (index_1.hasOwn(value, '$ref') && index_1.isString(value['$ref'])) {
var newReference = index_1.JsonPointer.compile(value['$ref']);
var isRecursive = index_1.JsonPointer.isSubPointer(newReference, pointer);
if (index_1.hasValue(newReference) && !index_1.hasOwn(_this.schemaRefLibrary, newReference)) {
_this.schemaRefLibrary[newReference] = index_1.getSchemaReference(_this.schema, newReference, _this.schemaRefLibrary);
}
if (!_this.schemaRecursiveRefMap.has(pointer)) {
_this.schemaRecursiveRefMap.set(pointer, newReference);
}
if (!isRecursive) {
delete value['$ref'];
var targetSchema = Object.assign(_.cloneDeep(_this.schemaRefLibrary[newReference]), value);
_this.schema = index_1.JsonPointer.set(_this.schema, pointer, targetSchema);
_this.schemaRecursiveRefMap.set(newReference, pointer);
}
else {
var mappedReference = _this.schemaRecursiveRefMap.get(newReference);
if (_this.schemaRecursiveRefMap.has(newReference) &&
index_1.JsonPointer.isSubPointer(mappedReference, newReference)) {
_this.schemaRecursiveRefMap.set(newReference, mappedReference);
}
}
}
}, true);
var addRedirects = new Map();
this.schemaRecursiveRefMap.forEach(function (toRef1, fromRef1) {
return _this.schemaRecursiveRefMap.forEach(function (toRef2, fromRef2) {
if (fromRef1 !== fromRef2 && fromRef1 !== toRef2 &&
index_1.JsonPointer.isSubPointer(toRef2, fromRef1)) {
var newRef = fromRef2 + fromRef1.slice(toRef2.length);
if (!_this.schemaRecursiveRefMap.has(newRef)) {
addRedirects.set(newRef, toRef1);
}
}
});
});
addRedirects.forEach(function (toRef, fromRef) { return _this.schemaRecursiveRefMap.set(fromRef, toRef); });
this.schemaRecursiveRefMap.forEach(function (toRef1, fromRef1) {
return _this.schemaRecursiveRefMap.forEach(function (toRef2, fromRef2) {
if (fromRef1 !== fromRef2 && toRef1 === toRef2 &&
index_1.JsonPointer.isSubPointer(fromRef1, fromRef2)) {
_this.schemaRecursiveRefMap.set(fromRef2, fromRef1);
}
});
});
this.schemaRecursiveRefMap.forEach(function (toRef, fromRef) {
if (!index_1.JsonPointer.isSubPointer(toRef, fromRef) &&
!index_1.hasOwn(_this.schemaRefLibrary, toRef)) {
_this.schemaRecursiveRefMap.delete(fromRef);
}
});
};
JsonSchemaFormService.prototype.buildSchemaFromData = function (data, requireAllFields) {
if (requireAllFields === void 0) { requireAllFields = false; }
if (data) {
return index_1.buildSchemaFromData(data, requireAllFields);
}
this.schema = index_1.buildSchemaFromData(this.initialValues, requireAllFields);
};
JsonSchemaFormService.prototype.buildSchemaFromLayout = function (layout) {
if (layout) {
return index_1.buildSchemaFromLayout(layout);
}
this.schema = index_1.buildSchemaFromLayout(this.layout);
};
JsonSchemaFormService.prototype.setTpldata = function (newTpldata) {
if (newTpldata === void 0) { newTpldata = {}; }
this.tpldata = newTpldata;
};
JsonSchemaFormService.prototype.parseText = function (text, value, values, key) {
if (text === void 0) { text = ''; }
if (value === void 0) { value = {}; }
if (values === void 0) { values = {}; }
if (key === void 0) { key = null; }
return index_1.parseText(text, value, values, key, this.tpldata);
};
JsonSchemaFormService.prototype.setTitle = function (parentCtx, childNode, index) {
if (parentCtx === void 0) { parentCtx = {}; }
if (childNode === void 0) { childNode = null; }
if (index === void 0) { index = null; }
var parentNode = parentCtx.layoutNode;
var text;
var childValue;
var parentValues = this.getControlValue(parentCtx);
var isArrayItem = parentNode.type.slice(-5) === 'array' && index_1.isArray(parentValues);
if (isArrayItem && childNode.type !== '$ref') {
text = index_1.JsonPointer.getFirst([
[childNode, '/options/legend'],
[childNode, '/options/title'],
[childNode, '/title'],
[parentNode, '/options/title'],
[parentNode, '/options/legend'],
[parentNode, '/title'],
]);
}
else {
text = index_1.JsonPointer.getFirst([
[childNode, '/title'],
[childNode, '/options/title'],
[childNode, '/options/legend'],
[parentNode, '/title'],
[parentNode, '/options/title'],
[parentNode, '/options/legend']
]);
if (childNode.type === '$ref') {
text = '+ ' + text;
}
}
if (!text) {
return text;
}
childValue = isArrayItem ? parentValues[index] : parentValues;
return this.parseText(text, childValue, parentValues, index);
};
JsonSchemaFormService.prototype.initializeControl = function (ctx) {
ctx.formControl = this.getControl(ctx);
ctx.boundControl = !!ctx.formControl;
if (ctx.boundControl) {
ctx.controlName = this.getControlName(ctx);
ctx.controlValue = ctx.formControl.value;
ctx.formControl.valueChanges.subscribe(function (v) { return ctx.controlValue = v; });
ctx.controlDisabled = ctx.formControl.disabled;
}
else {
ctx.controlName = ctx.layoutNode.name;
ctx.controlValue = ctx.layoutNode.value;
var dataPointer = this.getDataPointer(ctx);
if (dataPointer) {
console.error('warning: control "' + dataPointer +
'" is not bound to the Angular 2 FormGroup.');
}
}
return ctx.boundControl;
};
JsonSchemaFormService.prototype.updateValue = function (ctx, value) {
ctx.controlValue = value;
if (ctx.boundControl) {
ctx.formControl.setValue(value);
ctx.formControl.markAsDirty();
}
ctx.layoutNode.value = value;
if (index_1.isArray(ctx.options.copyValueTo)) {
for (var _i = 0, _a = ctx.options.copyValueTo; _i < _a.length; _i++) {
var item = _a[_i];
var targetControl = index_1.getControl(this.formGroup, item);
if (index_1.isObject(targetControl) && typeof targetControl.setValue === 'function') {
targetControl.setValue(value);
targetControl.markAsDirty();
}
}
}
};
JsonSchemaFormService.prototype.updateArrayCheckboxList = function (ctx, checkboxList) {
var formArray = this.getControl(ctx);
while (formArray.value.length) {
formArray.removeAt(0);
}
for (var _i = 0, checkboxList_1 = checkboxList; _i < checkboxList_1.length; _i++) {
var checkboxItem = checkboxList_1[_i];
if (checkboxItem.checked) {
var newFormControl = index_1.buildFormGroup(index_1.JsonPointer.get(this.templateRefLibrary, [ctx.layoutNode.dataPointer + '/-']));
newFormControl.setValue(checkboxItem.value);
formArray.push(newFormControl);
}
}
formArray.markAsDirty();
};
JsonSchemaFormService.prototype.getControl = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer ||
ctx.layoutNode.type === '$ref') {
return null;
}
return index_1.getControl(this.formGroup, this.getDataPointer(ctx));
};
JsonSchemaFormService.prototype.getControlValue = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer ||
ctx.layoutNode.type === '$ref') {
return null;
}
var control = index_1.getControl(this.formGroup, this.getDataPointer(ctx));
return control ? control.value : null;
};
JsonSchemaFormService.prototype.getControlGroup = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer) {
return null;
}
return index_1.getControl(this.formGroup, this.getDataPointer(ctx), true);
};
JsonSchemaFormService.prototype.getControlName = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer || !ctx.dataIndex) {
return null;
}
return index_1.JsonPointer.toKey(this.getDataPointer(ctx));
};
JsonSchemaFormService.prototype.getLayoutArray = function (ctx) {
return index_1.JsonPointer.get(this.layout, this.getLayoutPointer(ctx), 0, -1);
};
JsonSchemaFormService.prototype.getParentNode = function (ctx) {
return index_1.JsonPointer.get(this.layout, this.getLayoutPointer(ctx), 0, -2);
};
JsonSchemaFormService.prototype.getDataPointer = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer || !ctx.dataIndex) {
return null;
}
return index_1.JsonPointer.toIndexedPointer(ctx.layoutNode.dataPointer, ctx.dataIndex, this.arrayMap);
};
JsonSchemaFormService.prototype.getLayoutPointer = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.layoutPointer || !ctx.layoutIndex) {
return null;
}
return index_1.JsonPointer.toIndexedPointer(ctx.layoutNode.layoutPointer, ctx.layoutIndex);
};
JsonSchemaFormService.prototype.isControlBound = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer || !ctx.dataIndex) {
return false;
}
var controlGroup = this.getControlGroup(ctx);
var name = this.getControlName(ctx);
return controlGroup ? controlGroup.controls.hasOwnProperty(name) : false;
};
JsonSchemaFormService.prototype.addItem = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.$ref || !ctx.dataIndex ||
!ctx.layoutNode.layoutPointer || !ctx.layoutIndex) {
return false;
}
var newFormGroup = index_1.buildFormGroup(index_1.JsonPointer.get(this.templateRefLibrary, [ctx.layoutNode.$ref]));
if (ctx.layoutNode.arrayItem) {
this.getControlGroup(ctx)
.push(newFormGroup);
}
else {
this.getControlGroup(ctx)
.addControl(this.getControlName(ctx), newFormGroup);
}
var newLayoutNode = _.cloneDeep(index_1.JsonPointer.get(this.layoutRefLibrary, [ctx.layoutNode.$ref]));
index_1.JsonPointer.forEachDeep(newLayoutNode, function (value, pointer) {
if (index_1.hasOwn(value, '_id')) {
value._id = _.uniqueId();
}
if (!ctx.layoutNode.arrayItem || ctx.layoutNode.recursiveReference) {
if (index_1.hasOwn(value, 'dataPointer')) {
value.dataPointer = ctx.layoutNode.dataPointer + value.dataPointer;
}
if (index_1.hasOwn(value, 'layoutPointer')) {
value.layoutPointer =
ctx.layoutNode.layoutPointer.slice(0, -2) + value.layoutPointer;
}
}
});
index_1.JsonPointer.insert(this.layout, this.getLayoutPointer(ctx), newLayoutNode);
return true;
};
JsonSchemaFormService.prototype.moveArrayItem = function (ctx, oldIndex, newIndex) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer || !ctx.dataIndex ||
!ctx.layoutNode.layoutPointer || !ctx.layoutIndex ||
!index_1.isDefined(oldIndex) || !index_1.isDefined(newIndex)) {
return false;
}
var formArray = this.getControlGroup(ctx);
formArray.controls.splice(newIndex, 0, formArray.controls.splice(oldIndex, 1)[0]);
formArray.updateValueAndValidity();
formArray._onCollectionChange();
var layoutArray = this.getLayoutArray(ctx);
layoutArray.splice(newIndex, 0, layoutArray.splice(oldIndex, 1)[0]);
return true;
};
JsonSchemaFormService.prototype.removeItem = function (ctx) {
if (!ctx.layoutNode || !ctx.layoutNode.dataPointer || !ctx.dataIndex ||
!ctx.layoutNode.layoutPointer || !ctx.layoutIndex) {
return false;
}
if (ctx.layoutNode.arrayItem) {
this.getControlGroup(ctx)
.removeAt(ctx.dataIndex[ctx.dataIndex.length - 1]);
}
else {
this.getControlGroup(ctx)
.removeControl(this.getControlName(ctx));
}
var layoutPointer = this.getLayoutPointer(ctx);
index_1.JsonPointer.remove(this.layout, layoutPointer);
return true;
};
return JsonSchemaFormService;
}());
JsonSchemaFormService = __decorate([
core_1.Injectable(),
__metadata("design:paramtypes", [])
], JsonSchemaFormService);
exports.JsonSchemaFormService = JsonSchemaFormService;
//# sourceMappingURL=json-schema-form.service.js.map