Upit | Learn about creating the game Soccer Survival with gen AI

var BlockedFollower = Container.expand(function (enemy) {
	var self = Container.call(this);
	var blockedGraphics = self.createAsset('blocked', 'Blocked asset', 0.5, 0.5);
	self.enemy = enemy;
	self.followDuration = 500;
	self.followStartTime = LK.ticks;
	self.move = function () {
		self.x = self.enemy.x;
		self.y = self.enemy.y;
		LK.setTimeout(function () {
			if (self.parent) {
				self.move();
			}
		}, LK.tickDuration);
	};
});
var Star = Container.expand(function () {
	var self = Container.call(this);
	var starGraphics = self.createAsset('star', 'Star asset', .5, .5);
	self.move = function () {
		this.x += 4;
	};
});
var WaveMessage = Container.expand(function (waveIndex) {
	var self = Container.call(this);
	var messageImage = self.createAsset('wave' + waveIndex, 'Wave ' + (waveIndex + 1) + ' Image', .5, .5);
	self.addChild(messageImage);
	this.setMessage = function (customMessage) {
		var messageText = new Text2(customMessage, {
			size: 50,
			fill: "#ffffff",
			stroke: '#000000',
			strokeThickness: 5
		});
		messageText.anchor.set(0, .5);
		messageText.x = messageImage.width / 1.5;
		messageText.y = messageImage.height * 0.1;
		self.addChild(messageText);
	};
});
var SpatialGrid = Container.expand(function (cellSize) {
	var self = Container.call(this);
	self.cellSize = cellSize;
	self.grid = {};
	self._cellKey = function (x, y) {
		var cellX = Math.floor(x / self.cellSize);
		var cellY = Math.floor(y / self.cellSize);
		return cellX + ':' + cellY;
	};
	self.insert = function (object) {
		var key = self._cellKey(object.x, object.y);
		if (!self.grid[key]) {
			self.grid[key] = [];
		}
		self.grid[key].push(object);
	};
	self.retrieve = function (x, y) {
		var key = self._cellKey(x, y);
		return self.grid[key] || [];
	};
	self.clear = function () {
		self.grid = {};
	};
});
var Hero = Container.expand(function () {
	var self = Container.call(this);
	var heroGraphics = self.createAsset('hero', 'Hero character', .5, .5);
	self.targetPosition = null;
	self.setTargetPosition = function (x, y) {
		self.targetPosition = {
			x: x,
			y: Math.max(y, 250)
		};
	};
	self.move = function () {
		if (self.targetPosition) {
			var dx = self.targetPosition.x - this.x;
			var dy = self.targetPosition.y - this.y;
			var magnitude = Math.sqrt(dx * dx + dy * dy);
			if (magnitude > 5) {
				this.x += dx / magnitude * 10;
				this.y += dy / magnitude * 10;
			} else {
				this.x = self.targetPosition.x;
				this.y = self.targetPosition.y;
				self.targetPosition = null;
			}
		}
	};
	self.shoot = function () {};
});
var EnemyWave0 = Container.expand(function (enemyCount) {
	var self = Container.call(this);
	self.enemyCount = 1;
	var enemyGraphics = self.createAsset('enemyWave0', 'Enemy Wave 0 character', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		var speed = 3 + enemySpeedIncrease;
		var newX = this.x + dx / magnitude * speed;
		var newY = this.y + dy / magnitude * speed;
		var minX = 600, maxX = 1500, minY = 100, maxY = 200;
		newX = Math.max(minX, Math.min(newX, maxX));
		newY = Math.max(minY, Math.min(newY, maxY));
		this.x = newX;
		this.y = newY;
	};
});
var EnemyWave1 = Container.expand(function (enemyCount) {
	var self = Container.call(this);
	self.enemyCount = 10;
	var enemyGraphics = self.createAsset('enemyWave1', 'Enemy Wave 1 character', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		var speed = 2.5 + enemySpeedIncrease;
		this.x += dx / magnitude * speed;
		this.y += dy / magnitude * speed;
	};
});
var EnemyWave2 = Container.expand(function (enemyCount) {
	var self = Container.call(this);
	self.enemyCount = 5;
	var enemyGraphics = self.createAsset('enemyWave2', 'Enemy Wave 2 character', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		var speed = 2 + enemySpeedIncrease;
		this.x += dx / magnitude * speed;
		this.y += dy / magnitude * speed;
	};
});
var EnemyWave3 = Container.expand(function (enemyCount) {
	var self = Container.call(this);
	self.enemyCount = 6;
	var enemyGraphics = self.createAsset('enemyWave3', 'Enemy Wave 3 character', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		var speed = 4 + enemySpeedIncrease;
		this.x += dx / magnitude * speed;
		this.y += dy / magnitude * speed;
	};
});
var EnemyWave4 = Container.expand(function (enemyCount) {
	var self = Container.call(this);
	self.enemyCount = 15;
	var enemyGraphics = self.createAsset('enemyWave4', 'Enemy Wave 4 character', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		var speed = 3 + enemySpeedIncrease;
		this.x += dx / magnitude * speed;
		this.y += dy / magnitude * speed;
	};
});
var EnemyWave5 = Container.expand(function (enemyCount) {
	var self = Container.call(this);
	self.enemyCount = 1;
	var enemyGraphics = self.createAsset('enemyWave5', 'Enemy Wave 5 character', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		var speed = 7 + enemySpeedIncrease;
		this.x += dx / magnitude * speed;
		this.y += dy / magnitude * speed;
	};
});
var HeroBullet = Container.expand(function () {
	var self = Container.call(this);
	var bulletGraphics = self.createAsset('heroBullet', 'Hero Bullet', .5, .5);
	self.move = function (goalX, goalY) {
		var dx = goalX - this.x;
		var dy = goalY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		this.x += dx / magnitude * 5;
		this.y += dy / magnitude * 5;
	};
});
var EnemyBullet = Container.expand(function () {
	var self = Container.call(this);
	var bulletGraphics = self.createAsset('enemyBullet', 'Enemy Bullet', .5, .5);
	self.move = function (heroX, heroY) {
		var dx = heroX - this.x;
		var dy = heroY - this.y;
		var magnitude = Math.sqrt(dx * dx + dy * dy);
		this.x += dx / magnitude * 2;
		this.y += dy / magnitude * 2;
	};
});
var enemySpeedIncrease = 0;
var Game = Container.expand(function () {
	var self = Container.call(this);
	stage.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		hero.setTargetPosition(pos.x, pos.y);
	});
	var background = self.createAsset('background', 'Game Background', 0, 0);
	background.width = 2048;
	background.height = 2532;
	background.y = 200;
	self.addChild(background);
	var centerLine = self.createAsset('whiteLine', 'Center Line', 0, 0);
	centerLine.width = 2048;
	centerLine.height = 10;
	centerLine.y = 2732 / 2;
	self.addChild(centerLine);
	var centerCircle = self.createAsset('centerCircle', 'Center Circle', 0.5, 0.5);
	centerCircle.width = 100;
	centerCircle.height = 100;
	centerCircle.x = 2048 / 2;
	centerCircle.y = centerLine.y;
	self.addChild(centerCircle);
	var topArea = LK.getAsset('topArea', 'Top Area', 0, 0);
	topArea.width = 2048;
	topArea.height = 200;
	self.addChild(topArea);
	var horizontalLine = LK.getAsset('horizontalLine', 'Horizontal Line', 0, 0);
	horizontalLine.width = 2048;
	horizontalLine.height = 10;
	horizontalLine.y = 200;
	self.addChild(horizontalLine);
	self.getEnemyCountForWave = function (waveIndex) {
		switch (waveIndex % 6) {
			case 0:
				return 1;
			case 1:
				return 10;
			case 2:
				return 5;
			case 3:
				return 6;
			case 4:
				return 15;
			case 5:
				return 1;
		}
	};
	var goal = self.createAsset('goal', 'Goal asset', 0.5, 0.5);
	goal.width = 1100;
	goal.height = 200;
	goal.x = 2048 / 2;
	goal.y = goal.height / 2;
	self.addChild(goal);
	var hero = self.addChild(new Hero());
	var score = 0;
	var scoreIcon = LK.getAsset('scoreIcon', 'Score Icon', 0, 0);
	scoreIcon.x = 50;
	scoreIcon.y = 20;
	LK.gui.addChild(scoreIcon);
	var scoreTxt = new Text2(score.toString(), {
		size: 150,
		fill: "#ffffff",
		font: "rixel",
		dropShadow: true,
		dropShadowColor: "#666666",
		dropShadowBlur: 4,
		dropShadowAngle: Math.PI / 6,
		dropShadowDistance: 6
	});
	scoreTxt.anchor.set(0, 0.5);
	scoreTxt.x = scoreIcon.x + scoreIcon.width + 10;
	scoreTxt.y = scoreIcon.y + scoreIcon.height / 2 + 5;
	LK.gui.addChild(scoreTxt);
	var enemies = [];
	var waveIndex = 0;
	var maxWaveCount = 6;
	var waveTimer = 1000;
	var waveInterval = 1000;
	var heroBullets = [];
	self.messageTimeouts = [];
	var enemyBullets = [];
	hero.x = 2048 / 2;
	hero.y = 2732 - 700;
	var bulletTimer = 0;
	var bulletInterval = 100;
	LK.on('tick', function () {
		hero.move();
		bulletTimer++;
		if (bulletTimer >= bulletInterval) {
			var newBullet = new HeroBullet();
			newBullet.x = hero.x;
			newBullet.y = hero.y;
			heroBullets.push(newBullet);
			self.addChild(newBullet);
			bulletTimer = 0;
		}
		if (waveIndex < maxWaveCount) {
			waveTimer++;
		}
		if (waveTimer >= waveInterval && waveIndex < maxWaveCount) {
			var waveMessages = ['Its kick off time! Youve got this Lio!', 'EMPTY', 'Watch it, some fans got through!', 'End of match, time to handle the press!', 'Wow, hooligans are getting wild, watch out!', 'I Will Stop you. SIIIUU!'];
			var waveMessage = new WaveMessage(waveIndex);
			waveMessage.setMessage(waveMessages[waveIndex % waveMessages.length]);
			switch (waveIndex % 6) {
				case 0:
					waveMessage.x = 150;
					waveMessage.y = 1700;
					break;
				case 1:
					waveMessage.x = 150;
					waveMessage.y = 1700;
					break;
				case 2:
					waveMessage.x = 150;
					waveMessage.y = 1700;
					break;
				case 3:
					waveMessage.x = 150;
					waveMessage.y = 1700;
					break;
				case 4:
					waveMessage.x = 150;
					waveMessage.y = 1700;
					break;
				case 5:
					waveMessage.x = 150;
					waveMessage.y = 1700;
					break;
			}
			LK.gui.addChild(waveMessage);
			var messageTimeout = LK.setTimeout(function () {
				LK.gui.removeChild(waveMessage);
				waveMessage.destroy();
			}, 4000);
			self.messageTimeouts.push(messageTimeout);
			if (waveIndex == 0) {
				for (var i = 0; i < self.getEnemyCountForWave(waveIndex); i++) {
					var newEnemy = new EnemyWave0(self.getEnemyCountForWave(waveIndex));
					newEnemy.x = 1000;
					newEnemy.y = 300;
					enemies.push(newEnemy);
					self.addChild(newEnemy);
				}
				for (var i = 0; i < self.getEnemyCountForWave(waveIndex + 1); i++) {
					var newEnemy = new EnemyWave1(self.getEnemyCountForWave(waveIndex + 1));
					newEnemy.x = Math.random() * 2048;
					newEnemy.y = 300;
					enemies.push(newEnemy);
					self.addChild(newEnemy);
				}
				waveIndex += 2;
			} else {
				for (var i = 0; i < self.getEnemyCountForWave(waveIndex); i++) {
					var newEnemy;
					var enemyCount = self.getEnemyCountForWave(waveIndex);
					switch (waveIndex % 6) {
						case 0:
							newEnemy = new EnemyWave0(enemyCount);
							newEnemy.x = 1000;
							newEnemy.y = 0;
							break;
						case 1:
							newEnemy = new EnemyWave1(enemyCount);
							newEnemy.x = Math.random() * 2048;
							newEnemy.y = 0;
							break;
						case 2:
							newEnemy = new EnemyWave2(enemyCount);
							newEnemy.x = Math.random() * 2048;
							newEnemy.y = 2732;
							break;
						case 3:
							newEnemy = new EnemyWave3(enemyCount);
							newEnemy.x = 2048;
							newEnemy.y = Math.random() * 2732;
							break;
						case 4:
							newEnemy = new EnemyWave4(enemyCount);
							newEnemy.x = 0;
							newEnemy.y = Math.random() * 2732;
							break;
						case 5:
							newEnemy = new EnemyWave5(enemyCount);
							newEnemy.x = 1000;
							newEnemy.y = 2732;
							break;
					}
					enemies.push(newEnemy);
					self.addChild(newEnemy);
				}
				waveIndex++;
			}
			waveTimer = 0;
		}
		var spatialGrid = new SpatialGrid(100);
		for (var i = 0; i < enemies.length; i++) {
			spatialGrid.insert(enemies[i]);
		}
		for (var i = 0; i < enemies.length; i++) {
			var enemy = enemies[i];
			var nearbyEnemies = spatialGrid.retrieve(enemy.x, enemy.y);
			enemy.move(hero.x, hero.y);
			if (enemy.intersects(hero)) {
				self.messageTimeouts.forEach(function (timeout) {
					LK.clearTimeout(timeout);
				});
				LK.showGameOver();
				return;
			}
			for (var j = 0; j < nearbyEnemies.length; j++) {
				var otherEnemy = nearbyEnemies[j];
				if (otherEnemy !== enemy && enemy.intersects(otherEnemy)) {
					var overlapX = enemy.x - otherEnemy.x;
					var overlapY = enemy.y - otherEnemy.y;
					var overlapMagnitude = Math.sqrt(overlapX * overlapX + overlapY * overlapY);
					var separationDistance = 100;
					for (var j = 0; j < nearbyEnemies.length; j++) {
						var otherEnemy = nearbyEnemies[j];
						if (otherEnemy !== enemy && enemy.intersects(otherEnemy)) {
							var overlapX = enemy.x - otherEnemy.x;
							var overlapY = enemy.y - otherEnemy.y;
							var overlapMagnitude = Math.sqrt(overlapX * overlapX + overlapY * overlapY);
							if (overlapMagnitude < separationDistance) {
								var separationFactor = (separationDistance - overlapMagnitude) / overlapMagnitude;
								enemy.x += overlapX / overlapMagnitude * separationFactor;
								enemy.y += overlapY / overlapMagnitude * separationFactor;
								otherEnemy.x -= overlapX / overlapMagnitude * separationFactor;
								otherEnemy.y -= overlapY / overlapMagnitude * separationFactor;
							}
						}
					}
				}
			}
		}
		spatialGrid.clear();
		for (var i = heroBullets.length - 1; i >= 0; i--) {
			heroBullets[i].move(goal.x, goal.y);
			if (heroBullets[i].intersects(goal)) {
				var successAsset = self.createAsset('success', 'Success Asset', .5, .5);
				var dx = goal.x - heroBullets[i].x;
				var dy = goal.y - heroBullets[i].y;
				var magnitude = Math.sqrt(dx * dx + dy * dy);
				successAsset.x = heroBullets[i].x + dx / magnitude * 75;
				successAsset.y = heroBullets[i].y + dy / magnitude * 75;
				self.addChild(successAsset);
				LK.setTimeout(function () {
					successAsset.destroy();
				}, 1000);
				heroBullets[i].destroy();
				heroBullets.splice(i, 1);
				score++;
				enemySpeedIncrease += 0.1;
				scoreTxt.setText(score.toString());
				continue;
			}
			for (var j = 0; j < enemies.length; j++) {
				if (heroBullets[i] && heroBullets[i].intersects(enemies[j])) {
					var blockedFollower = new BlockedFollower(enemies[j]);
					self.addChild(blockedFollower);
					blockedFollower.move();
					LK.setTimeout(function () {
						blockedFollower.destroy();
					}, 500);
					heroBullets[i].destroy();
					heroBullets.splice(i, 1);
					break;
				}
			}
		}
		for (var i = 0; i < enemyBullets.length; i++) {
			enemyBullets[i].move();
		}
	});
});
Creation History

Images
