azeem/raver-3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

create html file

Browse Source
This commit is contained in:
Azeem Fidahusein
2025-07-26 21:15:36 +01:00
parent 7b44239040
commit c627c1213a
2 changed files with 62 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
README.md
View File

@@ -1,2 +1,55 @@
# raver-3 # Three.js Dark Room Experience
A Three.js experience featuring two point lights in a dark room with mouse-controlled camera direction.
## Features
- **Dark Room Environment**: A fully enclosed room with walls, floor, and ceiling
- **Two Point Lights**:
- Warm orange/red light positioned at (-6, 3, -6)
- Cool blue/cyan light positioned at (6, 3, 6)
- **Fixed Camera Position**: Camera stays at (0, 2, 0) but direction follows mouse movement
- **Interactive Objects**: Floating cubes, central pedestal, and corner pillars
- **Atmospheric Lighting**: Subtle animations and shadows for immersive experience
## How to Run
### Option 1: Using Node.js Server (Recommended)
```bash
node server.js
```
Then open your browser to `http://localhost:3000`
### Option 2: Using Python HTTP Server
```bash
python3 -m http.server 8000
```
Then open your browser to `http://localhost:8000`
### Option 3: Using any other local server
Simply serve the files from this directory using any local HTTP server.
## Controls
- **Mouse Movement**: Look around the room (camera direction follows mouse)
- **Camera Position**: Fixed at the center of the room, slightly elevated
## Technical Details
- Built with Three.js (loaded via CDN)
- Uses WebGL renderer with shadow mapping
- Point lights with dynamic intensity animation
- Responsive design that adapts to window size
- Smooth camera rotation interpolation for fluid mouse control
## Files
- `index.html` - Main HTML file with the Three.js setup
- `app.js` - JavaScript code for the 3D scene
- `server.js` - Simple Node.js HTTP server for local development
- `README.md` - This file
## Browser Requirements
- Modern browser with WebGL support
- Works best in Chrome, Firefox, Safari, or Edge

8
index.html Normal file
View File

@@ -0,0 +1,8 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Three.js Dark Room Experience</title>
</body>
</html>