diff options
| author | Terry Truong <terry06890@gmail.com> | 2022-05-18 22:24:52 +1000 |
|---|---|---|
| committer | Terry Truong <terry06890@gmail.com> | 2022-05-19 12:04:16 +1000 |
| commit | 80057ee1ffe3dbceceb9ae98c4e84e56847a4899 (patch) | |
| tree | 436fcaeb65e54983c74ab14d9105a569da934338 | |
| parent | 52560266b585e63742a81e27a3b6f1ef194470c6 (diff) | |
Fix not scrolling to focused nodes
| -rw-r--r-- | backend/data/README.md | 2 | ||||
| -rw-r--r-- | src/components/Tile.vue | 22 |
2 files changed, 13 insertions, 11 deletions
diff --git a/backend/data/README.md b/backend/data/README.md index 3df4268..44219da 100644 --- a/backend/data/README.md +++ b/backend/data/README.md @@ -36,7 +36,7 @@ data.db Tables - names: name TEXT, alt\_name TEXT, pref\_alt INT, PRIMARY KEY(name, alt\_name) - eol\_ids: id INT PRIMARY KEY, name TEXT - images: eol\_id INT PRIMARY KEY, source\_url TEXT, license TEXT, copyright\_owner TEXT -- descs: name TEXT PRIMARY KEY, desc TEXT, redirected INT, wiki\_id INT, from_dbp INT +- descs: name TEXT PRIMARY KEY, desc TEXT, redirected INT, wiki\_id INT, from\_dbp INT - r\_nodes: name TEXT PRIMARY KEY, tips INT - r\_edges: node TEXT, child TEXT, p\_support INT, PRIMARY KEY (node, child) diff --git a/src/components/Tile.vue b/src/components/Tile.vue index 1b765e8..0a404e6 100644 --- a/src/components/Tile.vue +++ b/src/components/Tile.vue @@ -60,6 +60,9 @@ export default defineComponent({ } return children.slice(firstIdx, lastIdx); }, + hasFocusedChild(): boolean { + return this.layoutNode.children.some(n => n.hasFocus); + }, // Basic abbreviations isLeaf(): boolean { return this.layoutNode.children.length == 0; @@ -306,6 +309,15 @@ export default defineComponent({ failFlag(){ this.triggerAnimation(this.isLeaf ? 'animate-expand-shrink' : 'animate-shrink-expand'); }, + // For scrolling to a focused child if overflownRoot + hasFocusedChild(newVal, oldVal){ + if (newVal && this.isOverflownRoot){ + let focusedChild = this.layoutNode.children.find(n => n.hasFocus) + let bottomY = focusedChild.pos[1] + focusedChild.dims[1] + this.lytOpts.tileSpacing; + let scrollTop = Math.max(0, bottomY - (this.overflownDim / 2)); // 'scrollTop' won't go over max + this.$el.scrollTop = scrollTop; + } + }, }, methods: { // Click handling @@ -372,7 +384,6 @@ export default defineComponent({ onScroll(evt: Event){ if (this.pendingScrollHdlr == 0){ this.pendingScrollHdlr = setTimeout(() => { - console.log('handling scroll') this.scrollOffset = this.$el.scrollTop; this.pendingScrollHdlr = 0; }, 50); @@ -384,15 +395,6 @@ export default defineComponent({ this.inTransition = false; this.wasClicked = false; this.hasExpanded = this.layoutNode.children.length > 0; - // Scroll to any focused node - if (this.isOverflownRoot){ - let focusedChild = this.layoutNode.children.find(n => n.hasFocus); - if (focusedChild != null){ - let bottomY = focusedChild.pos[1] + focusedChild.dims[1] + this.lytOpts.tileSpacing; - let scrollTop = Math.max(0, bottomY - this.overflownDim); - this.$el.scrollTop = scrollTop; - } - } } }, triggerAnimation(animation: string){ |