keep focus when clicking on edit read only note

2025-10-31 18:36:30 +01:00 · 2021-06-24 23:50:56 +02:00
parent f1a36f6cea
commit 1b9c3b0759
8 changed files with 99 additions and 83 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -1039,9 +1039,9 @@
      }
    },
    "acorn": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.3.0.tgz",
-      "integrity": "sha512-tqPKHZ5CaBJw0Xmy0ZZvLs1qTV+BNFSyvn77ASXkpBNfIRk8ev26fKrD9iLGwGA9zedPao52GSHzq8lyZG0NUw==",
+      "version": "8.4.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.4.1.tgz",
+      "integrity": "sha512-asabaBSkEKosYKMITunzX177CXxQ4Q8BSSzMTKD+FefUhipQC70gfW5SiUDhYQ3vk8G+81HqQk7Fv9OXwwn9KA==",
      "dev": true
    },
    "acorn-globals": {
@@ -1697,14 +1697,6 @@
        "electron-to-chromium": "^1.3.723",
        "escalade": "^3.1.1",
        "node-releases": "^1.1.71"
-      },
-      "dependencies": {
-        "colorette": {
-          "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
-          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
-          "dev": true
-        }
      }
    },
    "buffer": {
@@ -1944,9 +1936,9 @@
      "dev": true
    },
    "caniuse-lite": {
-      "version": "1.0.30001233",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001233.tgz",
-      "integrity": "sha512-BmkbxLfStqiPA7IEzQpIk0UFZFf3A4E6fzjPJ6OR+bFC2L8ES9J8zGA/asoi47p8XDVkev+WJo2I2Nc8c/34Yg==",
+      "version": "1.0.30001239",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001239.tgz",
+      "integrity": "sha512-cyBkXJDMeI4wthy8xJ2FvDU6+0dtcZSJW3voUF8+e9f1bBeuvyZfc3PNbkOETyhbR+dGCPzn9E7MA3iwzusOhQ==",
      "dev": true
    },
    "caseless": {
@@ -2002,18 +1994,18 @@
      }
    },
    "chokidar": {
-      "version": "3.5.1",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.1.tgz",
-      "integrity": "sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==",
+      "version": "3.5.2",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz",
+      "integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==",
      "requires": {
-        "anymatch": "~3.1.1",
+        "anymatch": "~3.1.2",
        "braces": "~3.0.2",
-        "fsevents": "~2.3.1",
-        "glob-parent": "~5.1.0",
+        "fsevents": "~2.3.2",
+        "glob-parent": "~5.1.2",
        "is-binary-path": "~2.1.0",
        "is-glob": "~4.0.1",
        "normalize-path": "~3.0.0",
-        "readdirp": "~3.5.0"
+        "readdirp": "~3.6.0"
      }
    },
    "chownr": {
@@ -2256,9 +2248,9 @@
      "integrity": "sha512-P0CysNDQ7rtVw4QIQtm+MRxV66vKFSvlsQvGYXZWR3qFU0jlMKHZZZgw8e+8DSah4UDKMqnknRDQz+xuQXQ/Zg=="
    },
    "commonmark": {
-      "version": "0.29.3",
-      "resolved": "https://registry.npmjs.org/commonmark/-/commonmark-0.29.3.tgz",
-      "integrity": "sha512-fvt/NdOFKaL2gyhltSy6BC4LxbbxbnPxBMl923ittqO/JBM0wQHaoYZliE4tp26cRxX/ZZtRsJlZzQrVdUkXAA==",
+      "version": "0.30.0",
+      "resolved": "https://registry.npmjs.org/commonmark/-/commonmark-0.30.0.tgz",
+      "integrity": "sha512-j1yoUo4gxPND1JWV9xj5ELih0yMv1iCWDG6eEQIPLSWLxzCXiFoyS7kvB+WwU+tZMf4snwJMMtaubV0laFpiBA==",
      "requires": {
        "entities": "~2.0",
        "mdurl": "~1.0.1",
@@ -2984,9 +2976,9 @@
      }
    },
    "electron": {
-      "version": "13.1.2",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-13.1.2.tgz",
-      "integrity": "sha512-aNT9t+LgdQaZ7FgN36pN7MjSEoj+EWc2T9yuOqBApbmR4HavGRadSz7u9N2Erw2ojdIXtei2RVIAvVm8mbDZ0g==",
+      "version": "13.1.4",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-13.1.4.tgz",
+      "integrity": "sha512-4qhRZbRvGqHmMWsCG/kRVF4X8VIq9Nujgm+gXZLBSpiR6uUtMHy7ViBTQZl1PGf6O9Ppxhpr9Yz+k6Um9WoP3Q==",
      "dev": true,
      "requires": {
        "@electron/get": "^1.0.1",
@@ -2995,9 +2987,9 @@
      },
      "dependencies": {
        "@types/node": {
-          "version": "14.17.3",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-14.17.3.tgz",
-          "integrity": "sha512-e6ZowgGJmTuXa3GyaPbTGxX17tnThl2aSSizrFthQ7m9uLGZBXiGhgE55cjRZTF5kjZvYn9EOPOMljdjwbflxw==",
+          "version": "14.17.4",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-14.17.4.tgz",
+          "integrity": "sha512-8kQ3+wKGRNN0ghtEn7EGps/B8CzuBz1nXZEIGGLP2GnwbqYn4dbTs7k+VKLTq1HvZLRCIDtN3Snx1Ege8B7L5A==",
          "dev": true
        }
      }
@@ -3783,9 +3775,9 @@
      }
    },
    "electron-to-chromium": {
-      "version": "1.3.743",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.743.tgz",
-      "integrity": "sha512-K2wXfo9iZQzNJNx67+Pld0DRF+9bYinj62gXCdgPhcu1vidwVuLPHQPPFnCdO55njWigXXpfBiT90jGUPbw8Zg==",
+      "version": "1.3.756",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.756.tgz",
+      "integrity": "sha512-WsmJym1TMeHVndjPjczTFbnRR/c4sbzg8fBFtuhlb2Sru3i/S1VGpzDSrv/It8ctMU2bj8G7g7/O3FzYMGw6eA==",
      "dev": true
    },
    "electron-window-state": {
@@ -3861,9 +3853,9 @@
      }
    },
    "es-module-lexer": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-0.4.1.tgz",
