diff options
| author | Terry Truong <terry06890@gmail.com> | 2022-06-29 15:15:47 +1000 |
|---|---|---|
| committer | Terry Truong <terry06890@gmail.com> | 2022-06-29 15:15:47 +1000 |
| commit | 93e3a4907c08a82225d1f947bb7674edf8a67c85 (patch) | |
| tree | a3404666f35a415cd86bc81d259a31f2c0c89946 | |
| parent | e3a86973922fa9370900f2e3b07a78222e44b056 (diff) | |
Add breadth prop to AncestryBar
| -rw-r--r-- | src/App.vue | 3 | ||||
| -rw-r--r-- | src/components/AncestryBar.vue | 3 |
2 files changed, 4 insertions, 2 deletions
diff --git a/src/App.vue b/src/App.vue index 7fca4c5..614121c 100644 --- a/src/App.vue +++ b/src/App.vue @@ -32,7 +32,8 @@ <transition name="fade" @after-enter="ancestryBarInTransition = false" @after-leave="ancestryBarInTransition = false"> <ancestry-bar v-if="detachedAncestors != null" class="w-full h-full" - :nodes="detachedAncestors" :vert="wideArea" :tolMap="tolMap" :lytOpts="lytOpts" :uiOpts="uiOpts" + :nodes="detachedAncestors" :vert="wideArea" :breadth="uiOpts.ancestryBarBreadth" + :tolMap="tolMap" :lytOpts="lytOpts" :uiOpts="uiOpts" @ancestor-click="onDetachedAncestorClick" @info-click="onInfoClick"/> </transition> </div> diff --git a/src/components/AncestryBar.vue b/src/components/AncestryBar.vue index c2aadf8..38d51c3 100644 --- a/src/components/AncestryBar.vue +++ b/src/components/AncestryBar.vue @@ -16,6 +16,7 @@ export default defineComponent({ props: { nodes: {type: Array as PropType<LayoutNode[]>, required: true}, vert: {type: Boolean, default: false}, + breadth: {type: Number, required: true}, // Other lytOpts: {type: Object as PropType<LayoutOptions>, required: true}, uiOpts: {type: Object as PropType<UiOptions>, required: true}, @@ -23,7 +24,7 @@ export default defineComponent({ }, computed: { imgSz(){ - return this.uiOpts.ancestryBarBreadth - this.lytOpts.tileSpacing - this.uiOpts.scrollGap; + return this.breadth - this.lytOpts.tileSpacing - this.uiOpts.scrollGap; }, dummyNodes(){ // Childless versions of 'nodes' used to parameterise <tile>s return this.nodes.map(n => { |