From 4858b24cfe978ad03e90b3fb2e52b006e823cb67 Mon Sep 17 00:00:00 2001 From: Simon Huber Date: Sat, 9 Jan 2021 14:25:48 +0100 Subject: [PATCH] Fix #5308 - WidgetSubclassingMechanism not working with widgets that add EventListeners (or logic ?) in constructor (#5382) * add EventListeners in the render() method instead of the constructor * scrollable widget: add EventListeners in render() method instead of constructor + ... move logic from constructor to render() * linkcatcher: add EventListeners in render() instead of constructor * fieldmangler: add EventListeners in render() instead of constructor * edit-bitmap: initialise editorOperations in render() instead of constructor * list-widget: initialise storyviews in render() instead of constructor * vars widget: execute Widget.call(this) in render() instead of constructor ... not shure what this should do * Update fieldmangler.js * Update edit-bitmap.js * Update linkcatcher.js * Update navigator.js * Update scrollable.js * Update list.js * Update vars.js --- core/modules/widgets/edit-bitmap.js | 10 +++---- core/modules/widgets/fieldmangler.js | 12 ++++----- core/modules/widgets/linkcatcher.js | 6 ++--- core/modules/widgets/list.js | 12 ++++----- core/modules/widgets/navigator.js | 22 +++++++-------- core/modules/widgets/scrollable.js | 40 ++++++++++++++-------------- core/modules/widgets/vars.js | 4 +-- 7 files changed, 53 insertions(+), 53 deletions(-) diff --git a/core/modules/widgets/edit-bitmap.js b/core/modules/widgets/edit-bitmap.js index 0e72b5df1..c6c3dde8c 100644 --- a/core/modules/widgets/edit-bitmap.js +++ b/core/modules/widgets/edit-bitmap.js @@ -25,11 +25,6 @@ var LINE_WIDTH_TITLE = "$:/config/BitmapEditor/LineWidth", var Widget = require("$:/core/modules/widgets/widget.js").widget; var EditBitmapWidget = function(parseTreeNode,options) { - // Initialise the editor operations if they've not been done already - if(!this.editorOperations) { - EditBitmapWidget.prototype.editorOperations = {}; - $tw.modules.applyMethods("bitmapeditoroperation",this.editorOperations); - } this.initialise(parseTreeNode,options); }; @@ -43,6 +38,11 @@ Render this widget into the DOM */ EditBitmapWidget.prototype.render = function(parent,nextSibling) { var self = this; + // Initialise the editor operations if they've not been done already + if(!this.editorOperations) { + EditBitmapWidget.prototype.editorOperations = {}; + $tw.modules.applyMethods("bitmapeditoroperation",this.editorOperations); + } // Save the parent dom node this.parentDomNode = parent; // Compute our attributes diff --git a/core/modules/widgets/fieldmangler.js b/core/modules/widgets/fieldmangler.js index ca0b4f0f4..a8b18ffa1 100644 --- a/core/modules/widgets/fieldmangler.js +++ b/core/modules/widgets/fieldmangler.js @@ -16,12 +16,6 @@ var Widget = require("$:/core/modules/widgets/widget.js").widget; var FieldManglerWidget = function(parseTreeNode,options) { this.initialise(parseTreeNode,options); - this.addEventListeners([ - {type: "tm-remove-field", handler: "handleRemoveFieldEvent"}, - {type: "tm-add-field", handler: "handleAddFieldEvent"}, - {type: "tm-remove-tag", handler: "handleRemoveTagEvent"}, - {type: "tm-add-tag", handler: "handleAddTagEvent"} - ]); }; /* @@ -33,6 +27,12 @@ FieldManglerWidget.prototype = new Widget(); Render this widget into the DOM */ FieldManglerWidget.prototype.render = function(parent,nextSibling) { + this.addEventListeners([ + {type: "tm-remove-field", handler: "handleRemoveFieldEvent"}, + {type: "tm-add-field", handler: "handleAddFieldEvent"}, + {type: "tm-remove-tag", handler: "handleRemoveTagEvent"}, + {type: "tm-add-tag", handler: "handleAddTagEvent"} + ]); this.parentDomNode = parent; this.computeAttributes(); this.execute(); diff --git a/core/modules/widgets/linkcatcher.js b/core/modules/widgets/linkcatcher.js index 28b906b80..616a54c32 100644 --- a/core/modules/widgets/linkcatcher.js +++ b/core/modules/widgets/linkcatcher.js @@ -16,9 +16,6 @@ var Widget = require("$:/core/modules/widgets/widget.js").widget; var LinkCatcherWidget = function(parseTreeNode,options) { this.initialise(parseTreeNode,options); - this.addEventListeners([ - {type: "tm-navigate", handler: "handleNavigateEvent"} - ]); }; /* @@ -30,6 +27,9 @@ LinkCatcherWidget.prototype = new Widget(); Render this widget into the DOM */ LinkCatcherWidget.prototype.render = function(parent,nextSibling) { + this.addEventListeners([ + {type: "tm-navigate", handler: "handleNavigateEvent"} + ]); this.parentDomNode = parent; this.computeAttributes(); this.execute(); diff --git a/core/modules/widgets/list.js b/core/modules/widgets/list.js index 786ce42a9..a49bf01ea 100755 --- a/core/modules/widgets/list.js +++ b/core/modules/widgets/list.js @@ -19,11 +19,6 @@ The list widget creates list element sub-widgets that reach back into the list w */ var ListWidget = function(parseTreeNode,options) { - // Initialise the storyviews if they've not been done already - if(!this.storyViews) { - ListWidget.prototype.storyViews = {}; - $tw.modules.applyMethods("storyview",this.storyViews); - } // Main initialisation inherited from widget.js this.initialise(parseTreeNode,options); }; @@ -37,6 +32,11 @@ ListWidget.prototype = new Widget(); Render this widget into the DOM */ ListWidget.prototype.render = function(parent,nextSibling) { + // Initialise the storyviews if they've not been done already + if(!this.storyViews) { + ListWidget.prototype.storyViews = {}; + $tw.modules.applyMethods("storyview",this.storyViews); + } this.parentDomNode = parent; this.computeAttributes(); this.execute(); @@ -324,4 +324,4 @@ ListItemWidget.prototype.refresh = function(changedTiddlers) { exports.listitem = ListItemWidget; -})(); \ No newline at end of file +})(); diff --git a/core/modules/widgets/navigator.js b/core/modules/widgets/navigator.js index 2f8e2421e..02eee8c43 100755 --- a/core/modules/widgets/navigator.js +++ b/core/modules/widgets/navigator.js @@ -18,6 +18,17 @@ var Widget = require("$:/core/modules/widgets/widget.js").widget; var NavigatorWidget = function(parseTreeNode,options) { this.initialise(parseTreeNode,options); +}; + +/* +Inherit from the base widget class +*/ +NavigatorWidget.prototype = new Widget(); + +/* +Render this widget into the DOM +*/ +NavigatorWidget.prototype.render = function(parent,nextSibling) { this.addEventListeners([ {type: "tm-navigate", handler: "handleNavigateEvent"}, {type: "tm-edit-tiddler", handler: "handleEditTiddlerEvent"}, @@ -36,17 +47,6 @@ var NavigatorWidget = function(parseTreeNode,options) { {type: "tm-unfold-all-tiddlers", handler: "handleUnfoldAllTiddlersEvent"}, {type: "tm-rename-tiddler", handler: "handleRenameTiddlerEvent"} ]); -}; - -/* -Inherit from the base widget class -*/ -NavigatorWidget.prototype = new Widget(); - -/* -Render this widget into the DOM -*/ -NavigatorWidget.prototype.render = function(parent,nextSibling) { this.parentDomNode = parent; this.computeAttributes(); this.execute(); diff --git a/core/modules/widgets/scrollable.js b/core/modules/widgets/scrollable.js index 93f81310a..23be39efd 100644 --- a/core/modules/widgets/scrollable.js +++ b/core/modules/widgets/scrollable.js @@ -16,26 +16,6 @@ var Widget = require("$:/core/modules/widgets/widget.js").widget; var ScrollableWidget = function(parseTreeNode,options) { this.initialise(parseTreeNode,options); - this.scaleFactor = 1; - this.addEventListeners([ - {type: "tm-scroll", handler: "handleScrollEvent"} - ]); - if($tw.browser) { - this.requestAnimationFrame = window.requestAnimationFrame || - window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - function(callback) { - return window.setTimeout(callback, 1000/60); - }; - this.cancelAnimationFrame = window.cancelAnimationFrame || - window.webkitCancelAnimationFrame || - window.webkitCancelRequestAnimationFrame || - window.mozCancelAnimationFrame || - window.mozCancelRequestAnimationFrame || - function(id) { - window.clearTimeout(id); - }; - } }; /* @@ -147,6 +127,26 @@ Render this widget into the DOM */ ScrollableWidget.prototype.render = function(parent,nextSibling) { var self = this; + this.scaleFactor = 1; + this.addEventListeners([ + {type: "tm-scroll", handler: "handleScrollEvent"} + ]); + if($tw.browser) { + this.requestAnimationFrame = window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + function(callback) { + return window.setTimeout(callback, 1000/60); + }; + this.cancelAnimationFrame = window.cancelAnimationFrame || + window.webkitCancelAnimationFrame || + window.webkitCancelRequestAnimationFrame || + window.mozCancelAnimationFrame || + window.mozCancelRequestAnimationFrame || + function(id) { + window.clearTimeout(id); + }; + } // Remember parent this.parentDomNode = parent; // Compute attributes and execute state diff --git a/core/modules/widgets/vars.js b/core/modules/widgets/vars.js index ce443aee5..cbd3e0ddc 100644 --- a/core/modules/widgets/vars.js +++ b/core/modules/widgets/vars.js @@ -22,8 +22,6 @@ This widget allows multiple variables to be set in one go: var Widget = require("$:/core/modules/widgets/widget.js").widget; var VarsWidget = function(parseTreeNode,options) { - // Call the constructor - Widget.call(this); // Initialise this.initialise(parseTreeNode,options); }; @@ -37,6 +35,8 @@ VarsWidget.prototype = Object.create(Widget.prototype); Render this widget into the DOM */ VarsWidget.prototype.render = function(parent,nextSibling) { + // Call the constructor + Widget.call(this); this.parentDomNode = parent; this.computeAttributes(); this.execute();