Load particles according to edm4hep

js/draw.js

@@ -1,51 +1,39 @@
 import { canvas, ctx } from "./main.js";
 
-export function drawAll(ctx, currentParticles) {
-  const { parentLinks, childrenLinks, infoBoxes } = currentParticles;
-
+export function drawAll(ctx, loadedObjects) {
   ctx.clearRect(0, 0, canvas.width, canvas.height);
-  // console.time("drawParentLinks");
-  for (const link of parentLinks) {
-    link.draw(ctx, infoBoxes);
-  }
-  // console.timeEnd("drawParentLinks");
-  // console.time("drawChildrenLinks");
-  for (const link of childrenLinks) {
-    link.draw(ctx, infoBoxes);
-  }
-  // console.timeEnd("drawChildrenLinks");
-  // console.time("drawBoxes");
-  for (const infoBox of infoBoxes) {
-    if (infoBox !== null) infoBox.draw(ctx);
-  }
-  // console.timeEnd("drawBoxes");
-}
 
-export function drawVisible(currentParticles, visibleParticles) {
-  const {
-    infoBoxes: visibleBoxes,
-    parentLinks: visibleParentLinks,
-    childrenLinks: visibleChildrenLinks,
-  } = visibleParticles;
+  for (const elements of Object.values(loadedObjects)) {
+    const { collection, oneToMany, oneToOne } = elements;
+
+    for (const links of Object.values(oneToMany)) {
+      for (const link of links) link.draw(ctx);
+    }
 
-  const { parentLinks, childrenLinks, infoBoxes } = currentParticles;
+    for (const link of Object.values(oneToOne)) link.draw(ctx);
 
+    for (const object of collection) object.draw(ctx);
+  }
+}
+
+export function drawVisible(visibleObjects) {
   const boundigClientRect = canvas.getBoundingClientRect();
   ctx.clearRect(
     0 - boundigClientRect.x,
     0 - boundigClientRect.y,
     window.innerWidth,
     window.innerHeight
   );
-  for (const linkId of visibleParentLinks) {
-    if (parentLinks[linkId] !== undefined)
-      parentLinks[linkId].draw(ctx, infoBoxes);
-  }
-  for (const linkId of visibleChildrenLinks) {
-    if (childrenLinks[linkId] !== undefined)
-      childrenLinks[linkId].draw(ctx, infoBoxes);
-  }
-  for (const boxId of visibleBoxes) {
-    infoBoxes[boxId].draw(ctx);
+
+  for (const elements of Object.values(visibleObjects)) {
+    const { collection, oneToMany, oneToOne } = elements;
+
+    for (const links of Object.values(oneToMany)) {
+      for (const link of links) link.draw(ctx);
+    }
+
+    for (const link of Object.values(oneToOne)) link.draw(ctx);
+
+    for (const object of collection) object.draw(ctx);
   }
 }

js/events.js

@@ -1,12 +1,7 @@
 import { canvas, ctx } from "./main.js";
 import { drawAll, drawVisible } from "./draw.js";
 
-const mouseDown = function (
-  event,
-  currentParticles,
-  visibleParticles,
-  dragTools
-) {
+const mouseDown = function (event, visibleObjects, dragTools) {
   event.preventDefault();
   const boundigClientRect = canvas.getBoundingClientRect();
   const mouseX = parseInt(event.clientX - boundigClientRect.x);
@@ -15,18 +10,18 @@ const mouseDown = function (
   dragTools.prevMouseX = mouseX;
   dragTools.prevMouseY = mouseY;
 
-  const infoBoxes = currentParticles.infoBoxes;
-  const visibleBoxes = visibleParticles.infoBoxes;
-  for (let i = visibleBoxes.length - 1; i >= 0; i--) {
-    if (infoBoxes[visibleBoxes[i]].isHere(mouseX, mouseY)) {
-      dragTools.draggedInfoBox = visibleBoxes[i];
-      dragTools.isDragging = true;
-      return;
+  for (const { collection } of Object.values(visibleObjects)) {
+    for (const object of collection) {
+      if (object.isHere(mouseX, mouseY)) {
+        dragTools.draggedObject = object;
+        dragTools.isDragging = true;
+        return;
+      }
     }
   }
 };
 
-const mouseUp = function (event, particlesHandler, dragTools) {
+const mouseUp = function (event, currentObjects, dragTools) {
   if (!dragTools.isDragging) {
     return;
   }
@@ -35,7 +30,7 @@ const mouseUp = function (event, particlesHandler, dragTools) {
   dragTools.isDragging = false;
 
   // console.time("drawAll");
-  drawAll(ctx, particlesHandler);
+  drawAll(ctx, currentObjects);
   // console.timeEnd("drawAll");
 };
 
@@ -48,12 +43,7 @@ const mouseOut = function (event, dragTools) {
   dragTools.isDragging = false;
 };
 
-const mouseMove = function (
-  event,
-  currentParticles,
-  visibleParticles,
-  dragTools
-) {
+const mouseMove = function (event, visibleObjects, dragTools) {
   if (!dragTools.isDragging) {
     return;
   }
@@ -66,82 +56,81 @@ const mouseMove = function (
   const dx = mouseX - dragTools.prevMouseX;
   const dy = mouseY - dragTools.prevMouseY;
 
-  const infoBox = currentParticles.infoBoxes[dragTools.draggedInfoBox];
-  infoBox.x += dx;
-  infoBox.y += dy;
+  const draggedObject = dragTools.draggedObject;
+  draggedObject.x += dx;
+  draggedObject.y += dy;
 
   // console.time("drawVisible");
-  drawVisible(currentParticles, visibleParticles);
+  drawVisible(visibleObjects);
   // console.timeEnd("drawVisible");
 
   dragTools.prevMouseX = mouseX;
   dragTools.prevMouseY = mouseY;
 };
 
-const getVisible = function (currentParticles, visibleParticles) {
+const getVisible = function (loadedObjects, visibleObjects) {
   const boundigClientRect = canvas.getBoundingClientRect();
 
-  const { infoBoxes, parentLinks, childrenLinks } = currentParticles;
-
-  const visibleBoxes = [];
-  const visibleParentLinks = [];
-  const visibleChildrenLinks = [];
-
-  for (const box of infoBoxes) {
-    if (box === null) continue;
-    if (
-      box.isVisible(
-        0 - boundigClientRect.x,
-        0 - boundigClientRect.y,
-        window.innerWidth,
-        window.innerHeight
-      )
-    ) {
-      visibleBoxes.push(box.id);
+  for (const [objectType, elements] of Object.entries(loadedObjects)) {
+    const { collection, oneToMany, oneToOne } = elements;
+
+    visibleObjects[objectType] = {
+      collection: [],
+      oneToMany: {},
+      oneToOne: {},
+    };
+
+    for (const object of collection) {
+      if (
+        object.isVisible(
+          0 - boundigClientRect.x,
+          0 - boundigClientRect.y,
+          window.innerWidth,
+          window.innerHeight
+        )
+      ) {
+        visibleObjects[objectType].collection.push(object);
+      }
     }
-  }
 
-  for (const link of parentLinks) {
-    if (
-      link.isVisible(
-        0 - boundigClientRect.x,
-        0 - boundigClientRect.y,
-        window.innerWidth,
-        window.innerHeight,
-        infoBoxes
-      )
-    ) {
-      visibleParentLinks.push(link.id);
+    for (const [name, links] of Object.entries(oneToMany)) {
+      visibleObjects[objectType].oneToMany[name] = [];
+
+      for (const link of links) {
+        if (
+          link.isVisible(
+            0 - boundigClientRect.x,
+            0 - boundigClientRect.y,
+            window.innerWidth,
+            window.innerHeight
+          )
+        ) {
+          visibleObjects[objectType].oneToMany[name].push(link);
+        }
+      }
     }
-  }
 
-  for (const link of childrenLinks) {
-    if (
-      link.isVisible(
-        0 - boundigClientRect.x,
-        0 - boundigClientRect.y,
-        window.innerWidth,
-        window.innerHeight,
-        infoBoxes
-      )
-    ) {
-      visibleChildrenLinks.push(link.id);
+    for (const [name, links] of Object.entries(oneToOne)) {
+      visibleObjects[objectType].oneToOne[name] = null;
+
+      for (const link of links) {
+        if (
+          link.isVisible(
+            0 - boundigClientRect.x,
+            0 - boundigClientRect.y,
+            window.innerWidth,
+            window.innerHeight
+          )
+        ) {
+          visibleObjects[objectType].oneToOne[name] = link;
+        }
+      }
     }
   }
-
-  /*
-  console.log("Visible boxes: ", visibleBoxes);
-  console.log("Visible parentLinks: ", visibleParentLinks);
-  console.log("Visible childrenLinks: ", visibleChildrenLinks);
-  */
-
-  visibleParticles.infoBoxes = visibleBoxes;
-  visibleParticles.parentLinks = visibleParentLinks;
-  visibleParticles.childrenLinks = visibleChildrenLinks;
 };
 
-const onScroll = function (currentParticles, visibleParticles) {
-  getVisible(currentParticles, visibleParticles);
+const onScroll = function (currentObjects, visibleObjects) {
+  getVisible(currentObjects, visibleObjects);
 };
 
 export { mouseDown, mouseUp, mouseOut, mouseMove, getVisible, onScroll };

js/lib/copy.js

@@ -0,0 +1,25 @@
+export function copyObject(objToCopy, updatedObject) {
+  for (const [key, value] of Object.entries(objToCopy)) {
+    updatedObject[key] = value;
+  }
+}
+
+export function emptyCopyObject(objToCopy, updatedObject) {
+  for (const [objectType, elements] of Object.entries(objToCopy)) {
+    const { _, oneToMany, oneToOne } = elements;
+
+    updatedObject[objectType] = {
+      collection: [],
+      oneToMany: {},
+      oneToOne: {},
+    };
+
+    for (const name in oneToMany) {
+      updatedObject[objectType].oneToMany[name] = [];
+    }
+
+    for (const name in oneToOne) {
+      updatedObject[objectType].oneToOne[name] = null;
+    }
+  }
+}

js/lib/getName.js

@@ -0,0 +1,13 @@
+import { mappings } from "../../data/particles.js";
+
+export function getName(pdg) {
+  const particle = mappings[pdg];
+
+  if (particle !== undefined) {
+    console.log("Name: " + particle);
+    return particle;
+  }
+
+  console.log("PDG: " + pdg.toString());
+  return "PDG: " + pdg.toString();
+}