Fix app/console: log auto scrolling when user isn't at the bottom

skybird23333 · Dec 1, 2022 · cccc6bb · cccc6bb
1 parent c81dd8b
commit cccc6bb
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 12 deletions.
diff --git a/app/components/Console/ConsoleComponent.vue b/app/components/Console/ConsoleComponent.vue
@@ -24,27 +24,23 @@ export default {
   },
   methods: {
     append(line, type) {
+      console.log(this.$refs.logview.scrollTop + 200, 'scrolltop')
+      console.log(this.$refs.logview.scrollHeight, 'scrollheight')
+      const isUserScrolledUp = !(this.$refs.logview.scrollTop + 200 == this.$refs.logview.scrollHeight)
       this.lines.push({ text: line, type: type });
       this.$nextTick(() => {
-        this.$refs.logview.scrollTop = this.$refs.logview.scrollHeight;
+        if (!isUserScrolledUp) {
+          this.$refs.logview.scrollTop = this.$refs.logview.scrollHeight;
+        }
       });
     },
     async handleSend(evt) {
       if (evt.keyCode !== 13) return
       if (this.input === "") return;
       this.$client.sendToProcessStdin(this.name, this.input);
-      this.pushLog({
-        type: "stdin",
-        text: this.input,
-      });
+      this.append(this.input, "stdin");
       this.input = "";
     },
-    pushLog(log) {
-      this.lines.push(log);
-      this.$nextTick(() => {
-        this.$refs.logview.scrollTop = this.$refs.logview.scrollHeight;
-      });
-    }
   }
 }
 </script>

diff --git a/app/views/ProcessView.vue b/app/views/ProcessView.vue
@@ -58,7 +58,6 @@ export default {
             this.$refs.console.append(`<div><span class="material-icons">event</span>${data.type}</div>`, data.type)
             break;
         }
-        console.log(data.type)
       } catch (e) {
         console.log(e)
       }