-      "integrity": "sha512-ooYciCUtfw6/d2w56UVeqHPcoCFAiJdz5XOkYpv/Txl1HMUozpXjz/2RIQgqwKdXNDPSF1W7mJCFse3G+HDyAA==",
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-0.6.0.tgz",
+      "integrity": "sha512-f8kcHX1ArhllUtb/wVSyvygoKCznIjnxhLxy7TCvIiMdT7fL4ZDTIKaadMe6eLvOXg6Wk02UeoFgUoZ2EKZZUA==",
      "dev": true
    },
    "es6-error": {
@@ -6057,9 +6049,9 @@
      }
    },
    "node-releases": {
-      "version": "1.1.72",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.72.tgz",
-      "integrity": "sha512-LLUo+PpH3dU6XizX3iVoubUNheF/owjXCZZ5yACDxNnPtgFuludV1ZL3ayK1kVep42Rmm0+R9/Y60NQbZ2bifw==",
+      "version": "1.1.73",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+      "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
      "dev": true
    },
    "noop-logger": {
@@ -6245,9 +6237,9 @@
      }
    },
    "open": {
-      "version": "8.2.0",
-      "resolved": "https://registry.npmjs.org/open/-/open-8.2.0.tgz",
-      "integrity": "sha512-O8uInONB4asyY3qUcEytpgwxQG3O0fJ/hlssoUHsBboOIRVZzT6Wq+Rwj5nffbeUhOdMjpXeISpDDzHCMRDuOQ==",
+      "version": "8.2.1",
+      "resolved": "https://registry.npmjs.org/open/-/open-8.2.1.tgz",
+      "integrity": "sha512-rXILpcQlkF/QuFez2BJDf3GsqpjGKbkUUToAIGo9A0Q6ZkoSGogZJulrUdwRkrAsoQvoZsrjCYt8+zblOk7JQQ==",
      "requires": {
        "define-lazy-prop": "^2.0.0",
        "is-docker": "^2.1.1",
@@ -6511,9 +6503,9 @@
      "integrity": "sha512-CzFr90qM24ju5f88quFC/6qohjC144rehe5n6DH900lgXmUe86+xCKc10ev56gRKC4/BkHUoG4uSiQgBiIXwDA=="
    },
    "picomatch": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.3.tgz",
-      "integrity": "sha512-KpELjfwcCDUb9PeigTs2mBJzXUPzAuP2oPcA989He8Rte0+YUAjw1JVedDhuTKPkHjSYzMN3npC9luThGYEKdg=="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
+      "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw=="
    },
    "pify": {
      "version": "2.3.0",
@@ -6859,9 +6851,9 @@
      }
    },
    "readdirp": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.5.0.tgz",
-      "integrity": "sha512-cMhu7c/8rdhkHXWsY+osBhfSy0JikwpHK/5+imo+LpeasTF8ouErHrlYkwT0++njiyuDvc7OFY5T3ukvZ8qmFQ==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
      "requires": {
        "picomatch": "^2.2.1"
      }
@@ -7652,9 +7644,9 @@
      }
    },
    "striptags": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/striptags/-/striptags-3.1.1.tgz",
