MontoyaTech/ignite-html
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improved Disabled template function to make it work with more complex conditions.

Browse Source
This commit is contained in:
MattMo
2025-07-13 09:36:50 -07:00
parent 1733df832a
commit 93dde5893f
1 changed files with 47 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
ignite-template.js
View File

@ -1203,24 +1203,45 @@ class IgniteTemplate {
* @returns {IgniteTemplate} This ignite template so function calls can be chained.
*/
disabled(value, converter = null) {
if (value instanceof IgniteProperty) {
this.attribute("disabled", value, convert => {
convert = (converter != null ? converter(convert) : convert);
if (convert) {
return "disabled";
} else {
return null;
}
});
IgniteRendering.push();
this.class(value, convert => {
convert = (converter != null ? converter(convert) : convert);
if (convert) {
return "disabled";
} else {
return null;
let updateDisabled = (...newValues) => {
var converted = (converter != null ? converter(...newValues) : newValues[0]);
if (converted) {
this._attributes["disabled"] = "disabled";
if (this._classes.indexOf("disabled") == -1) {
this._classes.push("disabled");
}
});
if (this.element) {
this.element.setAttribute("disabled", "disabled");
if (!this.element.classList.contains("disabled")) {
this.element.classList.add("disabled");
}
}
} else {
this._attributes["disabled"] = null;
this._classes.splice(this._classes.indexOf("disabled"), 1);
if (this.element) {
this.element.removeAttribute("disabled");
this.element.classList.remove("disabled");
}
}
};
if (value instanceof IgniteProperty) {
this._callbacks.push(value.attachOnChange((oldValue, newValue) => updateDisabled(newValue)));
this._callbacks.push(value.attachOnPush((list, items) => updateDisabled(list)));
this._callbacks.push(value.attachOnUnshift((list, items) => updateDisabled(list)));
this._callbacks.push(value.attachOnPop(list => updateDisabled(list)));
this._callbacks.push(value.attachOnShift(list => updateDisabled(list)));
this._callbacks.push(value.attachOnSplice((list, start, deleteCount, items) => updateDisabled(list)));
updateDisabled(value.value);
} else if (Array.isArray(value) && value.length > 0 && value[0] instanceof IgniteProperty) {
//There must be a converter for this to work correctly
if (!converter) {
@ -1230,32 +1251,21 @@ class IgniteTemplate {
//Attack a callback for all the properties
value.forEach(prop => {
if (prop instanceof IgniteProperty) {
let updateDisabled = () => {
this.onAttributeChanged("disabled", converter(...value.getPropertyValues()) ? "disabled" : null);
this.onClassChanged("disabled", converter(...value.getPropertyValues()) ? "disabled" : null);
}
this._callbacks.push(prop.attachOnChange((oldValue, newValue) => updateDisabled()));
this._callbacks.push(prop.attachOnPush((list, items) => updateDisabled()));
this._callbacks.push(prop.attachOnUnshift((list, items) => updateDisabled()));
this._callbacks.push(prop.attachOnPop((list) => updateDisabled()));
this._callbacks.push(prop.attachOnShift((list) => updateDisabled()));
this._callbacks.push(prop.attachOnSplice((list, start, deleteCount, items) => updateDisabled()));
this._callbacks.push(prop.attachOnChange((oldValue, newValue) => updateDisabled(...value.getPropertyValues())));
this._callbacks.push(prop.attachOnPush((list, items) => updateDisabled(...value.getPropertyValues())));
this._callbacks.push(prop.attachOnUnshift((list, items) => updateDisabled(...value.getPropertyValues())));
this._callbacks.push(prop.attachOnPop((list) => updateDisabled(...value.getPropertyValues())));
this._callbacks.push(prop.attachOnShift((list) => updateDisabled(...value.getPropertyValues())));
this._callbacks.push(prop.attachOnSplice((list, start, deleteCount, items) => updateDisabled(...value.getPropertyValues())));
}
});
if (converter(...value.getPropertyValues())) {
this.attribute("disabled", "disabled");
this.class("disabled");
}
updateDisabled(...value.getPropertyValues());
} else {
value = converter ? converter(value) : value;
updateDisabled(value);
}
if (value) {
this.attribute("disabled", "disabled");
this.class("disabled");
}
}
IgniteRendering.pop();
return this;
}