GoogleAIBuilder/MotionSimulator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Memory Viewer and Axis Memory Map visualization

Browse Source
This commit is contained in:
tindevil
2025-12-21 23:42:39 +09:00
parent d459bf4e9f
commit 711be48527
3 changed files with 244 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
App.tsx
View File

@@ -13,7 +13,8 @@ import {
LogicMathOp, MEMORY_SIZE, ADDR_AXIS_BASE, ADDR_AXIS_STRIDE, OFF_AXIS_CURRENT_POS, OFF_AXIS_TARGET_POS
} from './types';
import { EditableObject } from './components/SceneObjects';
import { Layout as LayoutIcon, Cpu, Play, Pause, Square, Download, Upload, Magnet, Settings } from 'lucide-react';
import { MemoryViewer } from './components/MemoryViewer';
import { Layout as LayoutIcon, Cpu, Play, Pause, Square, Download, Upload, Magnet, Settings, HardDrive } from 'lucide-react';
// --- Simulation Manager (PLC Scan Cycle) ---
const SimulationLoop = ({
@@ -26,7 +27,8 @@ const SimulationLoop = ({
setInputs,
setOutputs,
axes,
setAxes
setAxes,
memoryView
}: {
isPlaying: boolean,
objects: SimObject[],
@@ -253,7 +255,7 @@ const SimulationLoop = ({
};
export default function App() {
const [activeView, setActiveView] = useState<'layout' | 'logic'>('layout');
const [activeView, setActiveView] = useState<'layout' | 'logic' | 'memory'>('layout');
// --- Memory System (Ref-based, high frequency) ---
const memoryBuffer = useRef(new ArrayBuffer(MEMORY_SIZE)); // 10000 bytes
const memoryView = useRef(new DataView(memoryBuffer.current));
@@ -412,22 +414,30 @@ export default function App() {
<div className="h-16 bg-gray-900 border-b border-gray-800 flex items-center px-6 justify-between shrink-0 z-20 shadow-lg">
<div className="flex items-center gap-8">
<div className="flex items-center gap-2">
<div className="w-8 h-8 bg-blue-600 rounded flex items-center justify-center font-bold text-lg shadow-[0_0_15px_rgba(37,99,235,0.4)]">M</div>
<span className="font-bold tracking-tight text-lg">MotionSim</span>
<div className="w-8 h-8 bg-blue-600 rounded flex items-center justify-center font-bold text-lg shadow-[0_0_15px_rgba(37,99,235,0.4)]">
<span className="text-xl font-black bg-gradient-to-r from-blue-500 to-purple-600 text-transparent bg-clip-text">SIMP</span>
</div>
<span className="text-[10px] bg-gray-800 text-gray-400 px-1.5 py-0.5 rounded ml-2 font-mono">v0.9.2</span>
</div>
<div className="flex bg-gray-950 p-1 rounded-xl border border-gray-800 shadow-inner">
<div className="flex bg-gray-900 rounded-lg p-1 border border-gray-800">
<button
onClick={() => setActiveView('layout')}
className={`flex items-center gap-2 px-6 py-2 rounded-lg text-sm font-bold transition-all ${activeView === 'layout' ? 'bg-blue-600 text-white shadow-md' : 'text-gray-500 hover:text-gray-300'}`}
className={`flex items-center gap-2 px-4 py-1.5 rounded-md text-xs font-bold transition-all ${activeView === 'layout' ? 'bg-gray-800 text-white shadow shadow-black/50' : 'text-gray-500 hover:text-gray-300'}`}
>
<LayoutIcon size={32} /> Layout
<LayoutIcon size={14} /> Layout
</button>
<button
onClick={() => setActiveView('logic')}
className={`flex items-center gap-2 px-6 py-2 rounded-lg text-sm font-bold transition-all ${activeView === 'logic' ? 'bg-blue-600 text-white shadow-md' : 'text-gray-500 hover:text-gray-300'}`}
className={`flex items-center gap-2 px-4 py-1.5 rounded-md text-xs font-bold transition-all ${activeView === 'logic' ? 'bg-gray-800 text-white shadow shadow-black/50' : 'text-gray-500 hover:text-gray-300'}`}
>
<Cpu size={32} /> Logic
<Cpu size={14} /> Logic
</button>
<button
onClick={() => setActiveView('memory')}
className={`flex items-center gap-2 px-4 py-1.5 rounded-md text-xs font-bold transition-all ${activeView === 'memory' ? 'bg-gray-800 text-white shadow shadow-black/50' : 'text-gray-500 hover:text-gray-300'}`}
>
<HardDrive size={14} /> Memory
</button>
</div>
@@ -605,6 +615,11 @@ export default function App() {
axes={axes}
/>
)}
{/* Memory View */}
{activeView === 'memory' && (
<MemoryViewer memoryView={memoryView} />
)}
</div>
<SystemSetupDialog