-      "integrity": "sha1-yMPn/db7S7OjKjt1LltePjgJPr0="
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/striptags/-/striptags-3.2.0.tgz",
+      "integrity": "sha512-g45ZOGzHDMe2bdYMdIvdAfCQkCTDMGBazSw1ypMowwGIee7ZQ5dU0rBJ8Jqgl+jAKIv4dbeE1jscZq9wid1Tkw=="
    },
    "supports-color": {
      "version": "7.2.0",
@@ -8240,9 +8232,9 @@
      "integrity": "sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w=="
    },
    "webpack": {
-      "version": "5.38.1",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.38.1.tgz",
-      "integrity": "sha512-OqRmYD1OJbHZph6RUMD93GcCZy4Z4wC0ele4FXyYF0J6AxO1vOSuIlU1hkS/lDlR9CDYBz64MZRmdbdnFFoT2g==",
+      "version": "5.40.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.40.0.tgz",
+      "integrity": "sha512-c7f5e/WWrxXWUzQqTBg54vBs5RgcAgpvKE4F4VegVgfo4x660ZxYUF2/hpMkZUnLjgytVTitjeXaN4IPlXCGIw==",
      "dev": true,
      "requires": {
        "@types/eslint-scope": "^3.7.0",
@@ -8254,7 +8246,7 @@
        "browserslist": "^4.14.5",
        "chrome-trace-event": "^1.0.2",
        "enhanced-resolve": "^5.8.0",
-        "es-module-lexer": "^0.4.0",
+        "es-module-lexer": "^0.6.0",
        "eslint-scope": "5.1.1",
        "events": "^3.2.0",
        "glob-to-regexp": "^0.4.1",
@@ -8265,7 +8257,7 @@
        "neo-async": "^2.6.2",
        "schema-utils": "^3.0.0",
        "tapable": "^2.1.1",
-        "terser-webpack-plugin": "^5.1.1",
+        "terser-webpack-plugin": "^5.1.3",
        "watchpack": "^2.2.0",
        "webpack-sources": "^2.3.0"
      }
@@ -8522,9 +8514,9 @@
      }
    },
    "ws": {
-      "version": "7.4.6",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz",
-      "integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A=="
+      "version": "7.5.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.0.tgz",
+      "integrity": "sha512-6ezXvzOZupqKj4jUqbQ9tXuJNo+BR2gU8fFRk3XCP3e0G6WT414u5ELe6Y0vtp7kmSJ3F7YWObSNr1ESsgi4vw=="
    },
    "xdg-basedir": {
      "version": "4.0.0",
--- a/package.json
+++ b/package.json
@@ -29,9 +29,9 @@
    "axios": "0.21.1",
    "better-sqlite3": "7.1.4",
    "body-parser": "1.19.0",
-    "chokidar": "^3.5.1",
+    "chokidar": "3.5.2",
    "cls-hooked": "4.2.2",
-    "commonmark": "0.29.3",
+    "commonmark": "0.30.0",
    "cookie-parser": "1.4.5",
    "csurf": "1.11.0",
    "dayjs": "1.10.5",
@@ -60,7 +60,7 @@
    "mime-types": "2.1.31",
    "multer": "1.4.2",
    "node-abi": "2.30.0",
-    "open": "8.2.0",
+    "open": "8.2.1",
    "portscanner": "2.2.0",
    "rand-token": "1.0.1",
    "request": "^2.88.2",
@@ -72,16 +72,16 @@
    "serve-favicon": "2.5.0",
    "session-file-store": "1.5.0",
    "stream-throttle": "^0.1.3",
-    "striptags": "3.1.1",
+    "striptags": "3.2.0",
    "tmp": "^0.2.1",
    "turndown": "7.0.0",
    "unescape": "1.0.1",
-    "ws": "7.4.6",
+    "ws": "7.5.0",
    "yauzl": "2.10.0"
  },
  "devDependencies": {
    "cross-env": "7.0.3",
-    "electron": "13.1.2",
+    "electron": "13.1.4",
    "electron-builder": "22.11.7",
    "electron-packager": "15.2.0",
    "electron-rebuild": "2.3.5",
@@ -90,7 +90,7 @@
    "jsdoc": "3.6.7",
    "lorem-ipsum": "2.0.3",
    "rcedit": "3.0.0",
-    "webpack": "5.38.1",
+    "webpack": "5.40.0",
    "webpack-cli": "4.7.2"
  },
  "optionalDependencies": {
--- a/src/public/app/services/note_context.js
+++ b/src/public/app/services/note_context.js
@@ -40,7 +40,6 @@ class NoteContext extends Component {
        this.notePath = resolvedNotePath;
        this.noteId = treeService.getNoteIdFromNotePath(resolvedNotePath);

-        this.readOnlyTemporarilyDisabled = false;
        this.readOnlyTemporarilyDisabled = false;

        this.saveToRecentNotes(resolvedNotePath);
@@ -182,7 +181,8 @@ class NoteContext extends Component {
            return false;
        }

-        if (this.note.type !== 'text' && this.note.type !== 'code') {
+        // "readOnly" is a state valid only for text/code notes
+        if (!this.note || this.note.type !== 'text' && this.note.type !== 'code') {
            return false;
        }

--- a/src/public/app/widgets/buttons/edit_button.js
+++ b/src/public/app/widgets/buttons/edit_button.js
@@ -1,4 +1,5 @@
 import ButtonWidget from "./button_widget.js";
+import appContext from "../../services/app_context.js";

 export default class EditButton extends ButtonWidget {
    isEnabled() {
@@ -14,7 +15,7 @@ export default class EditButton extends ButtonWidget {
            .onClick(widget => {
                this.noteContext.readOnlyTemporarilyDisabled = true;

-                this.triggerEvent('readOnlyTemporarilyDisabled', {noteContext: this.noteContext});
+                appContext.triggerEvent('readOnlyTemporarilyDisabled', {noteContext: this.noteContext});

                this.refresh();
            });
--- a/src/public/app/widgets/containers/scrolling_container.js
+++ b/src/public/app/widgets/containers/scrolling_container.js
@@ -7,10 +7,38 @@ export default class ScrollingContainer extends Container {
        this.css('overflow', 'auto');
    }

+    setNoteContextEvent({noteContext}) {
+        /** @var {NoteContext} */
+        this.noteContext = noteContext;
+    }
+
    async noteSwitchedEvent({noteContext, notePath}) {
-        // if notePath does not match then the noteContext has been switched to another note in the mean time
-        if (noteContext.notePath === notePath) {
        this.$widget.scrollTop(0);
    }
+
+    async noteSwitchedAndActivatedEvent({noteContext, notePath}) {
+        this.noteContext = noteContext;
+
+        this.$widget.scrollTop(0);
+    }
+
+    async activeContextChangedEvent({noteContext}) {
+        this.noteContext = noteContext;
+    }
+
+    handleEventInChildren(name, data) {
+        if (name === 'readOnlyTemporarilyDisabled'
+                && this.noteContext
+                && this.noteContext.ntxId === data.noteContext.ntxId) {
+
+            const scrollTop = this.$widget.scrollTop();
+
+            const promise = super.handleEventInChildren(name, data);
+
+            promise.then(() => setTimeout(() => this.$widget.scrollTop(scrollTop), 500));
+        }
+        else {
+            return super.handleEventInChildren(name, data);
+        }
    }
 }
--- a/src/public/app/widgets/note_detail.js
+++ b/src/public/app/widgets/note_detail.js
@@ -271,12 +271,6 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
        }
    }

-    readOnlyTemporarilyDisabledEvent({noteContext}) {
-        if (this.isNoteContext(noteContext.ntxId)) {
-            this.refresh();
-        }
-    }
-
    async cutIntoNoteCommand() {
        const note = appContext.tabManager.getActiveContextNote();

--- a/src/public/app/widgets/type_widgets/read_only_code.js
+++ b/src/public/app/widgets/type_widgets/read_only_code.js
@@ -1,18 +1,18 @@
 import TypeWidget from "./type_widget.js";

 const TPL = `
-<div class="note-detail-read-only-code note-detail-printable">
+<div class="note-detail-readonly-code note-detail-printable">
    <style>
-    .note-detail-read-only-code {
+    .note-detail-readonly-code {
        min-height: 50px;
    }
    
-    .note-detail-read-only-code-content {
+    .note-detail-readonly-code-content {
        padding: 10px;
    }
    </style>

-    <pre class="note-detail-read-only-code-content"></pre>
+    <pre class="note-detail-readonly-code-content"></pre>
 </div>`;

 export default class ReadOnlyCodeTypeWidget extends TypeWidget {
@@ -20,7 +20,7 @@ export default class ReadOnlyCodeTypeWidget extends TypeWidget {

    doRender() {
        this.$widget = $(TPL);
-        this.$content = this.$widget.find('.note-detail-read-only-code-content');
+        this.$content = this.$widget.find('.note-detail-readonly-code-content');

        super.doRender();
    }
--- a/src/public/stylesheets/style.css
+++ b/src/public/stylesheets/style.css
@@ -278,6 +278,7 @@ button.btn, button.btn-sm {
 pre:not(.CodeMirror-line) {
    color: var(--main-text-color) !important;
    white-space: pre-wrap;
+    font-size: 100%;
 }

 .pointer {