UNPKG

mframejs

Version:
366 lines 19.1 kB
Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var exported_1 = require("../decorator/exported"); var exported_2 = require("../binding/exported"); var exported_3 = require("../utils/exported"); var PropertyChangeHandler = (function () { function PropertyChangeHandler(node) { this.node = node; this.firstRun = true; this.name = 'valueAttribute'; } PropertyChangeHandler.prototype.call = function (newValue, oldValue) { if (oldValue !== newValue || this.firstRun) { this.value = newValue; switch (true) { case this.node.type === 'textarea': case (this.node.type !== 'checkbox' && this.node.type !== 'radio' && this.node.type !== 'select-multiple' && this.node.type !== 'select-one'): this.node.value = newValue || ''; break; case this.node.type === 'checkbox': var modelBind = this.node.hasAttribute('model.bind') ? this.node.getAttributeNode('model.bind') : null; if (modelBind && modelBind.getContent) { var x = modelBind.getContent(); if (x) { if (Array.isArray(newValue)) { if (newValue.indexOf(x.value) !== -1) { this.node.checked = true; } else { this.node.checked = false; } } else { if (newValue === x.value) { this.node.checked = true; } else { this.node.checked = false; } } } } else { if (Array.isArray(newValue)) { console.warn('error: value is array, this should not happen'); } else { this.node.checked = newValue || false; } } break; case this.node.type === 'radio': if (this.node) { var modelBind_1 = this.node.hasAttribute('model.bind') ? this.node.getAttributeNode('model.bind') : null; if (modelBind_1 && modelBind_1.getContent) { var x = modelBind_1.getContent(); if (x) { if (newValue === x.value) { this.node.checked = true; } } } } break; case this.node.type === 'select-one': var optionsSingle = this.node.options; var index = null; for (var i = 0; i < optionsSingle.length; i++) { var modelBind_2 = optionsSingle[i].hasAttribute('model.bind') ? optionsSingle[i].getAttributeNode('model.bind') : null; if (modelBind_2 && modelBind_2.getContent) { var x = modelBind_2.getContent(); if (x) { if (Array.isArray(newValue)) { if (newValue[0] === x.value) { index = i; } } else { if (newValue === x.value) { index = i; } } } } } this.node.selectedIndex = index; break; case this.node.type === 'select-multiple': var optionsMany = this.node.options; for (var i = 0; i < optionsMany.length; i++) { var modelBind_3 = optionsMany[i].hasAttribute('model.bind') ? optionsMany[i].getAttributeNode('model.bind') : null; if (modelBind_3 && modelBind_3.getContent) { var x = modelBind_3.getContent(); if (x) { if (Array.isArray(newValue)) { if (newValue.indexOf(x.value) !== -1) { optionsMany[i].selected = true; } else { optionsMany[i].selected = false; } if (newValue.length === 0 && x.value === null) { optionsMany[i].selected = true; } } else { if (newValue === x.value) { optionsMany[i].selected = true; } else { optionsMany[i].selected = false; } } } } } break; } this.firstRun = false; } }; return PropertyChangeHandler; }()); exports.PropertyChangeHandler = PropertyChangeHandler; var ValueAttribute = (function () { function ValueAttribute() { this.valueConverters = []; this.eventHandlerBinded = this.eventHandler.bind(this); } ValueAttribute.prototype.attached = function () { if (this.$element.type === 'select-multiple') { this.propertyChangeHandler.call(this.propertyChangeHandler.value, 'somethign % its not'); } }; ValueAttribute.prototype.created = function () { var _this = this; this.expressionValue = this.$attribute.value; this.attributeName = this.expressionValue.split('|')[0].trim().split('&')[0].trim(); this.trigger = null; this.name = this.$attribute.name; this.propertyChangeHandler = new PropertyChangeHandler(this.$element); switch (true) { case (this.$element.tagName === 'INPUT' && this.$element.type !== 'checkbox' && this.$element.type !== 'radio' && this.$element.type !== 'select-multiple' && this.$element.type !== 'select-one') || this.$element.tagName === 'TEXTAREA': exported_2.BindingEngine.subscribeClassProperty(this.$bindingContext, this.expressionValue, this.propertyChangeHandler); exported_3.connectBehavior(this.expressionValue, this); if (!this.trigger) { this.$element.addEventListener('input', this.eventHandlerBinded, false); } else { this.trigger.forEach(function (trigger) { _this.$element.addEventListener(trigger, _this.eventHandlerBinded, false); }); } break; case this.$element.tagName === 'INPUT' && this.$element.type === 'checkbox': exported_2.BindingEngine.subscribeClassProperty(this.$bindingContext, this.expressionValue, this.propertyChangeHandler); exported_3.connectBehavior(this.expressionValue, this); if (!this.trigger) { this.$element.addEventListener('click', this.eventHandlerBinded, false); } else { this.trigger.forEach(function (trigger) { _this.$element.addEventListener(trigger, _this.eventHandlerBinded, false); }); } break; case this.$element.tagName === 'INPUT' && this.$element.type === 'radio': exported_2.BindingEngine.subscribeClassProperty(this.$bindingContext, this.expressionValue, this.propertyChangeHandler); exported_3.connectBehavior(this.expressionValue, this); if (!this.trigger) { this.$element.addEventListener('click', this.eventHandlerBinded, false); } else { this.trigger.forEach(function (trigger) { _this.$element.addEventListener(trigger, _this.eventHandlerBinded, false); }); } break; case this.$element.tagName === 'SELECT': exported_2.BindingEngine.subscribeClassProperty(this.$bindingContext, this.expressionValue, this.propertyChangeHandler); exported_3.connectBehavior(this.expressionValue, this); if (!this.trigger) { this.$element.addEventListener('change', this.eventHandlerBinded, false); } else { this.trigger.forEach(function (trigger) { _this.$element.addEventListener(trigger, _this.eventHandlerBinded, false); }); } break; default: } }; ValueAttribute.prototype.runValueConverter = function (value) { var x = exported_3.Cache.expressionMap.get(this.expressionValue); return exported_2.BindingEngine.valueConvert(x.ast, this.$bindingContext, value); }; ValueAttribute.prototype.detached = function () { var _this = this; switch (true) { case (this.$element.tagName === 'INPUT' && this.$element.type !== 'checkbox' && this.$element.type !== 'radio' && this.$element.type !== 'select-multiple' && this.$element.type !== 'select-one') || this.$element.tagName === 'TEXTAREA': if (!this.trigger) { this.$element.removeEventListener('input', this.eventHandlerBinded); } else { this.trigger.forEach(function (trigger) { _this.$element.removeEventListener(trigger, _this.eventHandlerBinded); }); } break; case this.$element.tagName === 'INPUT' && this.$element.type === 'checkbox': if (!this.trigger) { this.$element.removeEventListener('click', this.eventHandlerBinded); } else { this.trigger.forEach(function (trigger) { _this.$element.removeEventListener(trigger, _this.eventHandlerBinded); }); } break; case this.$element.tagName === 'INPUT' && this.$element.type === 'radio': if (!this.trigger) { this.$element.removeEventListener('click', this.eventHandlerBinded); } else { this.trigger.forEach(function (trigger) { _this.$element.removeEventListener(trigger, _this.eventHandlerBinded); }); } break; case this.$element.tagName === 'SELECT': if (!this.trigger) { this.$element.removeEventListener('change', this.eventHandlerBinded); } else { this.trigger.forEach(function (trigger) { _this.$element.removeEventListener(trigger, _this.eventHandlerBinded); }); } break; default: this.$attribute.$bindingContext = null; break; } if (this.propertyChangeHandler.caller) { exported_2.BindingEngine.unSubscribeClassProperty(this.$bindingContext, this.propertyChangeHandler); } }; ValueAttribute.prototype.eventHandler = function () { switch (true) { case (this.$element.tagName === 'INPUT' && this.$element.type !== 'checkbox' && this.$element.type !== 'radio' && this.$element.type !== 'select-multiple' && this.$element.type !== 'select-one') || this.$element.tagName === 'TEXTAREA': var value = this.$element.value; if (this.$element.type === 'number') { value = this.$element.valueAsNumber; } if (this.$element.type === 'date') { value = this.$element.valueAsDate; } exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, this.runValueConverter(value)); break; case this.$element.tagName === 'INPUT' && this.$element.type === 'checkbox': var modelBindCheckbox = this.$element.hasAttribute('model.bind') ? this.$element.getAttributeNode('model.bind') : null; if (modelBindCheckbox) { var value_1 = modelBindCheckbox.getContent().value; var propertyType_1 = exported_2.BindingEngine.evaluateExpression(this.$attribute.nodeValue, this.$bindingContext); var isArray_1 = Array.isArray(propertyType_1); var selected = this.$element.checked; if (isArray_1) { if (selected) { var ii = propertyType_1.indexOf(value_1); if (ii === -1) { propertyType_1 = propertyType_1.concat([this.runValueConverter(value_1)]); exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, propertyType_1); } } else { var ii = propertyType_1.indexOf(value_1); if (ii !== -1) { propertyType_1.splice(ii, 1); if (!propertyType_1.__array_observer__class) { propertyType_1 = propertyType_1.slice(); } exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, propertyType_1); } else { this.$element.checked = false; } } } else { exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, this.runValueConverter(value_1) || false); } } else { exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, this.$element.checked || false); } break; case this.$element.tagName === 'INPUT' && this.$element.type === 'radio': var modelBindRadio = this.$element.hasAttribute('model.bind') ? this.$element.getAttributeNode('model.bind') : null; if (modelBindRadio) { var value_2 = exported_2.BindingEngine.evaluateExpression(modelBindRadio.nodeValue, modelBindRadio.getContent().$bindingContext); exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, this.runValueConverter(value_2)); } else { exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, this.runValueConverter(this.$element.checked)); } break; case this.$element.tagName === 'SELECT': var propertyType = exported_2.BindingEngine.evaluateExpression(this.$attribute.nodeValue, this.$bindingContext); var isArray = Array.isArray(propertyType); var length_1 = this.$element.selectedOptions.length; var finalValue = null; if (length_1 > 1) { var values = []; for (var i = 0; i < length_1; i++) { var x = this.$element.selectedOptions[i]; var modelBind = x.hasAttribute('model.bind') ? x.getAttributeNode('model.bind') : null; var value_3 = exported_2.BindingEngine.evaluateExpression(modelBind.nodeValue, modelBind.getContent().$bindingContext); values.push(this.runValueConverter(value_3)); } finalValue = values; } else { if (length_1 === 0) { finalValue = null; } else { var x = this.$element.selectedOptions[0]; var modelBind = x.hasAttribute('model.bind') ? x.getAttributeNode('model.bind') : null; var value_4 = exported_2.BindingEngine.evaluateExpression(modelBind.nodeValue, modelBind.getContent().$bindingContext); finalValue = value_4; } } if (isArray) { exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, Array.isArray(finalValue) ? finalValue : finalValue === null ? [] : [finalValue]); } else { exported_2.BindingEngine.setValue(this.$bindingContext, this.attributeName, Array.isArray(finalValue) ? finalValue.map(function (a) { return a; }) : finalValue); } break; } }; ValueAttribute = tslib_1.__decorate([ exported_1.customAttribute('value.bind'), exported_1.customAttribute('checked.bind'), tslib_1.__metadata("design:paramtypes", []) ], ValueAttribute); return ValueAttribute; }()); exports.ValueAttribute = ValueAttribute; //# sourceMappingURL=valueAttribute.js.map