skyglitch-flight-sim

Cyberpunk Flight Simulator - Browser-based game with Three.js

Stars
9
Language
JavaScript
Updated

SkyGlitch: Cyberpunk Flight Simulator

SkyGlitch is a browser-based, cyberpunk-inspired flight simulator built with Three.js and JavaScript. Fly a futuristic fighter through a neon-glitch world, complete missions, and survive the anomalies of a glitched universe.


🚀 Features

  • Flyable Aircraft: Realistic flight dynamics (throttle, pitch, yaw, roll, gravity)
  • Interactive Cockpit HUD: Altimeter, Airspeed, Compass, Artificial Horizon, Fuel, Radar
  • Procedural World: Floating islands, obstacles, turbulence, portals, alien anomalies
  • Mission System: Multiple mission types, objectives, and progression
  • Cyberpunk UI/UX: Neon-glow, glitch effects, custom fonts, animated logs, SVG radar
  • Sound FX: Engine, wind, glitch, and warning sounds
  • Responsive Design: Works on desktop and modern mobile browsers

đŸ•šī¸ Controls

  • Pitch: W/S or Mouse Up/Down
  • Roll: A/D or Mouse Left/Right
  • Yaw: Q/E
  • Throttle: Shift (increase), Ctrl (decrease), or use the slider
  • Engine Toggle: Click ENGINE button
  • Landing Gear: Click GEAR button
  • Glitch Mode: Click GLITCH button
  • Pointer Lock: Click anywhere in the game to enable mouse flight
  • Restart: Click RESTART SIMULATION on Game Over

đŸŽ¯ Gameplay

  • Missions: Complete objectives (reach zones, fly through gates, land, etc.)
  • Obstacles: Avoid asteroids, debris, energy fields, and turbulence
  • Glitch Portals: Activate Glitch Mode for wild effects
  • Alien Anomalies: Investigate and survive mysterious phenomena
  • Mission Log: Watch for updates and encrypted lines in the terminal log
  • Radar: Track islands, obstacles, and portals with glowing SVG blips

đŸ› ī¸ Setup

  1. Clone or Download this repository.
  2. Add Assets:
    • Place your aircraft models/images in assets/models/
    • Place sound effects in assets/sounds/ (see below for required files)
    • Place textures in assets/textures/ (optional)
  3. Required Sound Files (place in assets/sounds/):
    • engine.mp3 (engine hum)
    • wind.mp3 (wind noise)
    • warning.mp3 (warning beep)
    • glitch.mp3 (glitch SFX)
    • You can use your own or find free SFX at freesound.org
  4. Open index.html in your browser. No build step required!

🎨 Customization

  • Fonts: Uses Orbitron and Share Tech Mono from Google Fonts.
  • Colors: Neon blue, glitch red, toxic green, vaporwave purple. Edit style.css for more.
  • Models: Replace the procedural aircraft in js/aircraft.js with your own Three.js model if desired.
  • Textures: Add custom skyboxes or island textures in assets/textures/.

🧩 Project Structure

fly/
  index.html
  style.css
  README.md
  js/
    main.js
    utils.js
    aircraft.js
    world.js
    hud.js
    missions.js
    audio.js
  assets/
    models/
    sounds/
    textures/

📝 Credits & License

  • Code: MIT License
  • Fonts: Google Fonts (Orbitron, Share Tech Mono)
  • SFX: Add your own or use free/CC0 sounds
  • Inspiration: Matrix, F-22 cockpits, cyberpunk terminals, vaporwave art

💡 Tips

  • For best experience, use Chrome or Firefox on desktop.
  • Enable fullscreen for full immersion.
  • Tweak js/aircraft.js and js/world.js for more insane flight dynamics or world effects.

Enjoy flying in the glitch!