mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2026-10-10 18:11:41 +00:00
Add class assignment to DOM node in editors (#9965)
* Add class assignment to DOM node in editor * Fix indentation in assignDomNodeClasses method * Fix conditional check for changedAttributes class * Improve class assignment in EditTextWidget Refactor class assignment logic to avoid duplicates and handle whitespace. * Refactor DOM class assignment in EditTextWidget * Refactor updateDomNodeClasses for clarity and efficiency * Add changenote for enhancement in editor refresh behavior
This commit is contained in:
@@ -210,6 +210,29 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
|
||||
this.editShowToolbar = this.wiki.getTiddlerText(ENABLE_TOOLBAR_TITLE,"yes");
|
||||
this.editShowToolbar = (this.editShowToolbar === "yes") && !!(this.children && this.children.length > 0) && (!this.document.isTiddlyWikiFakeDom);
|
||||
};
|
||||
|
||||
EditTextWidget.prototype.updateDomNodeClasses = function() {
|
||||
var domNodeClasses = this.engine.domNode.className.split(/\s+/).filter(Boolean),
|
||||
oldClasses = this.editClass.split(/\s+/).filter(Boolean),
|
||||
newClasses;
|
||||
|
||||
this.editClass = this.getAttribute("class","");
|
||||
newClasses = this.editClass.split(/\s+/).filter(Boolean);
|
||||
|
||||
// Remove classes assigned from the old value of the class attribute
|
||||
domNodeClasses = domNodeClasses.filter(function(className) {
|
||||
return !oldClasses.includes(className);
|
||||
});
|
||||
|
||||
// Add new classes from the updated class attribute
|
||||
domNodeClasses = domNodeClasses.concat(
|
||||
newClasses.filter(function(className) {
|
||||
return !domNodeClasses.includes(className);
|
||||
})
|
||||
);
|
||||
|
||||
this.engine.domNode.className = domNodeClasses.join(" ");
|
||||
};
|
||||
|
||||
/*
|
||||
Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
|
||||
@@ -217,7 +240,7 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
|
||||
EditTextWidget.prototype.refresh = function(changedTiddlers) {
|
||||
var changedAttributes = this.computeAttributes();
|
||||
// Completely rerender if any of our attributes have changed
|
||||
if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes["default"] || changedAttributes["class"] || changedAttributes.placeholder || changedAttributes.size || changedAttributes.autoHeight || changedAttributes.minHeight || changedAttributes.focusPopup || changedAttributes.rows || changedAttributes.tabindex || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || changedTiddlers[HEIGHT_MODE_TITLE] || changedTiddlers[ENABLE_TOOLBAR_TITLE] || changedTiddlers["$:/palette"] || changedAttributes.disabled || changedAttributes.fileDrop) {
|
||||
if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes["default"] || changedAttributes.placeholder || changedAttributes.size || changedAttributes.autoHeight || changedAttributes.minHeight || changedAttributes.focusPopup || changedAttributes.rows || changedAttributes.tabindex || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || changedTiddlers[HEIGHT_MODE_TITLE] || changedTiddlers[ENABLE_TOOLBAR_TITLE] || changedTiddlers["$:/palette"] || changedAttributes.disabled || changedAttributes.fileDrop) {
|
||||
this.refreshSelf();
|
||||
return true;
|
||||
} else if(changedTiddlers[this.editRefreshTitle]) {
|
||||
@@ -226,6 +249,9 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
|
||||
var editInfo = this.getEditInfo();
|
||||
this.updateEditor(editInfo.value,editInfo.type);
|
||||
}
|
||||
if(changedAttributes["class"]) {
|
||||
this.updateDomNodeClasses();
|
||||
}
|
||||
this.engine.fixHeight();
|
||||
if(this.editShowToolbar) {
|
||||
return this.refreshChildren(changedTiddlers);
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
title: $:/changenotes/5.5.0/#9965
|
||||
created: 20260812171534862
|
||||
modified: 20260812171534862
|
||||
tags: $:/tags/ChangeNote
|
||||
change-type: enhancement
|
||||
change-category: usability
|
||||
description: Change of the class attribute of editors does no more completely refresh the widget
|
||||
release: 5.5.0
|
||||
github-links: https://github.com/TiddlyWiki/TiddlyWiki5/pull/9965
|
||||
github-contributors: BurningTreeC
|
||||
type: text/vnd.tiddlywiki
|
||||
|
||||
This pull request changes the way editors refresh when their `class` attribute changes.
|
||||
They did refresh the widget completely. Now they just assign the new classes.
|
||||
Reference in New Issue
Block a user