No description
- TypeScript 98.1%
- CSS 1%
- HTML 0.5%
- JavaScript 0.4%
Portable dir target with code signing disabled. Output goes to release/ directory (gitignored). Build with: npm run electron:build Co-Authored-By: GLM-5.1 <noreply@z.ai> |
||
|---|---|---|
| docs | ||
| electron | ||
| src | ||
| .eslintrc.cjs | ||
| .gitignore | ||
| AGENTS.md | ||
| electron-builder.yml | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| postcss.config.js | ||
| README.md | ||
| tailwind.config.js | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
AssetViewer
Desktop application for browsing and previewing asset folders — 3D models, textures, PSD files and more.
Features
- Folder tree navigation with lazy loading
- Recursive mode — show all files from subdirectories in a flat list
- 3D model preview — interactive viewer with orbit controls for glTF, GLB, FBX, OBJ, DAE, STL
- Texture preview — PNG, JPG, BMP, GIF, SVG, TGA with zoom and pan
- PSD viewer — layer list, visibility toggle, composite/per-layer rendering
- Thumbnail generation — 3D models rendered to preview images with progress bar
- Smart texture resolution — automatically finds textures in sibling
textures/,.fbm/, and parent directories - Mouse back button support for navigation
Supported Formats
| Category | Extensions | Preview |
|---|---|---|
| 3D Models | .gltf, .glb, .fbx, .obj, .dae, .stl |
Interactive 3D viewer (Three.js) |
| Textures | .png, .jpg, .bmp, .tga, .gif, .svg, .webp |
Image viewer with zoom/pan |
| Layered | .psd |
Layer list, visibility toggle |
| Unsupported | .blend, .mtl, .ase and others |
File info only |
Tech Stack
- Electron 33+ — desktop runtime
- React 18 + TypeScript — UI framework
- Vite — build tool
- Three.js + @react-three/fiber — 3D rendering
- Zustand — state management
- Tailwind CSS + Lucide React — styling and icons
Getting Started
Prerequisites
- Node.js 18+
- npm
Install
npm install
Development
npm run dev
Build
npm run build
Lint & Typecheck
npm run lint
npm run typecheck
Project Structure
AssetViewer/
├── electron/ # Electron main process
│ ├── main.ts # App entry, window creation
│ ├── preload.ts # IPC bridge (contextBridge)
│ └── services/
│ ├── fileProtocol.ts # asset:// custom protocol
│ ├── ipcHandlers.ts # IPC handlers (scan, tree, textures)
│ └── fileScannerShared.ts # Format detection
├── src/ # React renderer
│ ├── App.tsx # Main app layout
│ ├── components/
│ │ ├── Sidebar/ # Folder tree
│ │ ├── ContentArea/ # Asset grid and cards
│ │ └── Viewers/ # 3D, image, PSD viewers
│ ├── store/ # Zustand state
│ ├── utils/ # Thumbnail generator, loader utils
│ └── types/ # TypeScript types
├── docs/plan.md
└── package.json
License
Private