Upit | Learn about creating the game Idle Snowflakes with gen AI

var Grid = Container.expand(function (gridWidth, gridHeight, x, y, horizontalPadding, verticalPadding) {
	var self = Container.call(this);
	self.clearGrid = function () {
		for (var i = 0; i < self.grid.length; i++) {
			for (var j = 0; j < self.grid[i].length; j++) {
				if (self.grid[i][j]) {
					self.grid[i][j].destroy();
					self.grid[i][j] = null;
				}
			}
		}
	};
	self.grid = [];
	self.setupGrid = function (labels) {
		for (var i = 0; i < gridWidth; i++) {
			self.grid[i] = [];
			for (var j = 0; j < gridHeight; j++) {
				if (j * gridWidth + i < labels.length) {
					var cell = new GridCell();
					cell.x = i * (cell.width + horizontalPadding) + x + cell.width / 2;
					cell.y = j * (cell.height + verticalPadding) + y + cell.height / 2;
					cell.label = labels[j * gridWidth + i];
					self.grid[i][j] = cell;
					self.addChild(cell);
				}
			}
		}
	};
});
var GridCell = Container.expand(function (label) {
	var self = Container.call(this);
	var cellGraphics = self.createAsset('cell', 'Grid Cell', .5, .5);
	self.state = 'empty';
	self.label = label;
	var labelTxt = new Text2(label, {
		size: 50,
		fill: '#ffffff'
	});
	labelTxt.anchor.set(.5, .5);
	self.addChild(labelTxt);
	cellGraphics.tint = 0xFFFFFF;
	self.addChild(cellGraphics);
	self.addChild(labelTxt);
});
var Upgrade = Container.expand(function (cost, effectType, effectMode, effectValue, available) {
	var self = Container.call(this);
	self.available = available || false;
	self.purchased = false;
	var self = Container.call(this);
	self.available = false;
	self.purchased = false;
	var upgradeGraphics = self.createAsset('upgrade', 'Upgrade Graphics', .5, .5);
	var costText = new Text2('Cost: ' + (cost < 10000 ? Math.round(cost) : cost.toPrecision(2)), {
		size: 35,
		fill: '#ffffff',
		anchor: {
			x: 0.5,
			y: 0.5
		}
	});
	costText.y = -35;
	costText.x = -costText.width / 2;
	self.addChild(costText);
	var effectDescription = effectType === 'click' ? 'Per Click: ' : 'Per Second: ';
	effectDescription += effectMode === 'add' ? '+' : 'x';
	effectDescription += effectValue !== undefined ? effectValue.toString() : '0';
	var effectText = new Text2(effectDescription, {
		size: 35,
		fill: '#ffffff',
		anchor: {
			x: 0.5,
			y: 0.5
		}
	});
	effectText.y = 35;
	effectText.x = -effectText.width / 2;
	self.addChild(effectText);
	self.cost = cost;
	self.effectType = effectType;
	self.effectMode = effectMode;
	self.effectValue = effectValue;
	self.purchased = false;
	self.on('down', function () {
		var gameInstance = self.parent.parent.parent;
		if (!self.purchased && gameInstance.getScore() >= self.cost) {
			gameInstance.setScore(gameInstance.getScore() - self.cost);
			if (self.effectType === 'click') {
				if (self.effectMode === 'add') {
					cloud.clickValue += self.effectValue;
				} else {
					cloud.clickValue *= self.effectValue;
				}
			} else {
				if (self.effectMode === 'add') {
					self.parent.parent.parent.setScorePerSec(self.parent.parent.parent.getScorePerSec() + self.effectValue);
				} else if (self.effectMode === 'multiply') {
					self.parent.parent.parent.setScorePerSec(self.parent.parent.parent.getScorePerSec() * self.effectValue);
				}
			}
			self.purchased = true;
			self.removeChild(self);
			self.parent.children.forEach(function (upgrade, index) {
				if (upgrade.purchased) {
					self.parent.removeChild(upgrade);
				} else if (index > 0) {
					upgrade.y -= 150;
				}
			});
		}
	});
});
var TabButton = Container.expand(function (label, onClick) {
	var self = Container.call(this);
	var buttonGraphics = self.createAsset('tabButton', 'Tab Button Graphics', 0, 0.5);
	buttonGraphics.tint = 0x777777;
	var buttonText = new Text2(label, {
		size: 50,
		fill: '#ffffff',
		anchor: {
			x: 0.5,
			y: 0.5
		},
		align: 'center'
	});
	self.addChild(buttonText);
	self.on('down', function () {
		onClick();
	});
});
var TabSystem = Container.expand(function () {
	var self = Container.call(this);
	self.tabs = {};
	self.currentTab = '';
	self.addTab = function (name, content) {
		self.tabs[name] = content;
		content.visible = false;
		self.addChild(content);
	};
	self.switchTab = function (name) {
		if (self.tabs[self.currentTab]) {
			self.tabs[self.currentTab].visible = false;
			self.tabs[self.currentTab].children.forEach(function (child) {
				child.visible = false;
			});
		}
		self.currentTab = name;
		self.tabs[name].visible = true;
		self.tabs[name].children.forEach(function (child) {
			child.visible = true;
			if (child instanceof TabButton) {
				child.children[0].tint = 0xFFFFFF;
			}
		});
		if (name === 'Upgrades') {
			var labels = upgradesConfig.map(function (upgrade) {
				return 'Cost: ' + upgrade.cost;
			}).slice(0, 15);
			grid.clearGrid();
			grid.setupGrid(labels);
		}
		Object.values(self.tabs).forEach(function (content) {
			if (content !== self.tabs[name]) {
				content.children.forEach(function (child) {
					if (child instanceof TabButton) {
						child.children[0].tint = 0x777777;
					}
				});
			}
		});
	};
});
var Snowflake = Container.expand(function () {
	var self = Container.call(this);
	var snowflakeGraphics = self.createAsset('snowflake', 'Snowflake Graphics', .5, .5);
	self.rotationSpeed = (Math.random() - 0.5) * 0.02;
	self.swayMagnitude = Math.random() * 10;
	self.swaySpeed = (Math.random() - 0.5) * 0.03;
	self.sizeFactor = Math.random() * 0.75 + 0.25;
	self.scale.set(self.sizeFactor);
	self.swayMagnitude = self.sizeFactor * 5;
	self.swayOffset = Math.random() * Math.PI * 2;
	self.update = function () {
		self.y += 0.5 + Math.random();
		self.rotation += self.rotationSpeed;
		self.x += Math.sin(LK.ticks * self.swaySpeed * 2 + self.swayOffset) * (self.swayMagnitude * 0.25);
	};
	self.collect = function () {
		var gameInstance = self.parent;
		gameInstance.setScore(Math.round(gameInstance.getScore() + 1));
		scoreTxt.setText(gameInstance.getScore().toString());
		self.destroy();
	};
});
var Cloud = Container.expand(function () {
	var self = Container.call(this);
	self.visible = true;
	var cloudGraphics = self.createAsset('cloud', 'Cloud Graphics', .5, .5);
	cloudGraphics.alpha = 1;
	self.spawnRate = 1;
	self.clickValue = 1;
	self.bounceSpeed = 0.02;
	self.bounceHeight = 15;
	self.bounceOffset = 0;
	self.swayWidth = 300;
	self.swaySpeed = .003;
	self.update = function () {
		self.bounceOffset += self.bounceSpeed;
		self.y = 2732 / 2 + Math.sin(self.bounceOffset) * self.bounceHeight;
		self.x = 1024 + Math.sin(LK.ticks * self.swaySpeed) * self.swayWidth;
	};
	self.spawnSnowflake = function () {
		var snowflake = new Snowflake();
		var cloudWidth = cloudGraphics.width;
		snowflake.x = this.x + (Math.random() - 0.5) * 800;
		snowflake.y = self.y + cloudGraphics.height / 2 + Math.sin(self.bounceOffset) * self.bounceHeight;
		snowflake.rotation = Math.random() * Math.PI * 2;
		return snowflake;
	};
});
var Game = Container.expand(function () {
	var self = Container.call(this);
	self._score = 0;
	self._scorePerSec = 0;
	self.getScore = function () {
		return self._score;
	};
	self.setScore = function (value) {
		self._score = value;
	};
	self.getScorePerSec = function () {
		return self._scorePerSec;
	};
	self.setScorePerSec = function (value) {
		self._scorePerSec = value;
	};
	LK.stageContainer.setBackgroundColor(0x000000);
	var tabSystem = new TabSystem();
	var upgradesTab = new Container();
	var upgradesConfig = [{
		cost: 10,
		effectType: 'perSecond',
		effectMode: 'add',
		effectValue: 1
	}, {
		cost: 25,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}, {
		cost: 100,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}, {
		cost: 500,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}, {
		cost: 1000,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}, {
		cost: 2500,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}, {
		cost: 10000,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}, {
		cost: 20000,
		effectType: 'perSecond',
		effectMode: 'multiply',
		effectValue: 2
	}];
	var columns = 3;
	var upgradeWidth = 400;
	var upgradeHeight = 200;
	var upgradeSpacing = 200;
	var upgradePadding = 200;
	var startX = 0 - upgradeWidth / 2;
	var startY = 800;
	var scoreTxt;
	function initializeScoreText() {
		scoreTxt = new Text2('', {
			size: 150,
			fill: '#ffffff',
			anchor: {
				x: 0.5,
				y: 0.5
			}
		});
		scoreTxt.x = -scoreTxt.width / 2;
		LK.gui.topCenter.addChild(scoreTxt);
		scoreTxt.y = LK.gui.topCenter.height / 2;
	}
	initializeScoreText();
	var grid = new Grid(3, 5, 50, 400, 25, 25);
	var labels = upgradesConfig.map(function (upgrade) {
		return 'Cost: ' + upgrade.cost;
	}).slice(0, 15);
	grid.setupGrid(labels);
	var cloudTabButton = new TabButton('Cloud', function () {
		tabSystem.switchTab('Cloud');
	});
	var upgradesTabButton = new TabButton('Upgrades', function () {
		tabSystem.switchTab('Upgrades');
	});
	cloudTabButton.x = -cloudTabButton.width;
	cloudTabButton.y = scoreTxt.y + scoreTxt.height + 50;
	upgradesTabButton.x = 10;
	upgradesTabButton.y = cloudTabButton.y;
	LK.gui.topCenter.addChild(cloudTabButton);
	LK.gui.topCenter.addChild(upgradesTabButton);
	self.addChild(tabSystem);
	var snowflakes = [];
	var cloudTab = new Container();
	var cloud = cloudTab.addChild(new Cloud());
	cloud.x = 2048 / 2;
	cloud.y = 2732 / 2;
	tabSystem.addTab('Upgrades', upgradesTab);
	tabSystem.addTab('Cloud', cloudTab);
	tabSystem.switchTab('Cloud');
	cloud.on('down', function (obj) {
		for (var i = 0; i < cloud.spawnRate; i++) {
			var snowflake = cloud.spawnSnowflake();
			snowflakes.push(snowflake);
			self.addChild(snowflake);
		}
		self.setScore(self.getScore() + cloud.clickValue);
		console.log('Score per click:', cloud.clickValue);
	});
	var tickCount = 0;
	LK.on('tick', function () {
		console.log('Current score:', self.getScore(), 'Score per second:', self.getScorePerSec(), 'Score per tick:', self.getScorePerSec() / 60, 'New score after tick:', self.getScore() + self.getScorePerSec() / 60);
		self.setScore(self.getScore() + self.getScorePerSec() / 60);
		tickCount++;
		scoreTxt.setText(Math.round(self.getScore()).toString());
		cloud.update();
		for (var i = snowflakes.length - 1; i >= 0; i--) {
			snowflakes[i].update();
			if (snowflakes[i].y > 2732 + snowflakes[i].height) {
				snowflakes[i].destroy();
				snowflakes.splice(i, 1);
			}
		}
		scoreTxt.setText(Math.round(self.getScore()).toString());
	});
});
Images
