Code edit (1 edits merged)
Please save this source code
User prompt
PBS Kids Super Hero Transformation
Initial prompt
PBS kids: tap to turn dash into mega dash with strong muscles, and tap to turn dot into mega dot with big teeth to eat with, and tap to turn del into mega del with longest arms to stretch with, and turn dee into mega dee with a cape to fly with
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var Character = Container.expand(function (characterType) {
var self = Container.call(this);
self.characterType = characterType;
self.isTransformed = false;
// Base character graphics
var baseGraphics = self.attachAsset(characterType + 'Base', {
anchorX: 0.5,
anchorY: 0.5
});
// Character name text
var nameText = new Text2(characterType.toUpperCase(), {
size: 60,
fill: 0xFFFFFF
});
nameText.anchor.set(0.5, 0.5);
nameText.x = 0;
nameText.y = -250;
self.addChild(nameText);
// Transformation elements
self.transformElements = [];
self.createTransformationElements = function () {
// Clear existing transformation elements
for (var i = 0; i < self.transformElements.length; i++) {
self.transformElements[i].destroy();
}
self.transformElements = [];
if (self.characterType === 'dash') {
// Create muscles
var leftMuscle = LK.getAsset('muscle', {
anchorX: 0.5,
anchorY: 0.5
});
leftMuscle.x = -120;
leftMuscle.y = -50;
self.addChild(leftMuscle);
self.transformElements.push(leftMuscle);
var rightMuscle = LK.getAsset('muscle', {
anchorX: 0.5,
anchorY: 0.5
});
rightMuscle.x = 120;
rightMuscle.y = -50;
self.addChild(rightMuscle);
self.transformElements.push(rightMuscle);
} else if (self.characterType === 'dot') {
// Create teeth
var leftTooth = LK.getAsset('tooth', {
anchorX: 0.5,
anchorY: 0.5
});
leftTooth.x = -40;
leftTooth.y = 50;
self.addChild(leftTooth);
self.transformElements.push(leftTooth);
var rightTooth = LK.getAsset('tooth', {
anchorX: 0.5,
anchorY: 0.5
});
rightTooth.x = 40;
rightTooth.y = 50;
self.addChild(rightTooth);
self.transformElements.push(rightTooth);
} else if (self.characterType === 'del') {
// Create stretchy arms
var leftArm = LK.getAsset('arm', {
anchorX: 0,
anchorY: 0.5
});
leftArm.x = -200;
leftArm.y = 0;
leftArm.scaleX = 1.5;
self.addChild(leftArm);
self.transformElements.push(leftArm);
var rightArm = LK.getAsset('arm', {
anchorX: 1,
anchorY: 0.5
});
rightArm.x = 200;
rightArm.y = 0;
rightArm.scaleX = 1.5;
self.addChild(rightArm);
self.transformElements.push(rightArm);
} else if (self.characterType === 'dee') {
// Create cape
var cape = LK.getAsset('cape', {
anchorX: 0.5,
anchorY: 0
});
cape.x = 0;
cape.y = -200;
self.addChild(cape);
self.transformElements.push(cape);
}
};
self.transform = function () {
if (self.isTransformed) {
self.untransform();
return;
}
self.isTransformed = true;
self.createTransformationElements();
// Base transformation animation
tween(baseGraphics, {
scaleX: 1.2,
scaleY: 1.2
}, {
duration: 300,
easing: tween.elasticOut
});
// Character-specific transformations and animations
if (self.characterType === 'dash') {
LK.getSound('powerUp').play();
LK.effects.flashObject(self, 0xffff00, 500);
// Animate muscles growing
for (var i = 0; i < self.transformElements.length; i++) {
var muscle = self.transformElements[i];
muscle.scaleX = 0;
muscle.scaleY = 0;
tween(muscle, {
scaleX: 1.3,
scaleY: 1.3
}, {
duration: 400,
easing: tween.bounceOut
});
}
} else if (self.characterType === 'dot') {
LK.getSound('chomp').play();
// Animate teeth appearing and chomping
for (var i = 0; i < self.transformElements.length; i++) {
var tooth = self.transformElements[i];
tooth.scaleY = 0;
tween(tooth, {
scaleY: 1.5
}, {
duration: 300,
easing: tween.bounceOut,
onFinish: function onFinish() {
// Chomping animation
tween(tooth, {
scaleY: 1.2
}, {
duration: 200
});
}
});
}
} else if (self.characterType === 'del') {
LK.getSound('stretch').play();
// Animate arms stretching
for (var i = 0; i < self.transformElements.length; i++) {
var arm = self.transformElements[i];
var originalScaleX = arm.scaleX;
tween(arm, {
scaleX: originalScaleX * 2
}, {
duration: 600,
easing: tween.elasticOut
});
}
} else if (self.characterType === 'dee') {
LK.getSound('fly').play();
// Animate cape and flying motion
var cape = self.transformElements[0];
cape.alpha = 0;
tween(cape, {
alpha: 1
}, {
duration: 300
});
// Flying animation - move up and down
self.startFlying();
}
};
self.startFlying = function () {
if (!self.isTransformed || self.characterType !== 'dee') return;
var originalY = self.y;
tween(self, {
y: originalY - 30
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
if (self.isTransformed) {
tween(self, {
y: originalY + 30
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
if (self.isTransformed) {
self.startFlying();
}
}
});
}
}
});
};
self.untransform = function () {
self.isTransformed = false;
// Stop any ongoing animations
tween.stop(self);
tween.stop(baseGraphics);
// Reset base graphics
tween(baseGraphics, {
scaleX: 1,
scaleY: 1
}, {
duration: 200,
easing: tween.easeOut
});
// Remove transformation elements
for (var i = 0; i < self.transformElements.length; i++) {
tween(self.transformElements[i], {
alpha: 0,
scaleX: 0,
scaleY: 0
}, {
duration: 200,
easing: tween.easeIn,
onFinish: function onFinish() {
if (self.transformElements[i]) {
self.transformElements[i].destroy();
}
}
});
}
self.transformElements = [];
// Reset position for Dee
if (self.characterType === 'dee') {
tween(self, {
y: self.originalY
}, {
duration: 300
});
}
};
self.down = function (x, y, obj) {
self.transform();
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x87ceeb
});
/****
* Game Code
****/
// Sound effects
// Transformation effects
// Character base assets
// Title text
var titleText = new Text2('PBS KIDS SUPER HEROES', {
size: 80,
fill: 0xFFFFFF
});
titleText.anchor.set(0.5, 0.5);
titleText.x = 2048 / 2;
titleText.y = 200;
game.addChild(titleText);
// Instructions text
var instructionsText = new Text2('TAP TO TRANSFORM!', {
size: 60,
fill: 0xFFFF00
});
instructionsText.anchor.set(0.5, 0.5);
instructionsText.x = 2048 / 2;
instructionsText.y = 300;
game.addChild(instructionsText);
// Create characters
var characters = [];
var characterTypes = ['dash', 'dot', 'del', 'dee'];
var characterNames = ['DASH', 'DOT', 'DEL', 'DEE'];
// Position characters in a 2x2 grid
var gridPositions = [{
x: 2048 / 4,
y: 2732 / 2 - 200
},
// Top left
{
x: 3 * 2048 / 4,
y: 2732 / 2 - 200
},
// Top right
{
x: 2048 / 4,
y: 2732 / 2 + 200
},
// Bottom left
{
x: 3 * 2048 / 4,
y: 2732 / 2 + 200
} // Bottom right
];
for (var i = 0; i < characterTypes.length; i++) {
var character = new Character(characterTypes[i]);
character.x = gridPositions[i].x;
character.y = gridPositions[i].y;
character.originalY = character.y; // Store original Y for reset
game.addChild(character);
characters.push(character);
}
// Add sparkle effects periodically
var sparkleTimer = 0;
game.update = function () {
sparkleTimer++;
// Add sparkle effects every 2 seconds
if (sparkleTimer % 120 === 0) {
for (var i = 0; i < characters.length; i++) {
if (characters[i].isTransformed) {
LK.effects.flashObject(characters[i], 0xffffff, 300);
}
}
}
}; /****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var Character = Container.expand(function (characterType) {
var self = Container.call(this);
self.characterType = characterType;
self.isTransformed = false;
// Base character graphics
var baseGraphics = self.attachAsset(characterType + 'Base', {
anchorX: 0.5,
anchorY: 0.5
});
// Character name text
var nameText = new Text2(characterType.toUpperCase(), {
size: 60,
fill: 0xFFFFFF
});
nameText.anchor.set(0.5, 0.5);
nameText.x = 0;
nameText.y = -250;
self.addChild(nameText);
// Transformation elements
self.transformElements = [];
self.createTransformationElements = function () {
// Clear existing transformation elements
for (var i = 0; i < self.transformElements.length; i++) {
self.transformElements[i].destroy();
}
self.transformElements = [];
if (self.characterType === 'dash') {
// Create muscles
var leftMuscle = LK.getAsset('muscle', {
anchorX: 0.5,
anchorY: 0.5
});
leftMuscle.x = -120;
leftMuscle.y = -50;
self.addChild(leftMuscle);
self.transformElements.push(leftMuscle);
var rightMuscle = LK.getAsset('muscle', {
anchorX: 0.5,
anchorY: 0.5
});
rightMuscle.x = 120;
rightMuscle.y = -50;
self.addChild(rightMuscle);
self.transformElements.push(rightMuscle);
} else if (self.characterType === 'dot') {
// Create teeth
var leftTooth = LK.getAsset('tooth', {
anchorX: 0.5,
anchorY: 0.5
});
leftTooth.x = -40;
leftTooth.y = 50;
self.addChild(leftTooth);
self.transformElements.push(leftTooth);
var rightTooth = LK.getAsset('tooth', {
anchorX: 0.5,
anchorY: 0.5
});
rightTooth.x = 40;
rightTooth.y = 50;
self.addChild(rightTooth);
self.transformElements.push(rightTooth);
} else if (self.characterType === 'del') {
// Create stretchy arms
var leftArm = LK.getAsset('arm', {
anchorX: 0,
anchorY: 0.5
});
leftArm.x = -200;
leftArm.y = 0;
leftArm.scaleX = 1.5;
self.addChild(leftArm);
self.transformElements.push(leftArm);
var rightArm = LK.getAsset('arm', {
anchorX: 1,
anchorY: 0.5
});
rightArm.x = 200;
rightArm.y = 0;
rightArm.scaleX = 1.5;
self.addChild(rightArm);
self.transformElements.push(rightArm);
} else if (self.characterType === 'dee') {
// Create cape
var cape = LK.getAsset('cape', {
anchorX: 0.5,
anchorY: 0
});
cape.x = 0;
cape.y = -200;
self.addChild(cape);
self.transformElements.push(cape);
}
};
self.transform = function () {
if (self.isTransformed) {
self.untransform();
return;
}
self.isTransformed = true;
self.createTransformationElements();
// Base transformation animation
tween(baseGraphics, {
scaleX: 1.2,
scaleY: 1.2
}, {
duration: 300,
easing: tween.elasticOut
});
// Character-specific transformations and animations
if (self.characterType === 'dash') {
LK.getSound('powerUp').play();
LK.effects.flashObject(self, 0xffff00, 500);
// Animate muscles growing
for (var i = 0; i < self.transformElements.length; i++) {
var muscle = self.transformElements[i];
muscle.scaleX = 0;
muscle.scaleY = 0;
tween(muscle, {
scaleX: 1.3,
scaleY: 1.3
}, {
duration: 400,
easing: tween.bounceOut
});
}
} else if (self.characterType === 'dot') {
LK.getSound('chomp').play();
// Animate teeth appearing and chomping
for (var i = 0; i < self.transformElements.length; i++) {
var tooth = self.transformElements[i];
tooth.scaleY = 0;
tween(tooth, {
scaleY: 1.5
}, {
duration: 300,
easing: tween.bounceOut,
onFinish: function onFinish() {
// Chomping animation
tween(tooth, {
scaleY: 1.2
}, {
duration: 200
});
}
});
}
} else if (self.characterType === 'del') {
LK.getSound('stretch').play();
// Animate arms stretching
for (var i = 0; i < self.transformElements.length; i++) {
var arm = self.transformElements[i];
var originalScaleX = arm.scaleX;
tween(arm, {
scaleX: originalScaleX * 2
}, {
duration: 600,
easing: tween.elasticOut
});
}
} else if (self.characterType === 'dee') {
LK.getSound('fly').play();
// Animate cape and flying motion
var cape = self.transformElements[0];
cape.alpha = 0;
tween(cape, {
alpha: 1
}, {
duration: 300
});
// Flying animation - move up and down
self.startFlying();
}
};
self.startFlying = function () {
if (!self.isTransformed || self.characterType !== 'dee') return;
var originalY = self.y;
tween(self, {
y: originalY - 30
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
if (self.isTransformed) {
tween(self, {
y: originalY + 30
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
if (self.isTransformed) {
self.startFlying();
}
}
});
}
}
});
};
self.untransform = function () {
self.isTransformed = false;
// Stop any ongoing animations
tween.stop(self);
tween.stop(baseGraphics);
// Reset base graphics
tween(baseGraphics, {
scaleX: 1,
scaleY: 1
}, {
duration: 200,
easing: tween.easeOut
});
// Remove transformation elements
for (var i = 0; i < self.transformElements.length; i++) {
tween(self.transformElements[i], {
alpha: 0,
scaleX: 0,
scaleY: 0
}, {
duration: 200,
easing: tween.easeIn,
onFinish: function onFinish() {
if (self.transformElements[i]) {
self.transformElements[i].destroy();
}
}
});
}
self.transformElements = [];
// Reset position for Dee
if (self.characterType === 'dee') {
tween(self, {
y: self.originalY
}, {
duration: 300
});
}
};
self.down = function (x, y, obj) {
self.transform();
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x87ceeb
});
/****
* Game Code
****/
// Sound effects
// Transformation effects
// Character base assets
// Title text
var titleText = new Text2('PBS KIDS SUPER HEROES', {
size: 80,
fill: 0xFFFFFF
});
titleText.anchor.set(0.5, 0.5);
titleText.x = 2048 / 2;
titleText.y = 200;
game.addChild(titleText);
// Instructions text
var instructionsText = new Text2('TAP TO TRANSFORM!', {
size: 60,
fill: 0xFFFF00
});
instructionsText.anchor.set(0.5, 0.5);
instructionsText.x = 2048 / 2;
instructionsText.y = 300;
game.addChild(instructionsText);
// Create characters
var characters = [];
var characterTypes = ['dash', 'dot', 'del', 'dee'];
var characterNames = ['DASH', 'DOT', 'DEL', 'DEE'];
// Position characters in a 2x2 grid
var gridPositions = [{
x: 2048 / 4,
y: 2732 / 2 - 200
},
// Top left
{
x: 3 * 2048 / 4,
y: 2732 / 2 - 200
},
// Top right
{
x: 2048 / 4,
y: 2732 / 2 + 200
},
// Bottom left
{
x: 3 * 2048 / 4,
y: 2732 / 2 + 200
} // Bottom right
];
for (var i = 0; i < characterTypes.length; i++) {
var character = new Character(characterTypes[i]);
character.x = gridPositions[i].x;
character.y = gridPositions[i].y;
character.originalY = character.y; // Store original Y for reset
game.addChild(character);
characters.push(character);
}
// Add sparkle effects periodically
var sparkleTimer = 0;
game.update = function () {
sparkleTimer++;
// Add sparkle effects every 2 seconds
if (sparkleTimer % 120 === 0) {
for (var i = 0; i < characters.length; i++) {
if (characters[i].isTransformed) {
LK.effects.flashObject(characters[i], 0xffffff, 300);
}
}
}
};