User prompt
Everything is good, but when the screen malfunctions, it just shows a screen with the screws but I just want it to be blank, and then the players should click on it, to show a screen popped up which has the screw
Code edit (1 edits merged)
Please save this source code
User prompt
Create a box inside the panel_bg
User prompt
This is the aspect ratio of the panel_bg ( 1500 X 2000) , make the screen to be in the top
User prompt
Make the grey screen larger
Code edit (1 edits merged)
Please save this source code
User prompt
Bomb Defuse Clicker
Initial prompt
Bomb Defuse clicker. - UI: Show a rectangle steel panel on the screen ( like a inside of open steel box ), with multiple wires (different colors: red, blue, green ) connecting from one end of the steel box to another. There should be a screen called the communication screen, which shows which wire to cut ( like shows the picture of the wire). There should be timer on the top, run down as the time passes ( showing the tick of the bomb ) when it can explode. There should be a scoring system on the bottom, increases as relation to seconds of the timer ( +1 for every seconds dropped). Puzzles and wire connecting shows up randomly to fix errors. - Mechanism: Steel panel has random wires (different colors: red, blue, green ), have to click on specific wire to break the wire, breaking the correct wire grands +5 points, breaking the wrong wire give -5 points, and click on the wrong wire gives -1 points. communication screen gives information on what wire to break. Errors occurs with communication screen, screen of it goes blank, then click on it, to show a screw panel, fix the screws by clicking on it, and if all screws are fixed then return to the main game and then continue ( the timer still runs even on the puzzle ). Just to make the game interesting and fun. And fixing the screen grants +10 points, as you break wires, new steel panel with different wires shows up.
/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); /**** * Classes ****/ // Screw class (for malfunction minigame) var Screw = Container.expand(function () { var self = Container.call(this); self.fixed = false; self.screwAsset = self.attachAsset('screw', { anchorX: 0.5, anchorY: 0.5 }); // Touch/click event self.down = function (x, y, obj) { if (self.fixed) { return; } self.fixed = true; // Animate: fade out and shrink tween(self, { scaleX: 0.1, scaleY: 0.1, alpha: 0 }, { duration: 200, easing: tween.cubicIn, onFinish: function onFinish() { self.visible = false; } }); if (typeof self.onFix === 'function') { self.onFix(self); } }; return self; }); // Wire class var Wire = Container.expand(function () { var self = Container.call(this); // Properties self.color = 'red'; // default, will be set on init self.cut = false; // Attach asset self.wireAsset = null; self.init = function (color) { self.color = color; self.cut = false; var assetId = 'wire_' + color; self.wireAsset = self.attachAsset(assetId, { anchorX: 0.5, anchorY: 0.5 }); }; // Cut animation self.cutWire = function () { if (self.cut) { return; } self.cut = true; // Animate: fade out and shrink tween(self, { scaleX: 0.1, scaleY: 0.1, alpha: 0 }, { duration: 300, easing: tween.cubicIn, onFinish: function onFinish() { self.visible = false; } }); }; // Touch/click event self.down = function (x, y, obj) { if (self.cut) { return; } if (typeof self.onCut === 'function') { self.onCut(self); } }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x181818 }); /**** * Game Code ****/ // --- Game constants --- // Wires: red, blue, green, yellow, black, white // Panel // Communication screen // Screw (for malfunction minigame) // Malfunction overlay // Sounds var WIRE_COLORS = ['red', 'blue', 'green', 'yellow', 'black', 'white']; var WIRES_PER_PANEL = 4; var PANEL_X = 2048 / 2; var PANEL_Y = 2732 / 2; var PANEL_W = 700; var PANEL_H = 500; var SCREEN_H = 180; var ROUND_TIME = 8000; // ms per round var MALFUNCTION_CHANCE = 0.18; // 18% chance per round // --- Game state --- var wires = []; var panel = null; var screen = null; var screenText = null; var malOverlay = null; var screws = []; var malfunctionActive = false; var roundTimer = null; var timeLeft = 0; var timerBar = null; var correctWireColor = ''; var canCut = true; var scoreText = null; var roundNum = 0; var tickingSoundTimer = null; // --- GUI --- scoreText = new Text2('0', { size: 120, fill: "#fff" }); scoreText.anchor.set(0.5, 0); LK.gui.top.addChild(scoreText); // Timer bar timerBar = LK.getAsset('panel_bg', { width: 600, height: 24, color: 0x44ff44, anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 180 }); game.addChild(timerBar); // --- Panel setup --- panel = new Container(); var panelBorder = panel.attachAsset('panel_border', { anchorX: 0.5, anchorY: 0.5 }); var panelBg = panel.attachAsset('panel_bg', { anchorX: 0.5, anchorY: 0.5 }); // Add a box inside the panel_bg (steel panel) var innerBox = panel.attachAsset('panel_border', { anchorX: 0.5, anchorY: 0.5, width: 900, // slightly smaller than panel_bg (1500x2000), visually inside height: 1200, x: 0, y: 50 // move it down a bit to be inside the panel visually }); panel.x = PANEL_X; panel.y = PANEL_Y; game.addChild(panel); // --- Communication screen --- screen = new Container(); var screenBg = screen.attachAsset('screen', { anchorX: 0.5, anchorY: 0.5 }); screen.x = 0; // Place the screen at the top of the panel, matching the panel_bg aspect ratio (panel_bg is 1500x2000, so screen should be near the top edge) screen.y = -1000 + SCREEN_H / 2 + 60; // -1000 is half of 2000 (panel_bg height), add some margin panel.addChild(screen); screenText = new Text2('', { size: 60, fill: "#fff" }); screenText.anchor.set(0.5, 0.5); screen.addChild(screenText); // Malfunction overlay (hidden by default) malOverlay = LK.getAsset('mal_overlay', { anchorX: 0.5, anchorY: 0.5, x: 0, y: 0, alpha: 0.8 }); malOverlay.visible = false; screen.addChild(malOverlay); // --- Functions --- function shuffle(arr) { // Fisher-Yates shuffle for (var i = arr.length - 1; i > 0; i--) { var j = Math.floor(Math.random() * (i + 1)); var t = arr[i]; arr[i] = arr[j]; arr[j] = t; } return arr; } function startRound() { roundNum += 1; canCut = true; malfunctionActive = false; // Remove old wires for (var i = 0; i < wires.length; i++) { wires[i].destroy(); } wires = []; // Remove screws if any for (var i = 0; i < screws.length; i++) { screws[i].destroy(); } screws = []; // Randomize wires var colorPool = shuffle(WIRE_COLORS.slice()); var roundWires = colorPool.slice(0, WIRES_PER_PANEL); // Pick correct wire correctWireColor = roundWires[Math.floor(Math.random() * roundWires.length)]; // Place wires vertically in panel var spacing = PANEL_H / (WIRES_PER_PANEL + 1); for (var i = 0; i < roundWires.length; i++) { var w = new Wire(); w.init(roundWires[i]); w.x = 0; w.y = -PANEL_H / 2 + spacing * (i + 1) + 40; w.onCut = handleWireCut; panel.addChild(w); wires.push(w); } // Set screen text screenText.setText('CUT THE ' + correctWireColor.toUpperCase() + ' WIRE!'); screenText.visible = true; malOverlay.visible = false; // Malfunction? if (Math.random() < MALFUNCTION_CHANCE) { LK.setTimeout(triggerMalfunction, 600 + Math.floor(Math.random() * 800)); } // Start timer timeLeft = ROUND_TIME; updateTimerBar(); if (roundTimer) { LK.clearInterval(roundTimer); } roundTimer = LK.setInterval(tickTimer, 30); // Ticking sound if (tickingSoundTimer) { LK.clearInterval(tickingSoundTimer); } tickingSoundTimer = LK.setInterval(function () { LK.getSound('tick').play(); }, 1000); } function handleWireCut(wire) { if (!canCut || malfunctionActive && !screws.length) { return; } canCut = false; wire.cutWire(); if (wire.color === correctWireColor) { // Success! LK.getSound('cut').play(); LK.setScore(LK.getScore() + 1); scoreText.setText(LK.getScore()); // Animate panel flash green LK.effects.flashObject(panel, 0x44ff44, 300); // Next round after short delay LK.setTimeout(startRound, 700); } else { // Wrong wire! LK.getSound('fail').play(); LK.effects.flashScreen(0xff0000, 600); LK.setScore(Math.max(0, LK.getScore() - 1)); scoreText.setText(LK.getScore()); // Game over LK.setTimeout(function () { LK.showGameOver(); }, 600); } } function tickTimer() { if (!canCut) { return; } timeLeft -= 30; updateTimerBar(); if (timeLeft <= 0) { canCut = false; LK.getSound('fail').play(); LK.effects.flashScreen(0xff0000, 600); LK.setTimeout(function () { LK.showGameOver(); }, 600); } } function updateTimerBar() { var frac = Math.max(0, timeLeft / ROUND_TIME); timerBar.width = 600 * frac; if (frac > 0.5) { timerBar.tint = 0x44ff44; } else if (frac > 0.2) { timerBar.tint = 0xffe066; } else { timerBar.tint = 0xff3333; } } function triggerMalfunction() { if (!canCut) { return; } malfunctionActive = true; screenText.visible = false; malOverlay.visible = true; // Hide screws for now, only show after click for (var i = 0; i < screws.length; i++) { screws[i].destroy(); } screws = []; // Add a one-time click handler to the screen to show the screw minigame screen.down = function (x, y, obj) { // Remove this handler after first click screen.down = undefined; // Show screws at random positions on the screen var screwCount = 3 + Math.floor(Math.random() * 2); // 3 or 4 screws = []; for (var i = 0; i < screwCount; i++) { var s = new Screw(); // Place randomly within screen area s.x = -180 + Math.random() * 360; s.y = -40 + Math.random() * 80; s.onFix = handleScrewFix; screen.addChild(s); screws.push(s); } LK.getSound('beep').play(); }; } function handleScrewFix(screw) { // Don't allow fixing screws if the minigame hasn't started (blank screen) if (!screws.length) return; LK.getSound('fix').play(); // Check if all screws fixed var allFixed = true; for (var i = 0; i < screws.length; i++) { if (!screws[i].fixed) { allFixed = false; break; } } if (allFixed) { malfunctionActive = false; malOverlay.visible = false; screenText.visible = true; // Remove screws from screen for (var i = 0; i < screws.length; i++) { screws[i].destroy(); } screws = []; // Remove any leftover click handler screen.down = undefined; } } // --- Game event handlers --- // Drag prevention: no drag in this game game.move = function (x, y, obj) {}; // --- Game update loop --- game.update = function () { // Win condition: e.g. 20 points if (LK.getScore() >= 20) { LK.showYouWin(); } }; // --- Start game --- LK.setScore(0); scoreText.setText('0'); startRound();
===================================================================
--- original.js
+++ change.js
@@ -95,15 +95,15 @@
/****
* Game Code
****/
-// Sounds
-// Malfunction overlay
-// Screw (for malfunction minigame)
-// Communication screen
-// Panel
-// Wires: red, blue, green, yellow, black, white
// --- Game constants ---
+// Wires: red, blue, green, yellow, black, white
+// Panel
+// Communication screen
+// Screw (for malfunction minigame)
+// Malfunction overlay
+// Sounds
var WIRE_COLORS = ['red', 'blue', 'green', 'yellow', 'black', 'white'];
var WIRES_PER_PANEL = 4;
var PANEL_X = 2048 / 2;
var PANEL_Y = 2732 / 2;
@@ -259,9 +259,9 @@
LK.getSound('tick').play();
}, 1000);
}
function handleWireCut(wire) {
- if (!canCut) {
+ if (!canCut || malfunctionActive && !screws.length) {
return;
}
canCut = false;
wire.cutWire();
@@ -318,23 +318,35 @@
}
malfunctionActive = true;
screenText.visible = false;
malOverlay.visible = true;
- // Show screws at random positions on the screen
- var screwCount = 3 + Math.floor(Math.random() * 2); // 3 or 4
- screws = [];
- for (var i = 0; i < screwCount; i++) {
- var s = new Screw();
- // Place randomly within screen area
- s.x = -180 + Math.random() * 360;
- s.y = -40 + Math.random() * 80;
- s.onFix = handleScrewFix;
- screen.addChild(s);
- screws.push(s);
+ // Hide screws for now, only show after click
+ for (var i = 0; i < screws.length; i++) {
+ screws[i].destroy();
}
- LK.getSound('beep').play();
+ screws = [];
+ // Add a one-time click handler to the screen to show the screw minigame
+ screen.down = function (x, y, obj) {
+ // Remove this handler after first click
+ screen.down = undefined;
+ // Show screws at random positions on the screen
+ var screwCount = 3 + Math.floor(Math.random() * 2); // 3 or 4
+ screws = [];
+ for (var i = 0; i < screwCount; i++) {
+ var s = new Screw();
+ // Place randomly within screen area
+ s.x = -180 + Math.random() * 360;
+ s.y = -40 + Math.random() * 80;
+ s.onFix = handleScrewFix;
+ screen.addChild(s);
+ screws.push(s);
+ }
+ LK.getSound('beep').play();
+ };
}
function handleScrewFix(screw) {
+ // Don't allow fixing screws if the minigame hasn't started (blank screen)
+ if (!screws.length) return;
LK.getSound('fix').play();
// Check if all screws fixed
var allFixed = true;
for (var i = 0; i < screws.length; i++) {
@@ -346,8 +358,15 @@
if (allFixed) {
malfunctionActive = false;
malOverlay.visible = false;
screenText.visible = true;
+ // Remove screws from screen
+ for (var i = 0; i < screws.length; i++) {
+ screws[i].destroy();
+ }
+ screws = [];
+ // Remove any leftover click handler
+ screen.down = undefined;
}
}
// --- Game event handlers ---
// Drag prevention: no drag in this game
It is like the back of a bomb, wires on the side. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
It's a screen, very chip like, light blue screen. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
“Top-down view of a steel box with a smooth metallic surface, subtle reflections, and sharp clean edges. The box should appear sturdy and industrial, with a slightly brushed texture on the steel. Lighting highlights the metal’s cool gray color and gives depth to the edges. Minimal shadows inside the box, set against a plain light background.”. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
it's a black wire. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
it's a blue wire. Don't cut it open, just blue nothing else. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
it's a green wire. Don't cut it open, just blue nothing else. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
it's a red wire. Don't cut it open, just blue nothing else. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
it's a yellow wire. Don't cut it open, just blue nothing else. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
paint it white
It's like back of a chip display. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
Make it light greyish black
It is a black screen, like a glass pane. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
Make it steel
That's a button, imagine a keyboard button. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
make it as a perfect rectangle, screws on all the corners. no background, transparent background