diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 00000000..997504b4 --- /dev/null +++ b/.gitattributes @@ -0,0 +1,2 @@ +# SCM syntax highlighting & preventing 3-way merges +pixi.lock merge=binary linguist-language=YAML linguist-generated=true -diff diff --git a/.gitignore b/.gitignore index 6c525168..068c3c9b 100644 --- a/.gitignore +++ b/.gitignore @@ -1,11 +1,19 @@ +# pixi environments +.pixi/* +!.pixi/config.toml + +# Python *.pyc __pycache__/ *.$py.class +# System .DS_Store +# Game Assets vcbr/ vcsky/ -saves/ -unpacked/ -*.bin \ No newline at end of file +vcsky.bak/ +vcsky_new/ +vcsky_old/ +vcsky_oldnew/ \ No newline at end of file diff --git a/.htaccess b/.htaccess index 4f93bf3b..5c2e5918 100644 --- a/.htaccess +++ b/.htaccess @@ -1,47 +1,52 @@ -# JS files -AddType application/javascript .js - -# WebAssembly files -AddType application/wasm .wasm - -# CSS files -AddType text/css .css - -# Brotli-compressed files -AddEncoding br .br - - - -# Enable rewrite engine RewriteEngine On +RewriteBase /reVCDOS/ + +# 1. Security Headers (Required) + + Header set Cross-Origin-Opener-Policy "same-origin" + Header set Cross-Origin-Embedder-Policy "require-corp" + + +# 2. DISABLE Apache Compression for .br files (The Fix) + + # Tell Apache NOT to gzip these files + SetEnvIfNoCase Request_URI "\.br$" no-gzip dont-vary + + +# 3. Explicitly Handle .br Files + + # Disable any default filters that might mess with the binary stream + RemoveOutputFilter .br + RemoveType .br + + # Tell the browser: "This file is encoded with Brotli" + + Header set Content-Encoding "br" + # Prevent caching issues during testing + Header set Cache-Control "no-cache, no-store, must-revalidate" + + -# Set base path if PHP file is not in root -RewriteBase / - -# If the request is for an existing file or directory, serve it directly -RewriteCond %{REQUEST_FILENAME} -f [OR] -RewriteCond %{REQUEST_FILENAME} -d -RewriteRule ^ - [L] - -# Otherwise, route everything to index.php -RewriteRule ^.*$ index.php [L,QSA] - - -# Correct MIME types +# 4. Correct MIME Types AddType application/javascript .js AddType application/wasm .wasm AddType text/css .css -# Brotli compressed files -AddEncoding br .br +# Force MIME types for the specific compressed files + + ForceType application/octet-stream + + + + ForceType application/wasm + -# Optional: force correct MIME for .js.br or .wasm.br ForceType application/javascript - AddEncoding br - - ForceType application/wasm - AddEncoding br - \ No newline at end of file +# 5. Routing +RewriteCond %{REQUEST_FILENAME} -f [OR] +RewriteCond %{REQUEST_FILENAME} -d +RewriteRule ^ - [L] +RewriteRule ^.*$ index.php [L,QSA] \ No newline at end of file diff --git a/README.md b/README.md index 2fdec407..0c13d5f2 100644 --- a/README.md +++ b/README.md @@ -1,40 +1,149 @@ -# GTA Vice City — HTML5 Port (DOS Zone) +reVCDOS - HTML5 Port [![Open In Colab](https://colab.research.google.com/assets/colab-badge.svg)](https://colab.research.google.com/drive/13GFRIxTwVbixv0Vup9MSVXnB4SLmA3G7?usp=sharing) > **Fast Start:** Run the server in one click using Google Colab. Click the badge above, run the cell, and use the **"Launch Game"** button. The tunnel password will be copied automatically — just paste it on the page that opens. -Web-based port of GTA: Vice City running in browser via WebAssembly. +Web-based port running in browser via WebAssembly. -## Requirements +You can check which files I made changes in commit section. Only for *educational* purpose only -- Colab or Docker or Python 3.8+ or PHP 8.0+ -- Dependencies from `requirements.txt` +## History & Restoration + +This project is a community effort to preserve the incredible HTML5 port. + +* **The Ban**: Takedown for the original web port, shutting down the official servers and CDNs. +* **Deobfuscation**: The source code was deobfuscated to allow for self-hosting and study. +* **WebAssembly Magic**: Unlike standard PC mods, this port runs entirely in the browser using WebAssembly. It streams assets on-the-fly, making it playable on almost any device with a browser and keyboard, without installation. +* **Restoring Functionality**: After the shutdown, the game would hang on a black screen because it couldn't fetch core data files (`.wasm`, `.data`) or assets from the dead CDNs. This repository solves that by: + 1. Providing a server that serves these critical files locally. + 2. Implementing a caching system to download and save surviving assets. + 3. Removing dependencies on the defunct infrastructure. + +> [!NOTE] +> We still do not have the source code for the files in `vcbr` (the compiled WebAssembly modules), which contain the core logic of the game. This project wraps and serves those existing binaries. + +**Stability Test**: Watch the server in action here: [reVCDOS Server Stability Test](https://www.youtube.com/watch?v=C8nK81N4iBs) ## Quick Start +**Installation Tutorial**: + +1. Windows 11 + Python/FastAPI: [Youtube](https://youtu.be/AEvh2ok-nvs?si=ibyGHrfqiBgYT39c) +2. Windows 11 + Apache Server/XAMPP: [Youtube](https://youtu.be/tgctRLYOxSg?si=wo8DgCqUSYDfLPhN) + +--- + 1. **Clone the repository**: ```bash - git clone https://github.com/Lolendor/reVCDOS.git + git clone --depth 1 https://github.com/Th3w33knd/reVCDOS cd reVCDOS ``` -2. **Configure Assets** (Optional): +2. **Download Assets**: + > [!WARNING] + > These files contain copyrighted materials. You must own the original game to use them legally. + + * **vcbr** (Core Data): [Download](https://gofile.io/d/ceuXTa) (or [Older Version](https://gofile.io/d/U63PZO)) + * **vcsky** (Assets): [Download](https://gofile.io/d/9QsvMn) + + **Important**: Extract them so your folder structure looks exactly like this: + ```text + reVCDOS/ + ├── vcbr/ + │ ├── vc-sky-en-v6.data + │ ├── vc-sky-en-v6.wasm + │ ├── vc-sky-ru-v6.data + │ └── vc-sky-ru-v6.wasm + ├── vcsky/ + │ ├── sha256sums.txt + │ ├── fetched/ + │ │ ├── audio/ <-- From download + │ │ ├── data/ <-- From download + │ │ └── ... + │ └── ... + ├── server.py + └── ... + ``` + +3. **Install Pixi** (if not already installed): + * **Windows (PowerShell)**: + ```powershell + powershell -ExecutionPolicy Bypass -c "irm -useb https://pixi.sh/install.ps1 | iex" + ``` + * **Linux & macOS**: + ```bash + curl -fsSL https://pixi.sh/install.sh | bash + ``` + +4. **Start the game**: + * **Online Mode** (Recommended): + ```bash + pixi run online + ``` + *Checks local files first. If missing, downloads from CDN and caches them.* + + * **Offline Mode** (Strict): + ```bash + pixi run offline + ``` + *Uses ONLY local files. No network connection. Useful if you have all assets downloaded.* + + * **Cheat Mode**: + ```bash + pixi run cheat + ``` + +5. **Play**: Open the link shown in the terminal (usually `http://localhost:8000`). If you used `pixi run cheat`, the browser should open automatically. + +## Requirements + +- Docker or Python 3.8+ or PHP 8.0+ +- Dependencies from `requirements.txt` +- **Pixi** (Recommended for package management) + +## Game Modes + +The server supports different modes to suit your setup: + +### 1. Online Mode (Recommended) +**Command:** `pixi run online` + +* **Behavior**: "Smart Caching". The server checks your local `vcsky/` folder first. + * **If file exists**: Serves it locally (Fast, Offline-capable). + * **If file missing**: Downloads it from the CDN and saves it to `vcsky/` for future use. +* **Best for**: Most users. It ensures you can play immediately even if you haven't manually downloaded every single asset. + +### 2. Offline Mode (Strict) +**Command:** `pixi run offline` + +* **Behavior**: "Strict Local". The server serves **ONLY** files present in your `vcsky/` and `vcbr/` folders. + * **If file missing**: Returns a 404 Error. No network requests are made. +* **Best for**: Users who have manually downloaded the full asset packs and want to ensure no background network activity. Ideal for air-gapped or fully offline setups. - By default, the project uses **DOS Zone CDN** — no local assets needed. For offline hosting you can use: - * **Packed archive** (`--packed` or `--unpacked`) — single `.bin` file with all assets - * **Local folders** (`--vcsky_local`, `--vcbr_local`) — unpacked asset directories - * **Cache mode** (`--vcsky_cache`, `--vcbr_cache`) — download from CDN once, serve locally after +### 3. Cheat Mode +**Command:** `pixi run cheat` -3. **Launch the Application**: - Choose one of the setup methods below: - * **Docker** (Recommended for most users) — fast and isolated. - * **PHP** — Simply upload the folder to your web server (FTP/Hosting). - * **Manual Installation** — for development and customization. +* **Behavior**: **Online Mode + Cheats + Auto-open**. + * Starts the server in Online Mode (Smart Caching). + * Automatically opens your default web browser. + * Enables the built-in cheat engine. +* **How to use**: Once the game loads, press **F3** to open the cheat menu (Memory Scanner, Noclip, etc.). +* **Best for**: Jumping straight into the action with cheats enabled. ## Setup & Running -### Option 1: Using Docker (Recommended) +### Option 1: Using Pixi (Recommended) + +This project uses [Pixi](https://pixi.sh/) for dependency management and task running. + +1. **Install Pixi**: Follow the instructions at [pixi.sh](https://pixi.sh/). +2. **Run a task**: + * `pixi run online` - Smart caching (download if missing). + * `pixi run offline` - Strict local files only. + * `pixi run cheat` - Online mode + cheats enabled + auto-open browser. + +### Option 2: Using Docker The easiest way to get started is using Docker Compose: ```bash @@ -66,7 +175,7 @@ IN_PORT=3000 AUTH_LOGIN=admin AUTH_PASSWORD=secret CUSTOM_SAVES=1 docker compose | `UNPACKED` | Unpack archive to local folders (filename or URL, auto-sets vcsky/vcbr paths) | | `PACK` | Pack a folder and serve from resulting archive (folder path or MD5 hash) | -### Option 2: Local Installation +### Option 3: Local Installation (Manual) 1. Install Python dependencies: ```bash @@ -75,15 +184,16 @@ pip install -r requirements.txt 2. Start the server: ```bash -python server.py --packed https://folder.morgen.monster/revcdos.bin +python server.py --vcsky_local --vcbr_local --custom_saves ``` Server starts at `http://localhost:8000` -### Option 3: Shared Hosting on PHP (No installation) +### Option 4: Shared Hosting on PHP (No installation) + +If you want to run the game from a hosted environment with `PHP 8.0` or above, just copy the contents of this repo to your desired hosting. +By default the `index.php` and `.htaccess` will get the job done. -If you want to run the game from a hosted environment with `PHP 8.0` or above, just copy the contents of this repo to your desired hosting -By default the `index.php` and `.htaccess` will get the job done. ## Server Options | Option | Type | Default | Description | @@ -92,22 +202,21 @@ By default the `index.php` and `.htaccess` will get the job done. | `--custom_saves` | flag | disabled | Enable local save files (saves router) | | `--login` | string | none | HTTP Basic Auth username | | `--password` | string | none | HTTP Basic Auth password | -| `--vcsky_local` | string/flag | disabled | Serve vcsky from local directory. Use flag for `vcsky/` or specify path | -| `--vcbr_local` | string/flag | disabled | Serve vcbr from local directory. Use flag for `vcbr/` or specify path | +| `--vcsky_local` | flag | disabled | Serve vcsky from local `vcsky/` directory (Strict Local) | +| `--vcbr_local` | flag | disabled | Serve vcbr from local `vcbr/` directory (Strict Local) | | `--vcsky_url` | string | `https://cdn.dos.zone/vcsky/` | Custom vcsky proxy URL | | `--vcbr_url` | string | `https://br.cdn.dos.zone/vcsky/` | Custom vcbr proxy URL | -| `--vcsky_cache` | flag | disabled | Cache vcsky files locally while proxying | -| `--vcbr_cache` | flag | disabled | Cache vcbr files locally while proxying | -| `--packed` | string | disabled | Serve from packed archive file. Accepts file path or URL | -| `--unpacked` | string | disabled | Unpack archive to `unpacked/{hash}/` and serve from there. Accepts file path or URL | -| `--pack` | string | disabled | Pack a folder and serve from resulting `{hash}.bin` archive. Accepts folder path or MD5 hash | +| `--vcsky_cache` | flag | enabled | Cache vcsky files locally while proxying (Smart Cache) | +| `--vcbr_cache` | flag | enabled | Cache vcbr files locally while proxying (Smart Cache) | +| `--cheats` | flag | disabled | Enable cheats in URL | +| `--open` | flag | disabled | Open browser on start | **Examples:** ```bash # Start on custom port python server.py --port 3000 -# Enable local saves +# Enable local saves (Recommended) python server.py --custom_saves # Enable HTTP Basic Authentication @@ -116,42 +225,10 @@ python server.py --login admin --password secret123 # Use local vcsky and vcbr files python server.py --vcsky_local --vcbr_local -# Cache files locally while proxying (hybrid mode) (recommended) +# Cache files locally while proxying (hybrid mode) python server.py --vcsky_cache --vcbr_cache - -# Serve from packed archive (local file) -python server.py --packed revcdos.bin - -# Serve from packed archive (download from URL if not present) -python server.py --packed https://example.com/revcdos.bin - -# Unpack archive and serve from unpacked files -python server.py --unpacked revcdos.bin - -# Stream-unpack from URL (downloads and unpacks simultaneously) -python server.py --unpacked https://example.com/revcdos.bin - -# Pack a folder and serve from the resulting archive -python server.py --pack /path/to/assets # Creates {folder_hash}.bin - -# Pack from existing unpacked folder by MD5 hash -python server.py --pack a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5d6 # Uses unpacked/{hash}/ ``` -> **Note:** HTTP Basic Auth is only enabled when both `--login` and `--password` are provided. - -> **Note:** By default, vcsky and vcbr are proxied from DOS Zone CDN. Use `--vcsky_local` and `--vcbr_local` flags to serve files from local directories instead. You can optionally specify a custom path. - -> **Note:** Use `--vcsky_cache` and `--vcbr_cache` to cache proxied files locally. Files are downloaded once and served from local storage on subsequent requests. - -> **Note:** `--packed` serves files directly from a compressed archive without unpacking (faster and more compressed). `--unpacked` extracts the archive once and serves from local files (if you want edit assets). - -> **Note:** When using URL with `--unpacked`, the archive is streamed and unpacked simultaneously during download using `downloader_brotli.py`. - -> **Note:** You can pass a raw MD5 hash (32 hex characters) to `--unpacked` to use an existing unpacked folder without needing the original archive. Example: if you have `unpacked/a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5d6/`, you can start the server with `--unpacked a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5d6`. - -> **Note:** `--pack` creates a packed archive from a folder containing subfolders (like `vcsky/` and `vcbr/`). Each subfolder is packed sequentially: the first creates the archive, subsequent ones are appended. After packing, the server automatically uses the created archive via `--packed` mode. - ## URL Parameters | Parameter | Values | Description | @@ -163,18 +240,15 @@ python server.py --pack a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5d6 # Uses unpacked/{hash} | `max_fps` | `1-240` | Limit frame rate (e.g., `60` for 60 FPS) | | `configurable` | `1` | Show configuration UI before play button | - **Examples:** -- `http://localhost:8000/?lang=ru` — Russian version -- `http://localhost:8000/?lang=en&cheats=1` — English + cheats -- `http://localhost:8000/?configurable=1` — Show settings UI before play +- `http://localhost:8000/?lang=ru` - Russian version +- `http://localhost:8000/?lang=en&cheats=1` - English + cheats ## Project Structure ``` -├── server.py # FastAPI proxy server -├── index.php # PHP proxy server -├── .htaccess # Apache config for PHP +├── server.py # FastAPI proxy/caching server +├── pixi.toml # Pixi project configuration ├── requirements.txt # Python dependencies ├── revcdos.bin # Packed archive (optional) ├── additions/ # Server extensions @@ -191,44 +265,25 @@ python server.py --pack a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5d6 # Uses unpacked/{hash} │ └── vcbr/ # Brotli-compressed binaries ├── dist/ # Game client files │ ├── index.html # Main page -│ ├── game.js # Game loader +│ ├── game.js # Game loader (updated with ownership check) │ ├── index.js # Module loader │ ├── GamepadEmulator.js # Touch controls │ ├── idbfs.js # IndexedDB filesystem │ ├── jsdos-cloud-sdk.js # Cloud saves (DOS Zone) │ ├── jsdos-cloud-sdk-local.js # Local saves (--custom_saves) │ └── modules/ # WASM modules -│ ├── runtime.js # WASM runtime initialization -│ ├── loader.js # Asset/package loading -│ ├── fs.js # Virtual filesystem -│ ├── audio.js # Audio system -│ ├── graphics.js # Rendering pipeline -│ ├── events.js # Input events handling -│ ├── fetch.js # Network requests (Real-time asset streaming) -│ ├── syscalls.js # System calls -│ ├── main.js # Main entry point -│ ├── cheats.js # Cheat engine (F3) -│ ├── asm_consts/ # Language-specific ASM constants -│ │ ├── en.js -│ │ └── ru.js -│ └── packages/ # Language-specific data packages -│ ├── en.js -│ └── ru.js -├── vcbr/ # Brotli-compressed game data (optional) -│ ├── vc-sky-en-v6.data.br -│ ├── vc-sky-en-v6.wasm.br -│ ├── vc-sky-ru-v6.data.br -│ └── vc-sky-ru-v6.wasm.br -└── vcsky/ # Decompressed assets (optional) - ├── fetched/ # English version files - │ ├── data/ - │ ├── audio/ - │ ├── models/ - │ └── anim/ - └── fetched-ru/ # Russian version files +├── vcbr/ # Core game data (REQUIRED LOCALLY) +│ ├── vc-sky-en-v6.data +│ ├── vc-sky-en-v6.wasm +│ ├── vc-sky-ru-v6.data +│ └── vc-sky-ru-v6.wasm +└── vcsky/ # Additional assets (Cached locally on demand) + ├── sha256sums.txt + └── fetched/ # Downloaded assets ├── data/ ├── audio/ - └── ... + ├── models/ + └── anim/ ``` ## Features @@ -239,12 +294,13 @@ python server.py --pack a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5d6 # Uses unpacked/{hash} - 🌍 English/Russian language support - 🔧 Built-in cheat engine (memory scanner, cheats) - 📱 Mobile touch controls +- 🔒 **Original Game Verification**: You must provide an original game file to verify ownership and play the full version. ## Local Saves When local saves are enabled (`--custom_saves` flag), enter any 5-character identifier in the "js-dos key" input field on the start page. This identifier will be used to store your saves in the `saves/` directory on the server. -Example: Enter `mykey` or `12345` — saves will be stored as `mykey_vcsky.saves` or `12345_vcsky.saves`. +Example: Enter `mykey` or `12345` - saves will be stored as `mykey_vcsky.saves` or `12345_vcsky.saves`. ## Controls (Touch) @@ -254,9 +310,128 @@ Touch controls appear automatically on mobile devices. Virtual joysticks for mov Enable with `?cheats=1`, press **F3** to open menu: - Memory scanner (find/edit values) -- All classic GTA VC cheats +- All classic cheats - AirBreak (noclip mode) +## Remote Access (Tailscale / LAN) + +The server is configured to listen on `0.0.0.0`, meaning it accepts connections from other devices on your network (LAN or VPN like Tailscale). + +### 1. Connecting +Simply use your host computer's IP address and the port (default 8000). +* **LAN**: `http://192.168.1.x:8000` +* **Tailscale**: `http://100.x.y.z:8000` + +### 2. "Secure Context" Issues (Browser Blocking) +Modern browsers restrict high-performance features (like `SharedArrayBuffer`, required by this game) to **Secure Contexts** (HTTPS or localhost). Connecting via a plain HTTP IP address (like `http://100.x.y.z:8000`) may cause the game to hang or crash. + +#### Solution A: Tailscale Serve (Recommended) +Use Tailscale's built-in HTTPS feature to create a secure tunnel. +1. Run the game server: `pixi run online` +2. In a separate terminal, run: + ```bash + tailscale serve https:443 / http://127.0.0.1:8000 + ``` +3. Open the provided HTTPS URL (e.g., `https://your-pc.tailnet.ts.net`) on your remote device. + +#### Solution B: Browser Flag (Workaround) +Force your browser to treat the insecure IP as secure. +1. On the **client device** (e.g., your phone or laptop), open Chrome/Edge. +2. Go to `chrome://flags/#unsafely-treat-insecure-origin-as-secure`. +3. Enable the flag and enter your server's full URL (e.g., `http://100.100.10.10:8000`). +4. Relaunch the browser. + +## Deploying reVCDOS on Android (Termux) via TUR Wheels + +### 1. Summary & Problem History +We are deploying the `reVCDOS` (WebAssembly) server on Android. +* **The Issue:** The dependency `pydantic-core` requires Rust compilation. Compiling natively on Android fails due to memory limits (`LLVM ERROR: out of memory`) and toolchain incompatibilities (`cargo-xwin` errors). +* **The Fix:** We bypass compilation entirely by forcing `pip` to download **pre-compiled binaries (wheels)** from the Termux User Repository (TUR). +* **Network Requirement:** A **VPN** is required because some ISPs block the TUR repository, causing `SSL connect errors`. + +--- + +### 2. Prerequisites +1. **Android Device** with Termux (F-Droid version). +2. **VPN Active:** Essential to prevent connection errors to the custom repository. +3. **Game Files:** `vcbr` and `vcsky` folders extracted in `/sdcard/Download`. + +--- + +### 3. Deployment Protocol + +#### Phase 1: Environment Initialization +Update the system and install base tools. +```bash +# Update system +pkg update && pkg upgrade -y + +# Install Python, Git, and SSL tools +pkg install python git openssl-tool -y + +# Grant storage access (Tap 'Allow' on screen) +termux-setup-storage +``` + +### Phase 2: The "Binary-Only" Injection (VPN Required) +*Objective: Force pip to find a pre-compiled version of Pydantic that matches the available Pydantic-Core in the Termux repository, bypassing all compilation.* + +**⚠️ CRITICAL:** Ensure your **VPN is ON** for this step to avoid connection errors with the custom repository. + +```bash +# 1. Install Pydantic (and automatically resolve Pydantic-Core binary) +# We use --only-binary=:all: to prevent pip from trying to compile newer, unsupported versions. +pip install --extra-index-url https://termux-user-repository.github.io/pypi/ --only-binary=:all: pydantic + +# 2. Install the remaining web server dependencies +# (Standard pip install is fine here as these are pure Python or standard packages) +pip install fastapi uvicorn httpx python-multipart brotli +``` + +#### Phase 3: Project Setup +Clone the game server code. +```bash +cd $HOME +rm -rf reVCDOS # Clear previous attempts +git clone --depth 1 https://github.com/Th3w33knd/reVCDOS +cd reVCDOS +pip install -r requirements.txt +``` + +#### Phase 4: Asset Injection (Manual) +Import the game assets from internal storage. +```bash +# Copy Core Data (vcbr) - The game logic +cp -r /sdcard/Download/vcbr ./ + +# Copy Assets (vcsky) - Audio and textures (Optional) +cp -r /sdcard/Download/vcsky ./ +``` + +#### Phase 5: Server Execution +Run the server in offline/local mode to ensure it uses the files we just copied. +```bash +python server.py --vcsky_local --vcbr_local --custom_saves +``` + +--- + +### 4. Known Error States & Fixes + +| Symptom | Cause | Fix | +| :--- | :--- | :--- | +| `SSL connect error` / `No matching distribution` | ISP blocking TUR Repo | **Turn on VPN** and retry Phase 2. | +| `Linker command failed` / `Aborted` | Pip tried to compile source | Ensure you used `--only-binary=:all:` in Phase 2. | +| `Could not find version for maturin` | Maturin isn't in TUR | **Ignore it.** We don't need `maturin` when using binaries. Remove it from the install command. | +| Black Screen in Browser | Missing Game Files | Re-run Phase 4. Ensure `vcbr` folder contains `.wasm` files. | + +--- + +### 5. Final Success State +* Server is running in Termux. +* User opens Chrome to `http://localhost:8000`. +* Game loads without compilation errors. + ## License MIT. Do what you want (but credit the port authors and me). Not affiliated with Rockstar Games. @@ -269,13 +444,38 @@ MIT. Do what you want (but credit the port authors and me). Not affiliated with **Russian translation:** [GamesVoice](https://www.gamesvoice.ru/) -**Added by the community:** -* PHP Support by [Rohamgames](https://github.com/Rohamgames) +**Some more files were required for being Fully Local:** [Th3w33knd](https://github.com/Th3w33knd) -## Support [me](https://github.com/Lolendor) +## Support me If you find this project useful: - **TON / USDT (TON)** `UQAyBchGEKi9NnNQ3AKMQMuO-SGEhMIAKFAbkwwrsiOPj9Gy` -- **ETH / USDT (ERC-20)** `0x69Ec02715cF65538Bb03725F03Bd4c85D33F8AC0` -- **TRX / USDT (TRC-20)** `THgNWT9MGW52tF8qFHbAWN25UR6WTeLDMY` + +## Changelog + +### v1.2.2 - Documentation Updates +* **Guide**: Added detailed guide for deploying on Android via Termux. +* **Docs**: Updated project description to be more generic. + +### v1.2.1 - Post-Merge Fixes +* **Fix**: Resolved `SyntaxError` in `game.js` by restoring missing IIFE wrapper. +* **Fix**: Resolved `ReferenceError` in `index.js` by exposing `currentLanguage` to global scope. +* **Fix**: Resolved `server.py` 500 Error by defining missing arguments and global variables. +* **Dependency**: Added `aiofiles` to `pixi.toml` and `requirements.txt`. + +### v1.2.0 - Upstream Sync & Fixes +* **Upstream Merge**: Merged latest changes from `Lolendor/reVCDOS` (Google Colab support, license, graphics updates). +* **Bug Fix**: Fixed `server.py` startup issue preventing the server from running. +* **Conflict Resolution**: Preserved local preferences (Offline Mode, Cheats) during merge. + +### v1.1.0 - Tailscale & Localization Update +* **Remote Access**: Server now binds to 0.0.0.0 to allow connections from LAN and Tailscale. +* **Documentation**: Added guide for connecting via Tailscale/LAN and handling Secure Contexts. +* **Localization**: Fixed Russian text in the main menu (Subscribe for news and releases). +* **Credits**: Added comprehensive credits for Deobfuscation, Translation, and Offline Support. + +### v1.0.0 - Initial Enhancements +* **Offline Mode**: Game assets are cached locally for offline play. +* **Cheats**: Added cheat menu (F3) and support for classic cheats. +* **Smart Caching**: Optimized asset loading strategy. diff --git a/dist/game.js b/dist/game.js index 537e92b8..dda53b7d 100644 --- a/dist/game.js +++ b/dist/game.js @@ -8,8 +8,8 @@ var wasm_content; const params = new URLSearchParams(window.location.search); // Base URLs -const replaceFetch = (str) => str.replace("https://cdn.dos.zone/vcsky/", "/vcsky/") -const replaceBR = "/vcbr/" +const replaceFetch = (str) => str.replace("https://cdn.dos.zone/vcsky/", "vcsky/") +const replaceBR = "vcbr/" // Configurable mode - show settings UI before play const configurableMode = params.get('configurable') === "1"; @@ -31,155 +31,98 @@ document.body.dataset.isTouch = isTouch ? 1 : 0; const dataSize = 130 * 1024 * 1024; const textDecoder = new TextDecoder(); let haveOriginalGame = false; -const translations = { - en: { - clickToPlayDemo: "Click to play demo", - clickToPlayFull: "Click to play", - invalidKey: "invalid key", - checking: "checking...", - cloudSaves: "Cloud saves:", - enabled: "enabled", - disabled: "disabled", - playDemoText: "You can play the DEMO version, or provide the original game files to play the full version.", - disclaimer: "DISCLAIMER:", - disclaimerSources: "This game is based on an open source version of GTA: Vice City. It is not a commercial release and is not affiliated with Rockstar Games.", - disclaimerCheckbox: "I own the original game", - disclaimerPrompt: "You need to provide a file from the original game to confirm ownership of the original game.", - cantContinuePlaying: "You can't continue playing in DEMO version. Please provide the original game files to continue playing.", - demoAlert: "The demo version is intended only for familiarizing yourself with the game technology. All features are available, but you won't be able to progress through the game's storyline. Please provide the original game files to launch the full version.", - downloading: "Downloading", - enterKey: "enter your key", - clickToContinue: "Click to continue...", - enterJsDosKey: "Enter js-dos key (5 len)", - portBy: "HTML5 port by:", - ruTranslate: "", - demoOffDisclaimer: "Due to the unexpectedly high popularity of the project, resulting in significant traffic costs, and in order to avoid any risk of the project being shut down due to rights holder claims, we have disabled the demo version. You can still run the full version by providing the original game resources.", - configLanguage: "Language:", - configCheats: "Cheats (F3)", - configFullscreen: "Fullscreen", - configMaxFps: "Max FPS:", - configUnlimited: "(0 = unlimited)", - }, - ru: { - clickToPlayDemo: "Играть в демо версию", - clickToPlayFull: "Играть", - invalidKey: "неверный ключ", - checking: "проверка...", - cloudSaves: "Облачные сохранения:", - enabled: "включены", - disabled: "выключены", - playDemoText: "Вы можете играть в демо версию, или предоставить оригинальные файлы игры для полной версии.", - disclaimer: "ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ:", - disclaimerSources: "Эта игра основана на открытой версии GTA: Vice City. Она не является коммерческим изданием и не связана с Rockstar Games.", - disclaimerCheckbox: "Я владею оригинальной игрой", - disclaimerPrompt: "Вам потребуется приложить какой-либо файл из оригинальной игры для подтверждения владения оригинальной игрой.", - cantContinuePlaying: "Вы не можете продолжить игру в демо версии. Пожалуйста, предоставьте оригинальные файлы игры для продолжения игры.", - demoAlert: "Демо версия предназначена только для ознакомления с технологией игры. Все функции доступны, но вы не сможете продолжить игру по сюжету. Пожалуйста, предоставьте оригинальные файлы игры для запуска полной версии.", - downloading: "Загрузка", - enterKey: "введите ваш ключ", - clickToContinue: "Нажмите для продолжения...", - enterJsDosKey: "Введите ключ js-dos (5 букв)", - portBy: "Авторы HTML5 порта:", - ruTranslate: ` +(function () { + const translations = { + en: { + clickToPlayDemo: "Click to play demo", + clickToPlayFull: "Click to play", + invalidKey: "invalid key", + checking: "checking...", + cloudSaves: "Cloud saves:", + enabled: "enabled", + disabled: "disabled", + playDemoText: "You can play the DEMO version, or provide the original game files to play the full version.", + disclaimer: "DISCLAIMER:", + disclaimerSources: "This game is based on an open source version of GTA: Vice City. It is not a commercial release and is not affiliated with Rockstar Games.", + disclaimerCheckbox: "I own the original game", + disclaimerPrompt: "You need to provide a file from the original game to confirm ownership of the original game.", + cantContinuePlaying: "You can't continue playing in DEMO version. Please provide the original game files to continue playing.", + demoAlert: "The demo version is intended only for familiarizing yourself with the game technology. All features are available, but you won't be able to progress through the game's storyline. Please provide the original game files to launch the full version.", + downloading: "Downloading", + enterKey: "enter your key", + clickToContinue: "Click to continue...", + enterJsDosKey: "Enter js-dos key (5 len)", + portBy: "HTML5 port by:", + ruTranslate: "", + demoOffDisclaimer: "Due to the unexpectedly high popularity of the project, resulting in significant traffic costs, and in order to avoid any risk of the project being shut down due to rights holder claims, we have disabled the demo version. You can still run the full version by providing the original game resources.", + configLanguage: "Language:", + configCheats: "Cheats (F3)", + configFullscreen: "Fullscreen", + configMaxFps: "Max FPS:", + configUnlimited: "(0 = unlimited)", + }, + ru: { + clickToPlayDemo: "Играть в демо версию", + clickToPlayFull: "Играть", + invalidKey: "неверный ключ", + checking: "проверка...", + cloudSaves: "Облачные сохранения:", + enabled: "включены", + disabled: "выключены", + playDemoText: "Вы можете играть в демо версию, или предоставить оригинальные файлы игры для полной версии.", + disclaimer: "ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ:", + disclaimerSources: "Эта игра основана на открытой версии GTA: Vice City. Она не является коммерческим изданием и не связана с Rockstar Games.", + disclaimerCheckbox: "Я владею оригинальной игрой", + disclaimerPrompt: "Вам потребуется приложить какой-либо файл из оригинальной игры для подтверждения владения оригинальной игрой.", + cantContinuePlaying: "Вы не можете продолжить игру в демо версии. Пожалуйста, предоставьте оригинальные файлы игры для продолжения игры.", + demoAlert: "Демо версия предназначена только для ознакомления с технологией игры. Все функции доступны, но вы не сможете продолжить игру по сюжету. Пожалуйста, предоставьте оригинальные файлы игры для запуска полной версии.", + downloading: "Загрузка", + enterKey: "введите ваш ключ", + clickToContinue: "Нажмите для продолжения...", + enterJsDosKey: "Введите ключ js-dos (5 букв)", + portBy: "Авторы HTML5 порта:", + ruTranslate: `
Переведено на русский студией GamesVoice
`, - demoOffDisclaimer: "В связи с неожиданно высокой популярностью проекта, как следствие — значительными расходами на трафик, а также во избежание рисков закрытия проекта из-за претензий правообладателей, мы отключили возможность запуска демо-версии. При этом вы по-прежнему можете запустить полную версию, предоставив оригинальные ресурсы.", - configLanguage: "Язык:", - configCheats: "Читы (F3)", - configFullscreen: "Полный экран", - configMaxFps: "Макс. FPS:", - configUnlimited: "(0 = без ограничений)", - }, -}; - -var currentLanguage = navigator.language.split("-")[0] === "ru" ? "ru" : "en"; -if (params.get("lang") === "ru") { - currentLanguage = "ru"; -} else if (params.get("lang") === "en") { - currentLanguage = "en"; -} - -window.t = function (key) { - return translations[currentLanguage][key]; -} + demoOffDisclaimer: "В связи с неожиданно высокой популярностью проекта, как следствие — значительными расходами на трафик, а также во избежание рисков закрытия проекта из-за претензий правообладателей, мы отключили возможность запуска демо-версии. При этом вы по-прежнему можете запустить полную версию, предоставив оригинальные ресурсы.", + configLanguage: "Язык:", + configCheats: "Читы (F3)", + configFullscreen: "Полный экран", + configMaxFps: "Макс. FPS:", + configUnlimited: "(0 = без ограничений)", + }, + }; -// Function to update all translated texts on the page -function updateAllTranslations() { - const keyInput = document.querySelector('.jsdos-key-input'); - if (keyInput) keyInput.setAttribute('placeholder', t("enterJsDosKey")); - - const clickToPlayButton = document.getElementById('click-to-play-button'); - if (clickToPlayButton) { - clickToPlayButton.textContent = haveOriginalGame ? t('clickToPlayFull') : t('clickToPlayDemo'); - } - - const demoOffDisclaimer = document.getElementById('demo-off-disclaimer'); - if (demoOffDisclaimer) { - demoOffDisclaimer.textContent = haveOriginalGame ? "" : "* " + t('demoOffDisclaimer'); - } - - const cloudSavesLink = document.getElementById('cloud-saves-link'); - if (cloudSavesLink) cloudSavesLink.textContent = t('cloudSaves'); - - const cloudSavesStatus = document.getElementById('cloud-saves-status'); - if (cloudSavesStatus) cloudSavesStatus.textContent = t('enterKey'); - - const playDemoText = document.getElementById('play-demo-text'); - if (playDemoText) playDemoText.textContent = t('playDemoText'); - - const disclaimerText = document.getElementById('disclaimer-text'); - if (disclaimerText) disclaimerText.textContent = t('disclaimer'); - - const disclaimerSources = document.getElementById('disclaimer-sources'); - if (disclaimerSources) disclaimerSources.textContent = t('disclaimerSources'); - - const disclaimerCheckboxLabel = document.getElementById('disclaimer-checkbox-label'); - if (disclaimerCheckboxLabel) disclaimerCheckboxLabel.textContent = t('disclaimerCheckbox'); - - const portBy = document.getElementById('port-by'); - if (portBy) portBy.textContent = t('portBy'); - - // Update developed-by section for ruTranslate - const developedBy = document.querySelector('.developed-by'); - const existingTranslatedBy = developedBy?.querySelector('.translated-by'); - if (existingTranslatedBy) existingTranslatedBy.remove(); - if (developedBy && t('ruTranslate')) { - developedBy.insertAdjacentHTML('beforeend', t('ruTranslate')); + window.currentLanguage = navigator.language.split("-")[0] === "ru" ? "ru" : "en"; + if (params.get("lang") === "ru") { + window.currentLanguage = "ru"; + // } + // if (params.get("lang") === "en") { + } else { + window.currentLanguage = "en"; } - - // Update config panel labels if present - const configLangLabel = document.getElementById('config-lang-label'); - if (configLangLabel) configLangLabel.textContent = t('configLanguage'); - - const configCheatsLabel = document.getElementById('config-cheats-label'); - if (configCheatsLabel) configCheatsLabel.textContent = t('configCheats'); - - const configFullscreenLabel = document.getElementById('config-fullscreen-label'); - if (configFullscreenLabel) configFullscreenLabel.textContent = t('configFullscreen'); - - const configMaxFpsLabel = document.getElementById('config-max-fps-label'); - if (configMaxFpsLabel) configMaxFpsLabel.textContent = t('configMaxFps'); - - const configMaxFpsUnlimited = document.getElementById('config-max-fps-unlimited'); - if (configMaxFpsUnlimited) configMaxFpsUnlimited.textContent = t('configUnlimited'); -} -// Function to update game data files based on language -function updateGameDataForLanguage(lang) { - if (lang === 'ru') { - data_content = `${replaceBR}vc-sky-ru-v6.data.br`; - wasm_content = `${replaceBR}vc-sky-ru-v6.wasm.br`; - } else { - data_content = `${replaceBR}vc-sky-en-v6.data.br`; - wasm_content = `${replaceBR}vc-sky-en-v6.wasm.br`; + window.t = function (key) { + return translations[currentLanguage][key]; } -} +})(); -// Initialize data files based on current language -updateGameDataForLanguage(currentLanguage); +if (params.get('lang') === 'ru') { + data_content = `${replaceBR}vc-sky-ru-v6.data`; + wasm_content = `${replaceBR}vc-sky-ru-v6.wasm`; + // } else if (params.get('lang') === 'ru') { + // data_content = `${replaceBR}vc-sky-ru-v6.data`; + // wasm_content = `${replaceBR}vc-sky-ru-v6.wasm`; +} else { + data_content = `${replaceBR}vc-sky-en-v6.data`; + wasm_content = `${replaceBR}vc-sky-en-v6.wasm`; + // data_content = "index.old.data"; +} +// data_content = `${replaceBR}vc-sky-ru-v6.data`; +// wasm_content = `${replaceBR}vc-sky-ru-v6.wasm`; async function loadData() { let cache; @@ -591,7 +534,7 @@ const clickToPlayButton = document.getElementById('click-to-play-button'); clickToPlayButton.textContent = t('clickToPlayDemo'); clickToPlayButton.classList.add('disabled'); const demoOffDisclaimer = document.getElementById('demo-off-disclaimer'); -demoOffDisclaimer.textContent = "* " +t('demoOffDisclaimer'); +demoOffDisclaimer.textContent = "* " + t('demoOffDisclaimer'); const cloudSavesLink = document.getElementById('cloud-saves-link'); cloudSavesLink.textContent = t('cloudSaves'); cloudSavesStatus.textContent = t('enterKey'); @@ -624,7 +567,7 @@ function ownerShipNotConfirmed() { localStorage.removeItem('vcsky.haveOriginalGame'); disclaimerCheckbox.checked = false; clickToPlayButton.textContent = t('clickToPlayDemo'); - demoOffDisclaimer.textContent = "* " +t('demoOffDisclaimer'); + demoOffDisclaimer.textContent = "* " + t('demoOffDisclaimer'); haveOriginalGame = false; clickToPlayButton.classList.add('disabled'); }; @@ -798,48 +741,3 @@ const revc_ini = (() => { } return revc_iniDefault; })(); - -// Configurable mode UI -if (configurableMode) { - const configPanel = document.getElementById('config-panel'); - const configLang = document.getElementById('config-lang'); - const configCheats = document.getElementById('config-cheats'); - const configFullscreen = document.getElementById('config-fullscreen'); - const configMaxFps = document.getElementById('config-max-fps'); - - if (configPanel && configCheats && configFullscreen && configMaxFps) { - // Show config panel - configPanel.style.display = 'block'; - - // Set initial values from URL params - if (configLang) configLang.value = currentLanguage; - configCheats.checked = cheatsEnabled; - configFullscreen.checked = autoFullScreen; - configMaxFps.value = maxFPS; - - // Update config panel labels with current language - updateAllTranslations(); - - // Language selector handler - if (configLang) { - configLang.addEventListener('change', (e) => { - currentLanguage = e.target.value; - updateGameDataForLanguage(currentLanguage); - updateAllTranslations(); - }); - } - - // Update settings when changed - configCheats.addEventListener('change', (e) => { - cheatsEnabled = e.target.checked; - }); - - configFullscreen.addEventListener('change', (e) => { - autoFullScreen = e.target.checked; - }); - - configMaxFps.addEventListener('input', (e) => { - maxFPS = parseInt(e.target.value) || 0; - }); - } -} \ No newline at end of file diff --git a/dist/index.html b/dist/index.html index a62072c4..61602b4e 100644 --- a/dist/index.html +++ b/dist/index.html @@ -32,6 +32,7 @@ padding: 1em; box-sizing: border-box; } + body.gameIsStarted { background-color: #000; background-image: none; @@ -188,7 +189,7 @@ height: 325px; max-height: 50vh; display: inline-block; - background-image: url(/cover.jpg); + background-image: url(cover.jpg); background-repeat: no-repeat; background-position: 50% 50%; box-shadow: inset 0 0 .5em #249ef5aa, 0 0 .75em #249ef5aa; @@ -199,6 +200,7 @@ .developed-by { margin-bottom: 2em; } + .translated-by { margin-top: .5em; } @@ -236,6 +238,7 @@ .warning { color: #ff4193; } + .wasted-container { position: absolute; top: 0; @@ -259,6 +262,7 @@ opacity: .5; display: none; } + .gameIsStarted[data-is-touch="1"] .touch-controls-wrapper { display: block; } @@ -281,6 +285,7 @@ top: 20vmin; left: 1vmin; } + .touch-control.jump { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M121.787 67.372c-10.171-5.855-16.174-11.504-22.205-20.367-.048-.072-.055-.17-.07-.255-1.01-5.835 3.645-9.23 2.079-13.779-1.554-4.515-4.935-5.477-10.671-4.799-7.724.913-5.02 8.573-4.922 14.326.025 1.505-.323 2.963-.45 3.438a1.3 1.3 0 0 1-.119.296C79.084 57.48 60.617 57.572 56.24 64.396c-2.187 3.463.742 12.197 2.047 14.916.032.066.029.132.054.2 1.92 5.165 8.862 10.678 11.644 13.166.33.295.798.373 1.204.196 2.781-1.215 4.48-5.286 8.165-5.456.276-.013.558.089.761.275 4.97 4.54-4.437 14.808-7.902 19.622-.351.487-1.02.627-1.527.306-8.18-5.175-11.68-9.811-20.629-15.887a1.15 1.15 0 0 0-1.314.014c-6.648 4.845-11.96 11.785-14.164 19.877l.399.634c3.857.447 8.46-2.464 12.36-4.032.31-.125.662-.097.958.061 9.43 5.019 13.74 9.035 20.47 16.301.125.136.287.25.461.312 8.366 3.013 17.284-9.892 21.315-13.667 6.534-8.944 12.715 1.198 12.788 1.345 3.874 7.735-.928 20.056-.108 27.144a1.1 1.1 0 0 0 .72.896c4.581 1.728 18.64 8.512 22.398 5.977.456-.308.604-.904.388-1.41-1.446-3.37-6.348-6.845-9.537-9.005a1.14 1.14 0 0 1-.435-1.287c3.001-9.439 2.904-12.684 4.45-22.979.279-5.517-10.63-15.458-13.864-28.936-1.604-6.68-2.447-5.915-2.329-12.724.013-.77.776-1.314 1.501-1.056 7.693 2.74 20.539 12.082 23.994 6.753 1.901-2.827-1.959-4.487-8.721-8.58M75.734 80.146c-11.991-3.257-9.08-14.113-1.609-15.495 6.445 0 2.467 10.513 1.609 15.495'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); width: 20vmin; @@ -288,9 +293,11 @@ bottom: 10vmin; right: 22vmin; } + [data-state-car="1"] .touch-control.jump { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M152.717 80.384c-.96-3.85-4.883-8.09-8.6-8.673-6.997-1.095-16.088-.738-23.234-.72l-39.21.093c-11.376.02-30.61-.79-41.1.153-6.453 1.766-10.547 5.334-10.54 12.63.008 8.717 2.39 17.42 3.354 26.066 1.17 8.424 2.058 17.695 3.87 25.953.48 2.18 2.608 5.848 5.14 6.878 3.03 1.073 5.87 1.092 8.87 1.23 9.558.432 82.67 1.523 86.62-.53 2.49-.978 3.21-1.804 4.313-3.025 2.698-2.924 3.506-6.992 4.563-12.5 2.7-15.208 6.955-42.447 5.954-47.554zM61.08 127.61c0 2.048-1.66 3.708-3.707 3.708h-4.14c-2.047 0-3.707-1.66-3.707-3.708v-4.14c0-2.047 1.66-3.707 3.708-3.707h4.14c2.047 0 3.707 1.66 3.707 3.708v4.14zm0-17.91c0 2.05-1.66 3.71-3.707 3.71h-4.14c-2.047 0-3.707-1.66-3.707-3.71v-4.138c0-2.048 1.66-3.71 3.708-3.71h4.14c2.047 0 3.707 1.662 3.707 3.71v4.14zm0-17.63c0 2.048-1.66 3.708-3.707 3.708h-4.14c-2.047 0-3.707-1.66-3.707-3.71v-4.137c0-2.048 1.66-3.708 3.708-3.708h4.14c2.047 0 3.707 1.66 3.707 3.71v4.137zm17.872 35.54c0 2.048-1.66 3.708-3.71 3.708h-4.137c-2.048 0-3.71-1.66-3.71-3.708v-4.14c0-2.047 1.662-3.707 3.71-3.707h4.138c2.05 0 3.71 1.66 3.71 3.708v4.14zm0-17.91c0 2.05-1.66 3.71-3.71 3.71h-4.137c-2.048 0-3.71-1.66-3.71-3.71v-4.138c0-2.048 1.662-3.71 3.71-3.71h4.138c2.05 0 3.71 1.662 3.71 3.71v4.14zm0-17.63c0 2.048-1.66 3.708-3.71 3.708h-4.137c-2.048 0-3.71-1.66-3.71-3.71v-4.137c0-2.048 1.662-3.708 3.71-3.708h4.138c2.05 0 3.71 1.66 3.71 3.71v4.137zm19.032 35.54c0 2.048-1.66 3.708-3.708 3.708h-4.14c-2.047 0-3.707-1.66-3.707-3.708v-4.14c0-2.047 1.66-3.707 3.707-3.707h4.14c2.047 0 3.707 1.66 3.707 3.708v4.14zm0-17.91c0 2.05-1.66 3.71-3.708 3.71h-4.14c-2.047 0-3.707-1.66-3.707-3.71v-4.138c0-2.048 1.66-3.71 3.707-3.71h4.14c2.047 0 3.707 1.662 3.707 3.71v4.14zm0-17.63c0 2.048-1.66 3.708-3.708 3.708h-4.14c-2.047 0-3.707-1.66-3.707-3.71v-4.137c0-2.048 1.66-3.708 3.707-3.708h4.14c2.047 0 3.707 1.66 3.707 3.71v4.137zM116 127.61c0 2.048-1.66 3.708-3.708 3.708h-4.14c-2.047 0-3.708-1.66-3.708-3.708v-4.14c0-2.047 1.66-3.707 3.71-3.707h4.138c2.048 0 3.708 1.66 3.708 3.708v4.14zm0-17.91c0 2.05-1.66 3.71-3.708 3.71h-4.14c-2.047 0-3.708-1.66-3.708-3.71v-4.138c0-2.048 1.66-3.71 3.71-3.71h4.138c2.048 0 3.708 1.662 3.708 3.71v4.14zm0-17.63c0 2.048-1.66 3.708-3.708 3.708h-4.14c-2.047 0-3.708-1.66-3.708-3.71v-4.137c0-2.048 1.66-3.708 3.71-3.708h4.138c2.048 0 3.708 1.66 3.708 3.71v4.137zm19.032 35.54c0 2.048-1.66 3.708-3.708 3.708h-4.14c-2.047 0-3.707-1.66-3.707-3.708v-4.14c0-2.047 1.66-3.707 3.708-3.707h4.14c2.047 0 3.707 1.66 3.707 3.708v4.14zm0-17.91c0 2.05-1.66 3.71-3.708 3.71h-4.14c-2.047 0-3.707-1.66-3.707-3.71v-4.138c0-2.048 1.66-3.71 3.708-3.71h4.14c2.047 0 3.707 1.662 3.707 3.71v4.14zm0-17.63c0 2.048-1.66 3.708-3.708 3.708h-4.14c-2.047 0-3.707-1.66-3.707-3.71v-4.137c0-2.048 1.66-3.708 3.708-3.708h4.14c2.047 0 3.707 1.66 3.707 3.71v4.137z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3C/svg%3E"); } + .touch-control.car.getIn { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M112.826 27.04c3.368 2.647 6.287 4.85 9.743 7.38-5.187 6.85-10.147 13.085-15.288 19.41 2.753 3.265 5.108 5.824 8.002 9.566-5.86-.177-24.25 0-24.25 0-1.24-9.96-2.455-16.65-3.683-26.03 3.44 3.278 6.422 5.84 10.382 8.587 5.913-6.907 9.656-11.38 15.094-18.914z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3Cpath d='M145.936 84.723c-.15-.282-.818-.517-1.126-.597-4.66-1.21-8.292 1.697-12.74 3.443-3.497-5.626-6.708-12.57-10.783-16.874-1.344-1.344-2.684-1.356-5.115-1.53-5.38-.387-14.963-.43-24.27-.322-9.308-.107-18.892-.065-24.27.32-2.432.176-3.772.188-5.116 1.532C58.44 75 55.23 81.944 51.733 87.57c-4.448-1.747-8.08-4.654-12.74-3.444-.308.08-.977.315-1.126.597-1.606 3.04 6.236 5.984 8.977 7.433-1.56 3.096-3.625 6.33-5.157 9.312-.42.815-.645 1.705-.645 4.02v19.378c0 3.144 2.59 5.627 5.733 5.584 3.948-.053 8.017.222 11.862.128 1.656-.04 3.193-.826 4.263-2.09 2.698-3.193 4.257-3.63 9.682-2.144 6.722 1.84 12.866 2.642 19.32 2.442 6.453.2 12.597-.6 19.32-2.442 5.424-1.486 6.983-1.05 9.68 2.143 1.07 1.265 2.608 2.05 4.264 2.09 3.845.095 7.914-.18 11.862-.127 3.144.043 5.733-2.44 5.733-5.584v-19.38c0-2.313-.225-3.203-.644-4.018-1.532-2.98-3.597-6.216-5.157-9.312 2.74-1.45 10.582-4.393 8.976-7.433zm-77.32 26.443c-.565.447-1.254.725-1.97.81l-.478.054c-7.588.912-30.085-.418-18.638-13.027 1.39-2.116 32.598 3.08 21.088 12.163zm37.6 13.318c-3.366 0-8.032.032-12.428.057-.034 0-.06-.008-.092-.01-.034.002-.058.01-.093.01h-.237v-.018l-1.465.01-1.463-.01v.018H90.2c-.035 0-.06-.008-.093-.01-.033.002-.058.01-.092.01-4.396-.024-9.062-.056-12.43-.056-2.86 0-4.687-2.144-4.687-3.71 0-2.447 1.598-4.326 4.86-4.288 4.027-.078 8.115-.017 12.198 0 .048 0 .1.03.15.044.052-.014.105-.044.152-.044.548-.002 1.096-.006 1.644-.01.547.004 1.095.008 1.643.01.047 0 .1.03.15.044.05-.014.104-.044.152-.044 4.083-.017 8.17-.078 12.198 0 3.262-.038 4.86 1.84 4.86 4.288 0 1.566-1.828 3.71-4.688 3.71zm-12.85-33.716v-.013l-1.465.007-1.463-.007v.013c-13.286.05-27.046-.036-34.213-.433 3.203-5.86 5.188-10.063 9.016-15.986 6.264 0 15.72.116 25.197.232v.036l1.465-.018 1.464.018v-.036c9.476-.116 18.933-.233 25.197-.233 3.828 5.922 5.813 10.125 9.016 15.985-7.168.397-20.928.483-34.214.433zm24.27 21.262l-.478-.055c-.717-.084-1.406-.362-1.972-.81-11.51-9.083 19.697-14.278 21.087-12.162 11.447 12.61-11.05 13.94-18.638 13.027z' fill='%23fff'/%3E%3C/svg%3E"); width: 13vmin; @@ -298,12 +305,15 @@ bottom: 50vmin; right: 4vmin; } + [data-state-car="1"] .touch-control.car.getIn { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3Cpath d='M145.936 84.723c-.15-.282-.818-.517-1.126-.597-4.66-1.21-8.292 1.697-12.74 3.443-3.497-5.626-6.708-12.57-10.783-16.874-1.344-1.344-2.684-1.356-5.115-1.53-5.38-.387-14.963-.43-24.27-.322-9.308-.107-18.892-.065-24.27.32-2.432.176-3.772.188-5.116 1.532C58.44 75 55.23 81.944 51.733 87.57c-4.448-1.747-8.08-4.654-12.74-3.444-.308.08-.977.315-1.126.597-1.606 3.04 6.236 5.984 8.977 7.433-1.56 3.096-3.625 6.33-5.157 9.312-.42.815-.645 1.705-.645 4.02v19.378c0 3.144 2.59 5.627 5.733 5.584 3.948-.053 8.017.222 11.862.128 1.656-.04 3.193-.826 4.263-2.09 2.698-3.193 4.257-3.63 9.682-2.144 6.722 1.84 12.866 2.642 19.32 2.442 6.453.2 12.597-.6 19.32-2.442 5.424-1.486 6.983-1.05 9.68 2.143 1.07 1.265 2.608 2.05 4.264 2.09 3.845.095 7.914-.18 11.862-.127 3.144.043 5.733-2.44 5.733-5.584v-19.38c0-2.313-.225-3.203-.644-4.018-1.533-2.98-3.597-6.216-5.157-9.312 2.74-1.45 10.582-4.393 8.976-7.433zm-77.32 26.443c-.565.447-1.254.725-1.97.81l-.478.054c-7.588.912-30.085-.418-18.638-13.027 1.39-2.116 32.598 3.08 21.088 12.163zm37.6 13.318c-3.366 0-8.032.032-12.428.057-.034 0-.06-.008-.092-.01-.034.002-.058.01-.093.01h-.237v-.018l-1.465.01-1.463-.01v.018H90.2c-.035 0-.06-.008-.093-.01-.033.002-.058.01-.092.01-4.396-.024-9.062-.056-12.43-.056-2.86 0-4.687-2.144-4.687-3.71 0-2.447 1.598-4.326 4.86-4.288 4.027-.078 8.115-.017 12.198 0 .048 0 .1.03.15.044.052-.014.105-.044.152-.044.548-.002 1.096-.006 1.644-.01.547.004 1.095.008 1.643.01.047 0 .1.03.15.044.05-.014.104-.044.152-.044 4.083-.017 8.17-.078 12.198 0 3.262-.038 4.86 1.84 4.86 4.288 0 1.566-1.828 3.71-4.688 3.71zm-12.85-33.716v-.013l-1.465.007-1.463-.007v.013c-13.286.05-27.046-.036-34.213-.433 3.203-5.86 5.188-10.063 9.016-15.986 6.264 0 15.72.116 25.197.232v.036l1.465-.018 1.464.018v-.036c9.476-.116 18.933-.233 25.197-.233 3.828 5.922 5.813 10.125 9.016 15.985-7.168.397-20.928.483-34.214.433zm24.27 21.262l-.478-.055c-.717-.084-1.406-.362-1.972-.81-11.51-9.083 19.697-14.278 21.087-12.162 11.447 12.61-11.05 13.94-18.638 13.027zM99.743 65.357c-3.368-2.648-6.287-4.85-9.743-7.38 5.186-6.85 10.146-13.086 15.287-19.41-2.753-3.266-5.108-5.825-8.002-9.567 5.86.177 24.25 0 24.25 0 1.24 9.962 2.455 16.65 3.683 26.03-3.44-3.277-6.42-5.84-10.38-8.587-5.914 6.907-9.657 11.38-15.095 18.914z' fill='%23fff'/%3E%3C/svg%3E"); } + [data-state-car="1"][data-state-bike="1"] .touch-control.car.getIn { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M99.743 65.357A339 339 0 0 0 90 57.977c5.186-6.85 10.146-13.086 15.287-19.41-2.753-3.266-5.108-5.825-8.002-9.567 5.859.177 24.25 0 24.25 0 1.241 9.962 2.455 16.65 3.683 26.03-3.439-3.277-6.421-5.84-10.381-8.586-5.913 6.906-9.656 11.38-15.094 18.913'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3Cpath fill='%23fff' d='M46.75 91.5c2.566 0 5.334.625 7.682 1.688l2.85-4.252a27.2 27.2 0 0 0-13.657-3.686 3.123 3.123 0 0 1-3.125-3.125v-6.25C40.5 63.815 50.314 54 62.375 54h6.25a3.123 3.123 0 0 1 3.125 3.125 3.123 3.123 0 0 1-3.125 3.125H65.5v6.25h9.375c1.044 0 2.02.522 2.6 1.392l3.24 4.858h39.239l1.568-2.353a8.74 8.74 0 0 1 7.279-3.897h15.741a3.123 3.123 0 0 1 3.125 3.125c0 8.03-6.089 14.664-13.889 15.53l-4.27 6.405c10.06.32 18.159 8.553 18.159 18.69 0 10.339-8.411 18.75-18.75 18.75-7.997 0-15.017-5.135-17.633-12.5H79.486c-4.156 0-7.766-2.96-8.578-7.034l-.443-2.213c-1.15-5.752-4.142-10.725-8.204-14.524l-2.648 3.948c3.792 3.594 5.887 8.563 5.887 13.573 0 10.089-8.482 18.75-18.75 18.75C36.41 129 28 120.589 28 110.25S36.41 91.5 46.75 91.5m82.167 24.979h-10.803c2.191 3.765 6.262 6.271 10.803 6.271 6.894 0 12.5-5.606 12.5-12.5s-5.606-12.5-12.5-12.5c-1.389 0-2.726.275-4.014.715l-1.092 1.638a8.72 8.72 0 0 1-7.278 3.897h12.384a6.25 6.25 0 0 1 6.25 6.25c0 3.452-2.798 6.229-6.25 6.229M46.75 122.75c6.771 0 12.5-5.687 12.5-12.5 0-2.889-1.012-5.77-3.208-8.249l-6.698 9.989a3.12 3.12 0 0 1-4.333.854 3.12 3.12 0 0 1-.855-4.333l6.7-9.991c-1.508-.528-2.515-.77-4.106-.77-6.894 0-12.5 5.606-12.5 12.5s5.606 12.5 12.5 12.5'/%3E%3C/svg%3E"); } + [data-state-cutscene="1"] .touch-control.car.getIn { display: block; background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3Cpath d='M76.024 51.614c7.215 4.49 16.193 20.678 21.925 25.955.753.693 1.82.92 2.793.598 4.258-1.4 14.066-5.376 15.932-2.672 3.824 5.225-9.416 11.092-18.357 13.963-2.217.71-4.65-.083-5.995-1.983-4.255-6.007-6.493-9.236-13.173-1.233-1.04 1.245-1.078 3.058-.07 4.327 2.815 3.543 6.912 7.27 10.335 10.875 1.484 1.562 1.625 3.955.347 5.69-4.775 6.48-14.643 17.82-19.528 22.582-.785.765-1.995.882-2.923.298l-3.353-2.115c-.973-.613-1.303-1.862-.785-2.888 2.79-5.523 8.93-12.284 13.5-17.32 1.277-1.407 1.42-3.497.373-5.082-1.985-3.006-3.752-4.64-6.992-6.593-.932-.56-2.13.09-2.152 1.178-.04 2.046-.125 4.604-.316 5.29-1.868 6.725-15.158 21.157-21.865 26.69-1.05.863-2.572.78-3.535-.177-.83-.827-1.43-1.534-2.252-2.584-.524-.67-.617-1.602-.202-2.345 4.63-8.278 11.298-13.945 16.69-21.242 1.184-1.605 1.62-3.644 1.243-5.603-.452-2.352-.806-4.846-.527-7.065 1.326-10.563 15.577-15.607 19.085-24.758.4-1.04-.364-1.807-.948-2.466-5.822-1.887-14.778 11.32-20.57 13.428-7.605-.868-4.03-6.424-.457-9.81 5.583-5.294 12.335-9.72 18.13-14.666 1.025-.873 2.506-.985 3.65-.274zM127.852 75.447c7.623 4.59 14.306 8.234 22.266 12.245-2.71 5.632-8.265 18.778-10.903 23.54-.713-2.753-1.568-5.598-3.717-10.243-.474-1.026-1.652-1.532-2.72-1.16-5.48 1.905-19.053 7.29-21.364 8.08-1.382-4.795-1.906-7.06-3.23-12.205 4.755-2.007 14.343-5.325 19.907-7.736 1.224-.53 1.907-1.84 1.663-3.15-.655-3.532-1.9-9.373-1.9-9.373z' fill='%23fff'/%3E%3Cpath d='M100.143 66.36c5.355 0 9.696-4.34 9.696-9.695s-4.342-9.697-9.697-9.697c-5.355 0-9.697 4.342-9.697 9.697 0 5.355 4.342 9.696 9.697 9.696z' fill='%23fff'/%3E%3C/svg%3E"); @@ -312,6 +322,7 @@ top: 10vmin; transform: scaleX(-1); } + .touch-control.drift, .touch-control.fist { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48.575 82.876c12.76 9.6 13.945 21.293 21.284 33.61 7.5-2.263 9.523-4.338 15.8-9.184-.653-1.997-1.183-3.81-2.086-5.714-5.166-11.52-9.89-21.34-14.508-33.174 3.92 1.74 5.757 3.15 9.106 5.71.913.695 4.57-.75 6.567.232-1.565 1.058-6.015 3.003-6.02 4.535-.017 7.38 7.636 22.065 12.178 27.228l17.296-6.716c-2.535-9.46-7.944-28.736-7.385-38.22l.675-.592c5.033 7.74 3.37 24.505 11.9 34.71 8.255-.534 9.578-2.02 16.26-6.922-2.062-11.312-5.643-48.818-19.734-49.496-6.638 1.553-10.306 4.15-16.348 6.606-14.702-4.753-11.985-4.656-22.196 6.81-1.213 1.363-9.993 3.963-10.938 5.006-5.745 6.35-6.773 10.228-15.897 12.727-2.417.664-3.877 7.187-4.615 9.216-1.466 4.484-2.835 9.438-4.214 13.997-.826 2.733-1.336 5.286.36 7.842 2.363 3.836 8.693 2.807 10.81 6.15 2.377 3.75 2.937 13.18 8.175 14.348 3.438.767 7.58-1.766 10.76-3.324-3.724-12.515-11.076-23.942-17.23-35.384z' fill='%23fff'/%3E%3Cpath d='M139.29 76.574c-.832-3.267-4.175-4.872-6.21-7.05-.655-.7-1.874-5.424-2.362-6.688-.64-1.657-.942-2.7-2.707-3.583-1.492 1.99 8.082 27.39 5.548 33.407-4.045 9.602-12.13 6.892-19.555 11.084-2.274 1.532-2.86 2-5.653 1.374l1.175-2.213-.338-.922c-4.032-1.435-11.41 4.362-14.103 7.316.142 1.925.35 6.11.773 7.77 2.39 4.477 4.858 10.595 9.717 12.15 7.577.282 10.958-3.92 16.89-8.488.497-.168 3.113-1.657 3.73-1.998 2.844-1.193 8.088-3.242 10.18-5.41.918-.95 1.047-3.01.814-4.262-.63-3.387 1.204-7.433 2.12-11.082 1.724-6.848 1.73-14.566-.017-21.406zM78.953 121.303c-3.905 1.578-14.127.496-16.074 3.307.417 1.323.318 1.31 1.32 2.24 3.492 2.044 8.896 3.2 12.93 4.768 5.04.56 6.047-1.212 9.282-4.705 2.62-3.386 7.65-8.2 3.624-11.993-2.683.503-7.825 5.067-11.084 6.383z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3C/svg%3E"); @@ -320,12 +331,15 @@ bottom: 33vmin; right: 3vmin; } + .touch-control.fist { display: block; } + [data-state-gun="1"] .touch-control.fist { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M113.275 2.388c11.083 2.943 21.506 7.96 30.718 14.787-.832-.136-4.625-.767-5.06-1-4.285-2.27-23.49-11.08-25.658-13.787zM91.542 64.147c.873.824 3.194 5.202 4.528 6.765 5.86 6.868 13.74 14.98 21.192 19.97-9.033 9.032-43.144 42.087-45.875 44.26-7.878-4.435-22.384-19.248-26.423-27.516 6.858-6.858 36.106-34.665 46.578-43.48zM132.3 37.525c2.3-.314 5.298-.835 7.14-.132 4.912 1.63 8.65 7.55 8.1 9.82-3.06 14.093-14.886 29.83-25.856 39.173-1.358-1.31-3.365-2.734-4.907-3.9-9.16-7.094-13.797-13.086-20.37-22.29 7.514-9.293 23.767-20.395 35.892-22.67zM25.277 48.865c1.607 0 3.792 18.945 4.335 21.955 2.132 11.736 4.433 23.442 6.902 35.113 2.78 13.47 7.206 24.874 2.163 38.387-.556 1.49-3.318.808-5.196-2.646-2.13-3.616-3.578-7.593-4.27-11.732-1.248-7.246-1.887-25.434-2.382-33.256-.706-11.162-3.83-46.71-1.55-47.82zM54.492 41.21c.196-.76 1.32-.616 1.307.17-.165 10.494-4.643 38.773-5.653 43.64-.593 2.857-1.946 7.165-4.094 9.234-1.1 1.06-1.28-.113-1.28-.113-1.642-7.586.798-17.82 2.777-26.036l6.942-26.893zM95.508 154.367c-7.81.656-25.895 2.686-33.246 2.512-4.196-.08-8.342-.93-12.23-2.51-3.693-1.35-4.77-3.983-3.38-4.75 12.63-6.968 24.56-4.26 38.29-3.48 11.908.734 23.824 1.296 35.746 1.687 3.058.097 22.118-.514 22.353 1.076-.765 2.417-36.386 4.53-47.532 5.464zM113.266 129.685c-7.84 3.16-17.605 7.072-25.35 6.56 0 0-1.186-.01-.3-1.25 1.733-2.428 5.796-4.398 8.534-5.403 4.67-1.71 31.988-10.28 42.345-11.978.775-.128 1.083.963.358 1.27l-25.587 10.8z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3C/svg%3E"); } + [data-state-car="1"][data-state-car-gun="1"][data-state-bike="1"][data-state-menu="0"] .touch-control.fist, [data-state-car="1"][data-state-panzer="1"] .touch-control.fist, [data-state-car="1"][data-state-car-with-weapon="1"] .touch-control.fist, @@ -334,18 +348,22 @@ right: 24vmin; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M113.275 2.388a90.7 90.7 0 0 1 30.718 14.787c-.832-.136-4.625-.767-5.061-.999-4.284-2.272-23.488-11.081-25.657-13.788M91.542 64.147c.873.824 3.194 5.202 4.528 6.765 5.86 6.868 13.741 14.979 21.192 19.969-9.033 9.033-43.143 42.088-45.875 44.262-7.878-4.436-22.384-19.249-26.423-27.517 6.858-6.858 36.106-34.665 46.578-43.48M132.299 37.525c2.302-.314 5.299-.835 7.14-.132 4.913 1.629 8.651 7.55 8.1 9.821-3.06 14.092-14.885 29.829-25.855 39.172-1.358-1.311-3.365-2.734-4.907-3.901-9.159-7.093-13.797-13.085-20.37-22.29 7.514-9.292 23.767-20.394 35.892-22.67M25.277 48.866c1.607 0 3.792 18.944 4.336 21.954a1242 1242 0 0 0 6.901 35.113c2.781 13.47 7.206 24.874 2.163 38.387-.556 1.49-3.318.808-5.196-2.646a34.2 34.2 0 0 1-4.271-11.732c-1.248-7.246-1.887-25.434-2.382-33.256-.706-11.162-3.83-46.71-1.551-47.82M54.492 41.21c.196-.76 1.32-.616 1.307.17-.164 10.494-4.642 38.773-5.652 43.641-.593 2.856-1.946 7.164-4.094 9.233-1.1 1.06-1.281-.113-1.281-.113-1.64-7.587.8-17.82 2.778-26.037zM95.508 154.367c-7.81.656-25.895 2.686-33.246 2.512a34.2 34.2 0 0 1-12.231-2.508c-3.692-1.352-4.77-3.984-3.378-4.752 12.63-6.967 24.558-4.259 38.29-3.48q17.861 1.102 35.745 1.688c3.058.097 22.118-.514 22.353 1.076-.766 2.417-36.387 4.53-47.533 5.464M113.266 129.685c-7.839 3.16-17.605 7.072-25.35 6.56 0 0-1.186-.009-.3-1.251 1.733-2.427 5.796-4.397 8.534-5.402 4.669-1.711 31.988-10.279 42.345-11.978.775-.128 1.083.963.358 1.269z'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); } + [data-state-car="1"][data-state-hunter="1"] .touch-control.fist { right: 3vmin; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M66.725 2.388a90.7 90.7 0 0 0-30.718 14.787c.832-.136 4.625-.767 5.061-.999 4.284-2.272 23.488-11.081 25.657-13.788M154.723 48.866c-1.607 0-3.792 18.944-4.335 21.954a1244 1244 0 0 1-6.902 35.113c-2.781 13.47-7.206 24.874-2.163 38.387.557 1.49 3.318.808 5.196-2.646a34.2 34.2 0 0 0 4.271-11.732c1.248-7.246 1.887-25.434 2.382-33.256.706-11.162 3.83-46.71 1.551-47.82M125.508 41.21c-.196-.76-1.32-.616-1.307.17.164 10.494 4.642 38.773 5.652 43.641.593 2.856 1.946 7.164 4.094 9.233 1.099 1.06 1.281-.113 1.281-.113 1.641-7.587-.8-17.82-2.778-26.037zM84.492 154.367c7.81.656 25.895 2.686 33.246 2.512a34.2 34.2 0 0 0 12.231-2.508c3.692-1.352 4.77-3.984 3.378-4.752-12.629-6.967-24.558-4.259-38.29-3.48a1240 1240 0 0 1-35.745 1.688c-3.057.097-22.117-.514-22.353 1.076.766 2.417 36.387 4.53 47.533 5.464M66.734 129.685c7.839 3.16 17.605 7.072 25.35 6.56 0 0 1.186-.009.3-1.251-1.733-2.427-5.796-4.397-8.534-5.402-4.67-1.711-31.988-10.279-42.345-11.978-.776-.128-1.083.963-.358 1.269z'/%3E%3Cpath fill='%23fff' d='M90 5.243C43.265 5.243 5.243 43.265 5.243 90S43.265 174.757 90 174.757 174.757 136.735 174.757 90 136.735 5.243 90 5.243M90 0c49.706 0 90 40.294 90 90s-40.294 90-90 90S0 139.706 0 90 40.294 0 90 0'/%3E%3Cpath fill='%23fff' d='M70.28 62.378C64.595 57.72 46.92 44.362 44.756 46.676 42.594 48.993 56.679 66.19 61.709 71.55l1.906 1.88q.234.23.476.455l9.248 8.643L75.502 95.5l5.521-5.791 10.692 9.995 18.867 31.636c.373.349 1.283-.019 2.033-.822l5.627-6.02-1.121-1.047 2.598-1.033 2.083 1.057c.013-.005 3.15-1.164 4.246-4.543l-1.175-2.027.422-3.218 1.628 1.522 5.626-6.019c.752-.804 1.057-1.736.684-2.085l-32.292-16.18-11.144-10.418L96 74l-14.643-1.38-8.586-8.024q-.24-.225-.485-.445z'/%3E%3C/svg%3E"); } + [data-state-car="1"][data-state-hunter="1"] .touch-control.drift { right: 24vmin; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M113.275 2.388a90.7 90.7 0 0 1 30.718 14.787c-.832-.136-4.625-.767-5.061-.999-4.284-2.272-23.488-11.081-25.657-13.788M91.542 64.147c.873.824 3.194 5.202 4.528 6.765 5.86 6.868 13.741 14.979 21.192 19.969-9.033 9.033-43.143 42.088-45.875 44.262-7.878-4.436-22.384-19.249-26.423-27.517 6.858-6.858 36.106-34.665 46.578-43.48M132.299 37.525c2.302-.314 5.299-.835 7.14-.132 4.913 1.629 8.651 7.55 8.1 9.821-3.06 14.092-14.885 29.829-25.855 39.172-1.358-1.311-3.365-2.734-4.907-3.901-9.159-7.093-13.797-13.085-20.37-22.29 7.514-9.292 23.767-20.394 35.892-22.67M25.277 48.866c1.607 0 3.792 18.944 4.336 21.954a1242 1242 0 0 0 6.901 35.113c2.781 13.47 7.206 24.874 2.163 38.387-.556 1.49-3.318.808-5.196-2.646a34.2 34.2 0 0 1-4.271-11.732c-1.248-7.246-1.887-25.434-2.382-33.256-.706-11.162-3.83-46.71-1.551-47.82M54.492 41.21c.196-.76 1.32-.616 1.307.17-.164 10.494-4.642 38.773-5.652 43.641-.593 2.856-1.946 7.164-4.094 9.233-1.1 1.06-1.281-.113-1.281-.113-1.64-7.587.8-17.82 2.778-26.037zM95.508 154.367c-7.81.656-25.895 2.686-33.246 2.512a34.2 34.2 0 0 1-12.231-2.508c-3.692-1.352-4.77-3.984-3.378-4.752 12.63-6.967 24.558-4.259 38.29-3.48q17.861 1.102 35.745 1.688c3.058.097 22.118-.514 22.353 1.076-.766 2.417-36.387 4.53-47.533 5.464M113.266 129.685c-7.839 3.16-17.605 7.072-25.35 6.56 0 0-1.186-.009-.3-1.251 1.733-2.427 5.796-4.397 8.534-5.402 4.669-1.711 31.988-10.279 42.345-11.978.775-.128 1.083.963.358 1.269z'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); } + [data-state-cutscene="0"] .touch-control.drift { display: block; background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M155.682 31.545c-3.006 1.738-16.654 5.808-18.21 4.298 0 0-.33-.214-.356-.378-.03-.185.247-.647.247-.647 2.298-3.75 9.56-8.042 13.94-7.783 1.106.946 3.457 3.465 4.38 4.51zM111.352 116.232c2.337.907 12.1 8.543 14.915 10.923-11.544 12.374-18.29 18.525-31.07 33.505-1.35 1.847-2.6 2.928-4.24 4.493-1.313-4.007-6.348-22.645-5.487-25.52 1.8-6.01 20.32-19.724 25.882-23.4zM112.906 85.722c2.77-1.256 6.726 8.143 8.302 11.01-3.388 2.724-11.924 7.278-16.048 9.972-7.097 5.04-10.673 7.897-17.018 13.703-1.472 1.365-3.248 2.77-4.808 4.066 2.037-13.266 4.066-23.427 6.064-25.13 5.61-4.777 11.77-7.383 23.508-13.62zM124.86 102.533c7.296 3.84 11.244 7.396 17.462 11.245 1.214 2.833 8.74 16.567 8.48 19.61-.708.893-1.806-.068-3.5-.917-8.988-5.306-23.542-15.6-31.213-22.33l8.77-7.607zM27.355 74.804c.092.007.188-.002.278.022 3.06.84 12.335 19.733 14.308 23.555-1.23 4.286-2.436 8.636-4.955 12.362l-.967.07c-4.586-6.8-8.516-14.807-12.522-21.996-4.435-7.96-6.085-11.68 3.86-14.012zM122.503 60.503c1.536-.426 1.588.393 2 .758 1.73 2.046 2.22 4.287 3.075 6.863-5.837 3.864-11.89 6.716-17.838 10.003-6.234 3.446-9.964 6.363-15.44 10.718-1.22.978-2.237 1.895-3.04 1.824 0 0-1.122-.6.143-3.004 5.136-9.837 8.13-15.778 11.467-18.125 4.45-3.133 9.86-5.352 19.633-9.037zM46.743 51.525c.964-.29 1.178.387 1.178.387 1.29 1.49 7.535 16.27 9.424 20.48.137.303.108.654-.076.933-2.05 3.11-4.47 5.94-6.956 8.704-.448.497-1.26.406-1.573-.186-2.7-5.09-7.62-19.058-9.614-25.58-.32-1.045.232-2.154 1.252-2.546 2.152-.83 3.854-1.442 6.365-2.193zM127.027 76.845c2.76 1.33 9.805 7.913 12.803 11.666.145 3.92 1.036 11.92 1.2 14.315 0 0-.105.47-.808.218-.687-.246-2.332-1.755-2.332-1.755-3.652-3.105-15.423-15.795-18.016-19.81 1.842-1.422 5.098-3.414 7.153-4.633zM69.644 38.085c2.6 3.174 5.75 9.65 7.46 13.187.288.596.233 1.31-.16 1.842-2.188 2.962-4.556 5.154-7.232 7.803l-.64.537c-.983.82-2.484.387-2.87-.834-1.352-4.285-3.102-13.898-3.242-16.473-.156-2.856 1.723-4.053 4.07-6.24.757-.708 1.957-.624 2.614.178zM135.857 40.008c1.003 2.922 1.507 5.006 2.072 7.003-3.807 3.227-22.617 11.036-27.787 12.938 0 0-.293.147-.507-.11-.095-.113.142-.576.142-.576 3.136-7.787 17.896-17.02 26.08-19.254zM83.334 25.325c-3.313 1.153-13.9 4.647-16.127 5.903 0 0-.67.453.224.51 4.504.28 9.56-.074 14.934-.395.06 1.694 1.705 13.03 2.015 16.282 3.686-2.24 6.86-4.025 9.928-6.238-2.245-6.242-9.78-15.065-10.974-16.062zM56.74 34.11c2.31-.46 4.235 3.45 3.205 4.743-4.004 3.876-17.752 7.938-25.022 10.24-1.56.533-3.257 1.266-3.624.704-.21-.32.057-.7.057-.7 5.355-6.725 17.36-11.246 25.383-14.986zM138.843 54.34c1.357 1.826 6.14 9.517 5.946 10.476-.89 4.402-1.605 7.906-3.48 10.15 0 0-6.736-8.783-10.172-16.53 2.456-1.77 7.705-4.096 7.705-4.096zM94.488 20.795c.124-.764.86-1.274 1.616-1.104 5.85 1.32 14.246 5.35 14.494 12.28.048 1.358-1.085 1.986-2.067 2.683-.08.058-.164.107-.257.146-1.45.612-3.26 1.207-4.89 1.748-.667.222-1.38-.116-1.654-.764-2.076-4.923-4.55-9.4-7.1-14.108-.142-.26-.194-.564-.146-.858l.004-.023zM119.17 16.514c5.266.707 12.525 3.07 8.695 8.922-.128.195-.303.36-.506.476-1.196.687-2.63 1.386-3.96 2.035-.716.35-1.58.065-1.96-.636-1.825-3.38-2.657-5.633-3.852-8.795-.397-1.05.468-2.15 1.582-2zM143.037 41.264c2.343-.878 3.948-1.256 6.465-1.728 1.837 3.403 3.175 4.957 4.26 8.807-1.53 1.6-3.066 3.735-5.395 5.158-1.413-3.51-4.078-8.518-5.33-12.236z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3Cpath d='M9.233 114.513c2.605-1.168 8.91-4.608 11.482-5.737 1.302-.572 2.815.016 3.398 1.314l9.596 21.337c.12.267.193.552.217.843l1.207 14.184c.195 2.293-6.607 9.28-6.443 3.844l-8.125-6.772c-.283-.236-.513-.53-.673-.862l-11.93-24.657c-.638-1.316-.062-2.896 1.27-3.494zM5.986 87.782c2.903 2.448 10.414 6.7 12.89 8.772 1.162.97 1.106 2.768-.11 3.668l-12.46 5.714c-1.194.884-2.898.444-3.516-.906l-1.05-2.3c-.157-.342-.228-.715-.21-1.09l.62-12.188c.097-1.93 2.358-2.915 3.836-1.67zM6.42 61.874l23.986-5.218c.865-.158 1.71.365 1.953 1.21l2.333 8.086c.253.876-.225 1.797-1.087 2.095l-27.67 9.636c-1.187.41-2.397-.554-2.262-1.803l1.35-12.504c.082-.755.65-1.366 1.397-1.502zM154.29 144.275l-18.395-7.887c-.752-.323-1.627-.11-2.148.522l-4.868 5.913c-.724.878-.486 2.196.5 2.765l16.71 9.665c.77.445 1.747.277 2.324-.4l6.553-7.69c.805-.944.465-2.4-.676-2.888zM102.498 172.835c4.77-6.2 14.573-19.017 17.55-22.908.492-.646 1.4-.798 2.08-.35L138.1 160.12c.94.623.927 2.008-.03 2.604-3.956 2.46-12.31 7.632-12.76 7.707-.438.074-14.122 3.216-21.245 4.853-1.414.326-2.453-1.298-1.57-2.448z' fill='%23fff'/%3E%3C/svg%3E"); } + [data-state-gun="1"][data-state-cutscene="1"] .touch-control.drift, [data-state-gun="1"][data-state-menu="1"] .touch-control.drift, [data-state-car="0"] .touch-control.drift, @@ -353,6 +371,7 @@ [data-state-car="1"] .touch-control.fist { display: none; } + [data-state-gun="1"][data-state-car="0"] .drift, [data-state-scope-mode="1"] .touch-control.drift, [data-state-scope-gun="1"] .touch-control.drift { @@ -360,6 +379,7 @@ right: 24vmin; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M157.486 83.922c-4.036.033-12.021-.362-16.227-.848-.999-3.95-2.811-9.163-4.866-13.435-7.087-14.734-18.804-24.032-34.294-28.463q-2.236-.63-4.499-1.166c.685-5.796.983-10.637 1.819-16.052-5.452-.022-10.707.115-16.346 0 1.166 5.86 1.395 9.12 2.14 14.95-26.574 7.485-36.978 16.742-45.46 42.94-7.602-.443-9.812-.706-16.932-1.446.037 4.748.19 9.58.001 14.284 5.89-.767 10.425-.813 16.596-1.278 3.269 15.554 10.295 27.641 23.73 36.47 7.41 4.868 11.781 5.302 19.844 7.767-.624 6.071-1.247 11.319-2.077 16.85 5.389.044 9.039.386 14.42 0 .117-1.701-.354-12.296-.163-16.043 24.729-6.101 38.088-17.492 45.575-42.44q8.36.945 16.739 1.706c0-5.35.265-8.555 0-13.797m-23.783 13.194c-3.816 18.191-19.862 34.33-38.772 33.624a1.045 1.045 0 0 1-.993-.999 938 938 0 0 1-.669-19.655c-.087-3.82-.04-9.966-.587-13.764a1 1 0 0 0-.659-.81c-1.287-.444-3.383-.465-4.647-.013-.34.122-.579.42-.643.776-1.58 8.697-2.178 24.285-3.616 34.404l-.398.406c-6.008.124-16.262-5.4-20.869-9.213-8.833-7.315-13.464-16.093-14.927-27.149-.08-.599.38-1.143.983-1.17 6.57-.303 30.78-.61 34.904-1.703.333-.088.586-.348.699-.674.478-1.383.376-1.815.173-3.576-.13-.527-.435-.768-1.008-1.13-9.693-2.195-25.306-1.94-34.996-3.383a1.034 1.034 0 0 1-.855-1.24c3.68-16.786 17.564-34.374 37.265-35.144.592-.023 1.334.168 1.334.168.665 6.312.607 30.03 2.203 35.762.112.403.471.687.887.733 1.387.154 1.977.229 3.302-.068.378-.085.683-.365.785-.74 1.57-5.78 3.27-27.393 4.078-35.124a1.04 1.04 0 0 1 1.22-.912c11.148 2.031 19.236 6.252 26.807 15.434 3.31 4.016 8.921 14.758 8.888 20.462a1.03 1.03 0 0 1-.867 1.016c-10.455 1.676-30.495 1.607-36.282 3.388a.94.94 0 0 0-.582.485c-.49 1.042-.395 2.322-.344 3.568.015.362.21.7.532.865 5.259 2.69 31.19 2.207 37.311 4.104.602.139.423.888.343 1.272'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); } + .touch-control.run { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3Cpath d='M76.024 51.614c7.215 4.49 16.193 20.678 21.925 25.955.753.693 1.82.92 2.793.598 4.258-1.4 14.066-5.376 15.932-2.672 3.824 5.225-9.416 11.092-18.357 13.963-2.217.71-4.65-.083-5.995-1.983-4.255-6.007-6.493-9.236-13.173-1.233-1.04 1.245-1.078 3.058-.07 4.327 2.815 3.543 6.912 7.27 10.335 10.875 1.484 1.562 1.625 3.955.347 5.69-4.775 6.48-14.643 17.82-19.528 22.582-.785.765-1.995.882-2.923.298l-3.353-2.115c-.973-.613-1.303-1.862-.785-2.888 2.79-5.523 8.93-12.284 13.5-17.32 1.277-1.407 1.42-3.497.373-5.082-1.985-3.006-3.752-4.64-6.992-6.593-.932-.56-2.13.09-2.152 1.178-.04 2.046-.125 4.604-.316 5.29-1.868 6.725-15.158 21.157-21.865 26.69-1.05.863-2.572.78-3.535-.177-.83-.827-1.43-1.534-2.252-2.584-.524-.67-.617-1.602-.202-2.345 4.63-8.278 11.298-13.945 16.69-21.242 1.184-1.605 1.62-3.644 1.243-5.603-.452-2.352-.806-4.846-.527-7.065 1.326-10.563 15.577-15.607 19.085-24.758.4-1.04-.364-1.807-.948-2.466-5.822-1.887-14.778 11.32-20.57 13.428-7.605-.868-4.03-6.424-.457-9.81 5.583-5.294 12.335-9.72 18.13-14.666 1.025-.873 2.506-.985 3.65-.274zM127.852 75.447c7.623 4.59 14.306 8.234 22.266 12.245-2.71 5.632-8.265 18.778-10.903 23.54-.713-2.753-1.568-5.598-3.717-10.243-.474-1.026-1.652-1.532-2.72-1.16-5.48 1.905-19.053 7.29-21.364 8.08-1.382-4.795-1.906-7.06-3.23-12.205 4.755-2.007 14.343-5.325 19.907-7.736 1.224-.53 1.907-1.84 1.663-3.15-.655-3.532-1.9-9.373-1.9-9.373z' fill='%23fff'/%3E%3Cpath d='M100.143 66.36c5.355 0 9.696-4.34 9.696-9.695s-4.342-9.697-9.697-9.697c-5.355 0-9.697 4.342-9.697 9.697 0 5.355 4.342 9.696 9.697 9.696z' fill='%23fff'/%3E%3C/svg%3E"); width: 20vmin; @@ -367,28 +387,35 @@ bottom: 10vmin; right: 1vmin; } + [data-state-cutscene="1"] .touch-control { display: none; } + [data-state-car="1"] .touch-control.run { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M130.653 110.546c-.205-22.184.412-44.5-.35-66.68-.11-3.174-2.71-5.692-5.885-5.737-15.644-.22-53.415-.515-53.53-.504-.915.086-3.722 0-4.734 2.458-2.344 6.024 1.557 18.59-.31 25.085-1.58 5.497-6.287 10.43-9.786 14.817-3.567 4.474-7.68 9.03-9.642 14.49-1.616 4.5-1.678 21.996-1.31 35.028.216 7.58 6.324 13.672 13.903 13.868 14.88.387 31.588-.018 45.203.086 4.19-.017 8.38-.15 12.568-.3 7.59-.273 13.65-6.402 13.82-13.993.14-6.174.11-12.334.053-18.62zm-60.76 17.423c0 2.21-1.793 4.002-4.004 4.002H61.42c-2.21 0-4.003-1.793-4.003-4.003v-4.47c0-2.21 1.79-4.002 4.002-4.002h4.467c2.21 0 4.002 1.792 4.002 4.003v4.47zm0-24.503c0 2.21-1.793 4.003-4.004 4.003H61.42c-2.21 0-4.003-1.792-4.003-4.003V99c0-2.21 1.79-4.003 4.002-4.003h4.467c2.21 0 4.002 1.792 4.002 4.003v4.467zm23.48 24.502c0 2.21-1.79 4.002-4.002 4.002h-4.466c-2.21 0-4.003-1.793-4.003-4.003v-4.47c0-2.21 1.793-4.002 4.004-4.002h4.467c2.212 0 4.004 1.792 4.004 4.003v4.47zm0-24.503c0 2.21-1.79 4.003-4.002 4.003h-4.466c-2.21 0-4.003-1.792-4.003-4.003V99c0-2.21 1.793-4.003 4.004-4.003h4.467c2.212 0 4.004 1.792 4.004 4.003v4.467zm0-23.713c0 2.21-1.79 4.003-4.002 4.003h-4.466c-2.21 0-4.003-1.793-4.003-4.003v-4.468c0-2.21 1.793-4.003 4.004-4.003h4.467c2.212 0 4.004 1.793 4.004 4.003v4.468zm0-24.33c0 2.212-1.79 4.004-4.002 4.004h-4.466c-2.21 0-4.003-1.792-4.003-4.003v-4.467c0-2.21 1.793-4.003 4.004-4.003h4.467c2.212 0 4.004 1.792 4.004 4.003v4.467zm24.48 72.545c0 2.21-1.792 4.002-4.003 4.002h-4.467c-2.21 0-4.003-1.793-4.003-4.003v-4.47c0-2.21 1.792-4.002 4.003-4.002h4.467c2.21 0 4.003 1.792 4.003 4.003v4.47zm0-24.503c0 2.21-1.792 4.003-4.003 4.003h-4.467c-2.21 0-4.003-1.792-4.003-4.003V99c0-2.21 1.792-4.003 4.003-4.003h4.467c2.21 0 4.003 1.792 4.003 4.003v4.467zm0-23.713c0 2.21-1.792 4.003-4.003 4.003h-4.467c-2.21 0-4.003-1.793-4.003-4.003v-4.468c0-2.21 1.792-4.003 4.003-4.003h4.467c2.21 0 4.003 1.793 4.003 4.003v4.468zm0-24.33c0 2.212-1.792 4.004-4.003 4.004h-4.467c-2.21 0-4.003-1.792-4.003-4.003v-4.467c0-2.21 1.792-4.003 4.003-4.003h4.467c2.21 0 4.003 1.792 4.003 4.003v4.467z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3C/svg%3E"); } + [data-state-menu="1"] .touch-control.run, [data-state-cutscene="1"] .touch-control.run { display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M54.539 45.298h46.587c3.841 3.84 36.78 36.383 46.447 45.99-14.743 15.222-31.813 32.923-46.41 47.52-2.083.402-10.467.059-12.972.036-11.478-.104-22.322.207-33.781.207 2.04-2.375 4.171-4.654 6.326-6.925 13.37-13.37 25.613-27.106 39.014-40.506-10.682-11.63-22.021-22.89-32.823-34.228-3.948-4.143-7.811-7.558-12.388-12.094'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); } + [data-state-cutscene="1"] .touch-control.run { bottom: auto; top: 12vmin; } + [data-state-menu="1"] .touch-control { display: none; } + [data-is-touch="1"][data-state-menu="1"] .touch-control.car.getIn { display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M113.073 57.392C102.271 68.73 90.932 79.99 80.25 91.62c13.4 13.4 25.643 27.136 39.014 40.506 2.155 2.271 4.285 4.55 6.326 6.925-11.459 0-22.303-.311-33.78-.207-2.506.023-10.89.366-12.973-.036-14.597-14.597-31.667-32.298-46.41-47.52 9.667-9.607 42.606-42.15 46.447-45.99h46.587c-4.577 4.536-8.44 7.951-12.388 12.094'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); } + [data-state-car="1"] .touch-control.camera { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30.244 52.207c6.014 2.763 26.82 11.125 32.152 12.538V51.102c26.8 0 56.51.576 83.09.576-.075 19.047-.28 36.933-.28 57.066-7.028-.01-23.055 0-29.213 0-2.09 2.16-2.28 2.35-4.094 4.794 4.44 6.457 10.777 12.274 15.418 18.58 1.225 2.162 2.345 3.47.184 4.87-6.622 1.956-16.95-11.9-23.395-17.2-6.045 5.008-11.17 11.167-17.56 15.644-2.445 1.715-4.743 2.255-6.222-.86.503-6.18 12.373-15.065 16.717-21.105l-2.993-4.723c-11.76-.215-20.865.347-31.654 0V97.068c-4.142.907-9.568 3.54-13.618 5.218-6.152 2.565-12.37 4.974-18.643 7.225.02-12.474.11-50.317.11-57.303z' fill='%23fff'/%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3C/svg%3E"); width: 10vmin; @@ -396,6 +423,7 @@ bottom: 65vmin; right: 17vmin; } + [data-state-job="1"] .touch-control.job { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3Cpath fill='%23fff' d='M132.677 92.029v-8.324q2.775 0 4.336-1.907 1.647-1.908 1.647-5.376h14.393q0 4.422-2.688 7.977-2.687 3.555-7.283 5.636-4.596 1.995-10.405 1.994m-4.248 28.699v-10.925h5.202v10.925zm0-26.965V83.705h5.116v10.058zm11.098 8.844v-1.648h14.393v1.648zm0-1.561q0-3.468-1.647-5.376-1.561-1.907-4.335-1.907v-8.324q5.809 0 10.404 2.081 4.595 1.995 7.283 5.55 2.688 3.467 2.688 7.976zm-11.098-31.82V58.3h4.335v10.924zm24.624 7.283H138.66q0-3.468-1.647-5.376-1.561-1.908-4.336-1.908V58.301q5.81 0 10.405 2.427 4.595 2.342 7.283 6.503 2.688 4.076 2.688 9.278m.867 26.011q0 5.203-2.688 9.364-2.688 4.076-7.283 6.503-4.595 2.341-10.404 2.341v-10.925q2.773 0 4.335-1.907 1.647-1.908 1.647-5.376zm-39.017 18.208V58.301h14.393v62.427zM90.528 103.907V75.035h14.393v28.872zm-26.185 0V75.035h14.393v28.872zm40.578-28.699H90.528q0-3.468-1.647-5.376-1.56-1.907-4.336-1.907V57q5.81 0 10.405 2.428 4.596 2.34 7.283 6.503 2.688 4.075 2.688 9.277m-40.578 0q0-5.202 2.688-9.277 2.688-4.163 7.283-6.503Q78.91 57 84.72 57v10.925q-2.775 0-4.422 1.907-1.56 1.908-1.56 5.376zm40.578 28.613q0 5.202-2.688 9.364-2.688 4.075-7.283 6.503-4.596 2.34-10.405 2.341v-10.925q2.775 0 4.336-1.908 1.647-1.907 1.647-5.375zm-40.578 0h14.393q0 3.468 1.56 5.375 1.649 1.908 4.423 1.908v10.925q-5.81 0-10.405-2.341-4.595-2.428-7.283-6.503-2.688-4.162-2.688-9.364M39.96 103.994V58.301h14.392v45.693zm14.392-.087q0 8.585-4.682 13.44-4.68 4.768-13.092 4.768l-1.734-10.924q1.647 0 2.774-.867 1.128-.868 1.734-2.515.608-1.647.608-3.902zm-23.323 5.81a6.9 6.9 0 0 0 1.734 1.127q.955.347 2.08.347l1.735 10.924q-2.775 0-5.376-.78-2.514-.78-5.202-2.688z'/%3E%3C/svg%3E"); width: 10vmin; @@ -403,6 +431,7 @@ bottom: 65vmin; right: 29vmin; } + [data-state-car="1"] .touch-control.horn { background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757 0 46.735-38.022 84.757-84.757 84.757-46.735 0-84.757-38.022-84.757-84.757C5.243 43.265 43.265 5.243 90 5.243zM90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0z' fill='%23fff'/%3E%3Cpath d='M150.61 55.75c-3.294.562-10.056 14.44-18.115 18.47-14.23 7.11-33.75 4.134-49.36 4.746-11.985.468-24.48.077-36.367-.507-4.03-.2-12.315-3.44-16.54-4.665 0 5.98-.29 15.515-.29 21.525 6.753-1.41 10.284-4.51 19.012-5.71-2.487 13.625-6.334 24.215 9.3 32.604 1.48.804 5.694 1.71 7.578 1.91 15.87 1.692 35.367 2.61 48.896-1.455 12.814-3.85 14.838-21.134 10.252-31.645 0 0 .62-.235.84-.235 10.992 0 17.692 19.47 23.22 20.232 7.792-.898 6.015-57.966 1.574-55.27zM116.143 102.1c0 7.063-5.726 12.79-12.79 12.79H69.25c-7.064 0-12.79-5.727-12.79-12.79 0-7.063 5.726-12.788 12.79-12.788h34.104c7.063 0 12.79 5.725 12.79 12.788z' fill='%23fff'/%3E%3C/svg%3E"); width: 10vmin; @@ -410,6 +439,7 @@ bottom: 65vmin; right: 5vmin; } + [data-state-mobring="1"] .touch-control.mobile { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3Cpath fill='%23fff' d='m54.761 74.215 45.326 77.923a1 1 0 0 0 1.365.362l32.843-19.002c.41-.237.591-.729.375-1.151-.523-1.023-1.641-2.823-3.641-5.229-2.647-3.186-7.72-5.752-9.926-6.637l-20.515-34.51 3.046-9.774a2 2 0 0 0-.184-1.607L91.163 53.643a1 1 0 0 0-1.36-.361L73.447 62.67a3 3 0 0 1-2.916.04l-2.978-1.605a9 9 0 0 1-3.31-3.068L49.61 35.206c-.411-.642-1.051-1.126-1.812-1.188-.524-.042-1.107-.023-1.475.188-.27.154-.507.427-.703.722-.496.747-.346 1.71.128 2.471l14.433 23.159a9 9 0 0 1 1.362 4.76V67.3a3 3 0 0 1-1.458 2.574l-4.974 2.98a1 1 0 0 0-.351 1.36'/%3E%3C/svg%3E"); width: 10vmin; @@ -417,6 +447,7 @@ bottom: 65vmin; right: 5vmin; } + .touch-control.fireRight, .touch-control.fireLeft { width: 10vmin; @@ -425,29 +456,35 @@ left: 31vmin; display: none; } + [data-state-car="1"][data-state-car-gun="1"] .touch-control.fireRight, [data-state-car="1"][data-state-car-gun="1"] .touch-control.fireLeft { display: block; } + [data-state-menu="1"][data-state-car="1"][data-state-car-gun="1"] .touch-control.fireRight, [data-state-menu="1"][data-state-car="1"][data-state-car-gun="1"] .touch-control.fireLeft, [data-state-cutscene="1"][data-state-car="1"][data-state-car-gun="1"] .touch-control.fireRight, [data-state-cutscene="1"][data-state-car="1"][data-state-car-gun="1"] .touch-control.fireLeft { display: none; } + .touch-control.fireRight { left: 43vmin; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M113.275 2.388a90.7 90.7 0 0 1 30.718 14.787c-.832-.136-4.625-.767-5.061-.999-4.284-2.272-23.488-11.081-25.657-13.788M91.542 64.147c.873.824 3.194 5.202 4.528 6.765 5.86 6.868 13.741 14.979 21.192 19.969-9.033 9.033-43.143 42.088-45.875 44.262-7.878-4.436-22.384-19.249-26.423-27.517 6.858-6.858 36.106-34.665 46.578-43.48M132.299 37.525c2.302-.314 5.299-.835 7.14-.132 4.913 1.629 8.651 7.55 8.1 9.821-3.06 14.092-14.885 29.829-25.855 39.172-1.358-1.311-3.365-2.734-4.907-3.901-9.159-7.093-13.797-13.085-20.37-22.29 7.514-9.292 23.767-20.394 35.892-22.67M25.277 48.866c1.607 0 3.792 18.944 4.336 21.954a1242 1242 0 0 0 6.901 35.113c2.781 13.47 7.206 24.874 2.163 38.387-.556 1.49-3.318.808-5.196-2.646a34.2 34.2 0 0 1-4.271-11.732c-1.248-7.246-1.887-25.434-2.382-33.256-.706-11.162-3.83-46.71-1.551-47.82M54.492 41.21c.196-.76 1.32-.616 1.307.17-.164 10.494-4.642 38.773-5.652 43.641-.593 2.856-1.946 7.164-4.094 9.233-1.1 1.06-1.281-.113-1.281-.113-1.64-7.587.8-17.82 2.778-26.037zM95.508 154.367c-7.81.656-25.895 2.686-33.246 2.512a34.2 34.2 0 0 1-12.231-2.508c-3.692-1.352-4.77-3.984-3.378-4.752 12.63-6.967 24.558-4.259 38.29-3.48q17.861 1.102 35.745 1.688c3.058.097 22.118-.514 22.353 1.076-.766 2.417-36.387 4.53-47.533 5.464M113.266 129.685c-7.839 3.16-17.605 7.072-25.35 6.56 0 0-1.186-.009-.3-1.251 1.733-2.427 5.796-4.397 8.534-5.402 4.669-1.711 31.988-10.279 42.345-11.978.775-.128 1.083.963.358 1.269z'/%3E%3Cpath fill='%23fff' d='M90 5.243c46.735 0 84.757 38.022 84.757 84.757S136.735 174.757 90 174.757 5.243 136.735 5.243 90 43.265 5.243 90 5.243M90 0C40.294 0 0 40.294 0 90s40.294 90 90 90 90-40.294 90-90S139.706 0 90 0'/%3E%3C/svg%3E"); } + .touch-control.fireLeft { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none' viewBox='0 0 180 180'%3E%3Cpath fill='%23fff' d='M66.725 2.388a90.7 90.7 0 0 0-30.718 14.787c.832-.136 4.625-.767 5.061-.999 4.284-2.272 23.488-11.081 25.657-13.788M88.458 64.147c-.873.824-3.194 5.202-4.528 6.765-5.86 6.868-13.74 14.979-21.192 19.969 9.033 9.033 43.144 42.088 45.875 44.262 7.878-4.436 22.384-19.249 26.423-27.517-6.858-6.858-36.106-34.665-46.578-43.48M47.7 37.525c-2.3-.314-5.298-.835-7.14-.132-4.912 1.629-8.65 7.55-8.099 9.821 3.06 14.092 14.885 29.829 25.855 39.172 1.358-1.311 3.365-2.734 4.907-3.901 9.159-7.093 13.797-13.085 20.37-22.29-7.514-9.292-23.767-20.394-35.892-22.67M154.723 48.866c-1.607 0-3.792 18.944-4.335 21.954a1244 1244 0 0 1-6.902 35.113c-2.781 13.47-7.206 24.874-2.163 38.387.557 1.49 3.318.808 5.196-2.646a34.2 34.2 0 0 0 4.271-11.732c1.248-7.246 1.887-25.434 2.382-33.256.706-11.162 3.83-46.71 1.551-47.82M125.508 41.21c-.196-.76-1.32-.616-1.307.17.164 10.494 4.642 38.773 5.652 43.641.593 2.856 1.946 7.164 4.094 9.233 1.099 1.06 1.281-.113 1.281-.113 1.641-7.587-.8-17.82-2.778-26.037zM84.492 154.367c7.81.656 25.895 2.686 33.246 2.512a34.2 34.2 0 0 0 12.231-2.508c3.692-1.352 4.77-3.984 3.378-4.752-12.629-6.967-24.558-4.259-38.29-3.48a1240 1240 0 0 1-35.745 1.688c-3.057.097-22.117-.514-22.353 1.076.766 2.417 36.387 4.53 47.533 5.464M66.734 129.685c7.839 3.16 17.605 7.072 25.35 6.56 0 0 1.186-.009.3-1.251-1.733-2.427-5.796-4.397-8.534-5.402-4.669-1.711-31.988-10.279-42.345-11.978-.775-.128-1.083.963-.358 1.269z'/%3E%3Cpath fill='%23fff' d='M90 5.243C43.265 5.243 5.243 43.265 5.243 90S43.265 174.757 90 174.757 174.757 136.735 174.757 90 136.735 5.243 90 5.243M90 0c49.706 0 90 40.294 90 90s-40.294 90-90 90S0 139.706 0 90 40.294 0 90 0'/%3E%3C/svg%3E"); } + .touch-control.radio { left: 50%; transform: translateX(-50%); width: 40vmin; height: 10vmin; } + .touch-control.weapon { right: 6vmin; top: 5vmin; @@ -463,6 +500,7 @@ height: 100%; z-index: 90; } + #look { position: fixed; top: 0; @@ -485,10 +523,12 @@ display: flex; flex-direction: column-reverse; } + .cover { margin-left: auto; margin-right: auto; } + .click-to-play { margin-top: 2em; margin-bottom: 0; @@ -499,14 +539,17 @@ color: white; font-weight: bold; } + .follow-container { margin-top: -30px; margin-bottom: 20px; } + .disabled { opacity: 0.4; filter: grayscale(100%); } + #demo-off-disclaimer { font-size: 0.7em; margin-top: 2px; @@ -546,28 +589,15 @@ - +