thepaperpilot/chromatic-lattice
1
0
Fork 0
Code Issues Pull requests Releases Activity Actions

Made all properties in FeatureNode non-optional

Browse source
This commit is contained in:
thepaperpilot 2022-03-27 19:06:58 -05:00
parent 3fa7ccf0c1
commit 572e543ba8
5 changed files with 22 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/Context.vue
View file

@ -24,11 +24,11 @@ const observerOptions = {
provide(RegisterNodeInjectionKey, (id, element) => {
const observer = new MutationObserver(() => updateNode(id));
observer.observe(element, observerOptions);
nodes.value[id] = { element, observer };
nodes.value[id] = { element, observer, rect: element.getBoundingClientRect() };
nextTick(() => updateNode(id));
});
provide(UnregisterNodeInjectionKey, id => {
nodes.value[id]?.observer?.disconnect();
nodes.value[id]?.observer.disconnect();
nodes.value[id] = undefined;
});
provide(NodesInjectionKey, nodes);

6
src/features/links/Link.vue
View file

@ -26,8 +26,7 @@ const props = toRefs(_props);
const startPosition = computed(() => {
const rect = props.startNode.value.rect;
const boundingRect = props.boundingRect.value;
const position =
rect && boundingRect
const position = boundingRect
? {
x: rect.x + rect.width / 2 - boundingRect.x,
y: rect.y + rect.height / 2 - boundingRect.y
@ -43,8 +42,7 @@ const startPosition = computed(() => {
const endPosition = computed(() => {
const rect = props.endNode.value.rect;
const boundingRect = props.boundingRect.value;
const position =
rect && boundingRect
const position = boundingRect
? {
x: rect.x + rect.width / 2 - boundingRect.x,
y: rect.y + rect.height / 2 - boundingRect.y

7
src/features/links/Links.vue
View file

@ -14,7 +14,7 @@
<script setup lang="ts">
import { Link } from "features/links/links";
import { NodesInjectionKey } from "game/layers";
import { FeatureNode, NodesInjectionKey } from "game/layers";
import { computed, inject, nextTick, onMounted, ref, toRef } from "vue";
import LinkVue from "./Link.vue";
@ -43,9 +43,8 @@ function updateNodes() {
isDirty = false;
nextTick(() => {
boundingRect.value = resizeListener.value?.getBoundingClientRect();
Object.values(nodes.value).forEach(
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
node => (node!.rect = node?.element.getBoundingClientRect())
(Object.values(nodes.value) as FeatureNode[]).forEach(
node => (node.rect = node.element.getBoundingClientRect())
);
isDirty = true;
});

7
src/features/particles/Particles.vue
View file

@ -35,7 +35,7 @@ import { Emitters } from "tsparticles-plugin-emitters/Emitters";
import { EmitterContainer } from "tsparticles-plugin-emitters/EmitterContainer";
import { defineComponent, inject, nextTick, onMounted, PropType, ref } from "vue";
import { ParticlesComponent } from "particles.vue3";
import { NodesInjectionKey } from "game/layers";
import { FeatureNode, NodesInjectionKey } from "game/layers";
// TODO get typing support on the Particles component
export default defineComponent({
@ -93,9 +93,8 @@ export default defineComponent({
nextTick(() => {
if (resizeListener.value != null && props.onContainerResized) {
// TODO don't overlap with Links.vue
Object.values(nodes.value).forEach(
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
node => (node!.rect = node?.element.getBoundingClientRect())
(Object.values(nodes.value) as FeatureNode[]).forEach(
node => (node.rect = node.element.getBoundingClientRect())
);
props.onContainerResized(resizeListener.value.getBoundingClientRect());
}

4
src/game/layers.tsx
View file

@ -22,8 +22,8 @@ import { persistent, PersistentRef } from "./persistence";
import player from "./player";
export interface FeatureNode {
rect?: DOMRect;
observer?: MutationObserver;
rect: DOMRect;
observer: MutationObserver;
element: HTMLElement;
}