Vetour

Virtual Tour Creator — Desktop App

Features • Prerequisites • Getting Started • Building • Structure • Contributing

---

Vetour is a cross-platform desktop application for creating, editing, and presenting immersive 360° virtual tours. Built with Tauri 2, React 19, and Photo Sphere Viewer, it offers a smooth, native experience for crafting interactive walkthroughs from panoramic images.

Features

• 360° Panorama Viewer — Full-screen panorama exploration with smooth navigation.
• Hotspots & Links — Add clickable info markers and navigation links between scenes.
• Interactive Markers — Rich hotspot actions: show images, videos, text, or play audio.
• Virtual Tour Mode — Seamlessly connect scenes into a guided walkthrough.
• Asset Manager — Import and manage images, audio, video, and documents.
• Present Mode — Separate full-screen presentation window with a clean interface.
• Project File (.vetour) — Save and load projects in a custom file format with compression.
• Multi-Resolution Processing — Automatic panorama resizing (low, medium, high) to WebP.
• Media Conversion — Automatic audio/video conversion for optimized playback.
• File Locking — Safe concurrent access to project files across windows.
• Drag & Drop Hotspots — Reposition markers by dragging in the viewer.
• Theme Support — Light, dark, and black themes.

Note: The deploy/publishing feature is maintained as a separate private module and is not included in this open-source build.

Prerequisites

Before you begin, ensure you have the following installed:

• Bun 1.x (or Node.js 22+ with npm/pnpm/yarn)
• Rust 1.85+ (via rustup)
• System dependencies for Tauri 2

Getting Started

# Clone the repository
git clone https://github.com/fazelllyyy/vetour.git
cd vetour

# Install JavaScript dependencies (also downloads ffmpeg sidecar)
bun install

# Run the app in development mode
bun run tauri dev

The app will launch with hot-reload enabled. The Tauri window will open automatically once the Vite dev server is ready on port 1420.

FFmpeg Sidecar

Audio/video conversion requires ffmpeg as a Tauri sidecar. During bun install, the postinstall hook automatically downloads the correct binary for your platform.

Download priority:

1. GitHub Release assets — direct binary, no extraction needed
2. Canonical sources (gyan.dev, evermeet.cx, johnvansickle.com) — extracted automatically
3. System ffmpeg in PATH

First-time setup: Create a GitHub Release (v1.0.0) and upload the ffmpeg binaries as release assets. This enables the fastest download path for all users.

Available Scripts

Command	Description
bun run dev	Start Vite dev server only
bun run build	Build the frontend for production
bun run tauri dev	Run the full Tauri desktop app in dev mode
bun run tauri build	Build the desktop app for distribution
bun run check	Run TypeScript type checking
bun run lint	Run ESLint on all source files
bun run sidecar:download	Manually download/re-download the ffmpeg sidecar

Building

To create a distributable package for your platform:

bun run tauri build

The output binaries will be placed in src-tauri/target/release/bundle/.

Build Configuration

• Identifier: com.fazli.vetour
• File Association: .vetour — virtual tour project files
• Supported Targets: Windows (NSIS installer), macOS (.dmg), Linux (.deb, .AppImage)

Tech Stack

Layer	Technology
Desktop Shell	Tauri 2
Frontend	React 19, TypeScript
Styling	Tailwind CSS 4
State Management	Zustand
UI Components	Radix UI, Framer Motion
Panorama Rendering	Photo Sphere Viewer
Image Processing	image crate (Rust)
Packaging	Bun

Project Structure

vetour/
├── src/                      # Frontend source (React + TypeScript)
│   ├── components/           # React components
│   │   ├── Editor/           # Main editor (panorama, hotspots, assets)
│   │   ├── Home/             # Home screen and project list
│   │   ├── Present/          # Presentation mode (separate window)
│   │   ├── Settings/         # Settings modal
│   │   └── ui/               # Shared UI primitives
│   ├── lib/                  # Utilities and helpers
│   ├── store/                # Zustand stores
│   ├── types/                # TypeScript type definitions
│   ├── contexts/             # React contexts (theme)
│   └── constants.ts          # Centralized constants
├── src-tauri/                # Tauri backend (Rust)
│   ├── src/
│   │   ├── lib.rs            # App entry point and command registration
│   │   ├── image_processor.rs # Panorama processing (resize, WebP)
│   │   ├── media_processor.rs # Audio/video conversion (FFmpeg)
│   │   └── file_lock.rs      # File locking for project files
│   ├── Cargo.toml
│   └── tauri.conf.json       # Tauri configuration
├── package.json
├── tsconfig.json
└── vite.config.ts

Contributing

Contributions are welcome! Please see CONTRIBUTING.md for guidelines.

License

This project is licensed under the MIT License — see LICENSE for details.

Acknowledgments

• Photo Sphere Viewer for the excellent panorama rendering library.
• Tauri for the lightweight, secure desktop runtime.
• All contributors and users who support this project.

---

Created by Zulfazli (fazelstudio)