Code edit (1 edits merged)
Please save this source code
User prompt
Hair Salon Studio
Initial prompt
Toca hair salon you (2011). Take a photo of you being a character, tap on any tool to get started, tap on the colored spray paint to color your hair, tap on any accessory onto your hair, tap on the camera to take a photo.
/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");
var facekit = LK.import("@upit/facekit.v1");
/**** 
* Classes
****/ 
var Accessory = Container.expand(function (accessoryType, x, y) {
	var self = Container.call(this);
	self.accessoryType = accessoryType;
	self.isDragging = false;
	var accessoryGraphics = self.attachAsset(accessoryType, {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.x = x;
	self.y = y;
	self.down = function (x, y, obj) {
		self.isDragging = true;
		draggedAccessory = self;
		tween(accessoryGraphics, {
			scaleX: 1.2,
			scaleY: 1.2
		}, {
			duration: 150
		});
	};
	self.up = function (x, y, obj) {
		self.isDragging = false;
		draggedAccessory = null;
		tween(accessoryGraphics, {
			scaleX: 1.0,
			scaleY: 1.0
		}, {
			duration: 150
		});
	};
	return self;
});
var ColorSwatch = Container.expand(function (colorName, colorValue) {
	var self = Container.call(this);
	self.colorName = colorName;
	self.colorValue = colorValue;
	var colorGraphics = self.attachAsset(colorName, {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.down = function (x, y, obj) {
		currentColor = self.colorValue;
		LK.getSound('click').play();
		// Visual feedback
		tween(colorGraphics, {
			scaleX: 1.3,
			scaleY: 1.3
		}, {
			duration: 100,
			onFinish: function onFinish() {
				tween(colorGraphics, {
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 100
				});
			}
		});
	};
	return self;
});
var CutEffect = Container.expand(function (x, y) {
	var self = Container.call(this);
	var cutGraphics = self.attachAsset('cutEffect', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.x = x;
	self.y = y;
	self.alpha = 1.0;
	self.update = function () {
		self.alpha -= 0.05;
		cutGraphics.scaleX += 0.1;
		cutGraphics.scaleY += 0.1;
		if (self.alpha <= 0) {
			self.destroy();
			var index = cutEffects.indexOf(self);
			if (index > -1) {
				cutEffects.splice(index, 1);
			}
		}
	};
	return self;
});
var HairSpray = Container.expand(function (x, y, color) {
	var self = Container.call(this);
	var sprayGraphics = self.attachAsset('hairSpray', {
		anchorX: 0.5,
		anchorY: 0.5,
		tint: color
	});
	self.x = x;
	self.y = y;
	self.alpha = 1.0;
	self.update = function () {
		self.alpha -= 0.02;
		sprayGraphics.scaleX += 0.05;
		sprayGraphics.scaleY += 0.05;
		if (self.alpha <= 0) {
			self.destroy();
			var index = hairSprays.indexOf(self);
			if (index > -1) {
				hairSprays.splice(index, 1);
			}
		}
	};
	return self;
});
var Tool = Container.expand(function (toolType, color) {
	var self = Container.call(this);
	self.toolType = toolType;
	self.isSelected = false;
	var toolGraphics = self.attachAsset(toolType, {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.select = function () {
		self.isSelected = true;
		toolGraphics.alpha = 1.0;
		tween(toolGraphics, {
			scaleX: 1.2,
			scaleY: 1.2
		}, {
			duration: 200
		});
	};
	self.deselect = function () {
		self.isSelected = false;
		toolGraphics.alpha = 0.7;
		tween(toolGraphics, {
			scaleX: 1.0,
			scaleY: 1.0
		}, {
			duration: 200
		});
	};
	self.down = function (x, y, obj) {
		currentTool = self.toolType;
		selectTool(self);
		LK.getSound('click').play();
	};
	// Initial state
	self.deselect();
	return self;
});
/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0xf0f0f0
});
/**** 
* Game Code
****/ 
// Sounds
// UI elements
// Accessories
// Color palette
// Styling tools
var currentTool = 'sprayPaint';
var currentColor = 0xff6b6b;
var tools = [];
var colorSwatches = [];
var accessories = [];
var hairSprays = [];
var cutEffects = [];
var draggedAccessory = null;
var isDrawing = false;
var lastSprayTime = 0;
// Create toolbar
var toolbar = game.addChild(LK.getAsset('toolbar', {
	anchorX: 0,
	anchorY: 1,
	x: 0,
	y: 2732
}));
// Create tools
var toolTypes = ['sprayPaint', 'scissors', 'brush', 'comb'];
for (var i = 0; i < toolTypes.length; i++) {
	var tool = new Tool(toolTypes[i]);
	tool.x = 150 + i * 120;
	tool.y = 2732 - 75;
	tools.push(tool);
	game.addChild(tool);
}
// Create color palette
var colorPalette = game.addChild(LK.getAsset('colorPalette', {
	anchorX: 0.5,
	anchorY: 1,
	x: 1024,
	y: 2732
}));
// Create color swatches
var colors = [{
	name: 'redColor',
	value: 0xff0000
}, {
	name: 'blueColor',
	value: 0x0000ff
}, {
	name: 'greenColor',
	value: 0x00ff00
}, {
	name: 'yellowColor',
	value: 0xffff00
}, {
	name: 'pinkColor',
	value: 0xff69b4
}, {
	name: 'purpleColor',
	value: 0x9370db
}];
for (var i = 0; i < colors.length; i++) {
	var colorSwatch = new ColorSwatch(colors[i].name, colors[i].value);
	colorSwatch.x = 824 + i * 70;
	colorSwatch.y = 2732 - 50;
	colorSwatches.push(colorSwatch);
	game.addChild(colorSwatch);
}
// Create camera button
var cameraButton = game.addChild(LK.getAsset('cameraButton', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 1900,
	y: 2732 - 75
}));
// Create some initial accessories
var accessoryTypes = ['bow', 'headband', 'clip', 'flower'];
for (var i = 0; i < accessoryTypes.length; i++) {
	var accessory = new Accessory(accessoryTypes[i], 1700 + i * 100, 200 + i * 100);
	accessories.push(accessory);
	game.addChild(accessory);
}
// Select initial tool
function selectTool(selectedTool) {
	for (var i = 0; i < tools.length; i++) {
		tools[i].deselect();
	}
	selectedTool.select();
}
// Initialize with spray paint selected
selectTool(tools[0]);
// Instructions text
var instructionText = new Text2('Use your camera to style your hair! Tap tools to switch, colors to change, and accessories to place.', {
	size: 40,
	fill: 0x2C3E50
});
instructionText.anchor.set(0.5, 0);
instructionText.x = 1024;
instructionText.y = 50;
game.addChild(instructionText);
// Game interaction handlers
game.down = function (x, y, obj) {
	isDrawing = true;
	handleStyling(x, y);
};
game.move = function (x, y, obj) {
	if (draggedAccessory) {
		draggedAccessory.x = x;
		draggedAccessory.y = y;
		return;
	}
	if (isDrawing) {
		handleStyling(x, y);
	}
};
game.up = function (x, y, obj) {
	isDrawing = false;
	if (draggedAccessory) {
		draggedAccessory.up(x, y, obj);
	}
};
function handleStyling(x, y) {
	// Don't style if clicking on toolbar area
	if (y > 2580) return;
	var currentTime = LK.ticks;
	if (currentTool === 'sprayPaint') {
		if (currentTime - lastSprayTime > 3) {
			// Spray every 3 frames
			var spray = new HairSpray(x, y, currentColor);
			hairSprays.push(spray);
			game.addChild(spray);
			lastSprayTime = currentTime;
			LK.getSound('spray').play();
		}
	} else if (currentTool === 'scissors') {
		var cutEffect = new CutEffect(x, y);
		cutEffects.push(cutEffect);
		game.addChild(cutEffect);
		LK.getSound('cut').play();
	} else if (currentTool === 'brush' || currentTool === 'comb') {
		// Create styling effect
		var spray = new HairSpray(x, y, 0xffffff);
		spray.alpha = 0.3;
		hairSprays.push(spray);
		game.addChild(spray);
	}
}
// Camera button functionality
cameraButton.down = function (x, y, obj) {
	LK.getSound('camera').play();
	// Flash effect for photo
	LK.effects.flashScreen(0xffffff, 300);
	// Scale animation
	tween(cameraButton, {
		scaleX: 1.2,
		scaleY: 1.2
	}, {
		duration: 150,
		onFinish: function onFinish() {
			tween(cameraButton, {
				scaleX: 1.0,
				scaleY: 1.0
			}, {
				duration: 150
			});
		}
	});
};
// Main game update loop
game.update = function () {
	// Update hair spray effects
	for (var i = hairSprays.length - 1; i >= 0; i--) {
		if (hairSprays[i] && hairSprays[i].update) {
			hairSprays[i].update();
		}
	}
	// Update cut effects
	for (var i = cutEffects.length - 1; i >= 0; i--) {
		if (cutEffects[i] && cutEffects[i].update) {
			cutEffects[i].update();
		}
	}
	// Use facekit to position elements relative to face
	if (facekit && facekit.mouthCenter) {
		// You can add face-relative positioning here
		// For example, accessories could snap to face positions
	}
}; ===================================================================
--- original.js
+++ change.js
@@ -1,6 +1,350 @@
-/****
+/**** 
+* Plugins
+****/ 
+var tween = LK.import("@upit/tween.v1");
+var facekit = LK.import("@upit/facekit.v1");
+
+/**** 
+* Classes
+****/ 
+var Accessory = Container.expand(function (accessoryType, x, y) {
+	var self = Container.call(this);
+	self.accessoryType = accessoryType;
+	self.isDragging = false;
+	var accessoryGraphics = self.attachAsset(accessoryType, {
+		anchorX: 0.5,
+		anchorY: 0.5
+	});
+	self.x = x;
+	self.y = y;
+	self.down = function (x, y, obj) {
+		self.isDragging = true;
+		draggedAccessory = self;
+		tween(accessoryGraphics, {
+			scaleX: 1.2,
+			scaleY: 1.2
+		}, {
+			duration: 150
+		});
+	};
+	self.up = function (x, y, obj) {
+		self.isDragging = false;
+		draggedAccessory = null;
+		tween(accessoryGraphics, {
+			scaleX: 1.0,
+			scaleY: 1.0
+		}, {
+			duration: 150
+		});
+	};
+	return self;
+});
+var ColorSwatch = Container.expand(function (colorName, colorValue) {
+	var self = Container.call(this);
+	self.colorName = colorName;
+	self.colorValue = colorValue;
+	var colorGraphics = self.attachAsset(colorName, {
+		anchorX: 0.5,
+		anchorY: 0.5
+	});
+	self.down = function (x, y, obj) {
+		currentColor = self.colorValue;
+		LK.getSound('click').play();
+		// Visual feedback
+		tween(colorGraphics, {
+			scaleX: 1.3,
+			scaleY: 1.3
+		}, {
+			duration: 100,
+			onFinish: function onFinish() {
+				tween(colorGraphics, {
+					scaleX: 1.0,
+					scaleY: 1.0
+				}, {
+					duration: 100
+				});
+			}
+		});
+	};
+	return self;
+});
+var CutEffect = Container.expand(function (x, y) {
+	var self = Container.call(this);
+	var cutGraphics = self.attachAsset('cutEffect', {
+		anchorX: 0.5,
+		anchorY: 0.5
+	});
+	self.x = x;
+	self.y = y;
+	self.alpha = 1.0;
+	self.update = function () {
+		self.alpha -= 0.05;
+		cutGraphics.scaleX += 0.1;
+		cutGraphics.scaleY += 0.1;
+		if (self.alpha <= 0) {
+			self.destroy();
+			var index = cutEffects.indexOf(self);
+			if (index > -1) {
+				cutEffects.splice(index, 1);
+			}
+		}
+	};
+	return self;
+});
+var HairSpray = Container.expand(function (x, y, color) {
+	var self = Container.call(this);
+	var sprayGraphics = self.attachAsset('hairSpray', {
+		anchorX: 0.5,
+		anchorY: 0.5,
+		tint: color
+	});
+	self.x = x;
+	self.y = y;
+	self.alpha = 1.0;
+	self.update = function () {
+		self.alpha -= 0.02;
+		sprayGraphics.scaleX += 0.05;
+		sprayGraphics.scaleY += 0.05;
+		if (self.alpha <= 0) {
+			self.destroy();
+			var index = hairSprays.indexOf(self);
+			if (index > -1) {
+				hairSprays.splice(index, 1);
+			}
+		}
+	};
+	return self;
+});
+var Tool = Container.expand(function (toolType, color) {
+	var self = Container.call(this);
+	self.toolType = toolType;
+	self.isSelected = false;
+	var toolGraphics = self.attachAsset(toolType, {
+		anchorX: 0.5,
+		anchorY: 0.5
+	});
+	self.select = function () {
+		self.isSelected = true;
+		toolGraphics.alpha = 1.0;
+		tween(toolGraphics, {
+			scaleX: 1.2,
+			scaleY: 1.2
+		}, {
+			duration: 200
+		});
+	};
+	self.deselect = function () {
+		self.isSelected = false;
+		toolGraphics.alpha = 0.7;
+		tween(toolGraphics, {
+			scaleX: 1.0,
+			scaleY: 1.0
+		}, {
+			duration: 200
+		});
+	};
+	self.down = function (x, y, obj) {
+		currentTool = self.toolType;
+		selectTool(self);
+		LK.getSound('click').play();
+	};
+	// Initial state
+	self.deselect();
+	return self;
+});
+
+/**** 
 * Initialize Game
-****/
+****/ 
 var game = new LK.Game({
-	backgroundColor: 0x000000
-});
\ No newline at end of file
+	backgroundColor: 0xf0f0f0
+});
+
+/**** 
+* Game Code
+****/ 
+// Sounds
+// UI elements
+// Accessories
+// Color palette
+// Styling tools
+var currentTool = 'sprayPaint';
+var currentColor = 0xff6b6b;
+var tools = [];
+var colorSwatches = [];
+var accessories = [];
+var hairSprays = [];
+var cutEffects = [];
+var draggedAccessory = null;
+var isDrawing = false;
+var lastSprayTime = 0;
+// Create toolbar
+var toolbar = game.addChild(LK.getAsset('toolbar', {
+	anchorX: 0,
+	anchorY: 1,
+	x: 0,
+	y: 2732
+}));
+// Create tools
+var toolTypes = ['sprayPaint', 'scissors', 'brush', 'comb'];
+for (var i = 0; i < toolTypes.length; i++) {
+	var tool = new Tool(toolTypes[i]);
+	tool.x = 150 + i * 120;
+	tool.y = 2732 - 75;
+	tools.push(tool);
+	game.addChild(tool);
+}
+// Create color palette
+var colorPalette = game.addChild(LK.getAsset('colorPalette', {
+	anchorX: 0.5,
+	anchorY: 1,
+	x: 1024,
+	y: 2732
+}));
+// Create color swatches
+var colors = [{
+	name: 'redColor',
+	value: 0xff0000
+}, {
+	name: 'blueColor',
+	value: 0x0000ff
+}, {
+	name: 'greenColor',
+	value: 0x00ff00
+}, {
+	name: 'yellowColor',
+	value: 0xffff00
+}, {
+	name: 'pinkColor',
+	value: 0xff69b4
+}, {
+	name: 'purpleColor',
+	value: 0x9370db
+}];
+for (var i = 0; i < colors.length; i++) {
+	var colorSwatch = new ColorSwatch(colors[i].name, colors[i].value);
+	colorSwatch.x = 824 + i * 70;
+	colorSwatch.y = 2732 - 50;
+	colorSwatches.push(colorSwatch);
+	game.addChild(colorSwatch);
+}
+// Create camera button
+var cameraButton = game.addChild(LK.getAsset('cameraButton', {
+	anchorX: 0.5,
+	anchorY: 0.5,
+	x: 1900,
+	y: 2732 - 75
+}));
+// Create some initial accessories
+var accessoryTypes = ['bow', 'headband', 'clip', 'flower'];
+for (var i = 0; i < accessoryTypes.length; i++) {
+	var accessory = new Accessory(accessoryTypes[i], 1700 + i * 100, 200 + i * 100);
+	accessories.push(accessory);
+	game.addChild(accessory);
+}
+// Select initial tool
+function selectTool(selectedTool) {
+	for (var i = 0; i < tools.length; i++) {
+		tools[i].deselect();
+	}
+	selectedTool.select();
+}
+// Initialize with spray paint selected
+selectTool(tools[0]);
+// Instructions text
+var instructionText = new Text2('Use your camera to style your hair! Tap tools to switch, colors to change, and accessories to place.', {
+	size: 40,
+	fill: 0x2C3E50
+});
+instructionText.anchor.set(0.5, 0);
+instructionText.x = 1024;
+instructionText.y = 50;
+game.addChild(instructionText);
+// Game interaction handlers
+game.down = function (x, y, obj) {
+	isDrawing = true;
+	handleStyling(x, y);
+};
+game.move = function (x, y, obj) {
+	if (draggedAccessory) {
+		draggedAccessory.x = x;
+		draggedAccessory.y = y;
+		return;
+	}
+	if (isDrawing) {
+		handleStyling(x, y);
+	}
+};
+game.up = function (x, y, obj) {
+	isDrawing = false;
+	if (draggedAccessory) {
+		draggedAccessory.up(x, y, obj);
+	}
+};
+function handleStyling(x, y) {
+	// Don't style if clicking on toolbar area
+	if (y > 2580) return;
+	var currentTime = LK.ticks;
+	if (currentTool === 'sprayPaint') {
+		if (currentTime - lastSprayTime > 3) {
+			// Spray every 3 frames
+			var spray = new HairSpray(x, y, currentColor);
+			hairSprays.push(spray);
+			game.addChild(spray);
+			lastSprayTime = currentTime;
+			LK.getSound('spray').play();
+		}
+	} else if (currentTool === 'scissors') {
+		var cutEffect = new CutEffect(x, y);
+		cutEffects.push(cutEffect);
+		game.addChild(cutEffect);
+		LK.getSound('cut').play();
+	} else if (currentTool === 'brush' || currentTool === 'comb') {
+		// Create styling effect
+		var spray = new HairSpray(x, y, 0xffffff);
+		spray.alpha = 0.3;
+		hairSprays.push(spray);
+		game.addChild(spray);
+	}
+}
+// Camera button functionality
+cameraButton.down = function (x, y, obj) {
+	LK.getSound('camera').play();
+	// Flash effect for photo
+	LK.effects.flashScreen(0xffffff, 300);
+	// Scale animation
+	tween(cameraButton, {
+		scaleX: 1.2,
+		scaleY: 1.2
+	}, {
+		duration: 150,
+		onFinish: function onFinish() {
+			tween(cameraButton, {
+				scaleX: 1.0,
+				scaleY: 1.0
+			}, {
+				duration: 150
+			});
+		}
+	});
+};
+// Main game update loop
+game.update = function () {
+	// Update hair spray effects
+	for (var i = hairSprays.length - 1; i >= 0; i--) {
+		if (hairSprays[i] && hairSprays[i].update) {
+			hairSprays[i].update();
+		}
+	}
+	// Update cut effects
+	for (var i = cutEffects.length - 1; i >= 0; i--) {
+		if (cutEffects[i] && cutEffects[i].update) {
+			cutEffects[i].update();
+		}
+	}
+	// Use facekit to position elements relative to face
+	if (facekit && facekit.mouthCenter) {
+		// You can add face-relative positioning here
+		// For example, accessories could snap to face positions
+	}
+};
\ No newline at end of file