Skip to content

Commit

Permalink
Merge branch 'main' into feat/view-info-section
Browse files Browse the repository at this point in the history
  • Loading branch information
brauliorivas authored Jul 17, 2024
2 parents 07291a8 + f294357 commit 4474702
Show file tree
Hide file tree
Showing 13 changed files with 260 additions and 95 deletions.
32 changes: 32 additions & 0 deletions css/switch-deploy.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
#switch-deploy {
position: fixed;
left: 10px;
bottom: 10px;
display: flex;
flex-direction: row;
align-items: center;
z-index: 1;
background-color: #fff;
padding: 5px;
border-radius: 5px;
border: 1px solid #000;
}

#switch-deploy-button {
cursor: pointer;
background-color: #fff;
border: 1px solid #000;
padding: 5px;
border-radius: 5px;
font-family: sans-serif;
font-size: 14px;
}

#switch-deploy-button:hover {
background-color: #c5c5c5;
cursor: pointer;
}

#switch-deploy-text {
margin: 0 7px 0 0;
}
7 changes: 7 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
<link rel="stylesheet" href="css/contact.css">
<link rel="stylesheet" href="css/views.css">
<link rel="stylesheet" href="css/empty-view.css">
<link rel="stylesheet" href="css/switch-deploy.css">
</head>

<body>
Expand Down Expand Up @@ -173,13 +174,19 @@ <h2 id="view-title-info"></h2>
<p>This view has no elements</p>
</div>

<div id="switch-deploy">
<p id="switch-deploy-text">Switch to</p>
<button id="switch-deploy-button">release</button>
</div>

<canvas id="canvas" width="100vw" height="100vh"></canvas>

<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js" type="text/javascript"></script>
<script type="module" src="js/main.js"></script>
<script type="module" src="js/information.js"></script>
<script type="module" src="js/views/views.js"></script>
<script type="module" src="js/menu/filter/filter.js"></script>
<script type="module" src="js/switch-deploy.js"></script>
</body>

</html>
34 changes: 29 additions & 5 deletions js/events.js
Original file line number Diff line number Diff line change
@@ -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) {
Expand Down Expand Up @@ -44,14 +44,38 @@ 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);

const allObjects = Object.values(visibleObjects.datatypes)
.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);
object.showObjectTip(ctx);
}
someHovered = true;
document.body.style.cursor = "pointer";
break;
}
}

if (!someHovered) {
document.body.style.cursor = "default";
dragTools.hoveredObject = null;
drawVisible(visibleObjects);
}

if (!dragTools.isDragging) {
return;
}

const dx = mouseX - dragTools.prevMouseX;
const dy = mouseY - dragTools.prevMouseY;

Expand Down
2 changes: 1 addition & 1 deletion js/lib/getName.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { mappings } from "../../data/particles.js";
import { mappings } from "../../mappings/particles.js";

export function getName(pdg) {
const particle = mappings[pdg];
Expand Down
39 changes: 39 additions & 0 deletions js/lib/graphic-primitives.js
Original file line number Diff line number Diff line change
Expand Up @@ -111,3 +111,42 @@ export function drawStraightLink(ctx, link) {
export function updateCanvas(ctx, x, y, width, height) {
ctx.clearRect(x, y, width, height);
}

export function drawObjectHeader(ctx, object) {
ctx.save();
ctx.font = "bold 16px sans-serif";
const text = object.constructor.name;
const boxCenterX = object.x + object.width / 2;
const textWidth = ctx.measureText(text).width;
const x = boxCenterX - ctx.measureText(text).width / 2;
const topY = object.y + 20;

if (textWidth > object.width) {
const lines = text.split(/(?=[A-Z])/);
for (const [i, lineText] of lines.entries()) {
ctx.fillText(
lineText,
boxCenterX - ctx.measureText(lineText).width / 2,
topY + i * 20
);
}
} else {
ctx.fillText(text, x, topY);
}
ctx.restore();
}

export function drawObjectInfoTip(ctx, x, y, ...args) {
ctx.save();
ctx.font = "bold 12px sans-serif";
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();
}
7 changes: 7 additions & 0 deletions js/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,12 @@ function showViewsMenu() {
aboutButton.style.display = "block";
}

function hideDeploySwitch() {
const deploySwitch = document.getElementById("switch-deploy");

deploySwitch.style.display = "none";
}

document.getElementById("input-file").addEventListener("change", (event) => {
for (const file of event.target.files) {
if (!file.name.endsWith("edm4hep.json")) {
Expand Down Expand Up @@ -139,6 +145,7 @@ document
showViewsMenu();
renderEvent(eventNum);
selectViewInformation();
hideDeploySwitch();
});

export { canvas, ctx, jsonData, selectedObjectTypes };
12 changes: 1 addition & 11 deletions js/menu/filter/filter.js
Original file line number Diff line number Diff line change
Expand Up @@ -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");
Expand Down Expand Up @@ -60,17 +61,6 @@ let parametersRange = units.sort((a, b) =>

parametersRange = parametersRange.map((parameter) => new Range(parameter));

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",
Expand Down
18 changes: 18 additions & 0 deletions js/switch-deploy.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
const button = document.getElementById("switch-deploy-button");

button.addEventListener("click", () => {
const currentUrl = window.location.href;

if (currentUrl.includes("/release")) {
window.location.href = currentUrl.replace("/release", "/main");
} else {
window.location.href = "https://key4hep.github.io/eede/release/index.html";
}
});

const url = window.location.href;
if (url.includes("/release")) {
button.innerText = "Develop";
} else {
button.innerText = "Release";
}
13 changes: 10 additions & 3 deletions js/types/load.js
Original file line number Diff line number Diff line change
Expand Up @@ -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]);
Expand Down Expand Up @@ -66,15 +72,16 @@ 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;
const collectionId = element.collID;
const objectCollection = loadPlainObject(
collection,
datatype,
collectionId
collectionId,
key
);
objects.datatypes[datatype].collection.push(...objectCollection);
}
Expand Down
Loading

0 comments on commit 4474702

Please sign in to comment.