Code edit (1 edits merged)
Please save this source code
User prompt
Piano Play
Initial prompt
Toca piano (2012). Rosie 🐹 is playing piano. Tap on the piano keys, tap on the Mary had a little lamb button, old macdonald button, jingle bells button, twinkle twinkle little star button, or the abc song button to make the Piano do a sequence, tap on the piano sequence keys
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var PianoKey = Container.expand(function (note, isBlack, position) {
var self = Container.call(this);
self.note = note;
self.isBlack = isBlack;
self.isPressed = false;
var keyAsset = isBlack ? 'blackKey' : 'whiteKey';
var keyPressedAsset = isBlack ? 'blackKeyPressed' : 'whiteKeyPressed';
self.normalGraphics = self.attachAsset(keyAsset, {
anchorX: 0.5,
anchorY: 0
});
self.pressedGraphics = self.attachAsset(keyPressedAsset, {
anchorX: 0.5,
anchorY: 0
});
self.pressedGraphics.visible = false;
self.x = position.x;
self.y = position.y;
self.press = function () {
if (self.isPressed) return;
self.isPressed = true;
self.normalGraphics.visible = false;
self.pressedGraphics.visible = true;
LK.getSound(self.note).play();
var releaseTimeout = LK.setTimeout(function () {
self.release();
}, 200);
};
self.release = function () {
self.isPressed = false;
self.normalGraphics.visible = true;
self.pressedGraphics.visible = false;
};
self.down = function (x, y, obj) {
self.press();
};
return self;
});
var SongButton = Container.expand(function (songName, position) {
var self = Container.call(this);
self.songName = songName;
self.buttonGraphics = self.attachAsset('songButton', {
anchorX: 0.5,
anchorY: 0.5
});
self.buttonText = new Text2(songName, {
size: 32,
fill: 0xFFFFFF
});
self.buttonText.anchor.set(0.5, 0.5);
self.addChild(self.buttonText);
self.x = position.x;
self.y = position.y;
self.down = function (x, y, obj) {
tween(self, {
scaleX: 0.95,
scaleY: 0.95
}, {
duration: 100,
onFinish: function onFinish() {
tween(self, {
scaleX: 1,
scaleY: 1
}, {
duration: 100
});
}
});
playSong(self.songName);
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x87CEEB
});
/****
* Game Code
****/
var keys = [];
var songButtons = [];
var currentSong = null;
var songTimeout = null;
var songIndex = 0;
// Define songs with note sequences and timings
var songs = {
"Mary Had a Little Lamb": [{
note: "E4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "C4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 1000
}, {
note: "D4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "D4",
duration: 1000
}, {
note: "E4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "G4",
duration: 1000
}],
"Old MacDonald": [{
note: "G4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "D4",
duration: 1000
}, {
note: "B4",
duration: 500
}, {
note: "B4",
duration: 500
}, {
note: "A4",
duration: 500
}, {
note: "A4",
duration: 500
}, {
note: "G4",
duration: 1000
}],
"Jingle Bells": [{
note: "E4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 1000
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 1000
}, {
note: "E4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "C4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "E4",
duration: 1000
}],
"Twinkle Twinkle Little Star": [{
note: "C4",
duration: 500
}, {
note: "C4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "A4",
duration: 500
}, {
note: "A4",
duration: 500
}, {
note: "G4",
duration: 1000
}, {
note: "F4",
duration: 500
}, {
note: "F4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "D4",
duration: 500
}, {
note: "C4",
duration: 1000
}],
"ABC Song": [{
note: "C4",
duration: 500
}, {
note: "C4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "G4",
duration: 500
}, {
note: "A4",
duration: 500
}, {
note: "A4",
duration: 500
}, {
note: "G4",
duration: 1000
}, {
note: "F4",
duration: 500
}, {
note: "F4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "E4",
duration: 500
}, {
note: "D4",
duration: 1000
}]
};
// Create piano keys
var whiteKeyNotes = ["C4", "D4", "E4", "F4", "G4", "A4", "B4", "C5", "D5", "E5", "F5", "G5"];
var blackKeyNotes = ["Cs4", "Ds4", "Fs4", "Gs4", "As4", "Cs5", "Ds5"];
var blackKeyPositions = [1, 2, 4, 5, 6, 8, 9]; // Positions relative to white keys
var keyboardStartX = 200;
var keyboardY = 1800;
var whiteKeyWidth = 90;
var whiteKeySpacing = 95;
// Create white keys
for (var i = 0; i < whiteKeyNotes.length; i++) {
var whiteKey = new PianoKey(whiteKeyNotes[i], false, {
x: keyboardStartX + i * whiteKeySpacing,
y: keyboardY
});
keys.push(whiteKey);
game.addChild(whiteKey);
}
// Create black keys
for (var i = 0; i < blackKeyNotes.length; i++) {
var blackKeyPos = blackKeyPositions[i];
var blackKey = new PianoKey(blackKeyNotes[i], true, {
x: keyboardStartX + blackKeyPos * whiteKeySpacing - whiteKeySpacing / 2,
y: keyboardY
});
keys.push(blackKey);
game.addChild(blackKey);
}
// Create song buttons
var songNames = ["Mary Had a Little Lamb", "Old MacDonald", "Jingle Bells", "Twinkle Twinkle Little Star", "ABC Song"];
var buttonStartY = 400;
var buttonSpacing = 120;
for (var i = 0; i < songNames.length; i++) {
var songButton = new SongButton(songNames[i], {
x: 1024,
y: buttonStartY + i * buttonSpacing
});
songButtons.push(songButton);
game.addChild(songButton);
}
function playSong(songName) {
if (currentSong) {
LK.clearTimeout(songTimeout);
currentSong = null;
}
var songNotes = songs[songName];
if (!songNotes) return;
currentSong = songNotes;
songIndex = 0;
playNextNote();
}
function playNextNote() {
if (!currentSong || songIndex >= currentSong.length) {
currentSong = null;
return;
}
var noteData = currentSong[songIndex];
var note = noteData.note;
var duration = noteData.duration;
// Find and press the corresponding key
var keyToPress = null;
for (var i = 0; i < keys.length; i++) {
if (keys[i].note === note) {
keyToPress = keys[i];
break;
}
}
if (keyToPress) {
keyToPress.press();
}
songIndex++;
songTimeout = LK.setTimeout(function () {
playNextNote();
}, duration);
}
game.update = function () {
// Game update logic if needed
}; ===================================================================
--- original.js
+++ change.js
@@ -1,6 +1,367 @@
-/****
+/****
+* Plugins
+****/
+var tween = LK.import("@upit/tween.v1");
+
+/****
+* Classes
+****/
+var PianoKey = Container.expand(function (note, isBlack, position) {
+ var self = Container.call(this);
+ self.note = note;
+ self.isBlack = isBlack;
+ self.isPressed = false;
+ var keyAsset = isBlack ? 'blackKey' : 'whiteKey';
+ var keyPressedAsset = isBlack ? 'blackKeyPressed' : 'whiteKeyPressed';
+ self.normalGraphics = self.attachAsset(keyAsset, {
+ anchorX: 0.5,
+ anchorY: 0
+ });
+ self.pressedGraphics = self.attachAsset(keyPressedAsset, {
+ anchorX: 0.5,
+ anchorY: 0
+ });
+ self.pressedGraphics.visible = false;
+ self.x = position.x;
+ self.y = position.y;
+ self.press = function () {
+ if (self.isPressed) return;
+ self.isPressed = true;
+ self.normalGraphics.visible = false;
+ self.pressedGraphics.visible = true;
+ LK.getSound(self.note).play();
+ var releaseTimeout = LK.setTimeout(function () {
+ self.release();
+ }, 200);
+ };
+ self.release = function () {
+ self.isPressed = false;
+ self.normalGraphics.visible = true;
+ self.pressedGraphics.visible = false;
+ };
+ self.down = function (x, y, obj) {
+ self.press();
+ };
+ return self;
+});
+var SongButton = Container.expand(function (songName, position) {
+ var self = Container.call(this);
+ self.songName = songName;
+ self.buttonGraphics = self.attachAsset('songButton', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.buttonText = new Text2(songName, {
+ size: 32,
+ fill: 0xFFFFFF
+ });
+ self.buttonText.anchor.set(0.5, 0.5);
+ self.addChild(self.buttonText);
+ self.x = position.x;
+ self.y = position.y;
+ self.down = function (x, y, obj) {
+ tween(self, {
+ scaleX: 0.95,
+ scaleY: 0.95
+ }, {
+ duration: 100,
+ onFinish: function onFinish() {
+ tween(self, {
+ scaleX: 1,
+ scaleY: 1
+ }, {
+ duration: 100
+ });
+ }
+ });
+ playSong(self.songName);
+ };
+ return self;
+});
+
+/****
* Initialize Game
-****/
+****/
var game = new LK.Game({
- backgroundColor: 0x000000
-});
\ No newline at end of file
+ backgroundColor: 0x87CEEB
+});
+
+/****
+* Game Code
+****/
+var keys = [];
+var songButtons = [];
+var currentSong = null;
+var songTimeout = null;
+var songIndex = 0;
+// Define songs with note sequences and timings
+var songs = {
+ "Mary Had a Little Lamb": [{
+ note: "E4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "C4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 1000
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 1000
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 1000
+ }],
+ "Old MacDonald": [{
+ note: "G4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 1000
+ }, {
+ note: "B4",
+ duration: 500
+ }, {
+ note: "B4",
+ duration: 500
+ }, {
+ note: "A4",
+ duration: 500
+ }, {
+ note: "A4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 1000
+ }],
+ "Jingle Bells": [{
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 1000
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 1000
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "C4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 1000
+ }],
+ "Twinkle Twinkle Little Star": [{
+ note: "C4",
+ duration: 500
+ }, {
+ note: "C4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "A4",
+ duration: 500
+ }, {
+ note: "A4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 1000
+ }, {
+ note: "F4",
+ duration: 500
+ }, {
+ note: "F4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 500
+ }, {
+ note: "C4",
+ duration: 1000
+ }],
+ "ABC Song": [{
+ note: "C4",
+ duration: 500
+ }, {
+ note: "C4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 500
+ }, {
+ note: "A4",
+ duration: 500
+ }, {
+ note: "A4",
+ duration: 500
+ }, {
+ note: "G4",
+ duration: 1000
+ }, {
+ note: "F4",
+ duration: 500
+ }, {
+ note: "F4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "E4",
+ duration: 500
+ }, {
+ note: "D4",
+ duration: 1000
+ }]
+};
+// Create piano keys
+var whiteKeyNotes = ["C4", "D4", "E4", "F4", "G4", "A4", "B4", "C5", "D5", "E5", "F5", "G5"];
+var blackKeyNotes = ["Cs4", "Ds4", "Fs4", "Gs4", "As4", "Cs5", "Ds5"];
+var blackKeyPositions = [1, 2, 4, 5, 6, 8, 9]; // Positions relative to white keys
+var keyboardStartX = 200;
+var keyboardY = 1800;
+var whiteKeyWidth = 90;
+var whiteKeySpacing = 95;
+// Create white keys
+for (var i = 0; i < whiteKeyNotes.length; i++) {
+ var whiteKey = new PianoKey(whiteKeyNotes[i], false, {
+ x: keyboardStartX + i * whiteKeySpacing,
+ y: keyboardY
+ });
+ keys.push(whiteKey);
+ game.addChild(whiteKey);
+}
+// Create black keys
+for (var i = 0; i < blackKeyNotes.length; i++) {
+ var blackKeyPos = blackKeyPositions[i];
+ var blackKey = new PianoKey(blackKeyNotes[i], true, {
+ x: keyboardStartX + blackKeyPos * whiteKeySpacing - whiteKeySpacing / 2,
+ y: keyboardY
+ });
+ keys.push(blackKey);
+ game.addChild(blackKey);
+}
+// Create song buttons
+var songNames = ["Mary Had a Little Lamb", "Old MacDonald", "Jingle Bells", "Twinkle Twinkle Little Star", "ABC Song"];
+var buttonStartY = 400;
+var buttonSpacing = 120;
+for (var i = 0; i < songNames.length; i++) {
+ var songButton = new SongButton(songNames[i], {
+ x: 1024,
+ y: buttonStartY + i * buttonSpacing
+ });
+ songButtons.push(songButton);
+ game.addChild(songButton);
+}
+function playSong(songName) {
+ if (currentSong) {
+ LK.clearTimeout(songTimeout);
+ currentSong = null;
+ }
+ var songNotes = songs[songName];
+ if (!songNotes) return;
+ currentSong = songNotes;
+ songIndex = 0;
+ playNextNote();
+}
+function playNextNote() {
+ if (!currentSong || songIndex >= currentSong.length) {
+ currentSong = null;
+ return;
+ }
+ var noteData = currentSong[songIndex];
+ var note = noteData.note;
+ var duration = noteData.duration;
+ // Find and press the corresponding key
+ var keyToPress = null;
+ for (var i = 0; i < keys.length; i++) {
+ if (keys[i].note === note) {
+ keyToPress = keys[i];
+ break;
+ }
+ }
+ if (keyToPress) {
+ keyToPress.press();
+ }
+ songIndex++;
+ songTimeout = LK.setTimeout(function () {
+ playNextNote();
+ }, duration);
+}
+game.update = function () {
+ // Game update logic if needed
+};
\ No newline at end of file