1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-12 12:59:57 +00:00

Refactor updating of classes for button widgets to avoid potential edge case failures (#5115)

This commit is contained in:
saqimtiaz 2020-11-24 22:19:20 +01:00 committed by GitHub
parent a9d583b85e
commit ce27492b96
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -42,7 +42,20 @@ ButtonWidget.prototype.render = function(parent,nextSibling) {
domNode = this.document.createElement(tag); domNode = this.document.createElement(tag);
this.domNode = domNode; this.domNode = domNode;
// Assign classes // Assign classes
this.assignDomNodeClasses(); var classes = this["class"].split(" ") || [],
isPoppedUp = (this.popup || this.popupTitle) && this.isPoppedUp();
if(this.selectedClass) {
if((this.set || this.setTitle) && this.setTo && this.isSelected()) {
$tw.utils.pushTop(classes,this.selectedClass.split(" "));
}
if(isPoppedUp) {
$tw.utils.pushTop(classes,this.selectedClass.split(" "));
}
}
if(isPoppedUp) {
$tw.utils.pushTop(classes,"tc-popup-handle");
}
domNode.className = classes.join(" ");
// Assign other attributes // Assign other attributes
if(this.style) { if(this.style) {
domNode.setAttribute("style",this.style); domNode.setAttribute("style",this.style);
@ -192,7 +205,7 @@ ButtonWidget.prototype.execute = function() {
this["aria-label"] = this.getAttribute("aria-label"); this["aria-label"] = this.getAttribute("aria-label");
this.tooltip = this.getAttribute("tooltip"); this.tooltip = this.getAttribute("tooltip");
this.style = this.getAttribute("style"); this.style = this.getAttribute("style");
// Class attribute is handled in assignDomNodeClasses() this["class"] = this.getAttribute("class","");
this.selectedClass = this.getAttribute("selectedClass"); this.selectedClass = this.getAttribute("selectedClass");
this.defaultSetValue = this.getAttribute("default",""); this.defaultSetValue = this.getAttribute("default","");
this.buttonTag = this.getAttribute("tag"); this.buttonTag = this.getAttribute("tag");
@ -208,21 +221,22 @@ ButtonWidget.prototype.execute = function() {
this.makeChildWidgets(); this.makeChildWidgets();
}; };
ButtonWidget.prototype.assignDomNodeClasses = function() { ButtonWidget.prototype.updateDomNodeClasses = function() {
var classes = this.getAttribute("class","").split(" "), var domNodeClasses = this.domNode.className.split(" "),
isPoppedUp = (this.popup || this.popupTitle) && this.isPoppedUp(); oldClasses = this.class.split(" "),
if(this.selectedClass) { newClasses;
if((this.set || this.setTitle) && this.setTo && this.isSelected()) { this["class"] = this.getAttribute("class","");
$tw.utils.pushTop(classes,this.selectedClass.split(" ")); newClasses = this.class.split(" ");
//Remove classes assigned from the old value of class attribute
$tw.utils.each(oldClasses,function(oldClass){
var i = domNodeClasses.indexOf(oldClass);
if(i !== -1) {
domNodeClasses.splice(i,1);
} }
if(isPoppedUp) { });
$tw.utils.pushTop(classes,this.selectedClass.split(" ")); //Add new classes from updated class attribute.
} $tw.utils.pushTop(domNodeClasses,newClasses);
} this.domNode.className = domNodeClasses.join(" ");
if(isPoppedUp) {
$tw.utils.pushTop(classes,"tc-popup-handle");
}
this.domNode.className = classes.join(" ");
} }
/* /*
@ -234,7 +248,7 @@ ButtonWidget.prototype.refresh = function(changedTiddlers) {
this.refreshSelf(); this.refreshSelf();
return true; return true;
} else if(changedAttributes["class"]) { } else if(changedAttributes["class"]) {
this.assignDomNodeClasses(); this.updateDomNodeClasses();
} }
return this.refreshChildren(changedTiddlers); return this.refreshChildren(changedTiddlers);
}; };