From fb30b713780011c36be9d2241eb5ee403df6777c Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Fri, 12 Jul 2024 12:13:07 -0500 Subject: [PATCH 01/11] load collection name into object --- js/types/load.js | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/js/types/load.js b/js/types/load.js index b9ee63d7..201602e4 100644 --- a/js/types/load.js +++ b/js/types/load.js @@ -21,13 +21,19 @@ function loadEmptyRelations(object, relations) { } } -export function loadPlainObject(collection, datatype, collectionId) { +export function loadPlainObject( + collection, + datatype, + collectionId, + collectionName +) { const objects = []; for (const [index, particle] of collection.entries()) { const newObject = new objectTypes[datatype](); newObject.index = index; newObject.collectionId = collectionId; + newObject.collectionName = collectionName; loadMembers(newObject, particle, datatypes[datatype].members); loadEmptyRelations(newObject, datatypes[datatype]); @@ -66,7 +72,7 @@ export function loadObjects(jsonData, event, objectsToLoad) { }); for (const datatype of datatypesToLoad) { - Object.values(eventData).forEach((element) => { + Object.entries(eventData).forEach(([key, element]) => { const collectionName = `${datatype}Collection`; if (element.collType === collectionName) { const collection = element.collection; @@ -74,7 +80,8 @@ export function loadObjects(jsonData, event, objectsToLoad) { const objectCollection = loadPlainObject( collection, datatype, - collectionId + collectionId, + key ); objects.datatypes[datatype].collection.push(...objectCollection); } From ec335b9f632101b6a2def98ad84ea6f8339be59a Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Fri, 12 Jul 2024 12:21:18 -0500 Subject: [PATCH 02/11] detect when mouse is over an object --- js/event-number.js | 1 + js/events.js | 16 ++++++++++++---- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/js/event-number.js b/js/event-number.js index 83b773ad..abfac08e 100644 --- a/js/event-number.js +++ b/js/event-number.js @@ -43,6 +43,7 @@ function loadSelectedEvent() { } else { copyObject(eventCollection[currentEvent.event], currentObjects); } + console.log(currentObjects); } export function renderEvent(eventNumber) { diff --git a/js/events.js b/js/events.js index 9c6a0043..d0ff6be9 100644 --- a/js/events.js +++ b/js/events.js @@ -44,14 +44,22 @@ const mouseOut = function (event, dragTools) { }; const mouseMove = function (event, visibleObjects, dragTools) { - if (!dragTools.isDragging) { - return; - } - const boundigClientRect = canvas.getBoundingClientRect(); const mouseX = parseInt(event.clientX - boundigClientRect.x); const mouseY = parseInt(event.clientY - boundigClientRect.y); + for (const { collection } of Object.values(visibleObjects.datatypes)) { + for (const object of collection) { + if (object.isHere(mouseX, mouseY)) { + object.showObjectTip(); + } + } + } + + if (!dragTools.isDragging) { + return; + } + const dx = mouseX - dragTools.prevMouseX; const dy = mouseY - dragTools.prevMouseY; From 1de96bee18853a96ba359136ea25f9f976b36607 Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Fri, 12 Jul 2024 14:57:11 -0500 Subject: [PATCH 03/11] show collection name from object when hovered --- js/events.js | 22 +++++++++++++++++----- js/lib/graphic-primitives.js | 10 ++++++++++ js/types/objects.js | 5 +++++ 3 files changed, 32 insertions(+), 5 deletions(-) diff --git a/js/events.js b/js/events.js index d0ff6be9..51a1f117 100644 --- a/js/events.js +++ b/js/events.js @@ -1,4 +1,4 @@ -import { canvas } from "./main.js"; +import { canvas, ctx } from "./main.js"; import { drawAll, drawVisible } from "./draw.js"; const mouseDown = function (event, visibleObjects, dragTools) { @@ -48,11 +48,23 @@ const mouseMove = function (event, visibleObjects, dragTools) { const mouseX = parseInt(event.clientX - boundigClientRect.x); const mouseY = parseInt(event.clientY - boundigClientRect.y); - for (const { collection } of Object.values(visibleObjects.datatypes)) { - for (const object of collection) { - if (object.isHere(mouseX, mouseY)) { - object.showObjectTip(); + const allObjects = Object.values(visibleObjects.datatypes) + .map((datatype) => datatype.collection) + .flat(); + + for (const object of allObjects) { + if (object.isHere(mouseX, mouseY)) { + if (dragTools.hoveredObject !== object) { + dragTools.hoveredObject = object; + drawVisible(visibleObjects); + setTimeout(() => { + object.showObjectTip(ctx); + }, 200); + setTimeout(() => { + drawVisible(visibleObjects); + }, 2000); } + break; } } diff --git a/js/lib/graphic-primitives.js b/js/lib/graphic-primitives.js index f8426ad5..2defa72b 100644 --- a/js/lib/graphic-primitives.js +++ b/js/lib/graphic-primitives.js @@ -131,3 +131,13 @@ export function drawObjectHeader(ctx, object) { } ctx.restore(); } + +export function drawObjectInfoTip(ctx, object) { + ctx.save(); + const collectionName = "Collection: " + object.collectionName; + const x = object.x + object.width / 2; + const y = object.y - 10; + ctx.font = "bold 12px sans-serif"; + ctx.fillText(collectionName, x, y); + ctx.restore(); +} diff --git a/js/types/objects.js b/js/types/objects.js index 483cac06..9875884b 100644 --- a/js/types/objects.js +++ b/js/types/objects.js @@ -3,6 +3,7 @@ import { drawRoundedRect, drawTextLines, drawObjectHeader, + drawObjectInfoTip, } from "../lib/graphic-primitives.js"; import { getName } from "../lib/getName.js"; import { linkTypes } from "./links.js"; @@ -53,6 +54,10 @@ class EDMObject { y < this.y + this.height ); } + + showObjectTip(ctx) { + drawObjectInfoTip(ctx, this); + } } export class MCParticle extends EDMObject { From 3c9312853176caccb3f0867bb18a1912f8386eeb Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Fri, 12 Jul 2024 15:05:12 -0500 Subject: [PATCH 04/11] remove log --- js/event-number.js | 1 - 1 file changed, 1 deletion(-) diff --git a/js/event-number.js b/js/event-number.js index abfac08e..83b773ad 100644 --- a/js/event-number.js +++ b/js/event-number.js @@ -43,7 +43,6 @@ function loadSelectedEvent() { } else { copyObject(eventCollection[currentEvent.event], currentObjects); } - console.log(currentObjects); } export function renderEvent(eventNumber) { From db4f5a38d9fae6fc714f4f487f7b2af69ade2785 Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Fri, 12 Jul 2024 15:13:27 -0500 Subject: [PATCH 05/11] improve hover effect --- js/events.js | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/js/events.js b/js/events.js index 51a1f117..0c300be8 100644 --- a/js/events.js +++ b/js/events.js @@ -52,22 +52,24 @@ const mouseMove = function (event, visibleObjects, dragTools) { .map((datatype) => datatype.collection) .flat(); + let someHovered = false; for (const object of allObjects) { if (object.isHere(mouseX, mouseY)) { if (dragTools.hoveredObject !== object) { dragTools.hoveredObject = object; drawVisible(visibleObjects); - setTimeout(() => { - object.showObjectTip(ctx); - }, 200); - setTimeout(() => { - drawVisible(visibleObjects); - }, 2000); + object.showObjectTip(ctx); } + someHovered = true; break; } } + if (!someHovered) { + dragTools.hoveredObject = null; + drawVisible(visibleObjects); + } + if (!dragTools.isDragging) { return; } From 3073c29bbfef211084fdbf97d899dd61047b4720 Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Fri, 12 Jul 2024 15:15:38 -0500 Subject: [PATCH 06/11] move further left text --- js/lib/graphic-primitives.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/lib/graphic-primitives.js b/js/lib/graphic-primitives.js index 2defa72b..5335f754 100644 --- a/js/lib/graphic-primitives.js +++ b/js/lib/graphic-primitives.js @@ -135,7 +135,7 @@ export function drawObjectHeader(ctx, object) { export function drawObjectInfoTip(ctx, object) { ctx.save(); const collectionName = "Collection: " + object.collectionName; - const x = object.x + object.width / 2; + const x = object.x; const y = object.y - 10; ctx.font = "bold 12px sans-serif"; ctx.fillText(collectionName, x, y); From 3c459903f7905cb14605cafd95b50ed0528f08d9 Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Sat, 13 Jul 2024 18:56:06 -0500 Subject: [PATCH 07/11] change cursor on mouse over --- js/events.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/js/events.js b/js/events.js index 0c300be8..8eb2e169 100644 --- a/js/events.js +++ b/js/events.js @@ -61,11 +61,13 @@ const mouseMove = function (event, visibleObjects, dragTools) { object.showObjectTip(ctx); } someHovered = true; + document.body.style.cursor = "pointer"; break; } } if (!someHovered) { + document.body.style.cursor = "default"; dragTools.hoveredObject = null; drawVisible(visibleObjects); } From 92cc302c66e0bd78c518488698bd6fe1afaf1aaa Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Sat, 13 Jul 2024 21:08:24 -0500 Subject: [PATCH 08/11] display simulator status for MCParticle on mouse over together with collection --- js/lib/graphic-primitives.js | 15 ++++++++++----- js/menu/filter/filter.js | 2 +- js/types/objects.js | 23 ++++++++++++++++++++++- 3 files changed, 33 insertions(+), 7 deletions(-) diff --git a/js/lib/graphic-primitives.js b/js/lib/graphic-primitives.js index 5335f754..a09cf63f 100644 --- a/js/lib/graphic-primitives.js +++ b/js/lib/graphic-primitives.js @@ -132,12 +132,17 @@ export function drawObjectHeader(ctx, object) { ctx.restore(); } -export function drawObjectInfoTip(ctx, object) { +export function drawObjectInfoTip(ctx, x, y, ...args) { ctx.save(); - const collectionName = "Collection: " + object.collectionName; - const x = object.x; - const y = object.y - 10; ctx.font = "bold 12px sans-serif"; - ctx.fillText(collectionName, x, y); + const lines = args.length; + const height = 20 * lines; + const maxWidth = Math.max(...args.map((arg) => ctx.measureText(arg).width)); + ctx.fillStyle = "rgba(225, 225, 225, 1)"; + ctx.fillRect(x, y, maxWidth + 10, height + 10); + ctx.fillStyle = "black"; + for (const [i, arg] of args.entries()) { + ctx.fillText(arg, x + 5, y + 20 + i * 20); + } ctx.restore(); } diff --git a/js/menu/filter/filter.js b/js/menu/filter/filter.js index 60724f6a..7938140e 100644 --- a/js/menu/filter/filter.js +++ b/js/menu/filter/filter.js @@ -60,7 +60,7 @@ let parametersRange = units.sort((a, b) => parametersRange = parametersRange.map((parameter) => new Range(parameter)); -const SimStatusBitFieldDisplayValues = { +export const SimStatusBitFieldDisplayValues = { 23: "Overlay", 24: "Stopped", 25: "LeftDetector", diff --git a/js/types/objects.js b/js/types/objects.js index 9875884b..1df1ea2f 100644 --- a/js/types/objects.js +++ b/js/types/objects.js @@ -8,6 +8,7 @@ import { import { getName } from "../lib/getName.js"; import { linkTypes } from "./links.js"; import { parseCharge } from "../lib/parseCharge.js"; +import { SimStatusBitFieldDisplayValues } from "../menu/filter/filter.js"; const TOP_MARGIN = 40; @@ -56,7 +57,10 @@ class EDMObject { } showObjectTip(ctx) { - drawObjectInfoTip(ctx, this); + const x = this.x; + const y = this.y - 10; + const collectionName = "Collection: " + this.collectionName; + drawObjectInfoTip(ctx, x, y, collectionName); } } @@ -125,6 +129,23 @@ export class MCParticle extends EDMObject { drawTextLines(ctx, bottomLines, boxCenterX, bottomY, 22); } + showObjectTip(ctx) { + const x = this.x; + const y = this.y - 10; + const collectionName = "Collection: " + this.collectionName; + const displaySimulatorStatus = + SimStatusBitFieldDisplayValues[this.simulatorStatus]; + let simulatorStatus = ""; + + if (displaySimulatorStatus) { + simulatorStatus = "Simulator status: " + displaySimulatorStatus; + } else { + simulatorStatus = "Simulator status: " + this.simulatorStatus; + } + + drawObjectInfoTip(ctx, x, y, collectionName, simulatorStatus); + } + static setup(mcCollection) { for (const mcParticle of mcCollection) { const parentLength = mcParticle.oneToManyRelations["parents"].length; From 1fcfeabbc79c664ea3497fb4ab7170bb79c9997f Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Sat, 13 Jul 2024 21:23:22 -0500 Subject: [PATCH 09/11] move mappings from SimStatus into new file to fix tests --- js/lib/getName.js | 2 +- js/menu/filter/filter.js | 12 +----------- js/types/objects.js | 2 +- {data => mappings}/particles.js | 0 mappings/sim-status.js | 10 ++++++++++ 5 files changed, 13 insertions(+), 13 deletions(-) rename {data => mappings}/particles.js (100%) create mode 100644 mappings/sim-status.js diff --git a/js/lib/getName.js b/js/lib/getName.js index edfbc1f5..599fb792 100644 --- a/js/lib/getName.js +++ b/js/lib/getName.js @@ -1,4 +1,4 @@ -import { mappings } from "../../data/particles.js"; +import { mappings } from "../../mappings/particles.js"; export function getName(pdg) { const particle = mappings[pdg]; diff --git a/js/menu/filter/filter.js b/js/menu/filter/filter.js index 7938140e..abcc5807 100644 --- a/js/menu/filter/filter.js +++ b/js/menu/filter/filter.js @@ -5,6 +5,7 @@ import { reconnect } from "./reconnect.js"; import { getVisible } from "../../events.js"; import { units } from "../../types/units.js"; import { copyObject } from "../../lib/copy.js"; +import { SimStatusBitFieldDisplayValues } from "../../../mappings/sim-status.js"; const filterButton = document.getElementById("filter-button"); const openFilter = document.getElementById("open-filter"); @@ -60,17 +61,6 @@ let parametersRange = units.sort((a, b) => parametersRange = parametersRange.map((parameter) => new Range(parameter)); -export const SimStatusBitFieldDisplayValues = { - 23: "Overlay", - 24: "Stopped", - 25: "LeftDetector", - 26: "DecayedInCalorimeter", - 27: "DecayedInTracker", - 28: "VertexIsNotEndpointOfParent", - 29: "Backscatter", - 30: "CreatedInSimulation", -}; - const bits = new BitFieldBuilder( "simulatorStatus", "Simulation status", diff --git a/js/types/objects.js b/js/types/objects.js index 1df1ea2f..b9b7dc3b 100644 --- a/js/types/objects.js +++ b/js/types/objects.js @@ -8,7 +8,7 @@ import { import { getName } from "../lib/getName.js"; import { linkTypes } from "./links.js"; import { parseCharge } from "../lib/parseCharge.js"; -import { SimStatusBitFieldDisplayValues } from "../menu/filter/filter.js"; +import { SimStatusBitFieldDisplayValues } from "../../mappings/sim-status.js"; const TOP_MARGIN = 40; diff --git a/data/particles.js b/mappings/particles.js similarity index 100% rename from data/particles.js rename to mappings/particles.js diff --git a/mappings/sim-status.js b/mappings/sim-status.js new file mode 100644 index 00000000..49727790 --- /dev/null +++ b/mappings/sim-status.js @@ -0,0 +1,10 @@ +export const SimStatusBitFieldDisplayValues = { + 23: "Overlay", + 24: "Stopped", + 25: "LeftDetector", + 26: "DecayedInCalorimeter", + 27: "DecayedInTracker", + 28: "VertexIsNotEndpointOfParent", + 29: "Backscatter", + 30: "CreatedInSimulation", +}; From 28b2d709bcd518aec0a60a702e29e31df1d54ba4 Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Mon, 15 Jul 2024 17:45:39 -0500 Subject: [PATCH 10/11] parse bitfield according to @tmadlener bitwise operations --- js/types/objects.js | 28 ++++++++++++++++------------ mappings/sim-status.js | 24 ++++++++++++++++++++++++ 2 files changed, 40 insertions(+), 12 deletions(-) diff --git a/js/types/objects.js b/js/types/objects.js index b9b7dc3b..4f9c90ff 100644 --- a/js/types/objects.js +++ b/js/types/objects.js @@ -8,7 +8,7 @@ import { import { getName } from "../lib/getName.js"; import { linkTypes } from "./links.js"; import { parseCharge } from "../lib/parseCharge.js"; -import { SimStatusBitFieldDisplayValues } from "../../mappings/sim-status.js"; +import { getSimStatusDisplayValuesFromBit } from "../../mappings/sim-status.js"; const TOP_MARGIN = 40; @@ -114,7 +114,17 @@ export class MCParticle extends EDMObject { const topLines = []; topLines.push("ID: " + this.index); topLines.push("Gen. stat.: " + this.generatorStatus); - topLines.push("Sim. stat.: " + this.simulatorStatus); + const simulatorStatus = getSimStatusDisplayValuesFromBit( + this.simulatorStatus + ); + const simulatorStatusFirstLetter = simulatorStatus + .map((s) => s[0]) + .join(", "); + const simulatorStatusString = + simulatorStatusFirstLetter !== "" + ? simulatorStatusFirstLetter + : this.simulatorStatus; + topLines.push("Sim. stat.: " + simulatorStatusString); const bottomY = this.y + this.height * 0.6; const bottomLines = []; @@ -133,17 +143,11 @@ export class MCParticle extends EDMObject { const x = this.x; const y = this.y - 10; const collectionName = "Collection: " + this.collectionName; - const displaySimulatorStatus = - SimStatusBitFieldDisplayValues[this.simulatorStatus]; - let simulatorStatus = ""; - - if (displaySimulatorStatus) { - simulatorStatus = "Simulator status: " + displaySimulatorStatus; - } else { - simulatorStatus = "Simulator status: " + this.simulatorStatus; - } + const simulatorStatus = getSimStatusDisplayValuesFromBit( + this.simulatorStatus + ); - drawObjectInfoTip(ctx, x, y, collectionName, simulatorStatus); + drawObjectInfoTip(ctx, x, y, collectionName, ...simulatorStatus); } static setup(mcCollection) { diff --git a/mappings/sim-status.js b/mappings/sim-status.js index 49727790..db438605 100644 --- a/mappings/sim-status.js +++ b/mappings/sim-status.js @@ -8,3 +8,27 @@ export const SimStatusBitFieldDisplayValues = { 29: "Backscatter", 30: "CreatedInSimulation", }; + +export function parseBits(bit) { + const bits = []; + + for (let i = 0; i < 32; i++) { + if (bit & (1 << i)) { + bits.push(i); + } + } + + return bits; +} + +export function getSimStatusDisplayValues(bits) { + return bits.map((bit) => + SimStatusBitFieldDisplayValues[bit] !== undefined + ? SimStatusBitFieldDisplayValues[bit] + : `Bit ${bit}` + ); +} + +export function getSimStatusDisplayValuesFromBit(bit) { + return getSimStatusDisplayValues(parseBits(bit)); +} From 598f8ceec4203dc07a084ae2110b5b20d87f2f95 Mon Sep 17 00:00:00 2001 From: Braulio Rivas Abad Date: Tue, 16 Jul 2024 15:41:52 -0500 Subject: [PATCH 11/11] remove commas to save space --- js/types/objects.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/types/objects.js b/js/types/objects.js index 4f9c90ff..6370034d 100644 --- a/js/types/objects.js +++ b/js/types/objects.js @@ -119,7 +119,7 @@ export class MCParticle extends EDMObject { ); const simulatorStatusFirstLetter = simulatorStatus .map((s) => s[0]) - .join(", "); + .join(""); const simulatorStatusString = simulatorStatusFirstLetter !== "" ? simulatorStatusFirstLetter