@dzeio/form-manager
Version:
A powerfull Form Manager
161 lines (160 loc) • 6.7 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
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);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var DefaultInput_1 = __importDefault(require("./DefaultInput"));
var RepeatInput = (function (_super) {
__extends(RepeatInput, _super);
function RepeatInput(element, form) {
var _this = _super.call(this, element, form) || this;
_this.elements = [];
_this.template = element.querySelector(".fmr-template");
if (!_this.template)
throw Error("Error: your repeat input \"" + _this.getName() + "\" MUST have a child with the class .fmr-template");
_this.template.style.display = "none";
_this.addBtn = element.querySelector(".fmr-add");
if (!_this.addBtn)
throw Error("Error: your repeat element \"" + _this.getName() + "\" MUST have a child with the class .fmr-add");
_this.addBtn.addEventListener("click", function () {
if (!_this.addBtn.hasAttribute("disabled"))
_this.addLine();
});
var observer = new MutationObserver(function (mutationList) {
for (var _i = 0, mutationList_1 = mutationList; _i < mutationList_1.length; _i++) {
var mutation = mutationList_1[_i];
if (mutation.type === 'attributes' && mutation.attributeName === "disabled") {
_this.element.querySelectorAll(".fmr-add, .fmr-del").forEach(function (el) {
if (_this.element.hasAttribute("disabled"))
el.style.display = "none";
else
el.style.display = "";
});
if (_this.element.hasAttribute("disabled"))
_this.addBtn.setAttribute("disabled", "");
else
_this.addBtn.removeAttribute("disabled");
for (var _a = 0, _b = _this.elements; _a < _b.length; _a++) {
var iterator = _b[_a];
for (var _c = 0, iterator_1 = iterator; _c < iterator_1.length; _c++) {
var i2 = iterator_1[_c];
if (_this.element.hasAttribute("disabled")) {
i2.element.setAttribute("disabled", "");
continue;
}
i2.element.removeAttribute("disabled");
}
}
}
}
});
observer.observe(_this.element, { attributes: true });
return _this;
}
RepeatInput.prototype.addLine = function (values) {
var _this = this;
var node = this.element.insertBefore(this.template.cloneNode(true), this.addBtn);
node.classList.remove("fmr-template");
node.classList.add("fmr-element");
node.style.display = "";
var sub = [];
node.querySelectorAll("[data-input]").forEach(function (el) {
var input = _this.form.getInit(el);
if (!input) {
return;
}
if (_this.element.hasAttribute("disabled")) {
input.element.disabled = true;
}
sub.push(input);
if (values != undefined && values[input.getName()] != undefined) {
input.setValue(values[input.getName()]);
}
if (typeof (values) != "object" && values != undefined) {
input.setValue(values);
}
});
this.elements.push(sub);
var del = node.querySelector(".fmr-del");
if (del)
del.addEventListener("click", function () {
if (del && !del.hasAttribute("disabled")) {
var id = _this.element.querySelectorAll(".fmr-element").length - 1;
_this.elements.splice(id);
node.remove();
}
});
};
RepeatInput.prototype.setValue = function (value) {
var _this = this;
this.element.querySelectorAll(".fmr-element").forEach(function (el) {
el.remove();
_this.elements = [];
});
if (typeof (value) == "string")
return;
for (var indexStr in value) {
var index = parseInt(indexStr);
if (value.hasOwnProperty(index)) {
var el = value[index];
if (this.element.querySelectorAll(".fmr-element").length <= index) {
if (el == "")
continue;
this.addLine(el);
continue;
}
}
}
};
RepeatInput.prototype.getValue = function () {
var values = [];
for (var _i = 0, _a = this.elements; _i < _a.length; _i++) {
var line = _a[_i];
var lineArray = {};
if (line.length == 1) {
for (var _b = 0, line_1 = line; _b < line_1.length; _b++) {
var col = line_1[_b];
values.push(col.getValue());
}
continue;
}
for (var _c = 0, line_2 = line; _c < line_2.length; _c++) {
var col = line_2[_c];
lineArray[col.getName()] = col.getValue();
}
values.push(lineArray);
}
return values;
};
RepeatInput.prototype.verify = function () {
for (var _i = 0, _a = this.elements; _i < _a.length; _i++) {
var el = _a[_i];
for (var _b = 0, el_1 = el; _b < el_1.length; _b++) {
var i = el_1[_b];
if (!i.verify())
return false;
}
}
return true;
};
RepeatInput.identity = {
input: RepeatInput,
classes: "fm-repeat",
tagName: "div"
};
return RepeatInput;
}(DefaultInput_1.default));
exports.default = RepeatInput;