/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); /**** * Classes ****/ // Ball class var Ball = Container.expand(function () { var self = Container.call(this); var ballSprite = self.attachAsset('ball', { anchorX: 0.5, anchorY: 0.5 }); // Ball physics self.vx = 0; self.vy = 0; self.radius = ballSprite.width / 2; // Used for bounce logic self.lastY = 0; self.lastX = 0; // Used to prevent multiple bounces in a single frame self.lastBounceTick = -100; // Used to track who last touched the ball self.lastTouch = null; // Ball update self.update = function () { // Gravity self.vy += 1.2; // gravity // Move self.x += self.vx; self.y += self.vy; // Friction (air) self.vx *= 0.995; self.vy *= 0.995; // Clamp speed if (self.vx > 40) self.vx = 40; if (self.vx < -40) self.vx = -40; if (self.vy > 60) self.vy = 60; if (self.vy < -60) self.vy = -60; // Table collision detection var tableLeft = 2048 / 2 - table.width / 2; var tableRight = 2048 / 2 + table.width / 2; var tableTop = groundLineY - table.height / 2; var tableBottom = groundLineY + table.height / 2; // Table curved top collision - check if ball is within table bounds first if (self.x > tableLeft && self.x < tableRight) { var tableY = tableTop + getTableCurveY(self.x); if (self.y + self.radius > tableY && self.lastY + self.radius <= tableY && LK.ticks - self.lastBounceTick > 5) { // Bounce off table top (curved surface) self.y = tableY - self.radius; // Calculate normal based on curve var normal = getTableNormal(self.x); var vDotN = self.vx * normal.x + self.vy * normal.y; self.vx = self.vx - 2 * vDotN * normal.x; self.vy = self.vy - 2 * vDotN * normal.y; // Dampen X as before self.vx *= 0.85; // Bounce up with power if (self.vy > 0) { self.vy = -Math.abs(self.vy) * 1.0; } else { self.vy = self.vy * 1.0; } self.lastBounceTick = LK.ticks; } } // Table left edge collision else if (self.x + self.radius > tableLeft && self.lastX + self.radius <= tableLeft && self.y > tableTop && self.y < tableBottom && LK.ticks - self.lastBounceTick > 5) { self.x = tableLeft - self.radius; self.vx = -Math.abs(self.vx) * 0.8; self.lastBounceTick = LK.ticks; } // Table right edge collision else if (self.x - self.radius < tableRight && self.lastX - self.radius >= tableRight && self.y > tableTop && self.y < tableBottom && LK.ticks - self.lastBounceTick > 5) { self.x = tableRight + self.radius; self.vx = Math.abs(self.vx) * 0.8; self.lastBounceTick = LK.ticks; } // Table bottom collision else if (self.y - self.radius < tableBottom && self.lastY - self.radius >= tableBottom && self.x > tableLeft && self.x < tableRight && LK.ticks - self.lastBounceTick > 5) { self.y = tableBottom + self.radius; self.vy = Math.abs(self.vy) * 0.8; self.lastBounceTick = LK.ticks; } // Floor (out of bounds) if (self.y > 2732 + 100) { // Score for the other side if (self.x < 2048 / 2) { // Left side missed, right scores scorePoint(2); } else { // Right side missed, left scores scorePoint(1); } } // Wall bounce if (self.x - self.radius < 0) { self.x = self.radius; self.vx = -self.vx * 0.7; } if (self.x + self.radius > 2048) { self.x = 2048 - self.radius; self.vx = -self.vx * 0.7; } self.lastY = self.y; self.lastX = self.x; }; return self; }); // Player class var Player = Container.expand(function () { var self = Container.call(this); // id: 1 (left, blue), 2 (right, red) self.id = 1; self.isAI = false; // Attach asset var assetId = 'player1'; self.sprite = self.attachAsset(assetId, { anchorX: 0.5, anchorY: 1.0 }); // Physics self.vx = 0; self.vy = 0; self.width = self.sprite.width; self.height = self.sprite.height; self.grounded = false; self.jumpCooldown = 0; self.kickCooldown = 0; self.lastKickTick = -100; // Control state self.moveLeft = false; self.moveRight = false; self.wantJump = false; self.wantKick = false; // For AI self.targetX = 0; // Update self.update = function () { // Movement var speed = 18; if (self.moveLeft) self.vx = -speed;else if (self.moveRight) self.vx = speed;else self.vx *= 0.7; // Clamp if (self.vx > speed) self.vx = speed; if (self.vx < -speed) self.vx = -speed; // Gravity self.vy += 2.0; // Move self.x += self.vx; self.y += self.vy; // Table collision (stand on table) var tableY = groundLineY - table.height / 2 + getTableCurveY(self.x); var feetY = self.y; if (feetY > tableY) { self.y = tableY; self.vy = 0; self.grounded = true; } else { self.grounded = false; } // Clamp to own side and prevent going on table var tableLeft = 2048 / 2 - table.width / 2; var tableRight = 2048 / 2 + table.width / 2; if (self.id === 1) { if (self.x < self.width / 2) self.x = self.width / 2; if (self.x > tableLeft - 10) self.x = tableLeft - 10; } if (self.id === 2) { if (self.x > 2048 - self.width / 2) self.x = 2048 - self.width / 2; if (self.x < tableRight + 10) self.x = tableRight + 10; } // Jump if (self.wantJump && self.grounded && self.jumpCooldown <= 0) { self.vy = -38; self.grounded = false; self.jumpCooldown = 30; } if (self.jumpCooldown > 0) self.jumpCooldown--; // Kick if (self.wantKick && self.kickCooldown <= 0 && LK.ticks - self.lastKickTick > 20) { // Try to kick if ball is close var dx = ball.x - self.x; var dy = ball.y - (self.y - self.height / 2); var dist = Math.sqrt(dx * dx + dy * dy); if (dist < 180 && Math.abs(dy) < 200) { // Kick direction: up and toward opponent var dirX = self.id === 1 ? 1 : -1; ball.vx = 22 * dirX + (Math.random() - 0.5) * 6; ball.vy = -32 + (Math.random() - 0.5) * 8; ball.lastTouch = self.id; self.lastKickTick = LK.ticks; self.kickCooldown = 25; // Animate kick (tint flash) LK.effects.flashObject(self, 0xffff00, 200); } } if (self.kickCooldown > 0) self.kickCooldown--; // AI logic if (self.isAI) { aiControl(self); } }; return self; }); /**** * Initialize Game ****/ /**** * Helper Functions ****/ // Table curve: returns Y offset for a given X (relative to table center) var game = new LK.Game({ backgroundColor: 0x1a1a1a }); /**** * Game Code ****/ // background asset // Table // Table (curved, green) // Ball (white) // Player 1 (blue) // Player 2 (red) /**** * Helper Functions ****/ // Table curve: returns Y offset for a given X (relative to table center) // Table curve: returns Y offset for a given X (relative to table center) // We'll use a cosine-based arc for a more realistic teqball table function getTableCurveY(x) { // Table center: 2048/2, table.y var relX = (x - 2048 / 2) / (table.width / 2); // -1 to 1 // Use a cosine arc: y = (1 - cos(pi * relX)) * h/2 // This gives a smooth, shallow arc with flat center and steeper edges var arcHeight = table.height * 0.22; // 22% of table height for a realistic arc return (1 - Math.cos(Math.PI * relX)) * (arcHeight / 2); } // Table normal: returns {x, y} normal vector at given X function getTableNormal(x) { // For y = (1 - cos(pi * relX)) * (arcHeight/2) // dy/dx = (pi * arcHeight / (2 * table.width)) * sin(pi * relX) var relX = (x - 2048 / 2) / (table.width / 2); // -1 to 1 var arcHeight = table.height * 0.22; var dYdX = Math.PI * arcHeight / (2 * table.width) * Math.sin(Math.PI * relX); // The tangent vector is (1, dYdX), so the normal is (-dYdX, 1) var nx = -dYdX; var ny = 1; var len = Math.sqrt(nx * nx + ny * ny); if (len === 0) return { x: 0, y: -1 }; return { x: nx / len, y: ny / len }; } // Score point for player (1 or 2) function scorePoint(playerId) { if (playerId === 1) { score1++; score1Txt.setText(score1); LK.effects.flashObject(player1, 0x00ff00, 400); } else { score2++; score2Txt.setText(score2); LK.effects.flashObject(player2, 0x00ff00, 400); } // Win condition: first to 5 if (score1 >= 5) { LK.showYouWin(); } else if (score2 >= 5) { LK.showGameOver(); } else { // Reset ball and players resetRound(); } } // Reset ball and players for next round function resetRound() { // Center ball ball.x = 2048 / 2; ball.y = groundLineY - table.height / 2 - 200; ball.vx = (Math.random() - 0.5) * 18; ball.vy = -22 + (Math.random() - 0.5) * 8; ball.lastTouch = null; ball.lastBounceTick = -100; // Reset players player1.x = 2048 / 6 - 222; player1.y = groundLineY - table.height / 2 + 555; if (typeof player2 !== "undefined" && player2 !== null) { player2.y = groundLineY - table.height / 2 + 555; } player1.vx = 0; player1.vy = 0; player1.moveLeft = false; player1.moveRight = false; player1.wantJump = false; player1.wantKick = false; player1.jumpCooldown = 0; player1.kickCooldown = 0; player2.x = 2048 * 5 / 6 + 222; player2.vx = 0; player2.vy = 0; player2.moveLeft = false; player2.moveRight = false; player2.wantJump = false; player2.wantKick = false; player2.jumpCooldown = 0; player2.kickCooldown = 0; } // AI control for player2 function aiControl(self) { // Only act if ball is on own side or coming toward AI var side = self.id === 2 ? 1 : -1; var ballOnSide = side === 1 ? ball.x > 2048 / 2 : ball.x < 2048 / 2; // Move toward ball if on own side or ball is coming if (ballOnSide || Math.abs(ball.x - self.x) < 400) { if (ball.x > self.x + 30) { self.moveLeft = false; self.moveRight = true; } else if (ball.x < self.x - 30) { self.moveLeft = true; self.moveRight = false; } else { self.moveLeft = false; self.moveRight = false; } // Jump if ball is above and close if (ball.y < self.y - 120 && Math.abs(ball.x - self.x) < 120 && self.grounded && Math.abs(ball.vy) > 8) { self.wantJump = true; } else { self.wantJump = false; } // Kick if ball is close if (Math.abs(ball.x - self.x) < 160 && Math.abs(ball.y - (self.y - self.height / 2)) < 180) { self.wantKick = true; } else { self.wantKick = false; } } else { self.moveLeft = false; self.moveRight = false; self.wantJump = false; self.wantKick = false; } } // Ground line base position (separate from table visual position) var groundLineY = 2046; // Original table position before the 300 unit move // Add background first so it's behind everything var background = LK.getAsset('background', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 2732 / 2 }); game.addChild(background); var table = LK.getAsset('table', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 1777 }); game.addChild(table); // Ball var ball = new Ball(); ball.x = 2048 / 2; ball.y = groundLineY - table.height / 2 - 200; game.addChild(ball); // Players var player1 = new Player(); player1.id = 1; player1.sprite.tint = 0x2980d9; player1.x = 2048 / 6 - 222; player1.y = groundLineY - table.height / 2 + 555; game.addChild(player1); var player2 = new Player(); player2.y = groundLineY - table.height / 2 + 555; player2.id = 2; player2.sprite.tint = 0xe74c3c; player2.x = 2048 * 5 / 6 + 222; player2.isAI = true; game.addChild(player2); // Scores var score1 = 0; var score2 = 0; var score1Txt = new Text2('0', { size: 120, fill: 0x2980D9 }); var score2Txt = new Text2('0', { size: 120, fill: 0xE74C3C }); score1Txt.anchor.set(1, 0); score2Txt.anchor.set(0, 0); LK.gui.top.addChild(score1Txt); LK.gui.top.addChild(score2Txt); score1Txt.x = LK.gui.top.width / 2 - 40; score2Txt.x = LK.gui.top.width / 2 + 40; score1Txt.y = 10; score2Txt.y = 10; // Touch controls // Touch zones: left, right, jump, kick var touchZone = { left: { x: 0, y: 2200, w: 400, h: 532 }, right: { x: 400, y: 2200, w: 400, h: 532 }, jump: { x: 2048 - 800, y: 2200, w: 400, h: 532 }, kick: { x: 2048 - 400, y: 2200, w: 400, h: 532 } }; // Draw touch zones (invisible, but for debugging you can add rectangles) // (Not adding any visible elements as per guidelines) // Touch state var touchState = { left: false, right: false, jump: false, kick: false }; // Helper: check if point is in zone function inZone(x, y, zone) { return x >= zone.x && x < zone.x + zone.w && y >= zone.y && y < zone.y + zone.h; } // Drag state for player1 var draggingPlayer1 = false; var dragOffsetX = 0; var dragOffsetY = 0; // Touch/move handlers game.down = function (x, y, obj) { // Check if touch is on player1 (allow some margin for finger size) var px = player1.x; var py = player1.y; var margin = 120; if (x >= px - player1.width / 2 - margin && x <= px + player1.width / 2 + margin && y >= py - player1.height - margin && y <= py + margin) { draggingPlayer1 = true; dragOffsetX = x - player1.x; dragOffsetY = y - player1.y; // Disable all touch controls while dragging touchState.left = false; touchState.right = false; touchState.jump = false; touchState.kick = false; updatePlayer1Controls(); return; } // Only allow on right side of screen (avoid top left menu) if (inZone(x, y, touchZone.left)) touchState.left = true; if (inZone(x, y, touchZone.right)) touchState.right = true; if (inZone(x, y, touchZone.jump)) touchState.jump = true; if (inZone(x, y, touchZone.kick)) touchState.kick = true; updatePlayer1Controls(); }; game.move = function (x, y, obj) { if (draggingPlayer1) { // Move player1 directly with drag, clamp to own side var newX = x - dragOffsetX; var newY = y - dragOffsetY; // Clamp X to left half var minX = player1.width / 2; var maxX = 2048 / 2 - 60; if (newX < minX) newX = minX; if (newX > maxX) newX = maxX; // Clamp Y to table surface var tableY = groundLineY - table.height / 2 + getTableCurveY(newX); var maxY = tableY; var minY = tableY - 600; // allow some jump height if (newY > maxY) newY = maxY; if (newY < minY) newY = minY; player1.x = newX; player1.y = newY; // While dragging, disable all touch controls touchState.left = false; touchState.right = false; touchState.jump = false; touchState.kick = false; updatePlayer1Controls(); return; } // Reset all touchState.left = false; touchState.right = false; touchState.jump = false; touchState.kick = false; // Multi-touch: check all touches var touches = []; if (obj && obj.event && obj.event.touches) { for (var i = 0; i < obj.event.touches.length; i++) { var tx = obj.event.touches[i].x; var ty = obj.event.touches[i].y; touches.push({ x: tx, y: ty }); } } else { touches.push({ x: x, y: y }); } for (var i = 0; i < touches.length; i++) { var tx = touches[i].x, ty = touches[i].y; if (inZone(tx, ty, touchZone.left)) touchState.left = true; if (inZone(tx, ty, touchZone.right)) touchState.right = true; if (inZone(tx, ty, touchZone.jump)) touchState.jump = true; if (inZone(tx, ty, touchZone.kick)) touchState.kick = true; } updatePlayer1Controls(); }; game.up = function (x, y, obj) { if (draggingPlayer1) { draggingPlayer1 = false; // On release, keep player1 at current position // No need to update controls, as drag disables them return; } // On up, clear all touchState.left = false; touchState.right = false; touchState.jump = false; touchState.kick = false; updatePlayer1Controls(); }; // Update player1 controls from touchState function updatePlayer1Controls() { player1.moveLeft = touchState.left; player1.moveRight = touchState.right; player1.wantJump = touchState.jump; player1.wantKick = touchState.kick; } // Main update loop game.update = function () { // Update all player1.update(); player2.update(); ball.update(); // Ball-player collision (kick or head) for (var i = 0; i < 2; i++) { var p = i === 0 ? player1 : player2; var px = p.x; var py = p.y - p.height / 2; var dx = ball.x - px; var dy = ball.y - py; var dist = Math.sqrt(dx * dx + dy * dy); if (dist < 100) { // If ball is moving toward player, bounce away var nx = dx / (dist || 1); var ny = dy / (dist || 1); var vDotN = ball.vx * nx + ball.vy * ny; if (vDotN < 0) { ball.vx -= nx * vDotN * 1.5; ball.vy -= ny * vDotN * 1.5; ball.lastTouch = p.id; } } } }; // Reset round at start resetRound();