Skip to content

Sync dev with latest staging #62

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
elainefan331 merged 7 commits into from
Jun 10, 2025
Merged

Sync dev with latest staging #62

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
6085f7b
Fix #52 dataset page bugs
Apr 24, 2025
4b75346
Fix Preview feature JS version
Jun 6, 2025
892c57a
Fix sub naming format under External data
Jun 6, 2025
ba36dad
Fix Preview bug
Jun 6, 2025
8ff7d13
Fix Preview bug
Jun 6, 2025
d645444
Merge dev into dev_hari
Jun 6, 2025
2961300
Merge pull request #61 from NeuroJSON/dev_hari
elainefan331 Jun 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 9 additions & 3 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,19 +20,23 @@
"@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^13.2.1",
"@types/jest": "^27.0.1",
"@types/numjs": "^0.16.8",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"@types/three": "^0.174.0",
"@types/three": "^0.176.0",
"ajv": "^8",
"ajv-keywords": "^5",
"axios": "^1.4.0",
"bda": "^1.0.0",
"bjd": "^0.3.2",
"buffer": "^6.0.3",
"buffer": "6.0.3",
"dayjs": "^1.11.10",
"jquery": "^3.7.1",
"json-stringify-safe": "^5.0.1",
"jwt-decode": "^3.1.2",
"lzma": "^2.3.2",
"numjs": "^0.16.1",
"pako": "1.0.11",
"path-browserify": "^1.0.1",
"pako": "^2.1.0",
"query-string": "^8.1.0",
Expand All @@ -44,8 +48,10 @@
"react-scripts": "^5.0.1",
"sharp": "^0.33.5",
"stats-js": "^1.0.1",
"stats.js": "0.17.0",
"three": "0.145.0",
"typescript": "^5.1.6",
"uplot": "^1.6.31",
"uplot": "1.6.17",
"web-vitals": "^2.1.0"
},
"devDependencies": {
Expand Down
144 changes: 42 additions & 102 deletions src/components/PreviewModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,117 +1,57 @@
/// <reference types="three" />
import React, { useEffect } from "react";

// Tell TS that THREE is available globally
declare const THREE: typeof import("three");

declare global {
interface Window {
scene: any;
camera: any;
renderer: any;
previewdata: (...args: any[]) => void;
[key: string]: any;
}
}

const PreviewModal: React.FC<{
isOpen: boolean;
dataKey: any;
isInternal: boolean;
onClose: () => void;
}> = ({ isOpen, dataKey, isInternal, onClose }) => {
useEffect(() => {
if (isOpen) {
console.log("🟢 Opening PreviewModal for:", dataKey);

setTimeout(() => {
// let canvas = document.querySelector("#canvas");

// if (!canvas) {
// console.error("❌ Error: #canvas element not found in DOM!");
// return;
// }

if (typeof (window as any).previewdata === "function") {
console.log("Calling previewdata to handle Three.js init...");
(window as any).previewdata(dataKey, 0, isInternal, false);
} else {
console.error("❌ previewdata() is not defined!");
}
}, 100); // Small delay ensures modal is rendered first
useEffect(() => {
if (isOpen) {
console.log("🟢 Opening PreviewModal for:", dataKey);

// 1. Clear previous canvas
const canvasDiv = document.getElementById("canvas");
if (canvasDiv) {
while (canvasDiv.firstChild) {
canvasDiv.removeChild(canvasDiv.firstChild);
}
}
}, [isOpen, dataKey]);

// 2. Clear global references
window.scene = undefined;
window.camera = undefined;
window.renderer = undefined;

// 3. Reinitialize preview
setTimeout(() => {
if (typeof window.previewdata === "function") {
console.log("Calling previewdata to handle Three.js init...");
window.previewdata(dataKey, 0, isInternal, false);
} else {
console.error("❌ previewdata() is not defined!");
}
}, 100);
console.log("⏳ Calling previewdata for", dataKey);
}
}, [isOpen, dataKey]);

if (!isOpen) return null;
return (
// <div className="preview-modal">
// <div className="modal-header">
// <h3>Preview</h3>
// <button className="close-btn" onClick={onClose}>×</button>
// </div>

// {/* ✅ Display Mode Section */}
// <div id="renderpanel" style={{ width: "100%", backgroundColor: "#222", padding: "10px", color: "#fff" }}>
// <b>Display Mode</b><br />
// <input type="radio" id="mip-radio-button" name="displaymode" value="mip" defaultChecked />
// <label htmlFor="mip-radio-button">MIP</label>
// <input type="radio" id="iso-radio-button" name="displaymode" value="iso" />
// <label htmlFor="iso-radio-button">Isosurface</label>

// {/* ✅ Colormap Section */}
// <b>Colormap</b><br />
// <label htmlFor="clim-low">Lower-bound</label>
// <input id="clim-low" type="range" min="1" step="0.25" max="100" defaultValue="50" disabled /><br />
// <label htmlFor="clim-hi">Upper-bound</label>
// <input id="clim-hi" type="range" min="1" step="0.25" max="100" defaultValue="50" disabled /><br />
// <label htmlFor="isothreshold">Threshold</label>
// <input id="isothreshold" type="range" min="0" step="0.01" max="1" defaultValue="0.5" disabled />
// </div>

// {/* ✅ Cross Sections Section */}
// <b>Cross Sections</b><br />
// <div className="controlrow">
// X
// <label htmlFor="cross-x-low">Min</label>
// <input id="cross-x-low" type="range" min="0" max="1" defaultValue="0" step="any" />
// <label htmlFor="cross-x-hi">Max</label>
// <input id="cross-x-hi" type="range" min="0" max="1" defaultValue="1" step="any" />
// </div>
// <div className="controlrow">
// Y
// <label htmlFor="cross-y-low">Min</label>
// <input id="cross-y-low" type="range" min="0" max="1" defaultValue="0" step="any" />
// <label htmlFor="cross-y-hi">Max</label>
// <input id="cross-y-hi" type="range" min="0" max="1" defaultValue="1" step="any" />
// </div>
// <div className="controlrow">
// Z
// <label htmlFor="cross-z-low">Min</label>
// <input id="cross-z-low" type="range" min="0" max="1" defaultValue="0" step="any" />
// <label htmlFor="cross-z-hi">Max</label>
// <input id="cross-z-hi" type="range" min="0" max="1" defaultValue="1" step="any" />
// </div>
// <div id="taxis">
// T
// <label htmlFor="cross-t">Time</label>
// <input id="cross-t" type="range" min="0" max="1" defaultValue="0" step="1" />
// </div>

// {/* ✅ Clip Plane Section */}
// <b>Clip Plane</b><br />
// <label htmlFor="camera-near">Near</label>
// <input id="camera-near" type="range" min="1" max="100" defaultValue="50" /><br />
// <label htmlFor="camera-far">Far</label>
// <input id="camera-far" type="range" min="1" max="100" defaultValue="50" />

// {/* ✅ View Section */}
// <b>View</b><br />
// <button id="neg-x-view">-X</button>
// <button id="pos-x-view">+X</button>
// <button id="neg-y-view">-Y</button>
// <button id="pos-y-view">+Y</button>
// <button id="neg-z-view">-Z</button>
// <button id="pos-z-view">+Z</button>

// {/* ✅ Ensure proper rendering with <canvas> */}
// <div
// id="canvas"
// style={{
// backgroundColor: '#000',
// width: '937px',
// height: '750px',
// border: '1px solid black',
// padding: 0,
// float: 'left',
// }}
// ></div>
// </div>
<div
className="preview-modal"
style={{
Expand Down
Loading