Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| be4cf502d1 | |||
| f6ac71dad2 | |||
| 30ff9826dc |
+1
-5
@@ -27,7 +27,7 @@ FROM node:20-slim AS runner
|
|||||||
LABEL maintainer="La Fabrik Durable"
|
LABEL maintainer="La Fabrik Durable"
|
||||||
LABEL description="Secure GLTF upload interface with Draco compression and GitHub push"
|
LABEL description="Secure GLTF upload interface with Draco compression and GitHub push"
|
||||||
|
|
||||||
# Install Blender (headless) + runtime helpers
|
# Blender is required for server-side Draco GLB export.
|
||||||
RUN apt-get update && apt-get install -y --no-install-recommends \
|
RUN apt-get update && apt-get install -y --no-install-recommends \
|
||||||
blender \
|
blender \
|
||||||
tini \
|
tini \
|
||||||
@@ -41,18 +41,14 @@ ENV NEXT_TELEMETRY_DISABLED=1
|
|||||||
ENV PORT=3000
|
ENV PORT=3000
|
||||||
ENV HOSTNAME=0.0.0.0
|
ENV HOSTNAME=0.0.0.0
|
||||||
|
|
||||||
# Copy build artifacts
|
|
||||||
COPY --from=builder /app/.next/standalone ./
|
COPY --from=builder /app/.next/standalone ./
|
||||||
COPY --from=builder /app/.next/static ./.next/static
|
COPY --from=builder /app/.next/static ./.next/static
|
||||||
COPY --from=builder /app/public ./public
|
COPY --from=builder /app/public ./public
|
||||||
|
|
||||||
# Copy the Blender compression script
|
|
||||||
COPY --from=builder /app/scripts ./scripts
|
COPY --from=builder /app/scripts ./scripts
|
||||||
|
|
||||||
# Ensure tmp dir for uploads exists
|
|
||||||
RUN mkdir -p /tmp/assets
|
RUN mkdir -p /tmp/assets
|
||||||
|
|
||||||
# Copy entrypoint
|
|
||||||
COPY docker-entrypoint.sh /docker-entrypoint.sh
|
COPY docker-entrypoint.sh /docker-entrypoint.sh
|
||||||
RUN chmod +x /docker-entrypoint.sh
|
RUN chmod +x /docker-entrypoint.sh
|
||||||
|
|
||||||
|
|||||||
@@ -161,8 +161,8 @@ components/
|
|||||||
│ ├── DriveErrorModal.tsx # "Drive failed, continue?" dialog
|
│ ├── DriveErrorModal.tsx # "Drive failed, continue?" dialog
|
||||||
│ └── ActionButtons.tsx # Upload / Cancel / Reset buttons
|
│ └── ActionButtons.tsx # Upload / Cancel / Reset buttons
|
||||||
├── UploadZone.tsx # Main upload page (rendering only)
|
├── UploadZone.tsx # Main upload page (rendering only)
|
||||||
├── ModelViewer.tsx # Lazy wrapper for 3D viewer
|
├── ModelViewer.tsx # 3D viewer shell, stats panel, and hierarchy panel
|
||||||
└── SceneViewer.tsx # Three.js Canvas
|
└── SceneViewer.tsx # Three.js Canvas, model stats, and scene hierarchy extraction
|
||||||
hooks/
|
hooks/
|
||||||
├── useSecret.ts # Secret key state management
|
├── useSecret.ts # Secret key state management
|
||||||
├── useFolderEntries.ts # Folder entries state management
|
├── useFolderEntries.ts # Folder entries state management
|
||||||
@@ -170,7 +170,7 @@ hooks/
|
|||||||
lib/
|
lib/
|
||||||
├── constants.ts # Shared constants and extensions
|
├── constants.ts # Shared constants and extensions
|
||||||
├── types.ts # Server types (ParsedFile, FileDiff, staged asset metadata, etc.)
|
├── types.ts # Server types (ParsedFile, FileDiff, staged asset metadata, etc.)
|
||||||
├── client-types.ts # Client types (FolderEntry, DriveStatus, etc.)
|
├── client-types.ts # Client types (FolderEntry, DriveStatus, viewer contracts, etc.)
|
||||||
├── upload-api.ts # Client-side API helpers (stage, check, uploadDrive, uploadGit)
|
├── upload-api.ts # Client-side API helpers (stage, check, uploadDrive, uploadGit)
|
||||||
├── guards.ts # Shared runtime guards and error message helpers
|
├── guards.ts # Shared runtime guards and error message helpers
|
||||||
├── diff-files.ts # File diff classification (new/changed/unchanged/deleted)
|
├── diff-files.ts # File diff classification (new/changed/unchanged/deleted)
|
||||||
@@ -190,7 +190,7 @@ lib/
|
|||||||
scripts/
|
scripts/
|
||||||
└── compress.py # Blender Draco compression script
|
└── compress.py # Blender Draco compression script
|
||||||
Dockerfile # Multi-stage build: Node 20 slim + Blender + tini
|
Dockerfile # Multi-stage build: Node 20 slim + Blender + tini
|
||||||
docker-entrypoint.sh # Startup check + launch
|
docker-entrypoint.sh # Upload temp setup + Blender availability check
|
||||||
```
|
```
|
||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
@@ -259,6 +259,6 @@ Git delivery outputs `.glb` by default, or keeps the source `.gltf` structure wh
|
|||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
See [MIT](LICENSE) License
|
See [MIT](LICENSE).
|
||||||
|
|
||||||
Copyright 2026 La Fabrik Durable. All rights reserved.
|
Copyright 2026 La Fabrik Durable. All rights reserved.
|
||||||
|
|||||||
+145
-35
@@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
import { Component, useEffect, useState } from 'react'
|
import { Component, useEffect, useState } from 'react'
|
||||||
import type { ComponentType, ReactNode } from 'react'
|
import type { ComponentType, ReactNode } from 'react'
|
||||||
import type { ModelStats } from './SceneViewer'
|
import type { ModelHierarchyNode, ModelStats, SceneViewerProps } from '@/lib/client-types'
|
||||||
|
|
||||||
interface ModelViewerProps {
|
interface ModelViewerProps {
|
||||||
url: string
|
url: string
|
||||||
@@ -11,6 +11,21 @@ interface ModelViewerProps {
|
|||||||
size: string
|
size: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const VIEWER_FRAME_CLASS = 'w-full h-[450px] bg-black-800 border border-white/20 rounded-xl overflow-hidden'
|
||||||
|
const CENTERED_VIEWER_FRAME_CLASS = `${VIEWER_FRAME_CLASS} flex items-center justify-center`
|
||||||
|
|
||||||
|
const MODEL_STAT_ROWS = [
|
||||||
|
{ label: 'Draw calls', getValue: (stats: ModelStats) => stats.drawCalls },
|
||||||
|
{ label: 'Children', getValue: (stats: ModelStats) => stats.childObjects },
|
||||||
|
{ label: 'Meshes', getValue: (stats: ModelStats) => stats.meshes },
|
||||||
|
{ label: 'Triangles', getValue: (stats: ModelStats) => stats.triangles.toLocaleString('fr-FR') },
|
||||||
|
{ label: 'Materials', getValue: (stats: ModelStats) => stats.materials },
|
||||||
|
{ label: 'Textures', getValue: (stats: ModelStats) => stats.textures },
|
||||||
|
] satisfies Array<{
|
||||||
|
label: string
|
||||||
|
getValue: (stats: ModelStats) => number | string
|
||||||
|
}>
|
||||||
|
|
||||||
function getPreviewErrorMessage(error: unknown) {
|
function getPreviewErrorMessage(error: unknown) {
|
||||||
return error instanceof Error ? error.message : 'Erreur preview inconnue'
|
return error instanceof Error ? error.message : 'Erreur preview inconnue'
|
||||||
}
|
}
|
||||||
@@ -28,6 +43,108 @@ function PreviewFallback({ message }: { message?: string }) {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatTransformValue(value: number) {
|
||||||
|
return Number.isInteger(value) ? String(value) : value.toFixed(4).replace(/0+$/, '').replace(/\.$/, '')
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatTransform(values: [number, number, number]) {
|
||||||
|
return `[${values.map(formatTransformValue).join(', ')}]`
|
||||||
|
}
|
||||||
|
|
||||||
|
function countHierarchyNodes(node: ModelHierarchyNode): number {
|
||||||
|
return 1 + node.children.reduce((count, child) => count + countHierarchyNodes(child), 0)
|
||||||
|
}
|
||||||
|
|
||||||
|
function HierarchyTree({
|
||||||
|
node,
|
||||||
|
depth = 0,
|
||||||
|
}: {
|
||||||
|
node: ModelHierarchyNode
|
||||||
|
depth?: number
|
||||||
|
}) {
|
||||||
|
const hasChildren = node.children.length > 0
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
className="grid grid-cols-[minmax(0,1fr)_auto] items-start gap-3 py-1 text-xs"
|
||||||
|
style={{ paddingLeft: `${depth * 14}px` }}
|
||||||
|
>
|
||||||
|
<div className="min-w-0">
|
||||||
|
<div className="flex min-w-0 items-center gap-1.5">
|
||||||
|
<span className="w-3 shrink-0 text-gray-500">{hasChildren ? 'v' : '-'}</span>
|
||||||
|
<span className="truncate font-semibold text-gray-200">{node.name}</span>
|
||||||
|
<span className="shrink-0 text-[10px] text-gray-500">{node.type}</span>
|
||||||
|
</div>
|
||||||
|
<div className="ml-4 mt-0.5 flex flex-wrap gap-x-4 gap-y-1 font-mono text-[10px] text-gray-600">
|
||||||
|
<span>pos {formatTransform(node.position)}</span>
|
||||||
|
<span>rot {formatTransform(node.rotation)}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span className={`rounded-full border px-2 py-0.5 text-[10px] ${
|
||||||
|
node.visible
|
||||||
|
? 'border-white/10 bg-white/5 text-gray-400'
|
||||||
|
: 'border-red-500/20 bg-red-500/10 text-red-300'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{node.visible ? 'Visible' : 'Hidden'}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{hasChildren && (
|
||||||
|
<div className="border-l border-white/10">
|
||||||
|
{node.children.map((child) => (
|
||||||
|
<HierarchyTree key={child.id} node={child} depth={depth + 1} />
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function HierarchyPanel({
|
||||||
|
hierarchy,
|
||||||
|
onClose,
|
||||||
|
}: {
|
||||||
|
hierarchy: ModelHierarchyNode
|
||||||
|
onClose: () => void
|
||||||
|
}) {
|
||||||
|
const nodeCount = countHierarchyNodes(hierarchy)
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="absolute inset-y-3 right-3 z-30 flex w-[min(22rem,calc(100%-1.5rem))] flex-col overflow-hidden rounded-xl border border-white/15 bg-black-900/90 text-gray-300 shadow-2xl backdrop-blur">
|
||||||
|
<div className="flex items-center justify-between border-b border-white/10 px-3 py-2">
|
||||||
|
<div>
|
||||||
|
<p className="text-xs font-semibold text-gray-100">Hierarchy</p>
|
||||||
|
<p className="text-[10px] text-gray-600">{nodeCount} nodes</p>
|
||||||
|
</div>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={onClose}
|
||||||
|
className="rounded-full border border-white/10 px-2 py-1 text-xs text-gray-400 transition hover:bg-white/10 hover:text-gray-100"
|
||||||
|
>
|
||||||
|
Close
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div className="flex-1 overflow-auto px-3 py-2">
|
||||||
|
<HierarchyTree node={hierarchy} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function ModelStatsPanel({ stats }: { stats: ModelStats }) {
|
||||||
|
return (
|
||||||
|
<div className="flex flex-col gap-1.5 rounded-lg border border-white/10 bg-black-900/75 p-2 text-xs text-gray-300 backdrop-blur">
|
||||||
|
{MODEL_STAT_ROWS.map(({ label, getValue }) => (
|
||||||
|
<span key={label} className="flex justify-between gap-3">
|
||||||
|
<span className="text-gray-500">{label}</span>
|
||||||
|
<span className="font-mono text-gray-200">{getValue(stats)}</span>
|
||||||
|
</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
class PreviewErrorBoundary extends Component<
|
class PreviewErrorBoundary extends Component<
|
||||||
{ children: ReactNode },
|
{ children: ReactNode },
|
||||||
{ message: string | null }
|
{ message: string | null }
|
||||||
@@ -54,12 +171,10 @@ class PreviewErrorBoundary extends Component<
|
|||||||
export default function ModelViewer({ url, assetUrls, filename, size }: ModelViewerProps) {
|
export default function ModelViewer({ url, assetUrls, filename, size }: ModelViewerProps) {
|
||||||
const canPreview = filename.toLowerCase().endsWith('.gltf')
|
const canPreview = filename.toLowerCase().endsWith('.gltf')
|
||||||
const [stats, setStats] = useState<ModelStats | null>(null)
|
const [stats, setStats] = useState<ModelStats | null>(null)
|
||||||
|
const [hierarchy, setHierarchy] = useState<ModelHierarchyNode | null>(null)
|
||||||
|
const [hierarchyOpen, setHierarchyOpen] = useState(false)
|
||||||
const [sceneError, setSceneError] = useState<string | null>(null)
|
const [sceneError, setSceneError] = useState<string | null>(null)
|
||||||
const [Scene, setScene] = useState<ComponentType<{
|
const [Scene, setScene] = useState<ComponentType<SceneViewerProps> | null>(null)
|
||||||
url: string
|
|
||||||
assetUrls: Record<string, string>
|
|
||||||
onStatsReady: (stats: ModelStats) => void
|
|
||||||
}> | null>(null)
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!canPreview) return
|
if (!canPreview) return
|
||||||
@@ -67,6 +182,8 @@ export default function ModelViewer({ url, assetUrls, filename, size }: ModelVie
|
|||||||
let cancel = false
|
let cancel = false
|
||||||
setSceneError(null)
|
setSceneError(null)
|
||||||
setStats(null)
|
setStats(null)
|
||||||
|
setHierarchy(null)
|
||||||
|
setHierarchyOpen(false)
|
||||||
|
|
||||||
import('./SceneViewer')
|
import('./SceneViewer')
|
||||||
.then((mod) => {
|
.then((mod) => {
|
||||||
@@ -81,7 +198,7 @@ export default function ModelViewer({ url, assetUrls, filename, size }: ModelVie
|
|||||||
|
|
||||||
if (!canPreview) {
|
if (!canPreview) {
|
||||||
return (
|
return (
|
||||||
<div className="w-full h-[450px] bg-black-800 border border-white/20 rounded-xl overflow-hidden flex items-center justify-center">
|
<div className={CENTERED_VIEWER_FRAME_CLASS}>
|
||||||
<p className="text-sm text-gray-400 px-6 text-center">
|
<p className="text-sm text-gray-400 px-6 text-center">
|
||||||
La preview 3D locale n'est pas disponible pour les dossiers <span className="font-mono">model.gltf</span> avec fichiers associes.
|
La preview 3D locale n'est pas disponible pour les dossiers <span className="font-mono">model.gltf</span> avec fichiers associes.
|
||||||
</p>
|
</p>
|
||||||
@@ -91,14 +208,14 @@ export default function ModelViewer({ url, assetUrls, filename, size }: ModelVie
|
|||||||
|
|
||||||
if (!Scene) {
|
if (!Scene) {
|
||||||
return (
|
return (
|
||||||
<div className="w-full h-[450px] bg-black-800 border border-white/20 rounded-xl overflow-hidden flex items-center justify-center">
|
<div className={CENTERED_VIEWER_FRAME_CLASS}>
|
||||||
<div className="w-6 h-6 border-2 border-gray-500 border-t-gray-300 rounded-full animate-spin" />
|
<div className="w-6 h-6 border-2 border-gray-500 border-t-gray-300 rounded-full animate-spin" />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full h-[450px] bg-black-800 border border-white/20 rounded-xl overflow-hidden relative">
|
<div className={`${VIEWER_FRAME_CLASS} relative`}>
|
||||||
<div className="absolute top-3 left-3 z-10 flex items-center gap-2">
|
<div className="absolute top-3 left-3 z-10 flex items-center gap-2">
|
||||||
<span className="text-xs text-gray-400 font-mono bg-black-900/60 px-2 py-1 rounded">
|
<span className="text-xs text-gray-400 font-mono bg-black-900/60 px-2 py-1 rounded">
|
||||||
{filename}
|
{filename}
|
||||||
@@ -108,38 +225,31 @@ export default function ModelViewer({ url, assetUrls, filename, size }: ModelVie
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
{stats && (
|
{stats && (
|
||||||
<div className="absolute top-3 right-3 z-10 flex w-44 flex-col gap-1.5 rounded-lg border border-white/10 bg-black-900/75 p-2 text-xs text-gray-300 backdrop-blur">
|
<div className="absolute top-3 right-3 z-20 flex w-44 flex-col gap-2">
|
||||||
<span className="flex justify-between gap-3">
|
<ModelStatsPanel stats={stats} />
|
||||||
<span className="text-gray-500">Draw calls</span>
|
<button
|
||||||
<span className="font-mono text-gray-200">{stats.drawCalls}</span>
|
type="button"
|
||||||
</span>
|
disabled={!hierarchy}
|
||||||
<span className="flex justify-between gap-3">
|
onClick={() => setHierarchyOpen((open) => !open)}
|
||||||
<span className="text-gray-500">Children</span>
|
className="rounded-lg border border-white/10 bg-black-900/75 px-3 py-1.5 text-xs font-medium text-gray-300 backdrop-blur transition hover:bg-white/10 hover:text-gray-100 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
<span className="font-mono text-gray-200">{stats.childObjects}</span>
|
>
|
||||||
</span>
|
Hierarchy
|
||||||
<span className="flex justify-between gap-3">
|
</button>
|
||||||
<span className="text-gray-500">Meshes</span>
|
|
||||||
<span className="font-mono text-gray-200">{stats.meshes}</span>
|
|
||||||
</span>
|
|
||||||
<span className="flex justify-between gap-3">
|
|
||||||
<span className="text-gray-500">Triangles</span>
|
|
||||||
<span className="font-mono text-gray-200">{stats.triangles.toLocaleString('fr-FR')}</span>
|
|
||||||
</span>
|
|
||||||
<span className="flex justify-between gap-3">
|
|
||||||
<span className="text-gray-500">Materials</span>
|
|
||||||
<span className="font-mono text-gray-200">{stats.materials}</span>
|
|
||||||
</span>
|
|
||||||
<span className="flex justify-between gap-3">
|
|
||||||
<span className="text-gray-500">Textures</span>
|
|
||||||
<span className="font-mono text-gray-200">{stats.textures}</span>
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
{hierarchy && hierarchyOpen && (
|
||||||
|
<HierarchyPanel hierarchy={hierarchy} onClose={() => setHierarchyOpen(false)} />
|
||||||
|
)}
|
||||||
{sceneError ? (
|
{sceneError ? (
|
||||||
<PreviewFallback message={sceneError} />
|
<PreviewFallback message={sceneError} />
|
||||||
) : (
|
) : (
|
||||||
<PreviewErrorBoundary key={url}>
|
<PreviewErrorBoundary key={url}>
|
||||||
<Scene url={url} assetUrls={assetUrls} onStatsReady={setStats} />
|
<Scene
|
||||||
|
url={url}
|
||||||
|
assetUrls={assetUrls}
|
||||||
|
onStatsReady={setStats}
|
||||||
|
onHierarchyReady={setHierarchy}
|
||||||
|
/>
|
||||||
</PreviewErrorBoundary>
|
</PreviewErrorBoundary>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
+38
-22
@@ -8,15 +8,7 @@ import { CanvasTexture, Mesh, TextureLoader } from 'three'
|
|||||||
import type { Material, Object3D, Texture } from 'three'
|
import type { Material, Object3D, Texture } from 'three'
|
||||||
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
|
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
|
||||||
import { normalizeTextureFilename } from '@/lib/asset-naming'
|
import { normalizeTextureFilename } from '@/lib/asset-naming'
|
||||||
|
import type { ModelHierarchyNode, ModelStats, SceneViewerProps } from '@/lib/client-types'
|
||||||
export interface ModelStats {
|
|
||||||
childObjects: number
|
|
||||||
drawCalls: number
|
|
||||||
materials: number
|
|
||||||
meshes: number
|
|
||||||
textures: number
|
|
||||||
triangles: number
|
|
||||||
}
|
|
||||||
|
|
||||||
interface OpacityMapEntry {
|
interface OpacityMapEntry {
|
||||||
target: string
|
target: string
|
||||||
@@ -103,7 +95,7 @@ function createAlphaMapTexture(texture: Texture) {
|
|||||||
const cachedTexture = alphaMapTextureCache.get(texture)
|
const cachedTexture = alphaMapTextureCache.get(texture)
|
||||||
if (cachedTexture) return cachedTexture
|
if (cachedTexture) return cachedTexture
|
||||||
|
|
||||||
const image = texture.image
|
const image: unknown = texture.image
|
||||||
|
|
||||||
if (!isAlphaImageSource(image)) {
|
if (!isAlphaImageSource(image)) {
|
||||||
texture.flipY = false
|
texture.flipY = false
|
||||||
@@ -207,6 +199,30 @@ function getModelStats(scene: Object3D, assetUrls: Record<string, string>): Mode
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function roundTransformValue(value: number) {
|
||||||
|
return Number(value.toFixed(4))
|
||||||
|
}
|
||||||
|
|
||||||
|
function getObjectHierarchy(object: Object3D): ModelHierarchyNode {
|
||||||
|
return {
|
||||||
|
children: object.children.map(getObjectHierarchy),
|
||||||
|
id: object.uuid,
|
||||||
|
name: object.name || object.type,
|
||||||
|
position: [
|
||||||
|
roundTransformValue(object.position.x),
|
||||||
|
roundTransformValue(object.position.y),
|
||||||
|
roundTransformValue(object.position.z),
|
||||||
|
],
|
||||||
|
rotation: [
|
||||||
|
roundTransformValue(object.rotation.x),
|
||||||
|
roundTransformValue(object.rotation.y),
|
||||||
|
roundTransformValue(object.rotation.z),
|
||||||
|
],
|
||||||
|
type: object.type,
|
||||||
|
visible: object.visible,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function pickOpacityMap(
|
function pickOpacityMap(
|
||||||
mesh: Mesh,
|
mesh: Mesh,
|
||||||
material: Material,
|
material: Material,
|
||||||
@@ -234,11 +250,8 @@ function Model({
|
|||||||
url,
|
url,
|
||||||
assetUrls,
|
assetUrls,
|
||||||
onStatsReady,
|
onStatsReady,
|
||||||
}: {
|
onHierarchyReady,
|
||||||
url: string
|
}: SceneViewerProps) {
|
||||||
assetUrls: Record<string, string>
|
|
||||||
onStatsReady: (stats: ModelStats) => void
|
|
||||||
}) {
|
|
||||||
const { scene } = useLoader(GLTFLoader, url, (loader) => {
|
const { scene } = useLoader(GLTFLoader, url, (loader) => {
|
||||||
loader.manager.setURLModifier((requestedUrl) => resolveAssetUrl(requestedUrl, assetUrls))
|
loader.manager.setURLModifier((requestedUrl) => resolveAssetUrl(requestedUrl, assetUrls))
|
||||||
})
|
})
|
||||||
@@ -247,7 +260,8 @@ function Model({
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
onStatsReady(getModelStats(scene, assetUrls))
|
onStatsReady(getModelStats(scene, assetUrls))
|
||||||
}, [assetUrls, onStatsReady, scene])
|
onHierarchyReady(getObjectHierarchy(scene))
|
||||||
|
}, [assetUrls, onHierarchyReady, onStatsReady, scene])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (opacityMapEntries.length === 0) return
|
if (opacityMapEntries.length === 0) return
|
||||||
@@ -270,16 +284,18 @@ export default function SceneViewer({
|
|||||||
url,
|
url,
|
||||||
assetUrls,
|
assetUrls,
|
||||||
onStatsReady,
|
onStatsReady,
|
||||||
}: {
|
onHierarchyReady,
|
||||||
url: string
|
}: SceneViewerProps) {
|
||||||
assetUrls: Record<string, string>
|
|
||||||
onStatsReady: (stats: ModelStats) => void
|
|
||||||
}) {
|
|
||||||
return (
|
return (
|
||||||
<Canvas dpr={[1, 2]} camera={{ fov: 50 }}>
|
<Canvas dpr={[1, 2]} camera={{ fov: 50 }}>
|
||||||
<Suspense fallback={null}>
|
<Suspense fallback={null}>
|
||||||
<Stage environment="city" intensity={0.6} adjustCamera={1.2}>
|
<Stage environment="city" intensity={0.6} adjustCamera={1.2}>
|
||||||
<Model url={url} assetUrls={assetUrls} onStatsReady={onStatsReady} />
|
<Model
|
||||||
|
url={url}
|
||||||
|
assetUrls={assetUrls}
|
||||||
|
onStatsReady={onStatsReady}
|
||||||
|
onHierarchyReady={onHierarchyReady}
|
||||||
|
/>
|
||||||
</Stage>
|
</Stage>
|
||||||
</Suspense>
|
</Suspense>
|
||||||
<OrbitControls makeDefault autoRotate autoRotateSpeed={0.5} />
|
<OrbitControls makeDefault autoRotate autoRotateSpeed={0.5} />
|
||||||
|
|||||||
@@ -41,7 +41,6 @@ export default function UploadZone() {
|
|||||||
globalError,
|
globalError,
|
||||||
setGlobalError,
|
setGlobalError,
|
||||||
overwriteConfirm,
|
overwriteConfirm,
|
||||||
setOverwriteConfirm,
|
|
||||||
noChangesFolder,
|
noChangesFolder,
|
||||||
setNoChangesFolder,
|
setNoChangesFolder,
|
||||||
driveError,
|
driveError,
|
||||||
|
|||||||
@@ -365,7 +365,6 @@ export function useUploadOrchestrator({
|
|||||||
globalError,
|
globalError,
|
||||||
setGlobalError,
|
setGlobalError,
|
||||||
overwriteConfirm,
|
overwriteConfirm,
|
||||||
setOverwriteConfirm,
|
|
||||||
noChangesFolder,
|
noChangesFolder,
|
||||||
setNoChangesFolder,
|
setNoChangesFolder,
|
||||||
driveError,
|
driveError,
|
||||||
|
|||||||
+27
-1
@@ -1,4 +1,4 @@
|
|||||||
export type FileStatus = 'pending' | 'uploading' | 'success' | 'error'
|
type FileStatus = 'pending' | 'uploading' | 'success' | 'error'
|
||||||
|
|
||||||
export interface TextureFile {
|
export interface TextureFile {
|
||||||
name: string
|
name: string
|
||||||
@@ -23,3 +23,29 @@ export interface FolderEntry {
|
|||||||
driveStatus?: DriveStatus
|
driveStatus?: DriveStatus
|
||||||
driveError?: string
|
driveError?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface ModelStats {
|
||||||
|
childObjects: number
|
||||||
|
drawCalls: number
|
||||||
|
materials: number
|
||||||
|
meshes: number
|
||||||
|
textures: number
|
||||||
|
triangles: number
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface ModelHierarchyNode {
|
||||||
|
children: ModelHierarchyNode[]
|
||||||
|
id: string
|
||||||
|
name: string
|
||||||
|
position: [number, number, number]
|
||||||
|
rotation: [number, number, number]
|
||||||
|
type: string
|
||||||
|
visible: boolean
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SceneViewerProps {
|
||||||
|
url: string
|
||||||
|
assetUrls: Record<string, string>
|
||||||
|
onStatsReady: (stats: ModelStats) => void
|
||||||
|
onHierarchyReady: (hierarchy: ModelHierarchyNode) => void
|
||||||
|
}
|
||||||
|
|||||||
+3
-2
@@ -202,7 +202,8 @@ async function uploadToLfsBatch(
|
|||||||
throw new Error(`LFS batch request failed (${batchRes.status}): ${text}`)
|
throw new Error(`LFS batch request failed (${batchRes.status}): ${text}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const batchObjects = parseLfsBatchResponse(await batchRes.json())
|
const batchData: unknown = await batchRes.json()
|
||||||
|
const batchObjects = parseLfsBatchResponse(batchData)
|
||||||
|
|
||||||
const objectMap = new Map(objects.map((o) => [o.oid, o]))
|
const objectMap = new Map(objects.map((o) => [o.oid, o]))
|
||||||
|
|
||||||
@@ -277,7 +278,7 @@ export async function getRemoteFolder(
|
|||||||
})
|
})
|
||||||
|
|
||||||
if (!Array.isArray(data)) {
|
if (!Array.isArray(data)) {
|
||||||
return { exists: false, files: [] }
|
throw new Error(`Le chemin distant ${folderPath} existe mais ce n'est pas un dossier`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const files: RemoteFile[] = await Promise.all(
|
const files: RemoteFile[] = await Promise.all(
|
||||||
|
|||||||
@@ -223,7 +223,12 @@ async function prepareDracoGlb(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
} finally {
|
} finally {
|
||||||
await rm(tmpFolder, { recursive: true, force: true }).catch(() => {})
|
await rm(tmpFolder, { recursive: true, force: true }).catch((err) => {
|
||||||
|
console.warn('[WARN] Blender temp cleanup failed', {
|
||||||
|
folderName,
|
||||||
|
error: getErrorMessage(err),
|
||||||
|
})
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
+1
-1
@@ -15,7 +15,7 @@ export type DriveAction = 'new' | 'replace'
|
|||||||
|
|
||||||
export type FileChange = 'new' | 'changed' | 'unchanged'
|
export type FileChange = 'new' | 'changed' | 'unchanged'
|
||||||
|
|
||||||
export type FileDiffStatus = 'changed' | 'new' | 'deleted'
|
type FileDiffStatus = 'changed' | 'new' | 'deleted'
|
||||||
|
|
||||||
export type AssetCategory = 'color' | 'diffuse' | 'roughness' | 'normal' | 'metalness' | 'height' | 'opacity' | 'orm' | 'ao' | 'assets'
|
export type AssetCategory = 'color' | 'diffuse' | 'roughness' | 'normal' | 'metalness' | 'height' | 'opacity' | 'orm' | 'ao' | 'assets'
|
||||||
|
|
||||||
|
|||||||
+19
-3
@@ -83,6 +83,24 @@ function isFileDiff(value: unknown): value is FileDiff {
|
|||||||
&& (value.status === 'new' || value.status === 'changed' || value.status === 'deleted')
|
&& (value.status === 'new' || value.status === 'changed' || value.status === 'deleted')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function parseFileDiffs(value: unknown): FileDiff[] {
|
||||||
|
if (!Array.isArray(value)) {
|
||||||
|
throw new Error('Reponse serveur invalide')
|
||||||
|
}
|
||||||
|
|
||||||
|
const diffs: FileDiff[] = []
|
||||||
|
|
||||||
|
for (const diff of value) {
|
||||||
|
if (!isFileDiff(diff)) {
|
||||||
|
throw new Error('Reponse serveur invalide')
|
||||||
|
}
|
||||||
|
|
||||||
|
diffs.push(diff)
|
||||||
|
}
|
||||||
|
|
||||||
|
return diffs
|
||||||
|
}
|
||||||
|
|
||||||
function buildUploadFormData(folder: FolderEntry, gitModelMode: GitModelMode): FormData {
|
function buildUploadFormData(folder: FolderEntry, gitModelMode: GitModelMode): FormData {
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
formData.append('folderName', folder.folderName)
|
formData.append('folderName', folder.folderName)
|
||||||
@@ -126,11 +144,9 @@ export async function checkFolderDiffs(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const diffs = Array.isArray(data.diffs) ? data.diffs.filter(isFileDiff) : []
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
exists: true,
|
exists: true,
|
||||||
diffs,
|
diffs: parseFileDiffs(data.diffs),
|
||||||
warning,
|
warning,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -25,7 +25,7 @@ export function uploadLockConflictResponse() {
|
|||||||
return uploadErrorMessageResponse(UPLOAD_LOCK_ERROR, 409)
|
return uploadErrorMessageResponse(UPLOAD_LOCK_ERROR, 409)
|
||||||
}
|
}
|
||||||
|
|
||||||
export function parseStagingRequestBody(value: unknown): StagingRequestBody {
|
function parseStagingRequestBody(value: unknown): StagingRequestBody {
|
||||||
if (!isRecord(value) || typeof value.stagingId !== 'string' || value.stagingId.trim() === '') {
|
if (!isRecord(value) || typeof value.stagingId !== 'string' || value.stagingId.trim() === '') {
|
||||||
throw new Error('stagingId manquant')
|
throw new Error('stagingId manquant')
|
||||||
}
|
}
|
||||||
@@ -38,7 +38,7 @@ export async function readStagingRequestBody(req: Request): Promise<StagingReque
|
|||||||
return parseStagingRequestBody(body)
|
return parseStagingRequestBody(body)
|
||||||
}
|
}
|
||||||
|
|
||||||
export function parseDriveRequestBody(value: unknown): DriveRequestBody {
|
function parseDriveRequestBody(value: unknown): DriveRequestBody {
|
||||||
const { stagingId } = parseStagingRequestBody(value)
|
const { stagingId } = parseStagingRequestBody(value)
|
||||||
|
|
||||||
if (!isRecord(value) || (value.action !== 'new' && value.action !== 'replace')) {
|
if (!isRecord(value) || (value.action !== 'new' && value.action !== 'replace')) {
|
||||||
|
|||||||
+12
-6
@@ -3,7 +3,7 @@ import { dirname, join } from 'path'
|
|||||||
import { mkdir, readdir, readFile, rm, writeFile } from 'fs/promises'
|
import { mkdir, readdir, readFile, rm, writeFile } from 'fs/promises'
|
||||||
import { existsSync } from 'fs'
|
import { existsSync } from 'fs'
|
||||||
import { TMP_DIR } from '@/lib/constants'
|
import { TMP_DIR } from '@/lib/constants'
|
||||||
import { isRecord } from '@/lib/guards'
|
import { getErrorMessage, isRecord } from '@/lib/guards'
|
||||||
import { getModelAssetPath } from '@/lib/model-paths'
|
import { getModelAssetPath } from '@/lib/model-paths'
|
||||||
import { prepareGitAssets } from '@/lib/prepare-git-assets'
|
import { prepareGitAssets } from '@/lib/prepare-git-assets'
|
||||||
import type {
|
import type {
|
||||||
@@ -28,7 +28,7 @@ interface StagedOriginalFile {
|
|||||||
interface StagedPreparedData {
|
interface StagedPreparedData {
|
||||||
modelFilename: string
|
modelFilename: string
|
||||||
compressed: boolean
|
compressed: boolean
|
||||||
deliveryMode?: GitModelMode
|
deliveryMode: GitModelMode
|
||||||
compressionError?: string
|
compressionError?: string
|
||||||
assetSummaries: PreparedAssetSummary[]
|
assetSummaries: PreparedAssetSummary[]
|
||||||
}
|
}
|
||||||
@@ -94,7 +94,7 @@ function isStagedPreparedData(value: unknown): value is StagedPreparedData {
|
|||||||
return isRecord(value)
|
return isRecord(value)
|
||||||
&& typeof value.modelFilename === 'string'
|
&& typeof value.modelFilename === 'string'
|
||||||
&& typeof value.compressed === 'boolean'
|
&& typeof value.compressed === 'boolean'
|
||||||
&& (value.deliveryMode === undefined || isGitModelMode(value.deliveryMode))
|
&& isGitModelMode(value.deliveryMode)
|
||||||
&& (value.compressionError === undefined || typeof value.compressionError === 'string')
|
&& (value.compressionError === undefined || typeof value.compressionError === 'string')
|
||||||
&& Array.isArray(value.assetSummaries)
|
&& Array.isArray(value.assetSummaries)
|
||||||
&& value.assetSummaries.every(isPreparedAssetSummary)
|
&& value.assetSummaries.every(isPreparedAssetSummary)
|
||||||
@@ -146,8 +146,14 @@ async function cleanupExpiredStagingUploads() {
|
|||||||
if (now - manifest.createdAt > STAGING_TTL_MS) {
|
if (now - manifest.createdAt > STAGING_TTL_MS) {
|
||||||
await cleanupStagingUpload(stagingId)
|
await cleanupStagingUpload(stagingId)
|
||||||
}
|
}
|
||||||
} catch {
|
} catch (err) {
|
||||||
await cleanupStagingUpload(stagingId).catch(() => {})
|
await cleanupStagingUpload(stagingId).catch((cleanupErr) => {
|
||||||
|
console.warn('[WARN] Staging cleanup failed', {
|
||||||
|
stagingId,
|
||||||
|
error: getErrorMessage(cleanupErr),
|
||||||
|
originalError: getErrorMessage(err),
|
||||||
|
})
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -259,7 +265,7 @@ export async function ensurePreparedStagingAssets(stagingId: string): Promise<Pr
|
|||||||
modelFilename: manifest.prepared.modelFilename,
|
modelFilename: manifest.prepared.modelFilename,
|
||||||
assetSummaries: manifest.prepared.assetSummaries,
|
assetSummaries: manifest.prepared.assetSummaries,
|
||||||
compressed: manifest.prepared.compressed,
|
compressed: manifest.prepared.compressed,
|
||||||
deliveryMode: manifest.prepared.deliveryMode ?? manifest.gitModelMode,
|
deliveryMode: manifest.prepared.deliveryMode,
|
||||||
compressionError: manifest.prepared.compressionError,
|
compressionError: manifest.prepared.compressionError,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user