Code edit (1 edits merged)
Please save this source code
User prompt
The Wheels on the Bus Story TV
Initial prompt
Toca storytime 2 (2015). The powerpuff girls have a tv to watch. Tap on the play or continue button to make the tv come to life or make the tv continue the story. It will be “the wheels on the bus”. They be the wheels on the bus go round and round scene at scene 1 the wipers on the bus go swish swish swish scene at scene 2 the baby on the bus go wah wah wah scene at scene 3 the teacher on the bus go shh shh shh scene at scene 4 the driver on the bus says move on back scene at scene 5 for end
/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); /**** * Classes ****/ var Baby = Container.expand(function () { var self = Container.call(this); var babyBody = self.attachAsset('baby', { anchorX: 0.5, anchorY: 0.5 }); self.cry = function () { tween(self, { scaleX: 1.2, scaleY: 1.2 }, { duration: 300, easing: tween.easeInOut, onFinish: function onFinish() { tween(self, { scaleX: 1, scaleY: 1 }, { duration: 300, easing: tween.easeInOut }); } }); }; return self; }); var Bus = Container.expand(function () { var self = Container.call(this); var busBody = self.attachAsset('bus', { anchorX: 0.5, anchorY: 0.5 }); var leftWheel = self.attachAsset('wheel', { anchorX: 0.5, anchorY: 0.5 }); leftWheel.x = -250; leftWheel.y = 150; var rightWheel = self.attachAsset('wheel', { anchorX: 0.5, anchorY: 0.5 }); rightWheel.x = 250; rightWheel.y = 150; var wiper = self.attachAsset('wiper', { anchorX: 0.5, anchorY: 0.5 }); wiper.x = -200; wiper.y = -100; self.spinWheels = function () { tween(leftWheel, { rotation: leftWheel.rotation + Math.PI * 4 }, { duration: 2000 }); tween(rightWheel, { rotation: rightWheel.rotation + Math.PI * 4 }, { duration: 2000 }); }; self.swishWipers = function () { tween(wiper, { rotation: -0.5 }, { duration: 500, easing: tween.easeInOut, onFinish: function onFinish() { tween(wiper, { rotation: 0.5 }, { duration: 500, easing: tween.easeInOut, onFinish: function onFinish() { tween(wiper, { rotation: 0 }, { duration: 500, easing: tween.easeInOut }); } }); } }); }; return self; }); var ContinueButton = Container.expand(function () { var self = Container.call(this); var button = self.attachAsset('continueButton', { anchorX: 0.5, anchorY: 0.5 }); var buttonText = new Text2('CONTINUE', { size: 36, fill: 0xFFFFFF }); buttonText.anchor.set(0.5, 0.5); self.addChild(buttonText); self.down = function (x, y, obj) { LK.getSound('buttonClick').play(); nextScene(); }; return self; }); var Driver = Container.expand(function () { var self = Container.call(this); var driverBody = self.attachAsset('driver', { anchorX: 0.5, anchorY: 0.5 }); self.gesture = function () { tween(self, { y: self.y - 30 }, { duration: 400, easing: tween.easeInOut, onFinish: function onFinish() { tween(self, { y: self.y + 30 }, { duration: 400, easing: tween.easeInOut }); } }); }; return self; }); var PlayButton = Container.expand(function () { var self = Container.call(this); var button = self.attachAsset('playButton', { anchorX: 0.5, anchorY: 0.5 }); var buttonText = new Text2('PLAY', { size: 40, fill: 0xFFFFFF }); buttonText.anchor.set(0.5, 0.5); self.addChild(buttonText); self.down = function (x, y, obj) { LK.getSound('buttonClick').play(); startStory(); }; return self; }); var PowerpuffGirl = Container.expand(function (color) { var self = Container.call(this); var girl = self.attachAsset(color, { anchorX: 0.5, anchorY: 0.5 }); return self; }); var TV = Container.expand(function () { var self = Container.call(this); var tvFrame = self.attachAsset('tvFrame', { anchorX: 0.5, anchorY: 0.5 }); var tvScreen = self.attachAsset('tvScreen', { anchorX: 0.5, anchorY: 0.5 }); return self; }); var Teacher = Container.expand(function () { var self = Container.call(this); var teacherBody = self.attachAsset('teacher', { anchorX: 0.5, anchorY: 0.5 }); self.shush = function () { tween(self, { x: self.x + 20 }, { duration: 200, easing: tween.easeInOut, onFinish: function onFinish() { tween(self, { x: self.x - 20 }, { duration: 200, easing: tween.easeInOut }); } }); }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x87CEEB }); /**** * Game Code ****/ var currentScene = 0; var scenes = ["The wheels on the bus go round and round", "The wipers on the bus go swish swish swish", "The baby on the bus goes wah wah wah", "The teacher on the bus goes shh shh shh", "The driver on the bus says move on back"]; // Create TV var tv = game.addChild(new TV()); tv.x = 1024; tv.y = 1200; // Create Powerpuff Girls var blossom = game.addChild(new PowerpuffGirl('blossom')); blossom.x = 400; blossom.y = 2200; var bubbles = game.addChild(new PowerpuffGirl('bubbles')); bubbles.x = 1024; bubbles.y = 2200; var buttercup = game.addChild(new PowerpuffGirl('buttercup')); buttercup.x = 1648; buttercup.y = 2200; // Create title text var titleText = new Text2('The Wheels on the Bus Story TV', { size: 60, fill: 0xFFFFFF }); titleText.anchor.set(0.5, 0.5); titleText.x = 1024; titleText.y = 200; game.addChild(titleText); // Create scene text var sceneText = new Text2('Tap PLAY to start the story!', { size: 48, fill: 0x000000 }); sceneText.anchor.set(0.5, 0.5); sceneText.x = 1024; sceneText.y = 800; game.addChild(sceneText); // Create play button var playButton = game.addChild(new PlayButton()); playButton.x = 1024; playButton.y = 1700; // Create continue button (hidden initially) var continueButton = game.addChild(new ContinueButton()); continueButton.x = 1024; continueButton.y = 1700; continueButton.visible = false; // Game elements var bus = null; var baby = null; var teacher = null; var driver = null; function startStory() { playButton.visible = false; currentScene = 0; showScene(); } function nextScene() { currentScene++; if (currentScene < scenes.length) { showScene(); } else { endStory(); } } function showScene() { // Clear previous scene elements if (bus) { bus.destroy(); bus = null; } if (baby) { baby.destroy(); baby = null; } if (teacher) { teacher.destroy(); teacher = null; } if (driver) { driver.destroy(); driver = null; } // Update scene text sceneText.setText(scenes[currentScene]); // Create scene-specific elements switch (currentScene) { case 0: // Wheels spinning bus = game.addChild(new Bus()); bus.x = 1024; bus.y = 1200; LK.setTimeout(function () { bus.spinWheels(); LK.getSound('wheelSound').play(); }, 500); break; case 1: // Wipers swishing bus = game.addChild(new Bus()); bus.x = 1024; bus.y = 1200; LK.setTimeout(function () { bus.swishWipers(); LK.getSound('wiperSound').play(); }, 500); break; case 2: // Baby crying bus = game.addChild(new Bus()); bus.x = 1024; bus.y = 1200; baby = game.addChild(new Baby()); baby.x = 1024; baby.y = 1100; LK.setTimeout(function () { baby.cry(); LK.getSound('crySound').play(); }, 500); break; case 3: // Teacher shushing bus = game.addChild(new Bus()); bus.x = 1024; bus.y = 1200; teacher = game.addChild(new Teacher()); teacher.x = 900; teacher.y = 1100; LK.setTimeout(function () { teacher.shush(); LK.getSound('shushSound').play(); }, 500); break; case 4: // Driver directing bus = game.addChild(new Bus()); bus.x = 1024; bus.y = 1200; driver = game.addChild(new Driver()); driver.x = 750; driver.y = 1050; LK.setTimeout(function () { driver.gesture(); }, 500); break; } continueButton.visible = true; } function endStory() { continueButton.visible = false; sceneText.setText('The End! Tap PLAY to watch again!'); playButton.visible = true; // Clear all scene elements if (bus) { bus.destroy(); bus = null; } if (baby) { baby.destroy(); baby = null; } if (teacher) { teacher.destroy(); teacher = null; } if (driver) { driver.destroy(); driver = null; } } game.update = function () { // Game loop updates if needed };
===================================================================
--- original.js
+++ change.js
@@ -1,6 +1,380 @@
-/****
+/****
+* Plugins
+****/
+var tween = LK.import("@upit/tween.v1");
+
+/****
+* Classes
+****/
+var Baby = Container.expand(function () {
+ var self = Container.call(this);
+ var babyBody = self.attachAsset('baby', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.cry = function () {
+ tween(self, {
+ scaleX: 1.2,
+ scaleY: 1.2
+ }, {
+ duration: 300,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ tween(self, {
+ scaleX: 1,
+ scaleY: 1
+ }, {
+ duration: 300,
+ easing: tween.easeInOut
+ });
+ }
+ });
+ };
+ return self;
+});
+var Bus = Container.expand(function () {
+ var self = Container.call(this);
+ var busBody = self.attachAsset('bus', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ var leftWheel = self.attachAsset('wheel', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ leftWheel.x = -250;
+ leftWheel.y = 150;
+ var rightWheel = self.attachAsset('wheel', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ rightWheel.x = 250;
+ rightWheel.y = 150;
+ var wiper = self.attachAsset('wiper', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ wiper.x = -200;
+ wiper.y = -100;
+ self.spinWheels = function () {
+ tween(leftWheel, {
+ rotation: leftWheel.rotation + Math.PI * 4
+ }, {
+ duration: 2000
+ });
+ tween(rightWheel, {
+ rotation: rightWheel.rotation + Math.PI * 4
+ }, {
+ duration: 2000
+ });
+ };
+ self.swishWipers = function () {
+ tween(wiper, {
+ rotation: -0.5
+ }, {
+ duration: 500,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ tween(wiper, {
+ rotation: 0.5
+ }, {
+ duration: 500,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ tween(wiper, {
+ rotation: 0
+ }, {
+ duration: 500,
+ easing: tween.easeInOut
+ });
+ }
+ });
+ }
+ });
+ };
+ return self;
+});
+var ContinueButton = Container.expand(function () {
+ var self = Container.call(this);
+ var button = self.attachAsset('continueButton', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ var buttonText = new Text2('CONTINUE', {
+ size: 36,
+ fill: 0xFFFFFF
+ });
+ buttonText.anchor.set(0.5, 0.5);
+ self.addChild(buttonText);
+ self.down = function (x, y, obj) {
+ LK.getSound('buttonClick').play();
+ nextScene();
+ };
+ return self;
+});
+var Driver = Container.expand(function () {
+ var self = Container.call(this);
+ var driverBody = self.attachAsset('driver', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.gesture = function () {
+ tween(self, {
+ y: self.y - 30
+ }, {
+ duration: 400,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ tween(self, {
+ y: self.y + 30
+ }, {
+ duration: 400,
+ easing: tween.easeInOut
+ });
+ }
+ });
+ };
+ return self;
+});
+var PlayButton = Container.expand(function () {
+ var self = Container.call(this);
+ var button = self.attachAsset('playButton', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ var buttonText = new Text2('PLAY', {
+ size: 40,
+ fill: 0xFFFFFF
+ });
+ buttonText.anchor.set(0.5, 0.5);
+ self.addChild(buttonText);
+ self.down = function (x, y, obj) {
+ LK.getSound('buttonClick').play();
+ startStory();
+ };
+ return self;
+});
+var PowerpuffGirl = Container.expand(function (color) {
+ var self = Container.call(this);
+ var girl = self.attachAsset(color, {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ return self;
+});
+var TV = Container.expand(function () {
+ var self = Container.call(this);
+ var tvFrame = self.attachAsset('tvFrame', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ var tvScreen = self.attachAsset('tvScreen', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ return self;
+});
+var Teacher = Container.expand(function () {
+ var self = Container.call(this);
+ var teacherBody = self.attachAsset('teacher', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.shush = function () {
+ tween(self, {
+ x: self.x + 20
+ }, {
+ duration: 200,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ tween(self, {
+ x: self.x - 20
+ }, {
+ duration: 200,
+ easing: tween.easeInOut
+ });
+ }
+ });
+ };
+ return self;
+});
+
+/****
* Initialize Game
-****/
+****/
var game = new LK.Game({
- backgroundColor: 0x000000
-});
\ No newline at end of file
+ backgroundColor: 0x87CEEB
+});
+
+/****
+* Game Code
+****/
+var currentScene = 0;
+var scenes = ["The wheels on the bus go round and round", "The wipers on the bus go swish swish swish", "The baby on the bus goes wah wah wah", "The teacher on the bus goes shh shh shh", "The driver on the bus says move on back"];
+// Create TV
+var tv = game.addChild(new TV());
+tv.x = 1024;
+tv.y = 1200;
+// Create Powerpuff Girls
+var blossom = game.addChild(new PowerpuffGirl('blossom'));
+blossom.x = 400;
+blossom.y = 2200;
+var bubbles = game.addChild(new PowerpuffGirl('bubbles'));
+bubbles.x = 1024;
+bubbles.y = 2200;
+var buttercup = game.addChild(new PowerpuffGirl('buttercup'));
+buttercup.x = 1648;
+buttercup.y = 2200;
+// Create title text
+var titleText = new Text2('The Wheels on the Bus Story TV', {
+ size: 60,
+ fill: 0xFFFFFF
+});
+titleText.anchor.set(0.5, 0.5);
+titleText.x = 1024;
+titleText.y = 200;
+game.addChild(titleText);
+// Create scene text
+var sceneText = new Text2('Tap PLAY to start the story!', {
+ size: 48,
+ fill: 0x000000
+});
+sceneText.anchor.set(0.5, 0.5);
+sceneText.x = 1024;
+sceneText.y = 800;
+game.addChild(sceneText);
+// Create play button
+var playButton = game.addChild(new PlayButton());
+playButton.x = 1024;
+playButton.y = 1700;
+// Create continue button (hidden initially)
+var continueButton = game.addChild(new ContinueButton());
+continueButton.x = 1024;
+continueButton.y = 1700;
+continueButton.visible = false;
+// Game elements
+var bus = null;
+var baby = null;
+var teacher = null;
+var driver = null;
+function startStory() {
+ playButton.visible = false;
+ currentScene = 0;
+ showScene();
+}
+function nextScene() {
+ currentScene++;
+ if (currentScene < scenes.length) {
+ showScene();
+ } else {
+ endStory();
+ }
+}
+function showScene() {
+ // Clear previous scene elements
+ if (bus) {
+ bus.destroy();
+ bus = null;
+ }
+ if (baby) {
+ baby.destroy();
+ baby = null;
+ }
+ if (teacher) {
+ teacher.destroy();
+ teacher = null;
+ }
+ if (driver) {
+ driver.destroy();
+ driver = null;
+ }
+ // Update scene text
+ sceneText.setText(scenes[currentScene]);
+ // Create scene-specific elements
+ switch (currentScene) {
+ case 0:
+ // Wheels spinning
+ bus = game.addChild(new Bus());
+ bus.x = 1024;
+ bus.y = 1200;
+ LK.setTimeout(function () {
+ bus.spinWheels();
+ LK.getSound('wheelSound').play();
+ }, 500);
+ break;
+ case 1:
+ // Wipers swishing
+ bus = game.addChild(new Bus());
+ bus.x = 1024;
+ bus.y = 1200;
+ LK.setTimeout(function () {
+ bus.swishWipers();
+ LK.getSound('wiperSound').play();
+ }, 500);
+ break;
+ case 2:
+ // Baby crying
+ bus = game.addChild(new Bus());
+ bus.x = 1024;
+ bus.y = 1200;
+ baby = game.addChild(new Baby());
+ baby.x = 1024;
+ baby.y = 1100;
+ LK.setTimeout(function () {
+ baby.cry();
+ LK.getSound('crySound').play();
+ }, 500);
+ break;
+ case 3:
+ // Teacher shushing
+ bus = game.addChild(new Bus());
+ bus.x = 1024;
+ bus.y = 1200;
+ teacher = game.addChild(new Teacher());
+ teacher.x = 900;
+ teacher.y = 1100;
+ LK.setTimeout(function () {
+ teacher.shush();
+ LK.getSound('shushSound').play();
+ }, 500);
+ break;
+ case 4:
+ // Driver directing
+ bus = game.addChild(new Bus());
+ bus.x = 1024;
+ bus.y = 1200;
+ driver = game.addChild(new Driver());
+ driver.x = 750;
+ driver.y = 1050;
+ LK.setTimeout(function () {
+ driver.gesture();
+ }, 500);
+ break;
+ }
+ continueButton.visible = true;
+}
+function endStory() {
+ continueButton.visible = false;
+ sceneText.setText('The End! Tap PLAY to watch again!');
+ playButton.visible = true;
+ // Clear all scene elements
+ if (bus) {
+ bus.destroy();
+ bus = null;
+ }
+ if (baby) {
+ baby.destroy();
+ baby = null;
+ }
+ if (teacher) {
+ teacher.destroy();
+ teacher = null;
+ }
+ if (driver) {
+ driver.destroy();
+ driver = null;
+ }
+}
+game.update = function () {
+ // Game loop updates if needed
+};
\ No newline at end of file