mirrors
/
TiddlyWiki5
mirror of https://github.com/Jermolene/TiddlyWiki5
1
0
Fork 0
Code Issues Releases Wiki Activity

Refactor to use existing widget.assignAttributes() method

This commit is contained in:
Jeremy Ruston 2023-11-12 22:05:25 +00:00
parent 08d6560391
commit 793692a4e4
7 changed files with 54 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
core/modules/widgets/browse.js
View File

@ -71,7 +71,10 @@ BrowseWidget.prototype.render = function(parent,nextSibling) {
return false;
},false);
// Assign data- attributes
this.updateDomNodeDataAttributes(null,domNode);
this.assignAttributes(domNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
// Insert element
parent.insertBefore(domNode,nextSibling);
this.renderChildren(domNode,null);

11
core/modules/widgets/button.js
View File

@ -60,7 +60,10 @@ ButtonWidget.prototype.render = function(parent,nextSibling) {
}
domNode.className = classes.join(" ");
// Assign data- attributes
this.updateDomNodeDataAttributes();
this.assignAttributes(domNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
// Assign other attributes
if(this.style) {
domNode.setAttribute("style",this.style);
@ -266,7 +269,11 @@ ButtonWidget.prototype.refresh = function(changedTiddlers) {
if(changedAttributes["class"]) {
this.updateDomNodeClasses();
}
this.updateDomNodeDataAttributes(changedAttributes);
this.assignAttributes(domNode,{
changedAttributes: changedAttributes,
sourcePrefix: "data-",
destPrefix: "data-"
});
}
return this.refreshChildren(changedTiddlers);
};

5
core/modules/widgets/checkbox.js
View File

@ -54,7 +54,10 @@ CheckboxWidget.prototype.render = function(parent,nextSibling) {
this.spanDomNode = this.document.createElement("span");
this.labelDomNode.appendChild(this.spanDomNode);
// Assign data- attributes
this.updateDomNodeDataAttributes(null,this.inputDomNode);
this.assignAttributes(this.inputDomNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
// Add a click event handler
$tw.utils.addEventListeners(this.inputDomNode,[
{name: "change", handlerObject: this, handlerMethod: "handleChangeEvent"}

5
core/modules/widgets/link.js
View File

@ -44,7 +44,10 @@ LinkWidget.prototype.render = function(parent,nextSibling) {
// Just insert the link text
var domNode = this.document.createElement("span");
// Assign data- attributes
this.updateDomNodeDataAttributes(null,domNode);
this.assignAttributes(domNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
parent.insertBefore(domNode,nextSibling);
this.renderChildren(domNode,null);
this.domNodes.push(domNode);

5
core/modules/widgets/radio.js
View File

@ -40,7 +40,10 @@ RadioWidget.prototype.render = function(parent,nextSibling) {
);
this.inputDomNode = this.document.createElement("input");
this.inputDomNode.setAttribute("type","radio");
this.updateDomNodeDataAttributes(null,this.inputDomNode);
this.assignAttributes(this.inputDomNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
if(isChecked) {
this.inputDomNode.checked = true;
}

5
core/modules/widgets/range.js
View File

@ -50,7 +50,10 @@ RangeWidget.prototype.render = function(parent,nextSibling) {
this.inputDomNode.setAttribute("disabled",true);
}
this.inputDomNode.value = this.getValue();
this.updateDomNodeDataAttributes(null,this.inputDomNode);
this.assignAttributes(this.inputDomNode,{
sourcePrefix: "data-",
destPrefix: "data-"
});
// Add a click event handler
$tw.utils.addEventListeners(this.inputDomNode,[
{name:"mousedown", handlerObject:this, handlerMethod:"handleMouseDownEvent"},

66
core/modules/widgets/widget.js
View File

@ -413,16 +413,23 @@ Widget.prototype.getAttribute = function(name,defaultText) {
};
/*
Assign the computed attributes of the widget to a domNode
Assign the common attributes of the widget to a domNode
options include:
excludeEventAttributes: ignores attributes whose name begins with "on"
sourcePrefix: prefix of attributes that are to be directly assigned (defaults to the emtpy string)
destPrefix: prefix to be applied to attribute names that are to be directly assigned (defaults to the emtpy string)
changedAttributes: hashmap by attribute name of attributes to process (if missing, process all attributes)
excludeEventAttributes: ignores attributes whose name would begin with "on"
*/
Widget.prototype.assignAttributes = function(domNode,options) {
options = options || {};
var self = this;
options = options || {};
var changedAttributes = options.changedAttributes || this.attributes;
var sourcePrefix = options.sourcePrefix || "";
var destPrefix = options.destPrefix || "";
var EVENT_ATTRIBUTE_PREFIX = "on";
var assignAttribute = function(name,value) {
// Check for excluded attribute names
if(options.excludeEventAttributes && name.substr(0,2) === "on") {
if(options.excludeEventAttributes && name.substr(0,2).toLowerCase() === EVENT_ATTRIBUTE_PREFIX) {
value = undefined;
}
if(value !== undefined) {
@ -432,28 +439,23 @@ Widget.prototype.assignAttributes = function(domNode,options) {
namespace = "http://www.w3.org/1999/xlink";
name = name.substr(6);
}
// Handle styles
if(name.substr(0,6) === "style." && name.length > 6) {
domNode.style[$tw.utils.unHyphenateCss(name.substr(6))] = value;
} else {
// Setting certain attributes can cause a DOM error (eg xmlns on the svg element)
try {
domNode.setAttributeNS(namespace,name,value);
} catch(e) {
}
// Setting certain attributes can cause a DOM error (eg xmlns on the svg element)
try {
domNode.setAttributeNS(namespace,name,value);
} catch(e) {
}
}
}
// Not all parse tree nodes have the orderedAttributes property
if(this.parseTreeNode.orderedAttributes) {
$tw.utils.each(this.parseTreeNode.orderedAttributes,function(attribute,index) {
assignAttribute(attribute.name,self.attributes[attribute.name]);
});
} else {
$tw.utils.each(Object.keys(self.attributes).sort(),function(name) {
assignAttribute(name,self.attributes[name]);
});
}
$tw.utils.each(changedAttributes,function(value,name) {
value = self.getAttribute(name);
// Check for a prefixed attribute
if(name.substr(0,sourcePrefix.length) === sourcePrefix) {
domNode.setAttribute(destPrefix + name.substr(sourcePrefix.length),value);
// Check for a style attribute
} else if(name.substr(0,6) === "style." && name.length > 6) {
domNode.style[$tw.utils.unHyphenateCss(name.substr(6))] = value;
}
});
};
/*
@ -811,24 +813,6 @@ Widget.evaluateVariable = function(widget,name,options) {
return result;
};
/*
Set/update the data- attributes of a DOM node according to the attributes of a widget
changedAttributes: hashmap by name of attributes that have changed (the values of the hashmap entry doesn't matter)
domNode: optional domNode to be assigned
*/
Widget.prototype.updateDomNodeDataAttributes = function(changedAttributes,domNode) {
var self = this;
changedAttributes = changedAttributes || this.attributes;
domNode = domNode || this.domNode;
var DATA_ATTRIBUTE_PREFIX = "data-";
$tw.utils.each(changedAttributes,function(value,name) {
value = self.getAttribute(name);
if(name.substr(0,DATA_ATTRIBUTE_PREFIX.length) === DATA_ATTRIBUTE_PREFIX) {
domNode.setAttribute(name,value);
}
});
};
/*
Set the data- attributes of a parse tree node according to the attributes of the widget
domNode: optional domNode to be assigned