Code edit (1 edits merged)
Please save this source code
User prompt
Record & Play TV Studio
Initial prompt
Toca tv (2013). Make a video by recording. Tap and hold the red button to record, then tap the check mark when your done, tap on the play button to watch your own video on the tv till the powerpuff girls clapping and cheering and paper bags throwing
/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); var facekit = LK.import("@upit/facekit.v1"); /**** * Classes ****/ var ControlPanel = Container.expand(function () { var self = Container.call(this); // Record Button var recordButton = self.attachAsset('recordButton', { anchorX: 0.5, anchorY: 0.5 }); recordButton.y = 0; recordButton.x = -200; // Play Button var playButton = self.attachAsset('playButton', { anchorX: 0.5, anchorY: 0.5 }); playButton.y = 0; playButton.x = 0; playButton.alpha = 0.5; // Check Button var checkButton = self.attachAsset('checkButton', { anchorX: 0.5, anchorY: 0.5 }); checkButton.y = 0; checkButton.x = 200; checkButton.alpha = 0; // Record indicator text var recordText = new Text2('REC', { size: 60, fill: 0xFF0000 }); recordText.anchor.set(0.5, 0.5); recordText.x = -200; recordText.y = -150; recordText.alpha = 0; self.addChild(recordText); self.getRecordButton = function () { return recordButton; }; self.getPlayButton = function () { return playButton; }; self.getCheckButton = function () { return checkButton; }; self.getRecordText = function () { return recordText; }; self.showRecording = function () { checkButton.alpha = 1; recordText.alpha = 1; playButton.alpha = 0.3; }; self.showPlaying = function () { checkButton.alpha = 0; recordText.alpha = 0; playButton.alpha = 1; recordButton.alpha = 0.5; }; self.showIdle = function () { checkButton.alpha = 0; recordText.alpha = 0; playButton.alpha = hasRecording ? 1 : 0.5; recordButton.alpha = 1; }; return self; }); var PaperBag = Container.expand(function () { var self = Container.call(this); var bag = self.attachAsset('paperBag', { anchorX: 0.5, anchorY: 0.5 }); self.throwAcrossScreen = function () { self.x = -100; self.y = Math.random() * 400 + 200; self.rotation = Math.random() * Math.PI * 2; tween(self, { x: 2148, rotation: self.rotation + Math.PI * 4 }, { duration: 2000 + Math.random() * 1000, easing: tween.easeOut, onFinish: function onFinish() { self.destroy(); } }); }; return self; }); var PowerpuffGirl = Container.expand(function (color, name) { var self = Container.call(this); var girl = self.attachAsset(name, { anchorX: 0.5, anchorY: 1 }); self.celebrate = function () { // Bounce animation tween(self, { scaleX: 1.2, scaleY: 1.2 }, { duration: 300, easing: tween.bounceOut }); tween(self, { scaleX: 1, scaleY: 1 }, { duration: 300, easing: tween.bounceOut }); // Jump animation tween(self, { y: self.y - 100 }, { duration: 400, easing: tween.easeOut }); tween(self, { y: self.y }, { duration: 400, easing: tween.bounceOut }); }; return self; }); var TVStudio = Container.expand(function () { var self = Container.call(this); // TV Frame var tvFrame = self.attachAsset('tvFrame', { anchorX: 0.5, anchorY: 0.5 }); // TV Screen var tvScreen = self.attachAsset('tvScreen', { anchorX: 0.5, anchorY: 0.5 }); self.getScreen = function () { return tvScreen; }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x87ceeb }); /**** * Game Code ****/ // Game state var gameState = 'idle'; // 'idle', 'recording', 'playing', 'celebrating' var isRecording = false; var hasRecording = false; var recordingStartTime = 0; var recordingDuration = 0; var playbackStartTime = 0; // Create TV Studio var tvStudio = game.addChild(new TVStudio()); tvStudio.x = 2048 / 2; tvStudio.y = 800; // Create Control Panel var controlPanel = game.addChild(new ControlPanel()); controlPanel.x = 2048 / 2; controlPanel.y = 1800; // Create title text var titleText = new Text2('TV STUDIO', { size: 120, fill: 0xFFFFFF }); titleText.anchor.set(0.5, 0.5); titleText.x = 2048 / 2; titleText.y = 200; game.addChild(titleText); // Instructions text var instructionText = new Text2('Hold RED to record, tap PLAY to watch!', { size: 80, fill: 0x333333 }); instructionText.anchor.set(0.5, 0.5); instructionText.x = 2048 / 2; instructionText.y = 2400; game.addChild(instructionText); // Powerpuff Girls (initially hidden) var blossom = game.addChild(new PowerpuffGirl(0xff69b4, 'blossom')); blossom.x = 400; blossom.y = 2732; blossom.alpha = 0; var bubbles = game.addChild(new PowerpuffGirl(0x87ceeb, 'bubbles')); bubbles.x = 1024; bubbles.y = 2732; bubbles.alpha = 0; var buttercup = game.addChild(new PowerpuffGirl(0x9acd32, 'buttercup')); buttercup.x = 1648; buttercup.y = 2732; buttercup.alpha = 0; // Paper bags array var paperBags = []; // Recording blinking effect var recordBlinkTimer = 0; function startRecording() { if (gameState !== 'idle') return; gameState = 'recording'; isRecording = true; recordingStartTime = LK.ticks; controlPanel.showRecording(); LK.getSound('recordStart').play(); // Update instruction instructionText.setText('Recording... Release or tap CHECK to stop'); } function stopRecording() { if (gameState !== 'recording') return; gameState = 'idle'; isRecording = false; hasRecording = true; recordingDuration = LK.ticks - recordingStartTime; controlPanel.showIdle(); LK.getSound('recordStop').play(); // Update instruction instructionText.setText('Tap PLAY to watch your video!'); } function startPlayback() { if (gameState !== 'idle' || !hasRecording) return; gameState = 'playing'; playbackStartTime = LK.ticks; controlPanel.showPlaying(); // Show camera feed on TV screen tvStudio.getScreen().alpha = 0.8; // Update instruction instructionText.setText('Playing your video...'); } function startCelebration() { gameState = 'celebrating'; // Show Powerpuff Girls blossom.alpha = 1; bubbles.alpha = 1; buttercup.alpha = 1; // Move them up tween(blossom, { y: 2400 }, { duration: 800, easing: tween.easeOut }); tween(bubbles, { y: 2400 }, { duration: 900, easing: tween.easeOut }); tween(buttercup, { y: 2400 }, { duration: 1000, easing: tween.easeOut }); // Celebrate LK.setTimeout(function () { blossom.celebrate(); }, 800); LK.setTimeout(function () { bubbles.celebrate(); }, 1000); LK.setTimeout(function () { buttercup.celebrate(); }, 1200); // Play cheer sound LK.getSound('cheer').play(); // Throw paper bags for (var i = 0; i < 8; i++) { LK.setTimeout(function () { var bag = game.addChild(new PaperBag()); paperBags.push(bag); bag.throwAcrossScreen(); }, i * 200); } // Update instruction instructionText.setText('Great job! Tap RED to record again!'); // Reset to idle after celebration LK.setTimeout(function () { gameState = 'idle'; controlPanel.showIdle(); // Hide Powerpuff Girls tween(blossom, { y: 2732, alpha: 0 }, { duration: 1000, easing: tween.easeIn }); tween(bubbles, { y: 2732, alpha: 0 }, { duration: 1000, easing: tween.easeIn }); tween(buttercup, { y: 2732, alpha: 0 }, { duration: 1000, easing: tween.easeIn }); tvStudio.getScreen().alpha = 1; }, 4000); } // Touch handlers game.down = function (x, y, obj) { var localPos = controlPanel.toLocal({ x: x, y: y }); // Record button if (Math.abs(localPos.x - -200) < 100 && Math.abs(localPos.y) < 100) { startRecording(); } // Play button if (Math.abs(localPos.x) < 75 && Math.abs(localPos.y) < 75) { startPlayback(); } // Check button if (Math.abs(localPos.x - 200) < 60 && Math.abs(localPos.y) < 60) { stopRecording(); } }; game.up = function (x, y, obj) { if (isRecording) { stopRecording(); } }; // Main game loop game.update = function () { // Recording blink effect if (gameState === 'recording') { recordBlinkTimer++; if (recordBlinkTimer % 30 < 15) { controlPanel.getRecordText().alpha = 1; } else { controlPanel.getRecordText().alpha = 0.3; } } // Check if playback should end if (gameState === 'playing') { var playbackTime = LK.ticks - playbackStartTime; if (playbackTime >= recordingDuration) { startCelebration(); } } // Clean up destroyed paper bags for (var i = paperBags.length - 1; i >= 0; i--) { if (paperBags[i].destroyed) { paperBags.splice(i, 1); } } };
===================================================================
--- original.js
+++ change.js
@@ -1,6 +1,370 @@
-/****
+/****
+* Plugins
+****/
+var tween = LK.import("@upit/tween.v1");
+var facekit = LK.import("@upit/facekit.v1");
+
+/****
+* Classes
+****/
+var ControlPanel = Container.expand(function () {
+ var self = Container.call(this);
+ // Record Button
+ var recordButton = self.attachAsset('recordButton', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ recordButton.y = 0;
+ recordButton.x = -200;
+ // Play Button
+ var playButton = self.attachAsset('playButton', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ playButton.y = 0;
+ playButton.x = 0;
+ playButton.alpha = 0.5;
+ // Check Button
+ var checkButton = self.attachAsset('checkButton', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ checkButton.y = 0;
+ checkButton.x = 200;
+ checkButton.alpha = 0;
+ // Record indicator text
+ var recordText = new Text2('REC', {
+ size: 60,
+ fill: 0xFF0000
+ });
+ recordText.anchor.set(0.5, 0.5);
+ recordText.x = -200;
+ recordText.y = -150;
+ recordText.alpha = 0;
+ self.addChild(recordText);
+ self.getRecordButton = function () {
+ return recordButton;
+ };
+ self.getPlayButton = function () {
+ return playButton;
+ };
+ self.getCheckButton = function () {
+ return checkButton;
+ };
+ self.getRecordText = function () {
+ return recordText;
+ };
+ self.showRecording = function () {
+ checkButton.alpha = 1;
+ recordText.alpha = 1;
+ playButton.alpha = 0.3;
+ };
+ self.showPlaying = function () {
+ checkButton.alpha = 0;
+ recordText.alpha = 0;
+ playButton.alpha = 1;
+ recordButton.alpha = 0.5;
+ };
+ self.showIdle = function () {
+ checkButton.alpha = 0;
+ recordText.alpha = 0;
+ playButton.alpha = hasRecording ? 1 : 0.5;
+ recordButton.alpha = 1;
+ };
+ return self;
+});
+var PaperBag = Container.expand(function () {
+ var self = Container.call(this);
+ var bag = self.attachAsset('paperBag', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.throwAcrossScreen = function () {
+ self.x = -100;
+ self.y = Math.random() * 400 + 200;
+ self.rotation = Math.random() * Math.PI * 2;
+ tween(self, {
+ x: 2148,
+ rotation: self.rotation + Math.PI * 4
+ }, {
+ duration: 2000 + Math.random() * 1000,
+ easing: tween.easeOut,
+ onFinish: function onFinish() {
+ self.destroy();
+ }
+ });
+ };
+ return self;
+});
+var PowerpuffGirl = Container.expand(function (color, name) {
+ var self = Container.call(this);
+ var girl = self.attachAsset(name, {
+ anchorX: 0.5,
+ anchorY: 1
+ });
+ self.celebrate = function () {
+ // Bounce animation
+ tween(self, {
+ scaleX: 1.2,
+ scaleY: 1.2
+ }, {
+ duration: 300,
+ easing: tween.bounceOut
+ });
+ tween(self, {
+ scaleX: 1,
+ scaleY: 1
+ }, {
+ duration: 300,
+ easing: tween.bounceOut
+ });
+ // Jump animation
+ tween(self, {
+ y: self.y - 100
+ }, {
+ duration: 400,
+ easing: tween.easeOut
+ });
+ tween(self, {
+ y: self.y
+ }, {
+ duration: 400,
+ easing: tween.bounceOut
+ });
+ };
+ return self;
+});
+var TVStudio = Container.expand(function () {
+ var self = Container.call(this);
+ // TV Frame
+ var tvFrame = self.attachAsset('tvFrame', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ // TV Screen
+ var tvScreen = self.attachAsset('tvScreen', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.getScreen = function () {
+ return tvScreen;
+ };
+ return self;
+});
+
+/****
* Initialize Game
-****/
+****/
var game = new LK.Game({
- backgroundColor: 0x000000
-});
\ No newline at end of file
+ backgroundColor: 0x87ceeb
+});
+
+/****
+* Game Code
+****/
+// Game state
+var gameState = 'idle'; // 'idle', 'recording', 'playing', 'celebrating'
+var isRecording = false;
+var hasRecording = false;
+var recordingStartTime = 0;
+var recordingDuration = 0;
+var playbackStartTime = 0;
+// Create TV Studio
+var tvStudio = game.addChild(new TVStudio());
+tvStudio.x = 2048 / 2;
+tvStudio.y = 800;
+// Create Control Panel
+var controlPanel = game.addChild(new ControlPanel());
+controlPanel.x = 2048 / 2;
+controlPanel.y = 1800;
+// Create title text
+var titleText = new Text2('TV STUDIO', {
+ size: 120,
+ fill: 0xFFFFFF
+});
+titleText.anchor.set(0.5, 0.5);
+titleText.x = 2048 / 2;
+titleText.y = 200;
+game.addChild(titleText);
+// Instructions text
+var instructionText = new Text2('Hold RED to record, tap PLAY to watch!', {
+ size: 80,
+ fill: 0x333333
+});
+instructionText.anchor.set(0.5, 0.5);
+instructionText.x = 2048 / 2;
+instructionText.y = 2400;
+game.addChild(instructionText);
+// Powerpuff Girls (initially hidden)
+var blossom = game.addChild(new PowerpuffGirl(0xff69b4, 'blossom'));
+blossom.x = 400;
+blossom.y = 2732;
+blossom.alpha = 0;
+var bubbles = game.addChild(new PowerpuffGirl(0x87ceeb, 'bubbles'));
+bubbles.x = 1024;
+bubbles.y = 2732;
+bubbles.alpha = 0;
+var buttercup = game.addChild(new PowerpuffGirl(0x9acd32, 'buttercup'));
+buttercup.x = 1648;
+buttercup.y = 2732;
+buttercup.alpha = 0;
+// Paper bags array
+var paperBags = [];
+// Recording blinking effect
+var recordBlinkTimer = 0;
+function startRecording() {
+ if (gameState !== 'idle') return;
+ gameState = 'recording';
+ isRecording = true;
+ recordingStartTime = LK.ticks;
+ controlPanel.showRecording();
+ LK.getSound('recordStart').play();
+ // Update instruction
+ instructionText.setText('Recording... Release or tap CHECK to stop');
+}
+function stopRecording() {
+ if (gameState !== 'recording') return;
+ gameState = 'idle';
+ isRecording = false;
+ hasRecording = true;
+ recordingDuration = LK.ticks - recordingStartTime;
+ controlPanel.showIdle();
+ LK.getSound('recordStop').play();
+ // Update instruction
+ instructionText.setText('Tap PLAY to watch your video!');
+}
+function startPlayback() {
+ if (gameState !== 'idle' || !hasRecording) return;
+ gameState = 'playing';
+ playbackStartTime = LK.ticks;
+ controlPanel.showPlaying();
+ // Show camera feed on TV screen
+ tvStudio.getScreen().alpha = 0.8;
+ // Update instruction
+ instructionText.setText('Playing your video...');
+}
+function startCelebration() {
+ gameState = 'celebrating';
+ // Show Powerpuff Girls
+ blossom.alpha = 1;
+ bubbles.alpha = 1;
+ buttercup.alpha = 1;
+ // Move them up
+ tween(blossom, {
+ y: 2400
+ }, {
+ duration: 800,
+ easing: tween.easeOut
+ });
+ tween(bubbles, {
+ y: 2400
+ }, {
+ duration: 900,
+ easing: tween.easeOut
+ });
+ tween(buttercup, {
+ y: 2400
+ }, {
+ duration: 1000,
+ easing: tween.easeOut
+ });
+ // Celebrate
+ LK.setTimeout(function () {
+ blossom.celebrate();
+ }, 800);
+ LK.setTimeout(function () {
+ bubbles.celebrate();
+ }, 1000);
+ LK.setTimeout(function () {
+ buttercup.celebrate();
+ }, 1200);
+ // Play cheer sound
+ LK.getSound('cheer').play();
+ // Throw paper bags
+ for (var i = 0; i < 8; i++) {
+ LK.setTimeout(function () {
+ var bag = game.addChild(new PaperBag());
+ paperBags.push(bag);
+ bag.throwAcrossScreen();
+ }, i * 200);
+ }
+ // Update instruction
+ instructionText.setText('Great job! Tap RED to record again!');
+ // Reset to idle after celebration
+ LK.setTimeout(function () {
+ gameState = 'idle';
+ controlPanel.showIdle();
+ // Hide Powerpuff Girls
+ tween(blossom, {
+ y: 2732,
+ alpha: 0
+ }, {
+ duration: 1000,
+ easing: tween.easeIn
+ });
+ tween(bubbles, {
+ y: 2732,
+ alpha: 0
+ }, {
+ duration: 1000,
+ easing: tween.easeIn
+ });
+ tween(buttercup, {
+ y: 2732,
+ alpha: 0
+ }, {
+ duration: 1000,
+ easing: tween.easeIn
+ });
+ tvStudio.getScreen().alpha = 1;
+ }, 4000);
+}
+// Touch handlers
+game.down = function (x, y, obj) {
+ var localPos = controlPanel.toLocal({
+ x: x,
+ y: y
+ });
+ // Record button
+ if (Math.abs(localPos.x - -200) < 100 && Math.abs(localPos.y) < 100) {
+ startRecording();
+ }
+ // Play button
+ if (Math.abs(localPos.x) < 75 && Math.abs(localPos.y) < 75) {
+ startPlayback();
+ }
+ // Check button
+ if (Math.abs(localPos.x - 200) < 60 && Math.abs(localPos.y) < 60) {
+ stopRecording();
+ }
+};
+game.up = function (x, y, obj) {
+ if (isRecording) {
+ stopRecording();
+ }
+};
+// Main game loop
+game.update = function () {
+ // Recording blink effect
+ if (gameState === 'recording') {
+ recordBlinkTimer++;
+ if (recordBlinkTimer % 30 < 15) {
+ controlPanel.getRecordText().alpha = 1;
+ } else {
+ controlPanel.getRecordText().alpha = 0.3;
+ }
+ }
+ // Check if playback should end
+ if (gameState === 'playing') {
+ var playbackTime = LK.ticks - playbackStartTime;
+ if (playbackTime >= recordingDuration) {
+ startCelebration();
+ }
+ }
+ // Clean up destroyed paper bags
+ for (var i = paperBags.length - 1; i >= 0; i--) {
+ if (paperBags[i].destroyed) {
+ paperBags.splice(i, 1);
+ }
+ }
+};
\ No newline at end of file