platform/lms-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

vision modify..

Browse Source
This commit is contained in:
chyoo
2026-08-04 08:56:47 +09:00
parent 97d6a0219f
commit 951d07cf31
10 changed files with 108 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/public/slam-viewer/index.html
+8 -3
View File
@@ -153,6 +153,11 @@
align-items:center;
gap:6px;
}
#splatToggle {
display:inline-flex;
align-items:center;
justify-content:center;
}
#cameraPresetSelect {
min-width:86px;
padding:0 24px 0 9px;
@@ -292,8 +297,8 @@
<script type="importmap">
{
"imports": {
"three": "/vendor/three/build/three.module.js",
"three/addons/": "/vendor/three/examples/jsm/",
"three": "../vendor/three/build/three.module.js",
"three/addons/": "../vendor/three/examples/jsm/",
"@mkkellogg/gaussian-splats-3d": "./vendor/gaussian-splats-3d.module.js"
}
}
@@ -977,7 +982,7 @@ async function loadMkMiniModel(sdfPose = { x:0, y:0, z:0, roll:0, pitch:0, yaw:0
const initialBounds = new THREE.Box3().setFromObject(model);
const initialSize = initialBounds.getSize(new THREE.Vector3());
const largestDimension = Math.max(initialSize.x, initialSize.y, initialSize.z, 0.001);
model.scale.setScalar(0.62 / largestDimension);
model.scale.setScalar(0.66 / largestDimension);
model.updateMatrixWorld(true);
const normalizedBounds = new THREE.Box3().setFromObject(model);
src/renderer/src/App.tsx
+17 -4
View File
@@ -3234,6 +3234,7 @@ export default function App(): React.JSX.Element {
const connectedPlatformRef = useRef<PlatformOption | null>(null)
const runningPlatformsRef = useRef<PlatformOption[]>([])
const platformStatusRequestSequenceRef = useRef(0)
const [checkedRemotePlatformStatusIds, setCheckedRemotePlatformStatusIds] = useState<Set<string>>(() => new Set())
const forcedPlatformTerminationHandlerRef = useRef<(payload: PlatformControlTerminatedPayload) => void>(() => undefined)
const [workspaceWeekState, setWorkspaceWeekState] = useState<CurriculumWeek | null>(null)
const [sessionConfirmAction, setSessionConfirmAction] = useState<'disconnect' | 'release' | null>(null)
@@ -3641,6 +3642,11 @@ export default function App(): React.JSX.Element {
return status ? { ...platform, ...status } : platform
}
setPlatformOptions((current) => current.map(mergePlatformStatus))
setCheckedRemotePlatformStatusIds((current) => {
const next = new Set(current)
platforms.forEach((platform) => next.add(platform.id))
return next
})
const lostControlPlatformIds = new Set(
runningPlatformsRef.current
.filter((platform) => {
@@ -3813,15 +3819,19 @@ export default function App(): React.JSX.Element {
cancelled = true
}
}, [authReady, authSession?.accessToken, fetchWithFreshAuth])
const isRemotePlatformStatusPending = (platform: PlatformOption): boolean => (
platform.platformKey !== 'futuredrive-local-pc' && !checkedRemotePlatformStatusIds.has(platform.id)
)
const filteredPlatformOptions = platformOptions.filter((platform) => {
if (platformFilter === 'available') return platform.state === 'ready'
if (platformFilter === 'unavailable') return platform.state !== 'ready'
const pending = isRemotePlatformStatusPending(platform)
if (platformFilter === 'available') return platform.state === 'ready' && !pending
if (platformFilter === 'unavailable') return platform.state !== 'ready' && !pending
return true
})
const platformFilterCounts = {
all: platformOptions.length,
available: platformOptions.filter((platform) => platform.state === 'ready').length,
unavailable: platformOptions.filter((platform) => platform.state !== 'ready').length
available: platformOptions.filter((platform) => platform.state === 'ready' && !isRemotePlatformStatusPending(platform)).length,
unavailable: platformOptions.filter((platform) => platform.state !== 'ready' && !isRemotePlatformStatusPending(platform)).length
}
const localPcPlatform = platformOptions.find((platform) => platform.platformKey === 'futuredrive-local-pc')
const openPlatformSettings = (platform: PlatformOption): void => {
@@ -4306,6 +4316,8 @@ export default function App(): React.JSX.Element {
setLocalPcLayoutOpen(false)
setRecentSessionModalOpen(false)
setPlatformModalMode('select')
platformStatusRequestSequenceRef.current += 1
setCheckedRemotePlatformStatusIds(new Set())
await loadCurriculum()
setPlatformModalOpen(true)
}
@@ -4828,6 +4840,7 @@ export default function App(): React.JSX.Element {
counts={platformFilterCounts}
workspaceWeekTitle={workspaceWeek.title}
platformLoading={platformLoading}
checkedRemotePlatformStatusIds={checkedRemotePlatformStatusIds}
isPlatformUnavailable={isPlatformUnavailable}
getPlatformDotClass={getPlatformDotClass}
onFilterChange={setPlatformFilter}
src/renderer/src/components/TitleBar.tsx
+15 -1
View File
@@ -1,5 +1,5 @@
import icon from '/assets/icon.png'
import { Bell, BookOpen, Building2, CheckCheck, ChevronLeft, ChevronRight, HelpCircle, LogOut, Minus, Search, Square, X } from 'lucide-react'
import { Bell, BookOpen, Bug, Building2, CheckCheck, ChevronLeft, ChevronRight, HelpCircle, LogOut, Minus, Search, Square, X } from 'lucide-react'
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import Tooltip from './Tooltip'
@@ -495,6 +495,20 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
<HelpCircle size={16} />
</button>
</Tooltip>
<Tooltip label="개발자 도구 열기">
<button
type="button"
aria-label="Open Developer Tools"
onClick={() => {
void window.titlebar.openDevTools().then((result) => {
if (!result.opened) console.error('[titlebar] open DevTools failed:', result.message)
}).catch((error) => console.error('[titlebar] open DevTools request failed:', error))
}}
className={winButton}
>
<Bug size={15} />
</button>
</Tooltip>
<div className="relative" ref={notificationRef}>
<Tooltip label="알림" disabled={notificationOpen}>
<button
src/renderer/src/env.d.ts
Vendored
+1
View File
@@ -44,6 +44,7 @@ interface Window {
titlebar: {
minimize: () => void
maximize: () => void
openDevTools: () => Promise<{ opened: boolean; message?: string }>
close: () => void
}
appLifecycle: {
src/renderer/src/features/platforms/PlatformCards.tsx
+6 -2
View File
@@ -1,4 +1,4 @@
import { AlertCircle, CheckCircle2, Link2, Lock, Power, Settings } from 'lucide-react'
import { AlertCircle, CheckCircle2, Link2, LoaderCircle, Lock, Power, Settings } from 'lucide-react'
import type { LucideIcon } from 'lucide-react'
import type React from 'react'
import type { PlatformOption } from './types'
@@ -60,6 +60,7 @@ type PlatformOptionCardProps = {
Icon: LucideIcon
dotClassName: string
unavailable: boolean
statusPending: boolean
displayStatus: string
primaryAction: string
actionDisabled: boolean
@@ -73,6 +74,7 @@ export function PlatformOptionCard({
Icon,
dotClassName,
unavailable,
statusPending,
displayStatus,
primaryAction,
actionDisabled,
@@ -106,7 +108,9 @@ export function PlatformOptionCard({
</div>
<p className="mt-1 text-[12px] font-medium text-[#5f6878]">{platform.description}</p>
<div className="mt-2 flex items-center gap-1.5 text-[11px] font-bold text-[#5f6878]">
{unavailable
{statusPending
? <LoaderCircle size={13} className="animate-spin text-[#7a879a]" />
: unavailable
? <AlertCircle size={13} className="text-[#dc2626]" />
: ready
? <CheckCircle2 size={13} className="text-[#2fbda0]" />
src/renderer/src/features/platforms/PlatformSelectionPanel.tsx
+11 -5
View File
@@ -19,6 +19,7 @@ type PlatformSelectionPanelProps = {
counts: Record<PlatformFilter, number>
workspaceWeekTitle: string
platformLoading: boolean
checkedRemotePlatformStatusIds: ReadonlySet<string>
isPlatformUnavailable: (platform: PlatformOption) => boolean
getPlatformDotClass: (platform: PlatformOption) => string
onFilterChange: (filter: PlatformFilter) => void
@@ -36,6 +37,7 @@ export default function PlatformSelectionPanel({
counts,
workspaceWeekTitle,
platformLoading,
checkedRemotePlatformStatusIds,
isPlatformUnavailable,
getPlatformDotClass,
onFilterChange,
@@ -81,14 +83,17 @@ export default function PlatformSelectionPanel({
const { id, status, action, state, iconKey } = platform
const Icon = PLATFORM_ICONS[iconKey] ?? Monitor
const locked = state === 'locked'
const unavailable = isPlatformUnavailable(platform)
const actionDisabled = locked || unavailable
const statusPending = platform.platformKey !== 'futuredrive-local-pc' && !checkedRemotePlatformStatusIds.has(id)
const unavailable = !statusPending && isPlatformUnavailable(platform)
const actionDisabled = statusPending || locked || unavailable
const runningInSelectionList = runningPlatforms.some((runningPlatform) => runningPlatform.id === platform.id)
const displayStatus = unavailable && !status.includes('연결 끊김') && !status.includes('연결 불가')
const displayStatus = statusPending
? '확인 중'
: unavailable && !status.includes('연결 끊김') && !status.includes('연결 불가')
? '연결 끊김'
: status
const hasControl = platform.control?.status === 'ACTIVE'
const primaryAction = hasControl ? '연결' : action
const primaryAction = statusPending ? '확인 중' : hasControl ? '연결' : action
const platformActionDisabled = runningInSelectionList || actionDisabled
return (
@@ -96,8 +101,9 @@ export default function PlatformSelectionPanel({
key={id}
platform={platform}
Icon={Icon}
dotClassName={getPlatformDotClass(platform)}
dotClassName={statusPending ? 'bg-[#94a3b8] shadow-[0_0_6px_rgba(148,163,184,0.45)]' : getPlatformDotClass(platform)}
unavailable={unavailable}
statusPending={statusPending}
displayStatus={displayStatus}
primaryAction={primaryAction}
actionDisabled={platformActionDisabled}
src/renderer/src/features/workspace/WorldEditorModal.tsx
+5 -5
View File
@@ -59,11 +59,11 @@ function createMesh(item: WorldLayoutObject): THREE.Mesh {
return mesh
}
const modelRoot = '/slam-viewer/turtlebot3_world_model/turtlebot3_world'
const modelRoot = './slam-viewer/turtlebot3_world_model/turtlebot3_world'
const modelRoots: Record<string, string> = {
turtlebot3_world: modelRoot,
turtlebot3_house: '/slam-viewer/turtlebot3_world_model/turtlebot3_house',
turtlebot3_common: '/slam-viewer/turtlebot3_world_model/turtlebot3_common'
turtlebot3_house: './slam-viewer/turtlebot3_world_model/turtlebot3_house',
turtlebot3_common: './slam-viewer/turtlebot3_world_model/turtlebot3_common'
}
function parseNumbers(value: string | null | undefined, count = 0): number[] {
@@ -97,7 +97,7 @@ function worldMaterial(visual: Element): THREE.MeshLambertMaterial {
}
function gazeboAssetPath(uri: string): string {
return uri.replace(/^model:\/\/(\w+)\//, (_match, name: string) => `${modelRoots[name] ?? `/slam-viewer/turtlebot3_world_model/${name}`}/`)
return uri.replace(/^model:\/\/(\w+)\//, (_match, name: string) => `${modelRoots[name] ?? `./slam-viewer/turtlebot3_world_model/${name}`}/`)
}
async function loadWorldSdf(parent: THREE.Group): Promise<void> {
@@ -470,7 +470,7 @@ export default function WorldEditorModal({ workspaceRoot, onClose, onSaved }: Wo
</aside>
<main className="relative min-w-0 flex-1 bg-[#0b1220]">
<div ref={canvasHostRef} className="pointer-events-none absolute inset-0 opacity-0" />
<iframe ref={viewerRef} title="TurtleBot3 World Editor" src="/slam-viewer/index.html?editor=1&mapKey=nav2-custom" className="absolute inset-0 z-10 size-full border-0" />
<iframe ref={viewerRef} title="TurtleBot3 World Editor" src="./slam-viewer/index.html?editor=1&mapKey=nav2-custom" className="absolute inset-0 z-10 size-full border-0" />
{loading && <div className="absolute inset-0 z-20 grid place-items-center bg-[#0b1220] text-[12px] font-semibold text-white/58"><span className="flex items-center gap-2"><LoaderCircle size={16} className="animate-spin" />월드 불러오는 중</span></div>}
<div className="absolute left-3 top-3 z-20 flex overflow-hidden rounded-md border border-white/15 bg-[#15223a]/95 shadow">
{([
src/renderer/src/features/workspace/useWorkspaceVisualization.ts
+2 -2
View File
@@ -134,8 +134,8 @@ export function useWorkspaceVisualization({
const visualizationRuntimeStack = visualizationStack === 'slam' || visualizationStack === 'slam3d' ? 'nav2' : visualizationStack
const pointCloudQuery = visualizationStack === 'slam3d' ? '&pointCloud=1' : ''
const visualizationViewerUrl = visualizationStack === 'slam' || visualizationStack === 'slam3d' || visualizationStack === 'nav2'
? `/slam-viewer/index.html?directBridge=1&mode=${visualizationStack === 'nav2' ? nav2VisualizationMode : 'slam'}&runtime=${isRealPlatformProfile(activeEnvironmentProfile) ? 'real' : 'simulation'}&bridgeWs=${encodeURIComponent(`${visualizationBridgeUrl}/ws/state`)}&bridgeHttp=${encodeURIComponent(visualizationBridgeHttpUrl)}&mapKey=${encodeURIComponent(mapKey ?? 'nav2-turtlebot3-world')}&layoutVersion=${worldLayoutVersion ?? 0}${pointCloudQuery}`
: `/autoware-viewer/index.html?source=ros&stack=${visualizationStack}&bridge=${encodeURIComponent(visualizationBridgeUrl)}&backend=${encodeURIComponent(visualizationBackendUrl)}`
? `./slam-viewer/index.html?directBridge=1&mode=${visualizationStack === 'nav2' ? nav2VisualizationMode : 'slam'}&runtime=${isRealPlatformProfile(activeEnvironmentProfile) ? 'real' : 'simulation'}&bridgeWs=${encodeURIComponent(`${visualizationBridgeUrl}/ws/state`)}&bridgeHttp=${encodeURIComponent(visualizationBridgeHttpUrl)}&mapKey=${encodeURIComponent(mapKey ?? 'nav2-turtlebot3-world')}&layoutVersion=${worldLayoutVersion ?? 0}${pointCloudQuery}`
: `./autoware-viewer/index.html?source=ros&stack=${visualizationStack}&bridge=${encodeURIComponent(visualizationBridgeUrl)}&backend=${encodeURIComponent(visualizationBackendUrl)}`
useEffect(() => {
const fallback = runtimeProfiles[0] ? resolveVisualizationStack(runtimeProfiles[0].profileType) : null