diff --git a/.htaccess b/.htaccess index e2bbc23..a395ed6 100644 --- a/.htaccess +++ b/.htaccess @@ -16,3 +16,13 @@ RewriteRule ^(.+?)/?$ $1.php [L] # 2) Optional: strip trailing slash for non-directories (keeps .php links working) RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^(.+)/$ $1 [R=301,L] + + + FileETag None + + Header unset ETag + Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate" + Header set Pragma "no-cache" + Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT" + + \ No newline at end of file diff --git a/assets/css/custom.css b/assets/css/custom.css index 126a7fc..86d8867 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -62,4 +62,48 @@ border-radius: 5px; background-color: #4CAF50; color: white; +} + +#tutorial-modal { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.7); + display: flex; + justify-content: center; + align-items: center; + color: white; + font-family: sans-serif; + z-index: 100; +} + +.modal-content { + text-align: center; + background-color: #333; + padding: 40px; + border-radius: 10px; +} + +.modal-content h2 { + font-size: 50px; + margin-bottom: 20px; +} + +.modal-content p { + font-size: 20px; + margin-bottom: 15px; + line-height: 1.5; +} + +#start-game-btn { + margin-top: 20px; + padding: 15px 30px; + font-size: 20px; + cursor: pointer; + border: none; + border-radius: 5px; + background-color: #4CAF50; + color: white; } \ No newline at end of file diff --git a/assets/js/Ball.js b/assets/js/Ball.js index 5731a63..da0ff61 100644 --- a/assets/js/Ball.js +++ b/assets/js/Ball.js @@ -44,8 +44,7 @@ export class Ball { const fieldLength = 100; const ballRadius = 0.8; - this.mesh.position.x = Math.max(-fieldWidth / 2 + ballRadius, Math.min(fieldWidth / 2 - ballRadius, this.mesh.position.x)); - this.mesh.position.z = Math.max(-fieldLength / 2 + ballRadius, Math.min(fieldLength / 2 - ballRadius, this.mesh.position.z)); + // --- Force 2D movement on the XZ plane --- diff --git a/assets/js/Player.js b/assets/js/Player.js index fc97855..bc11c8b 100644 --- a/assets/js/Player.js +++ b/assets/js/Player.js @@ -2,19 +2,23 @@ import * as THREE from 'three'; export class Player { - constructor(scene, color, position, team) { + constructor(scene, color, position, type, team) { this.scene = scene; this.color = color; - this.position = position; + this.velocity = new THREE.Vector3(0, 0, 0); + this.type = type; this.team = team; - this.createPlayer(); + this.radius = 1.5; + this.hasBall = false; + this.createPlayer(new THREE.Vector3(position.x, position.y, position.z)); } - createPlayer() { + createPlayer(initialPosition) { const playerGeometry = new THREE.CapsuleGeometry(1, 2, 4, 8); const playerMaterial = new THREE.MeshStandardMaterial({ color: this.color }); this.mesh = new THREE.Mesh(playerGeometry, playerMaterial); - this.mesh.position.set(this.position.x, this.position.y, this.position.z); + this.mesh.position.copy(initialPosition); + this.mesh.initialPosition = initialPosition.clone(); this.mesh.castShadow = true; this.mesh.lastVelocity = new THREE.Vector3(); this.mesh.team = this.team; diff --git a/assets/js/Team.js b/assets/js/Team.js index 9bc7dc8..ff71ae8 100644 --- a/assets/js/Team.js +++ b/assets/js/Team.js @@ -14,18 +14,16 @@ export class Team { createTeam() { for (let i = 0; i < this.numberOfPlayers; i++) { const position = this.generatePosition(i); - const player = new Player(this.scene, this.color, position, this.isPlayerTeam ? 'player' : 'bot'); + const player = new Player(this.scene, this.color, position, this.isPlayerTeam ? 'player' : 'bot', this); this.players.push(player); } } resetPositions() { - for (let i = 0; i < this.players.length; i++) { - const player = this.players[i]; - const position = this.generatePosition(i); - player.mesh.position.set(position.x, position.y, position.z); - player.mesh.velocity.set(0, 0, 0); - } + this.players.forEach(player => { + player.mesh.position.copy(player.mesh.initialPosition); + player.velocity.set(0, 0, 0); + }); } generatePosition(i) { diff --git a/assets/js/main.js b/assets/js/main.js index 35237ba..8133673 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,8 +1,8 @@ import * as THREE from 'three'; -import { Field } from './Field.js'; -import { Ball } from './Ball.js'; -import { Team } from './Team.js'; +import { Field } from 'app/field'; +import { Ball } from 'app/ball'; +import { Team } from 'app/team'; class Game { constructor() { @@ -10,8 +10,6 @@ class Game { this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); this.renderer = new THREE.WebGLRenderer({ antialias: true }); this.keyboardState = {}; - - this.init(); } init() { @@ -403,4 +401,14 @@ class Game { } } -new Game(); +const game = new Game(); + +const startGameBtn = document.getElementById('start-game-btn'); +const tutorialModal = document.getElementById('tutorial-modal'); + +function startGame() { + tutorialModal.style.display = 'none'; + game.init(); +} + +startGameBtn.addEventListener('click', startGame); diff --git a/game.php b/game.php deleted file mode 100644 index 787340e..0000000 --- a/game.php +++ /dev/null @@ -1,36 +0,0 @@ - - - - - - Pocket 5 Soccer - - - - -
- 0 - 0 -
-
30
- - - - - diff --git a/index.php b/index.php index b0c21d9..9885b8e 100644 --- a/index.php +++ b/index.php @@ -3,151 +3,44 @@ - Pocket 5 Soccer - Fast-Paced 5v5 Action - - - - - - - - - - - + Pocket 5 Soccer - - - - - - - + - - - - - -
-
-

Fast-Paced 5v5 Action

-

Real-time multiplayer soccer designed for quick, intense matches.

- Play Now - Learn More +
+
+ 0 - 0 +
+
30
+
- -
- -
-
-

Game Rules & Play Style

-
-
- A top-down view of a soccer game strategy board. -
-
-
-
-

- -

-
-
-
    -
  • Match Specs: 5v5 teams, 2-minute match duration.
    • -
  • Control Model: Each human controls one player.
    • -
  • Orientation: Vertical screen for mobile.
    • -
  • AI Players: AI fills all positions not controlled by humans.
    • -
-
-
-
-
-

- -

-
-
-
    -
  • Smart Passing: Auto-targets nearest teammate in a 30-degree arc.
    • -
  • Directional Shooting: Ball trajectory follows player's facing direction.
    • -
  • Active Tackle: High-speed sprint to win the ball. Failure results in a 1-second movement penalty.
    • -
-
-
-
-
-
-
-
-
- - -
-
-

Dual Platform Controls

-
-
- Close-up on a person's hands using a mobile phone for gaming. -
-
-
-
-

Mobile

-
Movement: Virtual Joystick
-
Actions: On-screen Buttons
-
-
-

Desktop

-
Movement: Arrow Keys
-
Pass: 'S' Key
-
Shoot: 'D' Key
-
Tackle: Spacebar
-
-
-
-
-
-
-
- - - - - - - - + + + \ No newline at end of file