profectus/Profectus
Template
1
0
Fork 4
Code Issues 38 Pull requests 6 Projects 2 Releases Packages Wiki Activity Actions

Fixed branches' positions not being accurate

Browse source
This commit is contained in:
thepaperpilot 2022-03-01 23:32:21 -06:00
parent 576efc39ea
commit 189dbfe725
2 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/components/links/Links.vue
View file

@ -26,10 +26,9 @@ const _props = defineProps<{ links?: Link[] }>();
const links = toRef(_props, "links"); const links = toRef(_props, "links");
const observer = new MutationObserver(updateNodes); const observer = new MutationObserver(updateNodes);
const resizeObserver = new ResizeObserver(updateBounds); const resizeObserver = new ResizeObserver(updateNodes);
const nodes = ref<Record<string, LinkNode | undefined>>({}); const nodes = ref<Record<string, LinkNode | undefined>>({});
const boundingRect = ref(new DOMRect());
const resizeListener = ref<Element | null>(null); const resizeListener = ref<Element | null>(null);
@ -39,7 +38,6 @@ onMounted(() => {
if (resListener != null) { if (resListener != null) {
resizeObserver.observe(resListener); resizeObserver.observe(resListener);
} }
updateNodes();
}); });
const validLinks = computed( const validLinks = computed(
@ -58,7 +56,7 @@ const validLinks = computed(
const observerOptions = { const observerOptions = {
attributes: true, attributes: true,
childList: true, childList: true,
subtree: true subtree: false
}; };
provide(RegisterLinkNodeInjectionKey, (id, element) => { provide(RegisterLinkNodeInjectionKey, (id, element) => {
@ -74,27 +72,28 @@ provide(UnregisterLinkNodeInjectionKey, id => {
nodes.value[id] = undefined; nodes.value[id] = undefined;
}); });
let isDirty = true;
let boundingRect = resizeListener.value?.getBoundingClientRect();
function updateNodes() { function updateNodes() {
if (resizeListener.value != null) { if (resizeListener.value != null && isDirty) {
Object.keys(nodes.value).forEach(id => updateNode(id)); isDirty = false;
nextTick(() => {
boundingRect = resizeListener.value?.getBoundingClientRect();
Object.keys(nodes.value).forEach(id => updateNode(id));
isDirty = true
});
} }
} }
function updateNode(id: string) { function updateNode(id: string) {
const node = nodes.value[id]; const node = nodes.value[id];
if (!node) { if (!node || boundingRect == null) {
return; return;
} }
const linkStartRect = node.element.getBoundingClientRect(); const linkStartRect = node.element.getBoundingClientRect();
node.x = linkStartRect.x + linkStartRect.width / 2 - boundingRect.value.x;
node.y = linkStartRect.y + linkStartRect.height / 2 - boundingRect.value.y;
}
function updateBounds() { node.x = linkStartRect.x + linkStartRect.width / 2 - boundingRect.x;
if (resizeListener.value != null) { node.y = linkStartRect.y + linkStartRect.height / 2 - boundingRect.y;
boundingRect.value = resizeListener.value.getBoundingClientRect();
updateNodes();
}
} }
</script> </script>

1
src/features/tabs/TabFamily.vue
View file

@ -165,6 +165,7 @@ export default defineComponent({
.tab-buttons-container { .tab-buttons-container {
width: calc(100% - 14px); width: calc(100% - 14px);
z-index: 4;
} }
.tab-buttons-container:not(.floating) { .tab-buttons-container:not(.floating) {