mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-11-18 08:15:15 +00:00
Code Issues Releases Wiki Activity

Remove flicker when resizing textareas

Browse Source 
The `EditTextWidget.prototype.fixHeight()` function was defering its
work with `nextTick()`, which led to flickering on all browsers when
typing triggers a resize.
This commit is contained in:
Jermolene
2014-11-13 11:19:21 +00:00
parent 1d49e45deb
commit d1bbe7253c
1 changed files with 19 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
core/modules/widgets/edit-text.js
View File

@@ -206,27 +206,25 @@ EditTextWidget.prototype.fixHeight = function() {
var self = this, var self = this,
domNode = this.domNodes[0]; domNode = this.domNodes[0];
if(this.editAutoHeight && domNode && !domNode.isTiddlyWikiFakeDom && this.editTag === "textarea") { if(this.editAutoHeight && domNode && !domNode.isTiddlyWikiFakeDom && this.editTag === "textarea") {
$tw.utils.nextTick(function() { // Resize the textarea to fit its content, preserving scroll position
// Resize the textarea to fit its content, preserving scroll position var scrollPosition = $tw.utils.getScrollPosition(),
var scrollPosition = $tw.utils.getScrollPosition(), scrollTop = scrollPosition.y;
scrollTop = scrollPosition.y; // Measure the specified minimum height
// Measure the specified minimum height domNode.style.height = self.editMinHeight;
domNode.style.height = self.editMinHeight; var minHeight = domNode.offsetHeight;
var minHeight = domNode.offsetHeight; // Set its height to auto so that it snaps to the correct height
// Set its height to auto so that it snaps to the correct height domNode.style.height = "auto";
domNode.style.height = "auto"; // Calculate the revised height
// Calculate the revised height var newHeight = Math.max(domNode.scrollHeight + domNode.offsetHeight - domNode.clientHeight,minHeight);
var newHeight = Math.max(domNode.scrollHeight + domNode.offsetHeight - domNode.clientHeight,minHeight); // Only try to change the height if it has changed
// Only try to change the height if it has changed if(newHeight !== domNode.offsetHeight) {
if(newHeight !== domNode.offsetHeight) { domNode.style.height = newHeight + "px";
domNode.style.height = newHeight + "px"; // Make sure that the dimensions of the textarea are recalculated
// Make sure that the dimensions of the textarea are recalculated $tw.utils.forceLayout(domNode);
$tw.utils.forceLayout(domNode); // Check that the scroll position is still visible before trying to scroll back to it
// Check that the scroll position is still visible before trying to scroll back to it scrollTop = Math.min(scrollTop,self.document.body.scrollHeight - window.innerHeight);
scrollTop = Math.min(scrollTop,self.document.body.scrollHeight - window.innerHeight); window.scrollTo(scrollPosition.x,scrollTop);
window.scrollTo(scrollPosition.x,scrollTop); }
}
});
} }
}; };