Meta Description" name="description" />
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Indian Army Test Drive - Big Map</title>
<style>
body { margin: 0; background: #222; color: white; font-family: sans-serif; overflow: hidden; touch-action: none; }
#menu { position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.9); z-index: 100; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.btn { background: #4b5320; color: white; padding: 15px 30px; border: none; border-radius: 10px; font-size: 20px; margin: 10px; width: 200px; }
/* Mobile Controls */
#controls { position: absolute; bottom: 20px; width: 100%; display: flex; justify-content: space-around; z-index: 50; }
.control-btn { width: 70px; height: 70px; background: rgba(255,255,255,0.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 30px; border: 2px solid white; -webkit-user-select: none; }
#hud { position: absolute; top: 10px; left: 10px; z-index: 60; background: rgba(0,0,0,0.5); padding: 10px; border-radius: 10px; }
</style>
</head>
<body>
<div id="menu">
<h1 style="color:#4b5320">ARMY TEST DRIVE</h1>
<p>Select Map:</p>
<button class="btn" onclick="startGame('Desert')">ποΈ DESERT MAP</button>
<button class="btn" onclick="startGame('City')">ποΈ CITY MAP</button>
<div style="margin-top:20px">
<label>Handling:</label> <input type="range" id="sens" min="2" max="10" value="5">
</div>
</div>
<div id="hud" style="display:none">
Map: <span id="mapName">None</span><br>
Speed: <span id="speedVal">0</span> km/h <br>
Car: <b>Defender / Suzuki</b>
</div>
<div id="controls" style="display:none">
<div class="control-btn" id="leftBtn">β</div>
<div class="control-btn" id="rightBtn">βΆ</div>
<div class="control-btn" style="background:green" id="gasBtn">β¬</div>
<div class="control-btn" style="background:red" id="brakeBtn">β¬</div>
</div>
<canvas id="gameCanvas"></canvas>
<script>
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
let speed = 0, carX, roadY = 0, currentMap = "", running = false;
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
carX = canvas.width / 2 - 30;
function startGame(map) {
currentMap = map;
document.getElementById('menu').style.display = 'none';
document.getElementById('controls').style.display = 'flex';
document.getElementById('hud').style.display = 'block';
document.getElementById('mapName').innerText = map;
running = true;
loop();
}
let input = { left: false, right: false, gas: false, brake: false };
// Touch Handlers
function bind(id, key) {
const el = document.getElementById(id);
el.ontouchstart = () => input[key] = true;
el.ontouchend = () => input[key] = false;
}
bind('leftBtn', 'left'); bind('rightBtn', 'right');
bind('gasBtn', 'gas'); bind('brakeBtn', 'brake');
function loop() {
if(!running) return;
// Map Design (Background)
if(currentMap === "Desert") ctx.fillStyle = "#edc9af"; // Sand
else ctx.fillStyle = "#555"; // City Road
ctx.fillRect(0, 0, canvas.width, canvas.height);
// Infinite Road / Map Detail
ctx.fillStyle = "white";
for(let i = -100; i < canvas.height; i += 100) {
ctx.fillRect(canvas.width/2 - 5, (i + roadY) % canvas.height, 10, 50);
}
// Car Physics (Unlimited Speed)
if(input.gas) speed += 0.8;
if(input.brake) speed -= 1.5;
speed *= 0.98; // Friction
if(speed < 0) speed = 0;
let sens = document.getElementById('sens').value;
if(input.left) carX -= (speed * 0.01 * sens);
if(input.right) carX += (speed * 0.01 * sens);
roadY += speed;
document.getElementById('speedVal').innerText = Math.floor(speed * 5);
// Draw Car (Indian Defender Look)
ctx.fillStyle = (currentMap === "Desert") ? "darkgreen" : "blue";
ctx.fillRect(carX, canvas.height - 180, 60, 100); // Body
ctx.fillStyle = "black";
ctx.fillRect(carX-5, canvas.height-170, 10, 20); // Wheels
ctx.fillRect(carX+55, canvas.height-170, 10, 20);
requestAnimationFrame(loop);
}
</script>
</body>
</html>1
1
5KB
5KB
245.0ms
252.0ms
245.0ms