/**** * Classes ****/ // Ball class var Ball = Container.expand(function () { var self = Container.call(this); var ballCircle = self.attachAsset('ball', { width: 80, height: 80, color: 0xffffff, shape: 'ellipse', anchorX: 0.5, anchorY: 0.5 }); self.radius = 40; self.vx = 0; self.vy = 0; self.friction = 0.98; self.update = function () { // Track lastX and lastY for event triggers if (self.lastX === undefined) self.lastX = self.x; if (self.lastY === undefined) self.lastY = self.y; self.x += self.vx; self.y += self.vy; self.vx *= self.friction; self.vy *= self.friction; // Clamp to field bounds if (self.x < -900 + self.radius) { self.x = -900 + self.radius; self.vx *= -0.7; } if (self.x > 900 - self.radius) { self.x = 900 - self.radius; self.vx *= -0.7; } if (self.y < -600 + self.radius) { self.y = -600 + self.radius; self.vy *= -0.7; } if (self.y > 600 - self.radius) { self.y = 600 - self.radius; self.vy *= -0.7; } // Update lastX and lastY for next frame self.lastX = self.x; self.lastY = self.y; }; return self; }); // --- Game Classes --- // Football field (background, goals, etc) var Field = Container.expand(function () { var self = Container.call(this); // Field background (green rectangle) var fieldBg = self.attachAsset('field', { width: 1800, height: 1200, color: 0x228B22, shape: 'box', anchorX: 0.5, anchorY: 0.5 }); fieldBg.x = 0; fieldBg.y = 0; // Center circle var centerCircle = self.attachAsset('centerCircle', { width: 300, height: 300, color: 0xffffff, shape: 'ellipse', anchorX: 0.5, anchorY: 0.5 }); centerCircle.x = 0; centerCircle.y = 0; // Left goal var leftGoal = self.attachAsset('leftGoal', { width: 40, height: 300, color: 0xffffff, shape: 'box', anchorX: 0.5, anchorY: 0.5 }); leftGoal.x = -900; leftGoal.y = 0; // Right goal var rightGoal = self.attachAsset('rightGoal', { width: 40, height: 300, color: 0xffffff, shape: 'box', anchorX: 0.5, anchorY: 0.5 }); rightGoal.x = 900; rightGoal.y = 0; return self; }); // Opponent class (AI or static for now) var Opponent = Container.expand(function () { var self = Container.call(this); var oppCircle = self.attachAsset('opponent', { width: 120, height: 120, color: 0xff3333, shape: 'ellipse', anchorX: 0.5, anchorY: 0.5 }); self.radius = 60; self.speed = 12; self.team = 2; self.update = function () { if (self.lastX === undefined) self.lastX = self.x; if (self.lastY === undefined) self.lastY = self.y; self.lastX = self.x; self.lastY = self.y; }; return self; }); // Player class (controlled by user) var Player = Container.expand(function () { var self = Container.call(this); var playerCircle = self.attachAsset('player', { width: 120, height: 120, color: 0x0077ff, shape: 'ellipse', anchorX: 0.5, anchorY: 0.5 }); self.radius = 60; self.speed = 18; self.team = 1; self.update = function () { if (self.lastX === undefined) self.lastX = self.x; if (self.lastY === undefined) self.lastY = self.y; self.lastX = self.x; self.lastY = self.y; }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x000000 }); /**** * Game Code ****/ // --- Game State Management --- var GAME_STATE_MENU = 0; var GAME_STATE_SETTINGS = 1; var GAME_STATE_PLAYING = 2; var GAME_STATE_RESULT = 3; var gameState = GAME_STATE_MENU; // --- Settings --- var matchDuration = 60; // seconds var goldPerMatch = 10; var playerTeam = 1; // 1 or 2 var opponentTeam = 2; var gold = 100; // Player's in-game currency // --- UI Elements --- var menuContainer = new Container(); var settingsContainer = new Container(); var resultContainer = new Container(); var matchUIContainer = new Container(); // --- Helper: Remove all UI containers --- function hideAllUI() { menuContainer.visible = false; settingsContainer.visible = false; resultContainer.visible = false; matchUIContainer.visible = false; } // --- Main Menu --- function setupMenu() { menuContainer.removeChildren(); var title = new Text2("Haxball Showdown", { size: 120, fill: "#fff" }); title.anchor.set(0.5, 0); title.x = 2048 / 2; title.y = 200; menuContainer.addChild(title); var playBtn = new Text2("Play", { size: 100, fill: 0x00FF00 }); playBtn.anchor.set(0.5, 0); playBtn.x = 2048 / 2; playBtn.y = 600; playBtn.interactive = true; playBtn.down = function () { if (gold < goldPerMatch) { playBtn.setText("Not enough gold!"); return; } gold -= goldPerMatch; startMatch(); }; menuContainer.addChild(playBtn); var settingsBtn = new Text2("Settings", { size: 80, fill: "#ff0" }); settingsBtn.anchor.set(0.5, 0); settingsBtn.x = 2048 / 2; settingsBtn.y = 800; settingsBtn.interactive = true; settingsBtn.down = function () { showSettings(); }; menuContainer.addChild(settingsBtn); var goldTxt = new Text2("Gold: " + gold, { size: 60, fill: "#fff" }); goldTxt.anchor.set(0.5, 0); goldTxt.x = 2048 / 2; goldTxt.y = 1100; menuContainer.addChild(goldTxt); LK.gui.center.addChild(menuContainer); menuContainer.visible = true; } // --- Settings Menu --- function showSettings() { hideAllUI(); settingsContainer.removeChildren(); var settingsTitle = new Text2("Settings", { size: 100, fill: "#fff" }); settingsTitle.anchor.set(0.5, 0); settingsTitle.x = 2048 / 2; settingsTitle.y = 200; settingsContainer.addChild(settingsTitle); // Match Duration var durationTxt = new Text2("Match Duration: " + matchDuration + "s", { size: 70, fill: "#fff" }); durationTxt.anchor.set(0.5, 0); durationTxt.x = 2048 / 2; durationTxt.y = 500; settingsContainer.addChild(durationTxt); var durationMinus = new Text2("-", { size: 90, fill: "#ff0" }); durationMinus.anchor.set(0.5, 0); durationMinus.x = 2048 / 2 - 200; durationMinus.y = 600; durationMinus.interactive = true; durationMinus.down = function () { if (matchDuration > 30) matchDuration -= 10; durationTxt.setText("Match Duration: " + matchDuration + "s"); }; settingsContainer.addChild(durationMinus); var durationPlus = new Text2("+", { size: 90, fill: "#ff0" }); durationPlus.anchor.set(0.5, 0); durationPlus.x = 2048 / 2 + 200; durationPlus.y = 600; durationPlus.interactive = true; durationPlus.down = function () { if (matchDuration < 300) matchDuration += 10; durationTxt.setText("Match Duration: " + matchDuration + "s"); }; settingsContainer.addChild(durationPlus); // Gold per match var goldTxt = new Text2("Gold per Match: " + goldPerMatch, { size: 70, fill: "#fff" }); goldTxt.anchor.set(0.5, 0); goldTxt.x = 2048 / 2; goldTxt.y = 800; settingsContainer.addChild(goldTxt); var goldMinus = new Text2("-", { size: 90, fill: "#ff0" }); goldMinus.anchor.set(0.5, 0); goldMinus.x = 2048 / 2 - 200; goldMinus.y = 900; goldMinus.interactive = true; goldMinus.down = function () { if (goldPerMatch > 1) goldPerMatch -= 1; goldTxt.setText("Gold per Match: " + goldPerMatch); }; settingsContainer.addChild(goldMinus); var goldPlus = new Text2("+", { size: 90, fill: "#ff0" }); goldPlus.anchor.set(0.5, 0); goldPlus.x = 2048 / 2 + 200; goldPlus.y = 900; goldPlus.interactive = true; goldPlus.down = function () { if (goldPerMatch < 100) goldPerMatch += 1; goldTxt.setText("Gold per Match: " + goldPerMatch); }; settingsContainer.addChild(goldPlus); // Team management var teamTxt = new Text2("Your Team: " + playerTeam + " | Opponent: " + opponentTeam, { size: 70, fill: "#fff" }); teamTxt.anchor.set(0.5, 0); teamTxt.x = 2048 / 2; teamTxt.y = 1100; settingsContainer.addChild(teamTxt); var switchBtn = new Text2("Switch Teams", { size: 70, fill: "#0ff" }); switchBtn.anchor.set(0.5, 0); switchBtn.x = 2048 / 2; switchBtn.y = 1200; switchBtn.interactive = true; switchBtn.down = function () { var tmp = playerTeam; playerTeam = opponentTeam; opponentTeam = tmp; teamTxt.setText("Your Team: " + playerTeam + " | Opponent: " + opponentTeam); }; settingsContainer.addChild(switchBtn); var removeBtn = new Text2("Remove Opponent", { size: 70, fill: "#f00" }); removeBtn.anchor.set(0.5, 0); removeBtn.x = 2048 / 2; removeBtn.y = 1300; removeBtn.interactive = true; removeBtn.down = function () { opponentTeam = "-"; teamTxt.setText("Your Team: " + playerTeam + " | Opponent: " + opponentTeam); }; settingsContainer.addChild(removeBtn); var backBtn = new Text2("Back", { size: 80, fill: "#fff" }); backBtn.anchor.set(0.5, 0); backBtn.x = 2048 / 2; backBtn.y = 1600; backBtn.interactive = true; backBtn.down = function () { showMenu(); }; settingsContainer.addChild(backBtn); LK.gui.center.addChild(settingsContainer); settingsContainer.visible = true; } // --- Show Menu --- function showMenu() { hideAllUI(); setupMenu(); gameState = GAME_STATE_MENU; } // --- Result Screen --- function showResult(playerScore, opponentScore) { hideAllUI(); resultContainer.removeChildren(); var resultTxt = new Text2("Result", { size: 120, fill: "#fff" }); resultTxt.anchor.set(0.5, 0); resultTxt.x = 2048 / 2; resultTxt.y = 400; resultContainer.addChild(resultTxt); var scoreTxt = new Text2("You: " + playerScore + " - " + opponentScore + " :Opponent", { size: 100, fill: "#fff" }); scoreTxt.anchor.set(0.5, 0); scoreTxt.x = 2048 / 2; scoreTxt.y = 700; resultContainer.addChild(scoreTxt); var goldTxt = new Text2("Gold: " + gold, { size: 80, fill: "#ff0" }); goldTxt.anchor.set(0.5, 0); goldTxt.x = 2048 / 2; goldTxt.y = 900; resultContainer.addChild(goldTxt); var menuBtn = new Text2("Menu", { size: 90, fill: "#0ff" }); menuBtn.anchor.set(0.5, 0); menuBtn.x = 2048 / 2; menuBtn.y = 1200; menuBtn.interactive = true; menuBtn.down = function () { showMenu(); }; resultContainer.addChild(menuBtn); LK.gui.center.addChild(resultContainer); resultContainer.visible = true; gameState = GAME_STATE_RESULT; } // --- Start Match --- function startMatch() { hideAllUI(); matchUIContainer.removeChildren(); // --- Football match setup --- var field = new Field(); field.x = 2048 / 2; field.y = 1366; // Centered vertically (2732/2) matchUIContainer.addChild(field); var player = new Player(); player.x = 2048 / 2 - 400; player.y = 1366; matchUIContainer.addChild(player); var opponent = new Opponent(); opponent.x = 2048 / 2 + 400; opponent.y = 1366; matchUIContainer.addChild(opponent); var ball = new Ball(); ball.x = 2048 / 2; ball.y = 1366; matchUIContainer.addChild(ball); // Timer and score UI var timerTxt = new Text2("Time: " + matchDuration, { size: 80, fill: "#fff" }); timerTxt.anchor.set(0.5, 0); timerTxt.x = 2048 / 2; timerTxt.y = 200; matchUIContainer.addChild(timerTxt); var matchTxt = new Text2("You: 0 - 0 :Opponent", { size: 100, fill: "#fff" }); matchTxt.anchor.set(0.5, 0); matchTxt.x = 2048 / 2; matchTxt.y = 350; matchUIContainer.addChild(matchTxt); var playerScore = 0; var opponentScore = 0; var timeLeft = matchDuration; var matchTimer = LK.setInterval(function () { timeLeft -= 1; timerTxt.setText("Time: " + timeLeft); if (timeLeft <= 0) { LK.clearInterval(matchTimer); showResult(playerScore, opponentScore); } }, 1000); LK.gui.center.addChild(matchUIContainer); matchUIContainer.visible = true; gameState = GAME_STATE_PLAYING; // Store references for update loop matchUIContainer._field = field; matchUIContainer._player = player; matchUIContainer._opponent = opponent; matchUIContainer._ball = ball; matchUIContainer._matchTxt = matchTxt; matchUIContainer._timerTxt = timerTxt; matchUIContainer._playerScore = function () { return playerScore; }; matchUIContainer._opponentScore = function () { return opponentScore; }; matchUIContainer._setPlayerScore = function (val) { playerScore = val; }; matchUIContainer._setOpponentScore = function (val) { opponentScore = val; }; matchUIContainer._matchTimer = matchTimer; matchUIContainer._timeLeft = function () { return timeLeft; }; matchUIContainer._setTimeLeft = function (val) { timeLeft = val; }; } // --- Start with Menu --- setupMenu(); // --- Football match update loop --- var draggingPlayer = false; var dragOffsetX = 0; var dragOffsetY = 0; // Touch/drag logic for player matchUIContainer.down = function (x, y, obj) { if (gameState !== GAME_STATE_PLAYING) return; var player = matchUIContainer._player; // Convert to local field coordinates var localX = x - 2048 / 2; var localY = y - 1366; var dx = localX - player.x + 2048 / 2; var dy = localY - player.y + 1366; var dist = Math.sqrt(dx * dx + dy * dy); if (dist < player.radius + 30) { draggingPlayer = true; dragOffsetX = player.x - localX; dragOffsetY = player.y - localY; } }; matchUIContainer.up = function (x, y, obj) { draggingPlayer = false; }; matchUIContainer.move = function (x, y, obj) { if (gameState !== GAME_STATE_PLAYING) return; if (!draggingPlayer) return; var player = matchUIContainer._player; // Clamp to field bounds var localX = x - 2048 / 2; var localY = y - 1366; var newX = localX + dragOffsetX; var newY = localY + dragOffsetY; // Clamp to field area if (newX < -900 + player.radius) newX = -900 + player.radius; if (newX > 900 - player.radius) newX = 900 - player.radius; if (newY < -600 + player.radius) newY = -600 + player.radius; if (newY > 600 - player.radius) newY = 600 - player.radius; player.x = newX; player.y = newY; }; // Main update loop for match game.update = function () { if (gameState !== GAME_STATE_PLAYING) return; var player = matchUIContainer._player; var opponent = matchUIContainer._opponent; var ball = matchUIContainer._ball; var matchTxt = matchUIContainer._matchTxt; // Ball physics ball.update(); player.update(); opponent.update(); // Player-ball collision var dx = ball.x - player.x; var dy = ball.y - player.y; var dist = Math.sqrt(dx * dx + dy * dy); if (dist < ball.radius + player.radius) { // Push ball away var angle = Math.atan2(dy, dx); var overlap = ball.radius + player.radius - dist + 1; ball.x += Math.cos(angle) * overlap; ball.y += Math.sin(angle) * overlap; // Give ball velocity ball.vx += Math.cos(angle) * player.speed * 0.7; ball.vy += Math.sin(angle) * player.speed * 0.7; } // Opponent AI: move toward ball var odx = ball.x - opponent.x; var ody = ball.y - opponent.y; var odist = Math.sqrt(odx * odx + ody * ody); if (odist > 1) { var oangle = Math.atan2(ody, odx); var ostep = Math.min(opponent.speed, odist); opponent.x += Math.cos(oangle) * ostep * 0.15; opponent.y += Math.sin(oangle) * ostep * 0.15; // Clamp to field if (opponent.x < -900 + opponent.radius) opponent.x = -900 + opponent.radius; if (opponent.x > 900 - opponent.radius) opponent.x = 900 - opponent.radius; if (opponent.y < -600 + opponent.radius) opponent.y = -600 + opponent.radius; if (opponent.y > 600 - opponent.radius) opponent.y = 600 - opponent.radius; } // Opponent-ball collision var odx2 = ball.x - opponent.x; var ody2 = ball.y - opponent.y; var odist2 = Math.sqrt(odx2 * odx2 + ody2 * ody2); if (odist2 < ball.radius + opponent.radius) { var oangle2 = Math.atan2(ody2, odx2); var overlap2 = ball.radius + opponent.radius - odist2 + 1; ball.x += Math.cos(oangle2) * overlap2; ball.y += Math.sin(oangle2) * overlap2; ball.vx += Math.cos(oangle2) * opponent.speed * 0.7; ball.vy += Math.sin(oangle2) * opponent.speed * 0.7; } // Goal detection // Left goal if (ball.x < -900 + ball.radius && Math.abs(ball.y) < 150) { // Opponent scores var score = matchUIContainer._opponentScore(); matchUIContainer._setOpponentScore(score + 1); matchTxt.setText("You: " + matchUIContainer._playerScore() + " - " + matchUIContainer._opponentScore() + " :Opponent"); // Check win condition if (matchUIContainer._opponentScore() >= 5) { // End match, show result LK.clearInterval(matchUIContainer._matchTimer); showResult(matchUIContainer._playerScore(), matchUIContainer._opponentScore()); return; } // Reset ball and players ball.x = 0; ball.y = 0; ball.vx = 0; ball.vy = 0; player.x = -400; player.y = 0; opponent.x = 400; opponent.y = 0; // Reset lastX/lastY to avoid false triggers after goal ball.lastX = ball.x; ball.lastY = ball.y; player.lastX = player.x; player.lastY = player.y; opponent.lastX = opponent.x; opponent.lastY = opponent.y; } // Right goal if (ball.x > 900 - ball.radius && Math.abs(ball.y) < 150) { // Player scores var score = matchUIContainer._playerScore(); matchUIContainer._setPlayerScore(score + 1); matchTxt.setText("You: " + matchUIContainer._playerScore() + " - " + matchUIContainer._opponentScore() + " :Opponent"); // Check win condition if (matchUIContainer._playerScore() >= 5) { // End match, show result LK.clearInterval(matchUIContainer._matchTimer); showResult(matchUIContainer._playerScore(), matchUIContainer._opponentScore()); return; } // Reset ball and players ball.x = 0; ball.y = 0; ball.vx = 0; ball.vy = 0; player.x = -400; player.y = 0; opponent.x = 400; opponent.y = 0; // Reset lastX/lastY to avoid false triggers after goal ball.lastX = ball.x; ball.lastY = ball.y; player.lastX = player.x; player.lastY = player.y; opponent.lastX = opponent.x; opponent.lastY = opponent.y; } };