From 2d67e54dc91708eaf89eca9dca27cec126f7f465 Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Thu, 26 May 2022 11:09:38 +1000
Subject: Make ancestry-bar scroll-to-end when added to

---
 src/components/AncestryBar.vue | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

(limited to 'src/components/AncestryBar.vue')

diff --git a/src/components/AncestryBar.vue b/src/components/AncestryBar.vue
index 2dd19fb..66c1b13 100644
--- a/src/components/AncestryBar.vue
+++ b/src/components/AncestryBar.vue
@@ -67,6 +67,14 @@ export default defineComponent({
 			};
 		},
 	},
+	watch: {
+		nodes(){
+			setTimeout(() => this.scrollToEnd(), 0); // Without timeout, seems to run before new tiles are added
+		},
+		wideArea(){
+			setTimeout(() => this.scrollToEnd(), 0);
+		},
+	},
 	methods: {
 		onTileClick(node: LayoutNode){
 			this.$emit('detached-ancestor-click', node);
@@ -80,6 +88,16 @@ export default defineComponent({
 				this.$el.scrollLeft -= (evt.deltaY > 0 ? 30 : -30);
 			}
 		},
+		scrollToEnd(){
+			if (this.wideArea){
+				this.$el.scrollLeft = this.$el.scrollWidth;
+			} else {
+				this.$el.scrollTop = this.$el.scrollHeight;
+			}
+		},
+	},
+	mounted(){
+		this.scrollToEnd();
 	},
 	components: {Tile, },
 	emits: ['detached-ancestor-click', 'info-icon-click', ],
-- 
cgit v1.2.3