refactor widget constructor

src/public/javascripts/widgets/attributes.js

@@ -5,17 +5,15 @@ import messagingService from "../services/messaging.js";
 import StandardWidget from "./standard_widget.js";
 
 class AttributesWidget extends StandardWidget {
-    constructor(ctx, state) {
-        super(ctx, state);
-
-        this.$title.text("Attributes");
+    getWidgetTitle() { return "Attributes"; }
 
+    getHeaderActions() {
         const $showFullButton = $("<a>").append("show dialog").addClass('widget-header-action');
         $showFullButton.click(() => {
             attributesDialog.showDialog();
         });
 
-        this.$headerActions.append($showFullButton);
+        return [$showFullButton];
     }
 
     async doRenderBody() {

src/public/javascripts/widgets/link_map.js

@@ -24,21 +24,15 @@ const linkOverlays = [
 ];
 
 class LinkMapWidget extends StandardWidget {
-    /**
-     * @param {TabContext} ctx
-     * @param {object} state
-     */
-    constructor(ctx, state) {
-        super(ctx, state);
-
-        this.$title.text("Link map");
+    getWidgetTitle() { return "Link map"; }
 
+    getHeaderActions() {
         const $showFullButton = $("<a>").append("show full").addClass('widget-header-action');
         $showFullButton.click(() => {
             linkMapDialog.showDialog();
         });
 
-        this.$headerActions.append($showFullButton);
+        return [$showFullButton];
     }
 
     async doRenderBody() {

src/public/javascripts/widgets/note_info.js

@@ -26,15 +26,7 @@ const TPL = `
 `;
 
 class NoteInfoWidget extends StandardWidget {
-    /**
-     * @param {TabContext} ctx
-     * @param {object} state
-     */
-    constructor(ctx, state) {
-        super(ctx, state);
-
-        this.$title.text("Note info");
-    }
+    getWidgetTitle() { return "Note info"; }
 
     async doRenderBody() {
         this.$body.html(TPL);

src/public/javascripts/widgets/note_revisions.js

@@ -7,15 +7,7 @@ const TPL = `
 `;
 
 class NoteRevisionsWidget extends StandardWidget {
-    /**
-     * @param {TabContext} ctx
-     * @param {object} state
-     */
-    constructor(ctx, state) {
-        super(ctx, state);
-
-        this.$title.text("Note revisions");
-    }
+    getWidgetTitle() { return "Note revisions"; }
 
     async doRenderBody() {
         const revisionItems = await server.get(`notes/${this.ctx.note.noteId}/revisions`);

src/public/javascripts/widgets/standard_widget.js

@@ -41,9 +41,15 @@ class StandardWidget {
         this.$widget.on('shown.bs.collapse', () => this.ctx.stateChanged());
         this.$widget.on('hidden.bs.collapse', () => this.ctx.stateChanged());
         this.$title = this.$widget.find('.widget-title');
+        this.$title.text(this.getWidgetTitle());
         this.$headerActions = this.$widget.find('.widget-header-actions');
+        this.$headerActions.append(...this.getHeaderActions());
     }
 
+    getWidgetTitle() { return "Untitled widget"; }
+
+    getHeaderActions() { return []; }
+
     async renderBody() {
         if (!this.isVisible() || this.rendered) {
             return;

src/public/stylesheets/style.css

@@ -134,6 +134,7 @@ ul.fancytree-container {
 }
 
 .note-detail-sidebar .widget-header-actions {
+    padding-right: 10px;
 }
 
 .note-detail-sidebar .widget-header-action {