Code edit (1 edits merged)
Please save this source code
User prompt
Call update face after switching
User prompt
Call updatefaceposition once at game start
User prompt
Call updatefaceposition once then only when not tweening
User prompt
Call updatefaceposition only when not tweening
Code edit (1 edits merged)
Please save this source code
User prompt
Please fix the bug: 'TypeError: target is not an Object. (evaluating 'key in target')' in or related to this line: 'tween(self.elements.head.scale, {' Line Number: 215
User prompt
Apply tween for head scale too āŖš” Consider importing and using the following plugins: @upit/tween.v1
Code edit (1 edits merged)
Please save this source code
User prompt
Add a system to wait for tween anim to end before starting the next āŖš” Consider importing and using the following plugins: @upit/tween.v1
User prompt
Add a global target position and use easing to make face movement less jerky āŖš” Consider importing and using the following plugins: @upit/tween.v1
User prompt
Use nose tip position for face
User prompt
Add a new background asset
User prompt
Remove switchButton (but keep troll face switch feature when player taps screen
User prompt
Add a white background
User prompt
Add separate assets for left and right eyes
User prompt
Please fix the bug: 'TypeError: self.elements.mouth.scale.set is not a function. (In 'self.elements.mouth.scale.set(self.elements.head.scale.x * 0.7, self.elements.head.scale.y * 0.7)', 'self.elements.mouth.scale.set' is undefined)' in or related to this line: 'self.elements.mouth.scale.set(self.elements.head.scale.x * 0.7, self.elements.head.scale.y * 0.7);' Line Number: 246
User prompt
Please fix the bug: 'TypeError: self.elements.rightEye.scale.set is not a function. (In 'self.elements.rightEye.scale.set(self.elements.head.scale.x * 0.5, self.elements.head.scale.y * 0.5)', 'self.elements.rightEye.scale.set' is undefined)' in or related to this line: 'self.elements.rightEye.scale.set(self.elements.head.scale.x * 0.5, self.elements.head.scale.y * 0.5);' Line Number: 234
User prompt
Please fix the bug: 'TypeError: self.elements.leftEye.scale.set is not a function. (In 'self.elements.leftEye.scale.set(self.elements.head.scale.x * 0.5, self.elements.head.scale.y * 0.5)', 'self.elements.leftEye.scale.set' is undefined)' in or related to this line: 'self.elements.leftEye.scale.set(self.elements.head.scale.x * 0.5, self.elements.head.scale.y * 0.5);' Line Number: 223
User prompt
Please fix the bug: 'TypeError: self.elements.head.scale.set is not a function. (In 'self.elements.head.scale.set(scale * 1.5, scale * 1.8)', 'self.elements.head.scale.set' is undefined)' in or related to this line: 'self.elements.head.scale.set(scale * 1.5, scale * 1.8);' Line Number: 211
Code edit (1 edits merged)
Please save this source code
User prompt
TrollFace Takeover
Initial prompt
Facekit funny tool where you face is replaced by a troll face. You can choose between 3 troll faces. Each face has assets for each part, i.e. head_0, leftEye_0, rightEye_0, upperLip_0, lowerLip_0. Player tap screen to switch between faces.
/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); var storage = LK.import("@upit/storage.v1"); var facekit = LK.import("@upit/facekit.v1"); /**** * Classes ****/ var DebugPoints = Container.expand(function () { var self = Container.call(this); // Create points for face tracking debugging self.points = { leftEye: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }), rightEye: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }), noseTip: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }), mouthCenter: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }), upperLip: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }), lowerLip: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }), chin: self.attachAsset('debugFacePoints', { anchorX: 0.5, anchorY: 0.5 }) }; // Update debug points to match face points self.update = function () { if (!facekit) { return; } if (facekit.leftEye) { self.points.leftEye.x = facekit.leftEye.x; self.points.leftEye.y = facekit.leftEye.y; } if (facekit.rightEye) { self.points.rightEye.x = facekit.rightEye.x; self.points.rightEye.y = facekit.rightEye.y; } if (facekit.noseTip) { self.points.noseTip.x = facekit.noseTip.x; self.points.noseTip.y = facekit.noseTip.y; } if (facekit.mouthCenter) { self.points.mouthCenter.x = facekit.mouthCenter.x; self.points.mouthCenter.y = facekit.mouthCenter.y; } if (facekit.upperLip) { self.points.upperLip.x = facekit.upperLip.x; self.points.upperLip.y = facekit.upperLip.y; } if (facekit.lowerLip) { self.points.lowerLip.x = facekit.lowerLip.x; self.points.lowerLip.y = facekit.lowerLip.y; } if (facekit.chin) { self.points.chin.x = facekit.chin.x; self.points.chin.y = facekit.chin.y; } }; return self; }); var SwitchButton = Container.expand(function () { var self = Container.call(this); // Create button var buttonBackground = self.attachAsset('trollFaceButton', { anchorX: 0.5, anchorY: 0.5 }); // Add text var buttonText = new Text2('Switch', { size: 50, fill: 0xFFFFFF }); buttonText.anchor.set(0.5, 0.5); self.addChild(buttonText); // Handle press event self.down = function (x, y, obj) { // Scale down for press effect tween(buttonBackground, { scaleX: 0.9, scaleY: 0.9 }, { duration: 100 }); }; // Handle release event self.up = function (x, y, obj) { // Scale back up on release tween(buttonBackground, { scaleX: 1, scaleY: 1 }, { duration: 100, onFinish: function onFinish() { // Trigger switch event if (self.onSwitch) { self.onSwitch(); } } }); }; return self; }); var TrollFace = Container.expand(function () { var self = Container.call(this); // Properties self.currentStyle = 1; self.elements = {}; // Initialize the troll face elements self.initialize = function (style) { // Clear previous elements self.removeAllElements(); // Create new elements for the selected style self.createFaceElements(style || self.currentStyle); }; // Create face elements for a specific style self.createFaceElements = function (style) { // Create head self.elements.head = self.attachAsset('trollHead' + style, { anchorX: 0.5, anchorY: 0.5, scale: 1 }); // Create eyes self.elements.leftEye = self.attachAsset('trollLeftEye' + style, { anchorX: 0.5, anchorY: 0.5, scale: 1 }); self.elements.rightEye = self.attachAsset('trollRightEye' + style, { anchorX: 0.5, anchorY: 0.5, scale: 1 }); // Create mouth self.elements.mouth = self.attachAsset('trollMouth' + style, { anchorX: 0.5, anchorY: 0.5, scale: 1 }); }; // Remove all face elements self.removeAllElements = function () { if (self.elements.head) { self.removeChild(self.elements.head); } if (self.elements.leftEye) { self.removeChild(self.elements.leftEye); } if (self.elements.rightEye) { self.removeChild(self.elements.rightEye); } if (self.elements.mouth) { self.removeChild(self.elements.mouth); } }; // Change to the next troll face style self.nextStyle = function () { self.currentStyle = self.currentStyle % 3 + 1; self.initialize(); return self.currentStyle; }; // Update face elements to match real face self.updateFacePosition = function () { if (!facekit) { return; } // Position the head at the center of the face if (self.elements.head) { // Head follows overall face position self.elements.head.x = 0; self.elements.head.y = 0; // Scale head based on distance between eyes if (facekit.leftEye && facekit.rightEye) { var eyeDistance = Math.sqrt(Math.pow(facekit.leftEye.x - facekit.rightEye.x, 2) + Math.pow(facekit.leftEye.y - facekit.rightEye.y, 2)); var scale = eyeDistance / 200; self.elements.head.scale = { x: scale * 1.5, y: scale * 1.8 }; // Ensure scale is an object with x and y properties } } // Position the eyes to match real eyes if (self.elements.leftEye && facekit.leftEye) { self.elements.leftEye.x = facekit.leftEye.x - self.x; self.elements.leftEye.y = facekit.leftEye.y - self.y; // Scale eyes based on face scale if (self.elements.head && self.elements.head.scale) { self.elements.leftEye.scale = { x: self.elements.head.scale.x * 0.5, y: self.elements.head.scale.y * 0.5 }; // Ensure scale is an object with x and y properties } } if (self.elements.rightEye && facekit.rightEye) { self.elements.rightEye.x = facekit.rightEye.x - self.x; self.elements.rightEye.y = facekit.rightEye.y - self.y; // Scale eyes based on face scale if (self.elements.head && self.elements.head.scale) { self.elements.rightEye.scale = { x: self.elements.head.scale.x * 0.5, y: self.elements.head.scale.y * 0.5 }; // Ensure scale is an object with x and y properties } } // Position the mouth to match real mouth if (self.elements.mouth && facekit.mouthCenter) { self.elements.mouth.x = facekit.mouthCenter.x - self.x; self.elements.mouth.y = facekit.mouthCenter.y - self.y; // Scale mouth based on face scale if (self.elements.head && self.elements.head.scale) { self.elements.mouth.scale = { x: self.elements.head.scale.x * 0.7, y: self.elements.head.scale.y * 0.7 }; // Ensure scale is an object with x and y properties } // Adjust mouth height based on whether mouth is open if (facekit.mouthOpen) { self.elements.mouth.scale.y = self.elements.mouth.scale.y * 1.5; } } }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0xFFFFFF }); /**** * Game Code ****/ // Global target position for the troll face var targetPosition = { x: 2048 / 2, y: 2732 / 2 }; var background = LK.getAsset('whiteBackground', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 2732 / 2 }); game.addChild(background); var instructionText = new Text2('Tap anywhere to change troll face', { size: 60, fill: 0xFFFFFF }); instructionText.anchor.set(0.5, 0); LK.gui.top.addChild(instructionText); instructionText.y = 50; // Add style text var styleText = new Text2('Style: 1/3', { size: 50, fill: 0xFFFFFF }); styleText.anchor.set(0.5, 0); LK.gui.top.addChild(styleText); styleText.y = 120; // Load the last used style from storage var lastStyle = storage.lastTrollStyle || 1; // Create the troll face var trollFace = new TrollFace(); trollFace.currentStyle = lastStyle; trollFace.initialize(); game.addChild(trollFace); // Set the troll face position to the center of the screen trollFace.x = 2048 / 2; trollFace.y = 2732 / 2; // Debug mode (turn on for development, off for production) var debugMode = false; var debugPoints = null; if (debugMode) { debugPoints = new DebugButton(); game.addChild(debugPoints); } // Handle tap anywhere on the screen to change face game.down = function (x, y, obj) { // Switch to the next troll face style var newStyle = trollFace.nextStyle(); // Save the current style to storage storage.lastTrollStyle = newStyle; // Update the style text styleText.setText('Style: ' + newStyle + '/3'); // Play switch sound LK.getSound('switchTroll').play(); }; // Update function called every frame game.update = function () { // Update troll face position to match real face if (facekit && facekit.noseTip) { // Use the nose tip position for the face with easing targetPosition.x = facekit.noseTip.x; targetPosition.y = facekit.noseTip.y; // Apply tweening for smooth movement and wait for it to finish before starting the next if (!trollFace.isTweening) { trollFace.isTweening = true; tween(trollFace, { x: targetPosition.x, y: targetPosition.y }, { duration: 300, easing: tween.easeInOut, onFinish: function onFinish() { trollFace.isTweening = false; } }); } // Update face elements to match real face features trollFace.updateFacePosition(); } // Update debug points if in debug mode if (debugMode && debugPoints) { debugPoints.update(); } };
===================================================================
--- original.js
+++ change.js
@@ -312,16 +312,22 @@
if (facekit && facekit.noseTip) {
// Use the nose tip position for the face with easing
targetPosition.x = facekit.noseTip.x;
targetPosition.y = facekit.noseTip.y;
- // Apply tweening for smooth movement
- tween(trollFace, {
- x: targetPosition.x,
- y: targetPosition.y
- }, {
- duration: 300,
- easing: tween.easeInOut
- });
+ // Apply tweening for smooth movement and wait for it to finish before starting the next
+ if (!trollFace.isTweening) {
+ trollFace.isTweening = true;
+ tween(trollFace, {
+ x: targetPosition.x,
+ y: targetPosition.y
+ }, {
+ duration: 300,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ trollFace.isTweening = false;
+ }
+ });
+ }
// Update face elements to match real face features
trollFace.updateFacePosition();
}
// Update debug points if in debug mode