improve functionality when checking for empty view

js/draw.js

@@ -1,4 +1,5 @@
 import { canvas, ctx } from "./main.js";
+import { updateCanvas } from "./lib/graphic-primitives.js";
 
 function draw(objects) {
   const datatypes = objects.datatypes;
@@ -32,19 +33,26 @@ function draw(objects) {
 }
 
 export function drawAll(loadedObjects) {
-  ctx.clearRect(0, 0, canvas.width, canvas.height);
-
+  emptyCanvas();
   draw(loadedObjects);
 }
 
 export function drawVisible(visibleObjects) {
+  emptyVisibleCanvas();
+  draw(visibleObjects);
+}
+
+export function emptyCanvas() {
+  updateCanvas(ctx, 0, 0, canvas.width, canvas.height);
+}
+
+function emptyVisibleCanvas() {
   const boundigClientRect = canvas.getBoundingClientRect();
-  ctx.clearRect(
+  updateCanvas(
+    ctx,
     0 - boundigClientRect.x,
     0 - boundigClientRect.y,
     window.innerWidth,
     window.innerHeight
   );
-
-  draw(visibleObjects);
 }

js/lib/empty-object.js

@@ -0,0 +1,32 @@
+const updateEmpty = (empty, length) => {
+  if (length === 0) {
+    empty.value = empty.value && true;
+  } else {
+    empty.value = false;
+  }
+};
+
+export function checkEmptyObject(obj) {
+  const datatypes = obj.datatypes;
+  const associations = obj.associations;
+
+  let empty = { value: true };
+
+  Object.values(datatypes).forEach((datatype) => {
+    updateEmpty(empty, datatype.collection.length);
+
+    Object.values(datatype.oneToMany).forEach((oneToMany) => {
+      updateEmpty(empty, oneToMany.length);
+    });
+
+    Object.values(datatype.oneToOne).forEach((oneToOne) => {
+      updateEmpty(empty, oneToOne.length);
+    });
+  });
+
+  Object.values(associations).forEach((association) => {
+    updateEmpty(empty, association.length);
+  });
+
+  return empty.value;
+}

js/lib/graphic-primitives.js

@@ -107,3 +107,7 @@ export function drawStraightLink(ctx, link) {
   ctx.stroke();
   ctx.restore();
 }
+
+export function updateCanvas(ctx, x, y, width, height) {
+  ctx.clearRect(x, y, width, height);
+}

js/lib/messages.js

@@ -15,7 +15,9 @@ export function errorMsg(msg) {
 export function emptyViewMessage() {
   const msgDiv = document.getElementById("empty-view");
   msgDiv.style.display = "flex";
-  setTimeout(() => {
-    msgDiv.style.display = "none";
-  }, 1500);
+}
+
+export function hideEmptyViewMessage() {
+  const msgDiv = document.getElementById("empty-view");
+  msgDiv.style.display = "none";
 }

js/views/association-view.js

@@ -1,16 +1,10 @@
 import { canvas } from "../main.js";
-import { emptyViewMessage } from "../lib/messages.js";
 
 // List 1:1 association in a vertical list
 export function buildAssociationView(viewObjects, associationName) {
   const associations = viewObjects.associations[associationName];
   const length = associations.length;
 
-  if (length === 0) {
-    emptyViewMessage();
-    return;
-  }
-
   const fromWidth = associations[0].from.width;
   const toWidth = associations[0].to.width;
   const fromHorizontalGap = 0.3 * fromWidth;

js/views/list.js

@@ -1,11 +1,6 @@
 import { canvas } from "../main.js";
-import { emptyViewMessage } from "../lib/messages.js";
 
 export function listView(collection) {
-  if (collection.length === 0) {
-    emptyViewMessage();
-    return;
-  }
   const width = window.innerWidth;
   canvas.width = width;
 

js/views/mcparticletree.js

@@ -1,16 +1,10 @@
 import { canvas } from "../main.js";
 import { preFilterTree } from "./pre-filter.js";
-import { emptyViewMessage } from "../lib/messages.js";
 
 export function mcParticleTree(viewCurrentObjects) {
   const mcCollection =
     viewCurrentObjects.datatypes["edm4hep::MCParticle"].collection ?? [];
 
-  if (mcCollection.length === 0) {
-    emptyViewMessage();
-    return;
-  }
-
   const getMaxRow = (parentLinks) => {
     let maxRow = -1;
     for (const parentLink of parentLinks) {

js/views/onewayview.js

@@ -1,5 +1,4 @@
 import { canvas } from "../main.js";
-import { emptyViewMessage } from "../lib/messages.js";
 
 export function oneWayView(viewObjects, fromCollectionName, relationName) {
   const relations =
@@ -8,11 +7,6 @@ export function oneWayView(viewObjects, fromCollectionName, relationName) {
   const fromCollection = relations.map((relation) => relation.from);
   const toCollection = relations.map((relation) => relation.to);
 
-  if (fromCollection.length === 0 || toCollection.length === 0) {
-    emptyViewMessage();
-    return;
-  }
-
   const fromWidth = fromCollection[0].width;
   const toWidth = toCollection[0].width;
   const fromHorizontalGap = 0.3 * fromWidth;

js/views/recoclustertrack.js

@@ -1,16 +1,10 @@
 import { canvas } from "../main.js";
 import { emptyCopyObject } from "../lib/copy.js";
-import { emptyViewMessage } from "../lib/messages.js";
 
 export function recoClusterTrackVertex(viewObjects) {
   const recoParticles =
     viewObjects.datatypes["edm4hep::ReconstructedParticle"].collection;
 
-  if (recoParticles.length === 0) {
-    emptyViewMessage();
-    return;
-  }
-
   const findFirstObject = (relationName) => {
     const object = recoParticles.find((particle) => {
       const relation = particle.oneToManyRelations[relationName];

js/views/tree.js

@@ -1,16 +1,10 @@
 import { canvas } from "../main.js";
-import { emptyViewMessage } from "../lib/messages.js";
 
 // All particles that are related to itself have an one to many relation
 export function buildTree(collection, relationOfReference) {
   const nodes = new Set();
   const children = new Set();
 
-  if (collection.length === 0) {
-    emptyViewMessage();
-    return;
-  }
-
   for (const object of collection) {
     const objects = object.oneToManyRelations[relationOfReference].map(
       (link) => link.to

js/views/views.js

@@ -1,5 +1,6 @@
 import { currentObjects, currentEvent } from "../event-number.js";
 import { copyObject } from "../lib/copy.js";
+import { checkEmptyObject } from "../lib/empty-object.js";
 import { getVisible } from "../events.js";
 import { drawAll } from "../draw.js";
 import { canvas } from "../main.js";
@@ -11,6 +12,8 @@ import {
   mouseMove,
   onScroll,
 } from "../events.js";
+import { emptyViewMessage, hideEmptyViewMessage } from "../lib/messages.js";
+import { emptyCanvas } from "../draw.js";
 
 const currentView = {};
 
@@ -55,6 +58,16 @@ const drawView = (view) => {
   const viewVisibleObjects = {};
 
   preFilterFunction(currentObjects, viewObjects);
+  const isEmpty = checkEmptyObject(viewObjects);
+
+  if (isEmpty) {
+    emptyCanvas();
+    emptyViewMessage();
+    return;
+  } else {
+    hideEmptyViewMessage();
+  }
+
   viewFunction(viewObjects);
   copyObject(viewObjects, viewCurrentObjects);