/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); /**** * Classes ****/ // PathPreview: shows the path as the user draws var PathPreview = Container.expand(function () { var self = Container.call(this); self.dots = []; self.setPath = function (path) { // Remove old dots for (var i = 0; i < self.dots.length; i++) { self.dots[i].destroy(); } self.dots = []; // Add new dots for (var j = 0; j < path.length; j += 2) { // skip every other for performance var dot = self.attachAsset('pathDot', { anchorX: 0.5, anchorY: 0.5, x: path[j].x, y: path[j].y, alpha: 0.5 }); self.dots.push(dot); } }; self.clear = function () { for (var i = 0; i < self.dots.length; i++) { self.dots[i].destroy(); } self.dots = []; }; return self; }); // Plant: has a pot, stem, and flower. Grows when watered. var Plant = Container.expand(function () { var self = Container.call(this); // Pot var pot = self.attachAsset('plantPot', { anchorX: 0.5, anchorY: 1 }); pot.y = 0; // Stem var stem = self.attachAsset('plantStem', { anchorX: 0.5, anchorY: 1 }); stem.y = -pot.height + 10; // Flower (starts small, grows) var flower = self.attachAsset('plantFlower', { anchorX: 0.5, anchorY: 0.5, scaleX: 0.2, scaleY: 0.2, alpha: 0.7 }); flower.y = stem.y - stem.height + 30; self.growth = 0; // 0 to 1 // Called when watered self.water = function () { if (self.growth < 1) { self.growth += 0.25; if (self.growth > 1) self.growth = 1; // Animate flower growth tween(flower, { scaleX: 0.2 + 0.8 * self.growth, scaleY: 0.2 + 0.8 * self.growth, alpha: 0.7 + 0.3 * self.growth }, { duration: 600, easing: tween.easeOut }); // Animate stem color (greener as it grows) tween(stem, { tint: 0x388e3c + Math.floor(0x007700 * self.growth) }, { duration: 600, easing: tween.linear }); } }; // For intersection, treat the flower as the main hit area self.intersects = function (obj) { return flower.intersects(obj); }; return self; }); // WaterDrop: follows a path of points, moves smoothly, and waters a plant if it reaches it var WaterDrop = Container.expand(function () { var self = Container.call(this); var drop = self.attachAsset('waterDrop', { anchorX: 0.5, anchorY: 0.5 }); self.path = []; // Array of {x, y} self.pathIndex = 0; self.speed = 8; // pixels per frame self.targetPlant = null; self.active = true; // Set path and target self.setPath = function (path, plant) { self.path = path; self.pathIndex = 0; self.targetPlant = plant; if (self.path.length > 0) { self.x = self.path[0].x; self.y = self.path[0].y; } }; // Called every tick self.update = function () { if (!self.active || self.path.length < 2) return; // Move along path var nextIdx = self.pathIndex + 1; if (nextIdx >= self.path.length) { // At end of path if (self.targetPlant && self.intersects(self.targetPlant)) { self.active = false; self.targetPlant.water(); // Animate droplet fade out tween(self, { alpha: 0 }, { duration: 400, easing: tween.easeOut, onFinish: function onFinish() { self.destroy(); } }); } else { // Not on plant, just fade out self.active = false; tween(self, { alpha: 0 }, { duration: 400, easing: tween.easeOut, onFinish: function onFinish() { self.destroy(); } }); } return; } var curr = self.path[self.pathIndex]; var next = self.path[nextIdx]; var dx = next.x - self.x; var dy = next.y - self.y; var dist = Math.sqrt(dx * dx + dy * dy); if (dist < self.speed) { // Move to next point self.x = next.x; self.y = next.y; self.pathIndex++; } else { // Move towards next point self.x += self.speed * dx / dist; self.y += self.speed * dy / dist; } }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0xf1f8e9 // soft garden green }); /**** * Game Code ****/ // --- Garden Layout --- // Water droplet: blue ellipse // Plant: green ellipse (pot) + stem (box) + flower (ellipse) // Path: light blue box (for drawn path preview) var plants = []; var plantPositions = [{ x: 512, y: 2200 }, { x: 1024, y: 2000 }, { x: 1536, y: 2200 }]; // Create plants for (var i = 0; i < plantPositions.length; i++) { var plant = new Plant(); plant.x = plantPositions[i].x; plant.y = plantPositions[i].y; plants.push(plant); game.addChild(plant); } // --- Water Source --- var waterSource = LK.getAsset('waterDrop', { anchorX: 0.5, anchorY: 0.5, x: 1024, y: 400, alpha: 0.9, scaleX: 1.2, scaleY: 1.2 }); game.addChild(waterSource); // --- Path Drawing State --- var isDrawing = false; var currentPath = []; var pathPreview = new PathPreview(); game.addChild(pathPreview); var selectedPlant = null; // --- Water Drops in Play --- var waterDrops = []; // --- Helper: Find nearest plant to a point --- function findNearestPlant(x, y) { var minDist = 999999; var nearest = null; for (var i = 0; i < plants.length; i++) { var dx = plants[i].x - x; var dy = plants[i].y - y; var dist = dx * dx + dy * dy; if (dist < minDist) { minDist = dist; nearest = plants[i]; } } return nearest; } // --- Touch/Drag Handlers --- // Only start drawing if touch/click is near the water source game.down = function (x, y, obj) { var dx = x - waterSource.x; var dy = y - waterSource.y; var r = waterSource.width * 0.6; if (dx * dx + dy * dy < r * r) { isDrawing = true; currentPath = [{ x: waterSource.x, y: waterSource.y }]; pathPreview.setPath(currentPath); selectedPlant = null; } }; game.move = function (x, y, obj) { if (!isDrawing) return; // Only add point if moved enough var last = currentPath[currentPath.length - 1]; var dx = x - last.x; var dy = y - last.y; if (dx * dx + dy * dy > 100) { currentPath.push({ x: x, y: y }); pathPreview.setPath(currentPath); } // Highlight nearest plant if close to end var plant = findNearestPlant(x, y); if (plant) { var pdx = plant.x - x; var pdy = plant.y - y; if (pdx * pdx + pdy * pdy < 20000) { // within ~140px selectedPlant = plant; } else { selectedPlant = null; } } else { selectedPlant = null; } }; game.up = function (x, y, obj) { if (!isDrawing) return; isDrawing = false; pathPreview.clear(); // Only create a water drop if path is long enough and ends near a plant if (currentPath.length > 3 && selectedPlant) { // Snap last point to plant center currentPath[currentPath.length - 1] = { x: selectedPlant.x, y: selectedPlant.y }; // Create water drop var drop = new WaterDrop(); drop.setPath(currentPath, selectedPlant); waterDrops.push(drop); game.addChild(drop); // Animate water source pulse tween(waterSource, { scaleX: 1.4, scaleY: 1.4 }, { duration: 120, easing: tween.easeOut, onFinish: function onFinish() { tween(waterSource, { scaleX: 1.2, scaleY: 1.2 }, { duration: 180, easing: tween.easeIn }); } }); } currentPath = []; selectedPlant = null; }; // --- No GUI overlays needed (no score, no timer) --- // --- Game Update Loop --- game.update = function () { // Update all water drops for (var i = waterDrops.length - 1; i >= 0; i--) { var drop = waterDrops[i]; if (drop.active) { drop.update(); } else { waterDrops.splice(i, 1); } } // Optionally, animate plants gently (sway) var t = LK.ticks / 60; for (var i = 0; i < plants.length; i++) { var plant = plants[i]; var sway = Math.sin(t + i) * 6 * (0.5 + 0.5 * plant.growth); plant.rotation = sway * 0.01; } };