Play
:quality(85)/https://cdn.frvr.ai/683a970d465073e366fa271c.png)
:quality(85)/https://cdn.frvr.ai/683a96d7465073e366fa2719.png)
#PatternPop
#InteractiveArt
#TapToCreate
#GenerativeDesign
#MobileFun
Creation History
User prompt
Please fix the bug: 'Uncaught TypeError: Cannot read properties of undefined (reading 'dx')' in or related to this line: 'overlay(animalParts[2].dx + 18, animalParts[2].dy, 10, 18, white, 0.13, "ellipse");' Line Number: 3896
User prompt
Please fix the bug: 'Uncaught TypeError: Cannot read properties of undefined (reading 'dx')' in or related to this line: 'overlay(animalParts[1].dx - 18, animalParts[1].dy, 10, 18, white, 0.13, "ellipse");' Line Number: 3891
User prompt
ekrana tıklayınca çıkan hayvanlar daha gerçekçi daha detaylı olmalı bütün hepsi için daha detaylı ve daha gerçekçi bir görünümleri olmalı lütfen profesyonel ve en iyisi ol
User prompt
ekrana tıklayınca çıkan hayvanları lütfen daha detaylı yap ve daha gerçekci olsun
User prompt
olmamış düzelt
User prompt
ekrana tıklayınca çıkan hayvanlar doğadaki kendi renklerinde çıksın
User prompt
ekrana tıklayınca çıkan hayvanlar için her hayvanın kendine özgü olan birşeylerini belirt anlaşılabilir olmalı
User prompt
ekrana tıklayınca çıkan hayvanlar biraz daha büyük olabilir
User prompt
ekrana tıklayınca çıkan hayvanlara biraz daha detay eklebilirsin
User prompt
ekrana tıklayınca çıkan hayvanlar biraz daha büyük olabilir
User prompt
ekrana tıklanınca çıkan partiküller biraz daha az olabilir
User prompt
hayvanlar daha gerçekçi olsun daha fazla detay ekle daha profesyonel ve en iyisi ol lütfen
User prompt
lütfen hayvanlar yukarda yazılan hayvan ismiyle birebir benzesin profesyonel ol
User prompt
şekiller görünmüyor
User prompt
şekiller lütfen hayvanlara birebir benzesin bunun için assetleri istediğin gibi kullanabilirsin
User prompt
şekiller ekranın hiç bir köşesine deymesin
User prompt
bütün hayvanları daha profesyonel yap
User prompt
çıkan şekiller ekranın sağ,sol,alt,üst köşelerinden çıkmasın
User prompt
her tıklandığında çıkan hayvanı yatay olarak çiz aşırı detaylı bir şekilde
User prompt
yatay olarak çiz bütün hayvanları
User prompt
hayvanların bütün kıvrımları bütün vücudunu çiz
User prompt
çıkan hayvan şekilleri biraz daha büyük olabilir ama ekranın dışına asla çıkmamalı
User prompt
çıkan havayıfişekler biraz azaltılabilir hayvan şekilinin üstünde çıkmasın
User prompt
çıkan hayvan desenleri daha güzel olsun ve daha belirgin olsun. arkaplan bir tık şeffaflaşabilir
User prompt
animasyon daha abartı olsun arkaplan göz kamaştırsın
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
// FireworkParticle class for animated firework/particle background
var FireworkParticle = Container.expand(function () {
var self = Container.call(this);
// Pick a random color asset for the particle
var colorAssetIds = ['altin', 'bej', 'bordo', 'bronz', 'camgobegi', 'civit_mavisi', 'eflatun', 'fume', 'gri', 'gumus', 'haki', 'kahverengi', 'kirmizi', 'kobalt_mavisi', 'krem', 'lacivert', 'lavanta', 'lila', 'magenta', 'mavi', 'mercan', 'mor', 'nane_yesili', 'pembe', 'sari', 'siyah', 'ten_rengi', 'turkuaz', 'turuncu', 'visne_curugu', 'yesil', 'zeytin_yesili'];
var assetId = colorAssetIds[Math.floor(Math.random() * colorAssetIds.length)];
var shapeType = Math.random() < 0.5 ? 'ellipse' : 'box';
// Larger and more varied size
var size = 48 + Math.random() * 80;
var asset = self.attachAsset(assetId, {
shape: shapeType,
anchorX: 0.5,
anchorY: 0.5,
width: size,
height: size
});
// Initial position, velocity, and alpha
self.x = 0;
self.y = 0;
var angle = Math.random() * Math.PI * 2;
// Faster and more energetic
var speed = 8 + Math.random() * 12;
self.vx = Math.cos(angle) * speed;
self.vy = Math.sin(angle) * speed;
self.gravity = 0.10 + Math.random() * 0.12;
// Longer life for more persistent effect
self.life = 40 + Math.floor(Math.random() * 32);
self.age = 0;
// Brighter and more random alpha
asset.alpha = 0.92 + Math.random() * 0.08;
asset.rotation = Math.random() * Math.PI * 2;
// Add a random scale pulse for extra dazzle
var pulse = 1 + Math.random() * 0.5;
asset.scale.set(pulse, pulse);
// Animate
self.update = function () {
self.x += self.vx;
self.y += self.vy;
self.vy += self.gravity;
// Flicker alpha for sparkle
asset.alpha *= 0.95 + Math.random() * 0.04;
// Add a color flash effect
if (Math.random() < 0.12) {
asset.rotation += (Math.random() - 0.5) * 0.3;
asset.scale.x = 1 + Math.random() * 0.7;
asset.scale.y = 1 + Math.random() * 0.7;
} else {
asset.scale.x *= 0.985;
asset.scale.y *= 0.985;
}
self.age++;
if (self.age > self.life) {
self.destroy();
}
};
return self;
});
// Pattern class: a container for a randomly generated pattern at a given position.
var Pattern = Container.expand(function () {
var self = Container.call(this);
// Generate a random pattern on creation
// Patterns: single shape, cluster, or overlay
function randomColor() {
// Expanded palette: all visually distinct, vibrant, and basic colors
// Turkish color names: beyaz, sarı, turuncu, kırmızı, mor, mavi, yeşil, kahverengi, gri, siyah, pembe, bej, turkuaz, lacivert, bordo, altın, gümüş, bronz, mercan, zeytin yeşili, füme, lila, eflatun, krem, ten rengi, haki, camgöbeği, magenta, çivit mavisi, vişne çürüğü, kobalt mavisi, nane yeşili, lavanta
// Full Turkish color palette, all unique and vibrant, including all requested names
var colors = [0xffffff,
// beyaz
0xffff00,
// sarı
0xffa500,
// turuncu
0xff0000,
// kırmızı
0x800080,
// mor
0x0000ff,
// mavi
0x008000,
// yeşil
0x8b4513,
// kahverengi
0x808080,
// gri
0x000000,
// siyah
0xffb6c1,
// pembe
0xf5f5dc,
// bej
0x40e0d0,
// turkuaz
0x191970,
// lacivert
0x800000,
// bordo
0xffd700,
// altın
0xc0c0c0,
// gümüş
0xcd7f32,
// bronz
0xff7f50,
// mercan
0x808000,
// zeytin yeşili
0x545454,
// füme
0xb57edc,
// lila
0x8f00ff,
// eflatun
0xfffdd0,
// krem
0xffdab9,
// ten rengi (peachpuff)
0x808000,
// haki
0x00ced1,
// camgöbeği
0xff00ff,
// magenta
0x00416a,
// çivit mavisi
0x70193d,
// vişne çürüğü
0x0047ab,
// kobalt mavisi
0x98ff98,
// nane yeşili
0xe6e6fa,
// lavanta
// Extra vibrant and pastel tones for more variety
0xff5e5b, 0xffc857, 0x4ecdc4, 0x3a86ff, 0xffbe0b, 0xfb5607, 0x8338ec, 0xff006e, 0x06d6a0, 0x00ff00, 0x00ffff, 0xff1493, 0x00bfff, 0x9932cc, 0x8b0000, 0x2e8b57, 0xff6347, 0x9acd32, 0x6495ed, 0xdda0dd, 0xb0e0e6, 0xf5deb3, 0xf0e68c, 0xe9967a, 0x48d1cc, 0x9400d3, 0x00ff7f, 0x7b68ee, 0x6a5acd, 0x5f9ea0, 0x8b008b, 0x556b2f, 0x228b22, 0xd2691e, 0xb22222, 0x00008b, 0x008b8b, 0xb8860b, 0xa9a9a9, 0x006400, 0xbdb76b, 0xff8c00, 0x8fbc8f, 0x483d8b, 0x2f4f4f, 0x696969, 0xfffaf0, 0xdcdcdc, 0xf8f8ff, 0xdaa520, 0xadff2f, 0xf0fff0, 0xff69b4, 0xcd5c5c, 0x4b0082, 0xfffff0, 0xfff0f5, 0xfffacd, 0xadd8e6, 0xf08080, 0xe0ffff, 0xfafad2, 0xd3d3d3, 0x90ee90, 0xffa07a, 0x20b2aa, 0x87cefa, 0x778899, 0xb0c4de, 0xffffe0, 0x32cd32, 0xfaf0e6, 0x66cdaa, 0x0000cd, 0xba55d3, 0x9370db, 0x3cb371, 0x00fa9a, 0xc71585, 0xf5fffa, 0xffe4e1, 0xffe4b5, 0xffdead, 0x000080, 0xfdf5e6, 0x6b8e23, 0xff4500, 0xda70d6, 0xeee8aa, 0x98fb98, 0xafeeee, 0xdb7093, 0xffefd5, 0xcd853f, 0xffc0cb, 0x4169e1, 0xfa8072, 0xf4a460, 0xfff5ee, 0xa0522d, 0x87ceeb, 0x708090, 0xfffafa, 0xd2b48c, 0xd8bfd8, 0xee82ee, 0xf5f5f5, 0x9acd32];
// Simulate a gradient by returning an array of two colors sometimes
if (Math.random() < 0.3) {
var c1 = colors[Math.floor(Math.random() * colors.length)];
var c2 = colors[Math.floor(Math.random() * colors.length)];
return [c1, c2];
}
return colors[Math.floor(Math.random() * colors.length)];
}
function randomShape() {
// Return 'box' or 'ellipse'
return Math.random() < 0.5 ? 'box' : 'ellipse';
}
function randomSize() {
// Return a size between 120 and 400 px
return 120 + Math.floor(Math.random() * 280);
}
function randomRotation() {
// Return a random rotation in radians
return Math.random() * Math.PI * 2;
}
function randomAlpha() {
// Return a random alpha between 0.7 and 1
return 0.7 + Math.random() * 0.3;
}
function randomPatternType() {
// 0: single, 1: cluster, 2: overlay
var r = Math.random();
if (r < 0.5) return 0;
if (r < 0.8) return 1;
return 2;
}
// Generate the pattern
function generatePattern() {
var type = randomPatternType();
if (type === 0) {
// Single shape
var w = randomSize();
var h = randomSize();
var shape = randomShape();
var color = randomColor();
if (Array.isArray(color)) {
// Simulate a gradient by overlaying two shapes with different colors and alpha
var asset1 = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color[0],
anchorX: 0.5,
anchorY: 0.5,
fill: color[0]
}, {});
asset1.rotation = randomRotation();
asset1.alpha = randomAlpha();
var asset2 = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color[1],
anchorX: 0.5,
anchorY: 0.5,
fill: color[1]
}, {});
asset2.rotation = randomRotation();
asset2.alpha = 0.5 + Math.random() * 0.3;
} else {
var asset = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color,
anchorX: 0.5,
anchorY: 0.5,
fill: color
}, {});
asset.rotation = randomRotation();
asset.alpha = randomAlpha();
}
} else if (type === 1) {
// Cluster: 3-6 shapes in a circle
var count = 3 + Math.floor(Math.random() * 4);
var radius = 80 + Math.random() * 120;
for (var i = 0; i < count; i++) {
var angle = Math.PI * 2 / count * i + Math.random() * 0.3;
var w = randomSize() * (0.5 + Math.random() * 0.7);
var h = randomSize() * (0.5 + Math.random() * 0.7);
var shape = randomShape();
var color = randomColor();
if (Array.isArray(color)) {
// Simulate a gradient by overlaying two shapes
var asset1 = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color[0],
anchorX: 0.5,
anchorY: 0.5,
fill: color[0]
}, {});
asset1.x = Math.cos(angle) * radius;
asset1.y = Math.sin(angle) * radius;
asset1.rotation = randomRotation();
asset1.alpha = randomAlpha();
var asset2 = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color[1],
anchorX: 0.5,
anchorY: 0.5,
fill: color[1]
}, {});
asset2.x = Math.cos(angle) * radius;
asset2.y = Math.sin(angle) * radius;
asset2.rotation = randomRotation();
asset2.alpha = 0.5 + Math.random() * 0.3;
} else {
var asset = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color,
anchorX: 0.5,
anchorY: 0.5,
fill: color
}, {});
asset.x = Math.cos(angle) * radius;
asset.y = Math.sin(angle) * radius;
asset.rotation = randomRotation();
asset.alpha = randomAlpha();
}
}
} else {
// Overlay: 2-3 shapes stacked with different rotations
var overlays = 2 + Math.floor(Math.random() * 2);
for (var j = 0; j < overlays; j++) {
var w = randomSize() * (0.7 + Math.random() * 0.5);
var h = randomSize() * (0.7 + Math.random() * 0.5);
var shape = randomShape();
var color = randomColor();
if (Array.isArray(color)) {
var asset1 = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color[0],
anchorX: 0.5,
anchorY: 0.5,
fill: color[0]
}, {});
asset1.rotation = randomRotation();
asset1.alpha = 0.5 + Math.random() * 0.5;
var asset2 = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color[1],
anchorX: 0.5,
anchorY: 0.5,
fill: color[1]
}, {});
asset2.rotation = randomRotation();
asset2.alpha = 0.3 + Math.random() * 0.3;
} else {
var asset = self.attachAsset({
shape: shape,
width: w,
height: h,
color: color,
anchorX: 0.5,
anchorY: 0.5,
fill: color
}, {});
asset.rotation = randomRotation();
asset.alpha = 0.5 + Math.random() * 0.5;
}
}
}
}
generatePattern();
// Pop-in animation
self.scale.set(0.2, 0.2);
tween(self.scale, {
x: 1,
y: 1
}, {
duration: 350,
easing: tween.elasticOut
});
// Sparkle and glow effect: animate alpha and scale for shimmer
function sparkleEffect(target) {
// Animate alpha up and down for shimmer
var _sparkleTween = function sparkleTween() {
tween(target, {
alpha: 1
}, {
duration: 180 + Math.random() * 120,
easing: tween.sineIn,
onComplete: function onComplete() {
tween(target, {
alpha: 0.7 + Math.random() * 0.3
}, {
duration: 180 + Math.random() * 120,
easing: tween.sineOut,
onComplete: _sparkleTween
});
}
});
};
_sparkleTween();
// Animate scale for a pulsing glow
var _pulseTween = function pulseTween() {
tween(target.scale, {
x: 1.08,
y: 1.08
}, {
duration: 320 + Math.random() * 120,
easing: tween.sineIn,
onComplete: function onComplete() {
tween(target.scale, {
x: 1,
y: 1
}, {
duration: 320 + Math.random() * 120,
easing: tween.sineOut,
onComplete: _pulseTween
});
}
});
};
_pulseTween();
}
// Apply sparkle effect to all children (shapes) of the pattern
for (var i = 0; i < self.children.length; i++) {
sparkleEffect(self.children[i]);
}
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0xffffff,
backgroundAlpha: 0.82 // Softer, slightly transparent background
});
/****
* Game Code
****/
// Store the current name and pattern containers
// No score, no timer, no GUI overlays
/*
We will use only shapes for patterns, with random colors and sizes.
No need to predefine assets, as LK will auto-create them as needed.
*/
// We'll use the tween plugin for simple pop-in animations.
var currentNameGroup = null;
var currentPatterns = [];
// --- Firework background animation ---
var fireworkParticles = [];
var fireworkBurstInterval = 18; // frames between bursts
var lastFireworkTick = 0;
function spawnFireworkBurst(cx, cy, count) {
for (var i = 0; i < count; i++) {
var p = new FireworkParticle();
p.x = cx;
p.y = cy;
// Place behind everything
p.zIndex = -1000;
game.addChild(p);
fireworkParticles.push(p);
}
}
// Initial burst at random locations
for (var i = 0; i < 3; i++) {
var fx = 200 + Math.random() * (2048 - 400);
var fy = 200 + Math.random() * (2732 - 400);
spawnFireworkBurst(fx, fy, 18 + Math.floor(Math.random() * 10));
}
// "Tap Me" colorful text at the start
var tapMeText = new Text2("Tap Me", {
size: 220,
fill: 0xFFFFFF,
font: "Arial Black"
});
tapMeText.anchor.set(0.5, 0.5);
tapMeText.x = 2048 / 2;
tapMeText.y = 2732 / 2 - 100;
tapMeText.alpha = 1;
game.addChild(tapMeText);
// Animate the "Tap Me" text with color cycling and pulsing
var tapMeColors = ["#ff5e5b", "#ffc857", "#4ecdc4", "#3a86ff", "#ffbe0b", "#fb5607", "#8338ec", "#ff006e", "#06d6a0", "#ff0099"];
var tapMeColorIdx = 0;
var tapMePulseUp = true;
var tapMePulseVal = 1;
var tapMePulseSpeed = 0.012;
game.update = function () {
// --- Firework background update ---
// Reduce firework burst frequency and avoid animal area
var animalAreaX = 2048 / 2;
var animalAreaY = 2732 / 2 + 100;
var animalAreaW = 420;
var animalAreaH = 420;
if (LK.ticks - lastFireworkTick > fireworkBurstInterval * 2.2) {
lastFireworkTick = LK.ticks;
// Fewer bursts per interval, each with fewer particles
var burstCount = 1 + Math.floor(Math.random() * 2);
for (var b = 0; b < burstCount; b++) {
var fx,
fy,
tries = 0;
do {
fx = 80 + Math.random() * (2048 - 160);
fy = 80 + Math.random() * (2732 - 160);
tries++;
} while (fx > animalAreaX - animalAreaW / 2 && fx < animalAreaX + animalAreaW / 2 && fy > animalAreaY - animalAreaH / 2 && fy < animalAreaY + animalAreaH / 2 && tries < 8);
var count = 12 + Math.floor(Math.random() * 8); // fewer particles per burst
spawnFireworkBurst(fx, fy, count);
}
}
// Add random "super burst" for extra dazzle, but never over animal
if (Math.random() < 0.012) {
var fx,
fy,
tries = 0;
do {
fx = 200 + Math.random() * (2048 - 400);
fy = 200 + Math.random() * (2732 - 400);
tries++;
} while (fx > animalAreaX - animalAreaW / 2 && fx < animalAreaX + animalAreaW / 2 && fy > animalAreaY - animalAreaH / 2 && fy < animalAreaY + animalAreaH / 2 && tries < 8);
spawnFireworkBurst(fx, fy, 24 + Math.floor(Math.random() * 12));
}
// Update and clean up firework particles
for (var i = fireworkParticles.length - 1; i >= 0; i--) {
var p = fireworkParticles[i];
if (typeof p.update === "function") p.update();
if (p.destroyed) {
fireworkParticles.splice(i, 1);
}
}
// Color cycle
if (LK.ticks % 18 === 0 && tapMeText && tapMeText.setStyle) {
tapMeColorIdx = (tapMeColorIdx + 1) % tapMeColors.length;
tapMeText.setStyle({
fill: tapMeColors[tapMeColorIdx]
});
}
// Pulse
if (tapMeText) {
if (tapMePulseUp) {
tapMePulseVal += tapMePulseSpeed;
if (tapMePulseVal > 1.13) tapMePulseUp = false;
} else {
tapMePulseVal -= tapMePulseSpeed;
if (tapMePulseVal < 0.87) tapMePulseUp = true;
}
tapMeText.scale.set(tapMePulseVal, tapMePulseVal);
}
};
// Helper: don't allow patterns in the top-left 100x100 px (menu area)
function isInMenuArea(x, y) {
return x < 100 && y < 100;
}
// List of fun, random, vibrant names
var nameList = ["LUNA", "PIXEL", "NOVA", "SPARK", "BLAZE", "AURA", "VIVID", "ZEST", "GLOW", "TWIST", "DREAM", "FLASH", "PRISM", "BUBBLE", "SHINE", "VIBE", "JAZZ", "BLOSSOM", "BOLT", "WAVE"];
// Helper: pick a random name
function getRandomName() {
return nameList[Math.floor(Math.random() * nameList.length)];
}
// Helper: get a vibrant color for text
function getVibrantColor() {
var colors = ["#ff5e5b", "#ffc857", "#4ecdc4", "#3a86ff", "#ffbe0b", "#fb5607", "#8338ec", "#ff006e", "#06d6a0", "#ff0099"];
return colors[Math.floor(Math.random() * colors.length)];
}
// Create the "Clear" button (Text2 object)
var clearBtn = new Text2("Clear", {
size: 100,
fill: "#222",
font: "Arial Black"
});
clearBtn.anchor.set(0.5, 0.5);
// Place the button at the top right, with margin
clearBtn.x = 2048 - 200;
clearBtn.y = 120;
clearBtn.interactive = true;
clearBtn.buttonMode = true;
game.addChild(clearBtn);
// On tap/click anywhere, show a random color asset at that location (removing the previous one)
game.down = function (x, y, obj) {
// Don't allow patterns in menu area or on the clear button
if (isInMenuArea(x, y)) return;
// If tap is on the clear button, ignore (handled separately)
var btnBounds = clearBtn.getBounds();
if (x >= clearBtn.x + btnBounds.x && x <= clearBtn.x + btnBounds.x + btnBounds.width && y >= clearBtn.y + btnBounds.y && y <= clearBtn.y + btnBounds.y + btnBounds.height) {
return;
}
// Prevent firework bursts from spawning over the animal shape
var animalAreaX = 2048 / 2;
var animalAreaY = 2732 / 2 + 100;
var animalAreaW = 420;
var animalAreaH = 420;
function isOverAnimalArea(px, py) {
return px > animalAreaX - animalAreaW / 2 && px < animalAreaX + animalAreaW / 2 && py > animalAreaY - animalAreaH / 2 && py < animalAreaY + animalAreaH / 2;
}
// Only spawn tap burst if not over animal
if (!isOverAnimalArea(x, y)) {
spawnFireworkBurst(x, y, 14 + Math.floor(Math.random() * 8));
}
// Add a few extra bursts around the tap for extra dazzle, but not over animal
for (var i = 0; i < 2 + Math.floor(Math.random() * 2); i++) {
var angle = Math.random() * Math.PI * 2;
var dist = 80 + Math.random() * 120;
var fx = x + Math.cos(angle) * dist;
var fy = y + Math.sin(angle) * dist;
if (!isOverAnimalArea(fx, fy)) {
spawnFireworkBurst(fx, fy, 7 + Math.floor(Math.random() * 5));
}
}
// Remove "Tap Me" text if present
if (tapMeText) {
tapMeText.destroy();
tapMeText = null;
}
// Remove previous patterns and name if exist
if (currentPatterns && currentPatterns.length) {
for (var i = 0; i < currentPatterns.length; i++) {
currentPatterns[i].destroy();
}
currentPatterns = [];
}
if (currentNameGroup) {
currentNameGroup.destroy();
currentNameGroup = null;
}
// List of all color asset ids
var colorAssetIds = ['altin', 'bej', 'bordo', 'bronz', 'camgobegi', 'civit_mavisi', 'eflatun', 'fume', 'gri', 'gumus', 'haki', 'kahverengi', 'kirmizi', 'kobalt_mavisi', 'krem', 'lacivert', 'lavanta', 'lila', 'magenta', 'mavi', 'mercan', 'mor', 'nane_yesili', 'pembe', 'sari', 'siyah', 'ten_rengi', 'turkuaz', 'turuncu', 'visne_curugu', 'yesil', 'zeytin_yesili'];
// Animal shape definitions: each is an array of {dx, dy, scale, colorIdx} for each part
// For brevity, most animals are represented by a simple body plan: head, body, 2 ears/fins/wings, 2 eyes, tail/limb if needed
// For more complex animals, you can expand the part list as needed
var animalShapes = [
// Dog
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 100,
scale: 1.4,
colorIdx: null
}, {
dx: -60,
dy: -50,
scale: 0.6,
colorIdx: null
}, {
dx: 60,
dy: -50,
scale: 0.6,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 80,
dy: 140,
scale: 0.5,
colorIdx: null
}],
// Cat
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: 55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 70,
dy: 120,
scale: 0.5,
colorIdx: null
}],
// Horse
[{
dx: 0,
dy: 0,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 1.7,
colorIdx: null
}, {
dx: -70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.22,
colorIdx: 2
}, {
dx: 30,
dy: 30,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Elephant
[{
dx: 0,
dy: 0,
scale: 1.5,
colorIdx: null
}, {
dx: 0,
dy: 130,
scale: 1.8,
colorIdx: null
}, {
dx: -90,
dy: -90,
scale: 0.7,
colorIdx: null
}, {
dx: 90,
dy: -90,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 60,
scale: 0.4,
colorIdx: null
}, {
dx: -40,
dy: 40,
scale: 0.22,
colorIdx: 2
}, {
dx: 40,
dy: 40,
scale: 0.22,
colorIdx: 2
}],
// Lion
[{
dx: 0,
dy: 0,
scale: 1.2,
colorIdx: null
}, {
dx: 0,
dy: 110,
scale: 1.5,
colorIdx: null
}, {
dx: -60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: 60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 200,
scale: 0.6,
colorIdx: null
}],
// Tiger
[{
dx: 0,
dy: 0,
scale: 1.2,
colorIdx: null
}, {
dx: 0,
dy: 110,
scale: 1.5,
colorIdx: null
}, {
dx: -60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: 60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 200,
scale: 0.6,
colorIdx: null
}],
// Bear
[{
dx: 0,
dy: 0,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 1.7,
colorIdx: null
}, {
dx: -70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.22,
colorIdx: 2
}, {
dx: 30,
dy: 30,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Whale
[{
dx: 0,
dy: 0,
scale: 1.5,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 2.0,
colorIdx: null
}, {
dx: -100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 200,
scale: 0.5,
colorIdx: null
}],
// Dolphin
[{
dx: 0,
dy: 0,
scale: 1.2,
colorIdx: null
}, {
dx: 0,
dy: 100,
scale: 1.5,
colorIdx: null
}, {
dx: -60,
dy: 0,
scale: 0.5,
colorIdx: null
}, {
dx: 60,
dy: 0,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 0.4,
colorIdx: null
}],
// Monkey
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: 55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 70,
dy: 120,
scale: 0.5,
colorIdx: null
}],
// Bat
[{
dx: 0,
dy: 0,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 1.2,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}],
// Deer
[{
dx: 0,
dy: 0,
scale: 1.2,
colorIdx: null
}, {
dx: 0,
dy: 110,
scale: 1.5,
colorIdx: null
}, {
dx: -60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: 60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 200,
scale: 0.6,
colorIdx: null
}],
// Wolf
[{
dx: 0,
dy: 0,
scale: 1.2,
colorIdx: null
}, {
dx: 0,
dy: 110,
scale: 1.5,
colorIdx: null
}, {
dx: -60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: 60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 200,
scale: 0.6,
colorIdx: null
}],
// Fox
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: 55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 70,
dy: 120,
scale: 0.5,
colorIdx: null
}],
// Rabbit
[{
dx: 0,
dy: 0,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.2,
colorIdx: null
}, {
dx: -30,
dy: -90,
scale: 0.4,
colorIdx: null
}, {
dx: 30,
dy: -90,
scale: 0.4,
colorIdx: null
}, {
dx: -18,
dy: 10,
scale: 0.18,
colorIdx: 2
}, {
dx: 18,
dy: 10,
scale: 0.18,
colorIdx: 2
}],
// Kangaroo
[{
dx: 0,
dy: 0,
scale: 1.2,
colorIdx: null
}, {
dx: 0,
dy: 110,
scale: 1.5,
colorIdx: null
}, {
dx: -60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: 60,
dy: -70,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 20,
scale: 0.22,
colorIdx: 2
}, {
dx: 0,
dy: 200,
scale: 0.6,
colorIdx: null
}],
// Human
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: 55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}],
// Eagle
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Owl
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: 55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}],
// Sparrow
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Penguin
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: 55,
dy: -65,
scale: 0.5,
colorIdx: null
}, {
dx: -25,
dy: 10,
scale: 0.22,
colorIdx: 2
}, {
dx: 25,
dy: 10,
scale: 0.22,
colorIdx: 2
}],
// Ostrich
[{
dx: 0,
dy: 0,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 1.7,
colorIdx: null
}, {
dx: -70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.22,
colorIdx: 2
}, {
dx: 30,
dy: 30,
scale: 0.22,
colorIdx: 2
}],
// Parrot
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Pigeon
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Hummingbird
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Duck
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Swan
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Crow
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Robin
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Albatross
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Flamingo
[{
dx: 0,
dy: 40,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -90,
scale: 0.22,
colorIdx: 4
}, {
dx: -60,
dy: 30,
scale: 0.7,
colorIdx: null
}, {
dx: 60,
dy: 80,
scale: 0.5,
colorIdx: null
}],
// Snake
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Lizard
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Crocodile
[{
dx: 0,
dy: 0,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 1.7,
colorIdx: null
}, {
dx: -70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Alligator
[{
dx: 0,
dy: 0,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 1.7,
colorIdx: null
}, {
dx: -70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Turtle
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Tortoise
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Chameleon
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Gecko
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Komodo Dragon
[{
dx: 0,
dy: 0,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 1.7,
colorIdx: null
}, {
dx: -70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 70,
dy: -80,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Cobra
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Python
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Frog
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Toad
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Salamander
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Newt
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Caecilian
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Axolotl
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: -40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 180,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 220,
scale: 0.7,
colorIdx: null
}],
// Shark
[{
dx: 0,
dy: 0,
scale: 1.5,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 2.0,
colorIdx: null
}, {
dx: -100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 200,
scale: 0.5,
colorIdx: null
}],
// Salmon
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Tuna
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Clownfish
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Goldfish
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Eel
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Seahorse
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: 0,
dy: 90,
scale: 1.3,
colorIdx: null
}, {
dx: 0,
dy: 180,
scale: 1.0,
colorIdx: null
}, {
dx: 0,
dy: 270,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 360,
scale: 0.5,
colorIdx: null
}],
// Trout
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Cod
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Barracuda
[{
dx: 0,
dy: 0,
scale: 1.1,
colorIdx: null
}, {
dx: -80,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: -60,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: -10,
scale: 0.18,
colorIdx: 2
}],
// Stingray
[{
dx: 0,
dy: 0,
scale: 1.5,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 2.0,
colorIdx: null
}, {
dx: -100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 200,
scale: 0.5,
colorIdx: null
}],
// Manta Ray
[{
dx: 0,
dy: 0,
scale: 1.5,
colorIdx: null
}, {
dx: 0,
dy: 120,
scale: 2.0,
colorIdx: null
}, {
dx: -100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 100,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 200,
scale: 0.5,
colorIdx: null
}],
// Ant
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Bee
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Butterfly
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -40,
dy: 0,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Moth
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -40,
dy: 0,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Beetle
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Fly
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Mosquito
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Grasshopper
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Dragonfly
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -40,
dy: 0,
scale: 0.5,
colorIdx: null
}, {
dx: 40,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Ladybug
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Cockroach
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}, {
dx: 0,
dy: 80,
scale: 0.3,
colorIdx: null
}],
// Spider
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.3,
colorIdx: null
}, {
dx: 30,
dy: 30,
scale: 0.3,
colorIdx: null
}],
// Scorpion
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.3,
colorIdx: null
}, {
dx: 30,
dy: 30,
scale: 0.3,
colorIdx: null
}],
// Tick
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Mite
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Tarantula
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.3,
colorIdx: null
}, {
dx: 30,
dy: 30,
scale: 0.3,
colorIdx: null
}],
// Black Widow
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: -30,
dy: 30,
scale: 0.3,
colorIdx: null
}, {
dx: 30,
dy: 30,
scale: 0.3,
colorIdx: null
}],
// Crab
[{
dx: 0,
dy: 0,
scale: 0.8,
colorIdx: null
}, {
dx: -40,
dy: 0,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: 0,
scale: 0.4,
colorIdx: null
}],
// Lobster
[{
dx: 0,
dy: 0,
scale: 0.8,
colorIdx: null
}, {
dx: -40,
dy: 0,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: 0,
scale: 0.4,
colorIdx: null
}],
// Shrimp
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Prawn
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Crayfish
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Barnacle
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Krill
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Snail
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Slug
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Octopus
[{
dx: 0,
dy: 0,
scale: 0.8,
colorIdx: null
}, {
dx: -40,
dy: 40,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: 40,
scale: 0.4,
colorIdx: null
}],
// Squid
[{
dx: 0,
dy: 0,
scale: 0.8,
colorIdx: null
}, {
dx: -40,
dy: 40,
scale: 0.4,
colorIdx: null
}, {
dx: 40,
dy: 40,
scale: 0.4,
colorIdx: null
}],
// Clam
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Oyster
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Mussel
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Scallop
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Nautilus
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}],
// Earthworm
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Leech
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Tapeworm
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Roundworm
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Starfish (Sea Star)
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}],
// Sea Urchin
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Sea Cucumber
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}],
// Sand Dollar
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Jellyfish
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}, {
dx: 0,
dy: 40,
scale: 0.5,
colorIdx: null
}],
// Coral
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}],
// Sea Anemone
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}],
// Hydra
[{
dx: 0,
dy: 0,
scale: 0.5,
colorIdx: null
}],
// Bath Sponge
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}],
// Sea Sponge
[{
dx: 0,
dy: 0,
scale: 0.7,
colorIdx: null
}]];
// Animal English names, in the same order as animalShapes
var animalEnglishNames = ["Dog", "Cat", "Horse", "Elephant", "Lion", "Tiger", "Bear", "Whale", "Dolphin", "Monkey", "Bat", "Deer", "Wolf", "Fox", "Rabbit", "Kangaroo", "Human", "Eagle", "Owl", "Sparrow", "Penguin", "Ostrich", "Parrot", "Pigeon", "Hummingbird", "Duck", "Swan", "Crow", "Robin", "Albatross", "Flamingo", "Snake", "Lizard", "Crocodile", "Alligator", "Turtle", "Tortoise", "Chameleon", "Gecko", "Komodo Dragon", "Cobra", "Python", "Frog", "Toad", "Salamander", "Newt", "Caecilian", "Axolotl", "Shark", "Salmon", "Tuna", "Clownfish", "Goldfish", "Eel", "Seahorse", "Trout", "Cod", "Barracuda", "Stingray", "Manta Ray", "Ant", "Bee", "Butterfly", "Moth", "Beetle", "Fly", "Mosquito", "Grasshopper", "Dragonfly", "Ladybug", "Cockroach", "Spider", "Scorpion", "Tick", "Mite", "Tarantula", "Black Widow", "Crab", "Lobster", "Shrimp", "Prawn", "Crayfish", "Barnacle", "Krill", "Snail", "Slug", "Octopus", "Squid", "Clam", "Oyster", "Mussel", "Scallop", "Nautilus", "Earthworm", "Leech", "Tapeworm", "Roundworm", "Starfish (Sea Star)", "Sea Urchin", "Sea Cucumber", "Sand Dollar", "Jellyfish", "Coral", "Sea Anemone", "Hydra", "Bath Sponge", "Sea Sponge"];
// Pick a random animal shape and its English name
var animalIdx = Math.floor(Math.random() * animalShapes.length);
var animal = animalShapes[animalIdx];
var animalName = animalEnglishNames[animalIdx];
// Show the animal name at the top (destroy previous if exists)
if (currentNameGroup) {
currentNameGroup.destroy();
currentNameGroup = null;
}
currentNameGroup = new Container();
var nameText = new Text2(animalName, {
size: 180,
fill: getVibrantColor(),
font: "Arial Black"
});
nameText.anchor.set(0.5, 0);
nameText.x = 2048 / 2;
nameText.y = 40;
currentNameGroup.addChild(nameText);
game.addChild(currentNameGroup);
// Real-world animal color mapping (by animalIdx order)
var animalRealColors = [
// Dog
{
main: "kahverengi",
detail: "bej"
},
// Cat
{
main: "gri",
detail: "bej"
},
// Horse
{
main: "kahverengi",
detail: "bej"
},
// Elephant
{
main: "gri",
detail: "gri"
},
// Lion
{
main: "altin",
detail: "bej"
},
// Tiger
{
main: "turuncu",
detail: "siyah"
},
// Bear
{
main: "kahverengi",
detail: "bej"
},
// Whale
{
main: "lacivert",
detail: "gri"
},
// Dolphin
{
main: "gri",
detail: "beyaz"
},
// Monkey
{
main: "kahverengi",
detail: "bej"
},
// Bat
{
main: "fume",
detail: "siyah"
},
// Deer
{
main: "bej",
detail: "kahverengi"
},
// Wolf
{
main: "gri",
detail: "beyaz"
},
// Fox
{
main: "turuncu",
detail: "beyaz"
},
// Rabbit
{
main: "bej",
detail: "beyaz"
},
// Kangaroo
{
main: "bej",
detail: "kahverengi"
},
// Human
{
main: "ten_rengi",
detail: "bej"
},
// Eagle
{
main: "kahverengi",
detail: "beyaz"
},
// Owl
{
main: "bej",
detail: "kahverengi"
},
// Sparrow
{
main: "bej",
detail: "kahverengi"
},
// Penguin
{
main: "siyah",
detail: "beyaz"
},
// Ostrich
{
main: "gri",
detail: "beyaz"
},
// Parrot
{
main: "kirmizi",
detail: "yesil"
},
// Pigeon
{
main: "gri",
detail: "beyaz"
},
// Hummingbird
{
main: "yesil",
detail: "turkuaz"
},
// Duck
{
main: "yesil",
detail: "sari"
},
// Swan
{
main: "beyaz",
detail: "sari"
},
// Crow
{
main: "siyah",
detail: "gri"
},
// Robin
{
main: "kirmizi",
detail: "kahverengi"
},
// Albatross
{
main: "beyaz",
detail: "gri"
},
// Flamingo
{
main: "pembe",
detail: "beyaz"
},
// Snake
{
main: "yesil",
detail: "sari"
},
// Lizard
{
main: "yesil",
detail: "turkuaz"
},
// Crocodile
{
main: "zeytin_yesili",
detail: "haki"
},
// Alligator
{
main: "zeytin_yesili",
detail: "haki"
},
// Turtle
{
main: "yesil",
detail: "bej"
},
// Tortoise
{
main: "bej",
detail: "yesil"
},
// Chameleon
{
main: "turkuaz",
detail: "yesil"
},
// Gecko
{
main: "yesil",
detail: "turkuaz"
},
// Komodo Dragon
{
main: "fume",
detail: "kahverengi"
},
// Cobra
{
main: "siyah",
detail: "bej"
},
// Python
{
main: "bej",
detail: "siyah"
},
// Frog
{
main: "yesil",
detail: "nane_yesili"
},
// Toad
{
main: "bej",
detail: "kahverengi"
},
// Salamander
{
main: "siyah",
detail: "turuncu"
},
// Newt
{
main: "turuncu",
detail: "siyah"
},
// Caecilian
{
main: "fume",
detail: "gri"
},
// Axolotl
{
main: "pembe",
detail: "beyaz"
},
// Shark
{
main: "gri",
detail: "beyaz"
},
// Salmon
{
main: "pembe",
detail: "gri"
},
// Tuna
{
main: "mavi",
detail: "gri"
},
// Clownfish
{
main: "turuncu",
detail: "beyaz"
},
// Goldfish
{
main: "altin",
detail: "turuncu"
},
// Eel
{
main: "yesil",
detail: "gri"
},
// Seahorse
{
main: "bej",
detail: "turuncu"
},
// Trout
{
main: "bej",
detail: "gri"
},
// Cod
{
main: "kahverengi",
detail: "bej"
},
// Barracuda
{
main: "gri",
detail: "beyaz"
},
// Stingray
{
main: "gri",
detail: "fume"
},
// Manta Ray
{
main: "siyah",
detail: "beyaz"
},
// Ant
{
main: "siyah",
detail: "kirmizi"
},
// Bee
{
main: "sari",
detail: "siyah"
},
// Butterfly
{
main: "pembe",
detail: "turuncu"
},
// Moth
{
main: "bej",
detail: "gri"
},
// Beetle
{
main: "siyah",
detail: "yesil"
},
// Fly
{
main: "fume",
detail: "gri"
},
// Mosquito
{
main: "gri",
detail: "fume"
},
// Grasshopper
{
main: "yesil",
detail: "nane_yesili"
},
// Dragonfly
{
main: "turkuaz",
detail: "mavi"
},
// Ladybug
{
main: "kirmizi",
detail: "siyah"
},
// Cockroach
{
main: "kahverengi",
detail: "bej"
},
// Spider
{
main: "siyah",
detail: "fume"
},
// Scorpion
{
main: "bej",
detail: "kahverengi"
},
// Tick
{
main: "bordo",
detail: "siyah"
},
// Mite
{
main: "bordo",
detail: "bej"
},
// Tarantula
{
main: "kahverengi",
detail: "siyah"
},
// Black Widow
{
main: "siyah",
detail: "kirmizi"
},
// Crab
{
main: "kirmizi",
detail: "bej"
},
// Lobster
{
main: "kirmizi",
detail: "bej"
},
// Shrimp
{
main: "pembe",
detail: "bej"
},
// Prawn
{
main: "pembe",
detail: "bej"
},
// Crayfish
{
main: "kirmizi",
detail: "bej"
},
// Barnacle
{
main: "bej",
detail: "gri"
},
// Krill
{
main: "pembe",
detail: "bej"
},
// Snail
{
main: "bej",
detail: "kahverengi"
},
// Slug
{
main: "bej",
detail: "kahverengi"
},
// Octopus
{
main: "mor",
detail: "pembe"
},
// Squid
{
main: "beyaz",
detail: "pembe"
},
// Clam
{
main: "bej",
detail: "gri"
},
// Oyster
{
main: "bej",
detail: "gri"
},
// Mussel
{
main: "lacivert",
detail: "bej"
},
// Scallop
{
main: "bej",
detail: "turuncu"
},
// Nautilus
{
main: "bej",
detail: "turuncu"
},
// Earthworm
{
main: "pembe",
detail: "bej"
},
// Leech
{
main: "fume",
detail: "siyah"
},
// Tapeworm
{
main: "bej",
detail: "beyaz"
},
// Roundworm
{
main: "bej",
detail: "beyaz"
},
// Starfish (Sea Star)
{
main: "turuncu",
detail: "kirmizi"
},
// Sea Urchin
{
main: "mor",
detail: "siyah"
},
// Sea Cucumber
{
main: "kahverengi",
detail: "bej"
},
// Sand Dollar
{
main: "bej",
detail: "beyaz"
},
// Jellyfish
{
main: "pembe",
detail: "beyaz"
},
// Coral
{
main: "kirmizi",
detail: "turuncu"
},
// Sea Anemone
{
main: "pembe",
detail: "turuncu"
},
// Hydra
{
main: "yesil",
detail: "turkuaz"
},
// Bath Sponge
{
main: "bej",
detail: "sari"
},
// Sea Sponge
{
main: "sari",
detail: "bej"
}];
// Pick real-world color indices for this animal
var mainColorName = animalRealColors[animalIdx] && animalRealColors[animalIdx].main ? animalRealColors[animalIdx].main : "bej";
var detailColorName = animalRealColors[animalIdx] && animalRealColors[animalIdx].detail ? animalRealColors[animalIdx].detail : "kahverengi";
var baseColorIdx = colorAssetIds.indexOf(mainColorName);
if (baseColorIdx < 0) baseColorIdx = 0;
var detailColorIdx = colorAssetIds.indexOf(detailColorName);
if (detailColorIdx < 0) detailColorIdx = 1;
// All animals are centered on the screen
var centerX = 2048 / 2;
var centerY = 2732 / 2 + 100; // visually below the name
// Make animal shapes larger by applying a scale multiplier
var animalSizeScale = 1.68;
// Helper for animal part drawing
function drawAnimalPart(opts) {
// opts: {shape, color, dx, dy, w, h, alpha, z, outline, assetIdOverride}
var assetId = opts.assetIdOverride || colorAssetIds[opts.color % colorAssetIds.length];
var asset = LK.getAsset(assetId, {
shape: opts.shape,
anchorX: 0.5,
anchorY: 0.5
});
asset.x = centerX + opts.dx * animalSizeScale;
asset.y = centerY + opts.dy * animalSizeScale;
asset.width = opts.w * animalSizeScale;
asset.height = opts.h * animalSizeScale;
asset.alpha = typeof opts.alpha === "number" ? opts.alpha : 1;
if (opts.outline) {
asset.lineWidth = opts.outline.width;
asset.lineColor = opts.outline.color;
}
if (typeof opts.z === "number") asset.zIndex = opts.z;
game.addChild(asset);
currentPatterns.push(asset);
return asset;
}
// Always use real-world animal colors for main and detail
var outline = {
width: 8,
color: 0x222222
};
var main = baseColorIdx;
var detail = detailColorIdx;
var black = colorAssetIds.indexOf("siyah");
var white = colorAssetIds.indexOf("beyaz") >= 0 ? colorAssetIds.indexOf("beyaz") : black;
// Overwrite main and detail with real-world color indices
main = colorAssetIds.indexOf(mainColorName);
if (main < 0) main = 0;
detail = colorAssetIds.indexOf(detailColorName);
if (detail < 0) detail = 1;
// Draw the full body of the animal using all defined parts in animalShapes
var animalParts = animalShapes[animalIdx];
// Add more visual distinction: alternate between ellipse and box for some parts, add subtle color variation, and add a soft shadow
for (var i = 0; i < animalParts.length; i++) {
var part = animalParts[i];
// Alternate shape for ears, fins, wings, tails, etc.
var isEarOrFin = i === 2 || i === 3;
var isTailOrLimb = i === animalParts.length - 1 && animalParts.length > 4;
var isEye = typeof part.colorIdx === "number" && part.colorIdx === 2;
var shapeType = isEarOrFin ? "box" : "ellipse";
// Color: eyes always black, otherwise use main or detail color for some parts
var colorIdx = isEye ? black : typeof part.colorIdx === "number" ? part.colorIdx : isEarOrFin || isTailOrLimb ? detail : main;
var alpha = 1;
var z = i + 1;
var w = 100 * part.scale;
var h = 100 * part.scale;
// If this is a tail or limb, make it a bit longer and thinner
if (isTailOrLimb) {
h = 160 * part.scale;
w = 48 * part.scale;
shapeType = "box";
alpha = 0.92;
}
// Eyes: smaller, always on top
if (isEye) {
w = h = 32 * part.scale;
z = 100 + i;
alpha = 0.98;
}
// Add a soft shadow for body and head
if (i === 0 || i === 1) {
var shadow = drawAnimalPart({
shape: shapeType,
color: black,
dx: part.dx + 10,
dy: part.dy + 16,
w: w * 1.08,
h: h * 1.08,
alpha: 0.18,
z: z - 0.5
});
currentPatterns.push(shadow);
}
// Add a subtle highlight for body and head
if (i === 0 || i === 1) {
var highlight = drawAnimalPart({
shape: shapeType,
color: white,
dx: part.dx - 12,
dy: part.dy - 18,
w: w * 0.55,
h: h * 0.55,
alpha: 0.13,
z: z + 0.5
});
currentPatterns.push(highlight);
}
// Main part
var asset = drawAnimalPart({
shape: shapeType,
color: colorIdx,
dx: part.dx,
dy: part.dy,
w: w,
h: h,
alpha: alpha,
z: z,
outline: outline
});
// Add a white dot highlight to the eyes for cuteness
if (isEye) {
var eyeHighlight = drawAnimalPart({
shape: "ellipse",
color: white,
dx: part.dx - 6,
dy: part.dy - 6,
w: w * 0.35,
h: h * 0.35,
alpha: 0.7,
z: z + 1
});
currentPatterns.push(eyeHighlight);
}
// Add a subtle color variation for detail parts
if (isEarOrFin || isTailOrLimb) {
var detailOverlay = drawAnimalPart({
shape: shapeType,
color: (detail + 3) % colorAssetIds.length,
dx: part.dx + 4,
dy: part.dy + 4,
w: w * 0.82,
h: h * 0.82,
alpha: 0.22,
z: z + 0.2
});
currentPatterns.push(detailOverlay);
}
}
// --- EXTRA DETAIL FOR ANIMAL FACES AND BODIES ---
// Add much more facial/body details for each animal for realism
var detailZ = 200;
function addFaceDetailEllipse(dx, dy, w, h, color, alpha) {
var asset = drawAnimalPart({
shape: "ellipse",
color: color,
dx: dx,
dy: dy,
w: w,
h: h,
alpha: typeof alpha === "number" ? alpha : 1,
z: detailZ
});
currentPatterns.push(asset);
return asset;
}
function addFaceDetailBox(dx, dy, w, h, color, alpha) {
var asset = drawAnimalPart({
shape: "box",
color: color,
dx: dx,
dy: dy,
w: w,
h: h,
alpha: typeof alpha === "number" ? alpha : 1,
z: detailZ
});
currentPatterns.push(asset);
return asset;
}
function addWhiskers(centerDx, centerDy, length, color, alpha) {
for (var w = -1; w <= 1; w++) {
var angle = -0.5 + w * 0.5;
var whisker = addFaceDetailBox(centerDx + 18, centerDy + 8 + w * 10, length, 8, color, alpha);
whisker.rotation = angle;
var whisker2 = addFaceDetailBox(centerDx - 18, centerDy + 8 + w * 10, length, 8, color, alpha);
whisker2.rotation = -angle;
}
}
function addStripes(centerDx, centerDy, count, length, color, alpha, angleSpread) {
for (var s = 0; s < count; s++) {
var angle = -angleSpread / 2 + angleSpread / (count - 1) * s;
var stripe = addFaceDetailBox(centerDx, centerDy, length, 10, color, alpha);
stripe.rotation = angle;
}
}
function addSpots(centerDx, centerDy, count, radius, color, alpha, spread) {
for (var s = 0; s < count; s++) {
var a = Math.random() * Math.PI * 2;
var r = spread * (0.5 + Math.random() * 0.5);
addFaceDetailEllipse(centerDx + Math.cos(a) * r, centerDy + Math.sin(a) * r, radius, radius, color, alpha);
}
}
function addBeak(centerDx, centerDy, w, h, color, alpha) {
// Simulate a beak with a box and ellipse overlay
addFaceDetailBox(centerDx, centerDy + h / 4, w, h / 2, color, alpha);
addFaceDetailEllipse(centerDx, centerDy + h / 2, w * 0.7, h * 0.7, color, alpha * 0.7);
}
function addMane(centerDx, centerDy, r, count, color, alpha) {
for (var a = 0; a < count; a++) {
var angle = Math.PI * 2 * a / count;
addFaceDetailEllipse(centerDx + Math.cos(angle) * r, centerDy + Math.sin(angle) * r, 38, 48, color, alpha);
}
}
function addEarInner(dx, dy, w, h, color, alpha) {
addFaceDetailEllipse(dx, dy, w, h, color, alpha);
}
function addNostril(dx, dy, w, h, color, alpha) {
addFaceDetailEllipse(dx, dy, w, h, color, alpha);
}
function addMouth(dx, dy, w, h, color, alpha) {
addFaceDetailBox(dx, dy, w, h, color, alpha);
}
function addTailTip(dx, dy, w, h, color, alpha) {
addFaceDetailEllipse(dx, dy, w, h, color, alpha);
}
function addFin(dx, dy, w, h, color, alpha) {
addFaceDetailBox(dx, dy, w, h, color, alpha);
}
function addShellPattern(dx, dy, w, h, color, alpha) {
addFaceDetailBox(dx, dy, w, h, color, alpha);
}
function addCheek(dx, dy, w, h, color, alpha) {
addFaceDetailEllipse(dx, dy, w, h, color, alpha);
}
function addEyeBrow(dx, dy, w, h, color, alpha, rot) {
var brow = addFaceDetailBox(dx, dy, w, h, color, alpha);
brow.rotation = rot;
}
function addTongue(dx, dy, w, h, color, alpha) {
addFaceDetailEllipse(dx, dy, w, h, color, alpha);
}
function addTrunkLines(dx, dy, w, h, color, alpha, count) {
for (var i = 0; i < count; i++) {
addFaceDetailBox(dx, dy + i * 10, w, 6, color, alpha);
}
}
function addTusk(dx, dy, w, h, color, alpha) {
addFaceDetailBox(dx, dy, w, h, color, alpha);
}
function addEarTip(dx, dy, w, h, color, alpha) {
addFaceDetailBox(dx, dy, w, h, color, alpha);
}
function addWingLine(dx, dy, w, h, color, alpha, rot) {
var wing = addFaceDetailBox(dx, dy, w, h, color, alpha);
wing.rotation = rot;
}
function addBeard(dx, dy, w, h, color, alpha) {
addFaceDetailBox(dx, dy, w, h, color, alpha);
}
function addFreckles(centerDx, centerDy, count, radius, color, alpha, spread) {
for (var s = 0; s < count; s++) {
var a = Math.random() * Math.PI * 2;
var r = spread * (0.5 + Math.random() * 0.5);
addFaceDetailEllipse(centerDx + Math.cos(a) * r, centerDy + Math.sin(a) * r, radius, radius, color, alpha);
}
}
// --- NEW: Even more realism and detail for all animals ---
// Add extra details for all animals, not just a few, using their anatomy
// For each animal, add unique features: e.g. claws, hooves, beards, tail tufts, scale overlays, feather overlays, etc.
function addAnimalExtraDetails(animalIdx, animalParts, main, detail, black, white) {
// Helper for color overlays
function overlay(dx, dy, w, h, color, alpha, shape) {
var asset = drawAnimalPart({
shape: shape || "ellipse",
color: color,
dx: dx,
dy: dy,
w: w,
h: h,
alpha: alpha,
z: detailZ + 1
});
currentPatterns.push(asset);
return asset;
}
// DOG: add claws, tail tuft
if (animalIdx === 0) {
overlay(animalParts[6].dx, animalParts[6].dy + 40, 18, 18, detail, 0.7, "ellipse"); // tail tuft
for (var c = -1; c <= 1; c++) {
overlay(animalParts[1].dx + c * 24, animalParts[1].dy + 60, 10, 18, black, 0.18, "ellipse"); // claws
}
}
// CAT: add tail tip, claws
if (animalIdx === 1) {
overlay(animalParts[6].dx, animalParts[6].dy + 40, 18, 18, detail, 0.7, "ellipse");
for (var c = -1; c <= 1; c++) {
overlay(animalParts[1].dx + c * 22, animalParts[1].dy + 54, 8, 16, black, 0.13, "ellipse");
}
}
// HORSE: add hooves, tail tuft
if (animalIdx === 2) {
overlay(animalParts[6].dx, animalParts[6].dy + 60, 18, 28, detail, 0.7, "ellipse");
for (var c = -1; c <= 1; c++) {
overlay(animalParts[1].dx + c * 28, animalParts[1].dy + 90, 12, 22, black, 0.18, "ellipse");
}
}
// ELEPHANT: add tusk shine, trunk tip, ear veins
if (animalIdx === 3) {
overlay(animalParts[4].dx, animalParts[4].dy + 60, 18, 18, white, 0.18, "ellipse");
overlay(animalParts[2].dx, animalParts[2].dy + 18, 18, 38, detail, 0.13, "box");
overlay(animalParts[3].dx, animalParts[3].dy + 18, 18, 38, detail, 0.13, "box");
}
// LION: add tail tuft, extra mane
if (animalIdx === 4) {
overlay(animalParts[6].dx, animalParts[6].dy + 40, 22, 22, detail, 0.7, "ellipse");
addMane(animalParts[0].dx, animalParts[0].dy, 110, 18, detail, 0.09);
}
// TIGER: add more stripes, tail tip
if (animalIdx === 5) {
addStripes(animalParts[1].dx, animalParts[1].dy + 40, 4, 38, black, 0.18, 1.2);
overlay(animalParts[6].dx, animalParts[6].dy + 40, 18, 18, black, 0.7, "ellipse");
}
// BEAR: add claws, tail stub
if (animalIdx === 6) {
overlay(animalParts[6].dx, animalParts[6].dy + 30, 18, 18, detail, 0.7, "ellipse");
for (var c = -1; c <= 1; c++) {
overlay(animalParts[1].dx + c * 28, animalParts[1].dy + 90, 12, 22, black, 0.18, "ellipse");
}
}
// WHALE: add blowhole, fin highlight
if (animalIdx === 7) {
overlay(animalParts[0].dx, animalParts[0].dy - 40, 18, 10, black, 0.18, "ellipse");
overlay(animalParts[2].dx, animalParts[2].dy, 18, 10, white, 0.13, "ellipse");
overlay(animalParts[3].dx, animalParts[3].dy, 18, 10, white, 0.13, "ellipse");
}
// DOLPHIN: add blowhole, fin highlight
if (animalIdx === 8) {
overlay(animalParts[0].dx, animalParts[0].dy - 30, 12, 8, black, 0.18, "ellipse");
overlay(animalParts[2].dx, animalParts[2].dy, 12, 8, white, 0.13, "ellipse");
overlay(animalParts[3].dx, animalParts[3].dy, 12, 8, white, 0.13, "ellipse");
}
// MONKEY: add tail curl, ear highlight
if (animalIdx === 9) {
overlay(animalParts[6].dx, animalParts[6].dy + 40, 18, 18, detail, 0.7, "ellipse");
overlay(animalParts[2].dx, animalParts[2].dy, 10, 18, white, 0.13, "ellipse");
overlay(animalParts[3].dx, animalParts[3].dy, 10, 18, white, 0.13, "ellipse");
}
// BAT: add wing tips, ear highlight
if (animalIdx === 10) {
overlay(animalParts[2].dx - 18, animalParts[2].dy + 30, 10, 18, white, 0.13, "ellipse");
overlay(animalParts[3].dx + 18, animalParts[3].dy + 30, 10, 18, white, 0.13, "ellipse");
}
// RABBIT: add tail, paw pads
if (animalIdx === 14) {
if (animalParts[6]) {
overlay(animalParts[6].dx, animalParts[6].dy + 40, 18, 18, white, 0.7, "ellipse");
}
for (var c = -1; c <= 1; c++) {
overlay(animalParts[1].dx + c * 18, animalParts[1].dy + 54, 8, 12, detail, 0.13, "ellipse");
}
}
// FOX: add tail tip, paw pads
if (animalIdx === 13) {
if (animalParts[6]) {
overlay(animalParts[6].dx, animalParts[6].dy + 40, 18, 18, white, 0.7, "ellipse");
}
for (var c = -1; c <= 1; c++) {
overlay(animalParts[1].dx + c * 18, animalParts[1].dy + 54, 8, 12, detail, 0.13, "ellipse");
}
}
// Add more for other animals as needed...
// For birds: feather overlays, for fish: scale overlays, for reptiles: scale/skin overlays, for insects: wing veins, etc.
// BIRD EXAMPLES
if (animalIdx >= 17 && animalIdx <= 31) {
// Beak shine
overlay(animalParts[0].dx, animalParts[0].dy + 38, 12, 8, white, 0.18, "ellipse");
// Feather overlay
overlay(animalParts[1].dx, animalParts[1].dy + 40, 38, 18, detail, 0.13, "ellipse");
}
// FISH EXAMPLES
if (animalIdx >= 47 && animalIdx <= 56) {
// Fin highlight
overlay(animalParts[2].dx, animalParts[2].dy, 18, 10, white, 0.13, "ellipse");
overlay(animalParts[3].dx, animalParts[3].dy, 18, 10, white, 0.13, "ellipse");
// Scale overlay
for (var s = 0; s < 4; s++) {
var a = Math.PI * 2 * s / 4;
overlay(animalParts[1].dx + Math.cos(a) * 30, animalParts[1].dy + Math.sin(a) * 30, 18, 10, detail, 0.09, "ellipse");
}
}
// REPTILE EXAMPLES
if (animalIdx >= 31 && animalIdx <= 46) {
// Scale overlays
for (var s = 0; s < 5; s++) {
var a = Math.PI * 2 * s / 5;
overlay(animalParts[1].dx + Math.cos(a) * 30, animalParts[1].dy + Math.sin(a) * 30, 12, 8, detail, 0.09, "ellipse");
}
}
// INSECT EXAMPLES
if (animalIdx >= 57 && animalIdx <= 76) {
// Wing veins
overlay(animalParts[0].dx, animalParts[0].dy, 38, 8, black, 0.13, "box");
overlay(animalParts[0].dx, animalParts[0].dy, 8, 38, black, 0.13, "box");
}
// CRUSTACEAN EXAMPLES
if (animalIdx >= 77 && animalIdx <= 86) {
// Claw tips
if (animalParts[1]) {
overlay(animalParts[1].dx - 18, animalParts[1].dy, 10, 18, white, 0.13, "ellipse");
}
if (animalParts[2]) {
overlay(animalParts[2].dx + 18, animalParts[2].dy, 10, 18, white, 0.13, "ellipse");
}
}
// MOLLUSK EXAMPLES
if (animalIdx >= 87 && animalIdx <= 96) {
// Shell shine
overlay(animalParts[0].dx, animalParts[0].dy - 18, 18, 8, white, 0.13, "ellipse");
}
// WORM EXAMPLES
if (animalIdx >= 97 && animalIdx <= 100) {
// Segment lines
for (var s = 1; s < 4; s++) {
overlay(animalParts[0].dx, animalParts[0].dy + s * 18, 28, 4, black, 0.09, "box");
}
}
// STARFISH/SEA URCHIN/SEA CUCUMBER
if (animalIdx >= 101 && animalIdx <= 104) {
// Center dot
overlay(animalParts[0].dx, animalParts[0].dy, 18, 18, detail, 0.18, "ellipse");
}
// JELLYFISH/CORAL/ANEMONE
if (animalIdx >= 105 && animalIdx <= 107) {
// Tentacle overlays
for (var t = 0; t < 5; t++) {
var a = Math.PI * 2 * t / 5;
overlay(animalParts[0].dx + Math.cos(a) * 18, animalParts[0].dy + Math.sin(a) * 18, 8, 28, detail, 0.13, "ellipse");
}
}
// SPONGE
if (animalIdx >= 108 && animalIdx <= 109) {
// Pore dots
for (var p = 0; p < 6; p++) {
var a = Math.PI * 2 * p / 6;
overlay(animalParts[0].dx + Math.cos(a) * 18, animalParts[0].dy + Math.sin(a) * 18, 8, 8, black, 0.09, "ellipse");
}
}
}
// Call the extra detail function for all animals
addAnimalExtraDetails(animalIdx, animalParts, main, detail, black, white);
// DOG: mouth, nose, floppy ears, eyebrows, tongue
if (animalIdx === 0) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 32, 32, 22, black, 0.9); // Nose
addMouth(animalParts[0].dx, animalParts[0].dy + 54, 38, 10, black, 0.5);
addTongue(animalParts[0].dx, animalParts[0].dy + 66, 22, 14, detail, 0.7);
addEyeBrow(animalParts[0].dx - 18, animalParts[0].dy - 18, 18, 6, black, 0.18, -0.3);
addEyeBrow(animalParts[0].dx + 18, animalParts[0].dy - 18, 18, 6, black, 0.18, 0.3);
// Floppy ears
addFaceDetailEllipse(animalParts[2].dx - 18, animalParts[2].dy + 30, 38, 60, black, 0.13);
addFaceDetailEllipse(animalParts[3].dx + 18, animalParts[3].dy + 30, 38, 60, black, 0.13);
addEarInner(animalParts[2].dx - 18, animalParts[2].dy + 30, 18, 32, detail, 0.18);
addEarInner(animalParts[3].dx + 18, animalParts[3].dy + 30, 18, 32, detail, 0.18);
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
}
// CAT: nose, mouth, whiskers, pointy ears, stripes, cheeks
if (animalIdx === 1) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 28, 28, 18, black, 0.8); // Nose
addMouth(animalParts[0].dx, animalParts[0].dy + 44, 32, 8, black, 0.4);
addWhiskers(animalParts[0].dx, animalParts[0].dy + 32, 38, black, 0.25);
addEyeBrow(animalParts[0].dx - 18, animalParts[0].dy - 18, 18, 6, black, 0.18, -0.3);
addEyeBrow(animalParts[0].dx + 18, animalParts[0].dy - 18, 18, 6, black, 0.18, 0.3);
// Pointy ear highlights
addEarInner(animalParts[2].dx, animalParts[2].dy - 18, 18, 32, white, 0.18);
addEarInner(animalParts[3].dx, animalParts[3].dy - 18, 18, 32, white, 0.18);
// Stripes
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 3, 32, detail, 0.18, 0.7);
// Cheeks
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
}
// HORSE: nostrils, mouth, mane, ears, beard
if (animalIdx === 2) {
addNostril(animalParts[0].dx - 16, animalParts[0].dy + 38, 12, 18, black, 0.5);
addNostril(animalParts[0].dx + 16, animalParts[0].dy + 38, 12, 18, black, 0.5);
addMouth(animalParts[0].dx, animalParts[0].dy + 60, 36, 8, black, 0.3);
// Mane
addMane(animalParts[0].dx, animalParts[0].dy - 60, 60, 7, detail, 0.22);
// Ear inner
addEarInner(animalParts[2].dx, animalParts[2].dy, 18, 32, detail, 0.18);
addEarInner(animalParts[3].dx, animalParts[3].dy, 18, 32, detail, 0.18);
// Beard
addBeard(animalParts[0].dx, animalParts[0].dy + 70, 18, 18, detail, 0.13);
}
// ELEPHANT: trunk lines, tusks, trunk tip, ear inner
if (animalIdx === 3) {
addTrunkLines(animalParts[4].dx, animalParts[4].dy + 10, 36, 6, black, 0.13, 3);
addTusk(animalParts[4].dx - 18, animalParts[4].dy + 38, 18, 10, white, 0.7);
addTusk(animalParts[4].dx + 18, animalParts[4].dy + 38, 18, 10, white, 0.7);
addFaceDetailEllipse(animalParts[4].dx, animalParts[4].dy + 48, 22, 18, black, 0.18);
// Ear inner
addEarInner(animalParts[2].dx, animalParts[2].dy, 38, 48, detail, 0.18);
addEarInner(animalParts[3].dx, animalParts[3].dy, 38, 48, detail, 0.18);
}
// LION: mouth, nose, whiskers, mane, cheeks
if (animalIdx === 4) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 32, 32, 22, black, 0.7);
addMouth(animalParts[0].dx, animalParts[0].dy + 54, 38, 10, black, 0.3);
addWhiskers(animalParts[0].dx, animalParts[0].dy + 32, 38, black, 0.18);
addMane(animalParts[0].dx, animalParts[0].dy, 70, 12, detail, 0.18);
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
}
// TIGER: stripes, nose, mouth, cheek stripes, ear tips
if (animalIdx === 5) {
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 5, 38, black, 0.18, 1.2);
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 28, 28, 18, black, 0.7);
addMouth(animalParts[0].dx, animalParts[0].dy + 44, 32, 8, black, 0.3);
addFaceDetailBox(animalParts[0].dx - 24, animalParts[0].dy + 18, 18, 6, black, 0.13);
addFaceDetailBox(animalParts[0].dx + 24, animalParts[0].dy + 18, 18, 6, black, 0.13);
// Ear tips
addEarTip(animalParts[2].dx, animalParts[2].dy - 18, 18, 18, black, 0.18);
addEarTip(animalParts[3].dx, animalParts[3].dy - 18, 18, 18, black, 0.18);
}
// BEAR: nose, mouth, round ears, ear inner, cheeks
if (animalIdx === 6) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 32, 32, 22, black, 0.7);
addMouth(animalParts[0].dx, animalParts[0].dy + 54, 38, 10, black, 0.3);
addEarInner(animalParts[2].dx, animalParts[2].dy, 22, 22, white, 0.13);
addEarInner(animalParts[3].dx, animalParts[3].dy, 22, 22, white, 0.13);
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
}
// WHALE: mouth line, water spout, fin
if (animalIdx === 7) {
addMouth(animalParts[0].dx, animalParts[0].dy + 60, 60, 10, black, 0.18);
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy - 60, 18, 38, detail, 0.22);
addFaceDetailEllipse(animalParts[0].dx - 12, animalParts[0].dy - 80, 10, 18, detail, 0.18);
addFaceDetailEllipse(animalParts[0].dx + 12, animalParts[0].dy - 80, 10, 18, detail, 0.18);
addFin(animalParts[2].dx, animalParts[2].dy, 38, 18, detail, 0.18);
addFin(animalParts[3].dx, animalParts[3].dy, 38, 18, detail, 0.18);
}
// DOLPHIN: mouth line, dorsal fin, tail tip
if (animalIdx === 8) {
addMouth(animalParts[0].dx, animalParts[0].dy + 44, 48, 8, black, 0.18);
addFin(animalParts[0].dx, animalParts[0].dy - 40, 18, 38, detail, 0.22);
addTailTip(animalParts[4].dx, animalParts[4].dy + 18, 28, 18, detail, 0.18);
}
// MONKEY: mouth, nose, ears, ear inner, cheeks, freckles
if (animalIdx === 9) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 32, 28, 18, black, 0.7);
addMouth(animalParts[0].dx, animalParts[0].dy + 44, 32, 8, black, 0.3);
addEarInner(animalParts[2].dx, animalParts[2].dy, 16, 16, detail, 0.18);
addEarInner(animalParts[3].dx, animalParts[3].dy, 16, 16, detail, 0.18);
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 5, 4, black, 0.13, 18);
}
// BAT: wing lines, ear points, ear inner
if (animalIdx === 10) {
addWingLine(animalParts[2].dx, animalParts[2].dy + 20, 60, 8, black, 0.13, 0.2);
addWingLine(animalParts[3].dx, animalParts[3].dy + 20, 60, 8, black, 0.13, -0.2);
addEarTip(animalParts[2].dx, animalParts[2].dy - 18, 12, 28, black, 0.13);
addEarTip(animalParts[3].dx, animalParts[3].dy - 18, 12, 28, black, 0.13);
addEarInner(animalParts[2].dx, animalParts[2].dy, 18, 18, detail, 0.18);
addEarInner(animalParts[3].dx, animalParts[3].dy, 18, 18, detail, 0.18);
}
// RABBIT: nose, mouth, whiskers, long ears, ear inner, cheeks
if (animalIdx === 14) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 28, 18, 12, black, 0.7);
addMouth(animalParts[0].dx, animalParts[0].dy + 44, 32, 8, black, 0.3);
addWhiskers(animalParts[0].dx, animalParts[0].dy + 32, 38, black, 0.18);
addEarInner(animalParts[2].dx, animalParts[2].dy - 18, 12, 38, detail, 0.18);
addEarInner(animalParts[3].dx, animalParts[3].dy - 18, 12, 38, detail, 0.18);
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
}
// FOX: nose, mouth, whiskers, ear tips, cheeks
if (animalIdx === 13) {
addFaceDetailEllipse(animalParts[0].dx, animalParts[0].dy + 28, 18, 12, black, 0.7);
addMouth(animalParts[0].dx, animalParts[0].dy + 44, 32, 8, black, 0.3);
addWhiskers(animalParts[0].dx, animalParts[0].dy + 32, 38, black, 0.18);
addEarTip(animalParts[2].dx, animalParts[2].dy - 18, 18, 18, black, 0.18);
addEarTip(animalParts[3].dx, animalParts[3].dy - 18, 18, 18, black, 0.18);
addCheek(animalParts[0].dx - 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
addCheek(animalParts[0].dx + 22, animalParts[0].dy + 38, 18, 12, detail, 0.18);
}
// Add more as needed for other animals...
// For birds, add beaks, for fish add fins, for reptiles add scales, etc.
if (animalIdx === 17 || animalIdx === 18 || animalIdx === 19 || animalIdx === 20) {
// Eagle, Owl, Sparrow, Penguin
addBeak(animalParts[0].dx, animalParts[0].dy + 38, 28, 22, detail, 0.9);
}
if (animalIdx === 7 || animalIdx === 8) {
// Whale, Dolphin
addFin(animalParts[2].dx, animalParts[2].dy, 38, 18, detail, 0.18);
addFin(animalParts[3].dx, animalParts[3].dy, 38, 18, detail, 0.18);
}
if (animalIdx === 35 || animalIdx === 36) {
// Turtle, Tortoise
addShellPattern(animalParts[0].dx, animalParts[0].dy, 60, 60, detail, 0.18);
addShellPattern(animalParts[0].dx + 20, animalParts[0].dy + 20, 30, 30, main, 0.13);
}
if (animalIdx === 41) {
// Frog
addSpots(animalParts[0].dx, animalParts[0].dy, 7, 12, detail, 0.18, 40);
}
if (animalIdx === 5) {
// Tiger
addStripes(animalParts[0].dx, animalParts[0].dy + 38, 3, 32, black, 0.18, 0.7);
}
if (animalIdx === 4) {
// Lion
addMane(animalParts[0].dx, animalParts[0].dy, 90, 16, detail, 0.13);
}
if (animalIdx === 0) {
// Dog
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 4, 6, black, 0.13, 18);
}
if (animalIdx === 1) {
// Cat
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 3, 6, black, 0.13, 12);
}
if (animalIdx === 14) {
// Rabbit
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 13) {
// Fox
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 6) {
// Bear
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 3, 6, black, 0.13, 12);
}
if (animalIdx === 2) {
// Horse
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 3) {
// Elephant
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 9) {
// Monkey
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 4, 6, black, 0.13, 18);
}
if (animalIdx === 10) {
// Bat
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 41) {
// Frog
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 7) {
// Whale
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 8) {
// Dolphin
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 35 || animalIdx === 36) {
// Turtle, Tortoise
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 17 || animalIdx === 18 || animalIdx === 19 || animalIdx === 20) {
// Eagle, Owl, Sparrow, Penguin
addFreckles(animalParts[0].dx, animalParts[0].dy + 38, 2, 6, black, 0.13, 10);
}
if (animalIdx === 13) {
// Fox
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, black, 0.13, 0.5);
}
if (animalIdx === 14) {
// Rabbit
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 9) {
// Monkey
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 6) {
// Bear
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 2) {
// Horse
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 3) {
// Elephant
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 0) {
// Dog
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 1) {
// Cat
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 10) {
// Bat
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 41) {
// Frog
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 7) {
// Whale
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 8) {
// Dolphin
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 35 || animalIdx === 36) {
// Turtle, Tortoise
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
if (animalIdx === 17 || animalIdx === 18 || animalIdx === 19 || animalIdx === 20) {
// Eagle, Owl, Sparrow, Penguin
addStripes(animalParts[0].dx, animalParts[0].dy - 18, 2, 18, detail, 0.13, 0.5);
}
};
// Handle "Clear" button tap: remove the patterns and name
clearBtn.down = function (x, y, obj) {
if (currentPatterns && currentPatterns.length) {
for (var i = 0; i < currentPatterns.length; i++) {
currentPatterns[i].destroy();
}
currentPatterns = [];
}
if (currentNameGroup) {
currentNameGroup.destroy();
currentNameGroup = null;
}
};
// No dragging or move/up handlers needed, as only one name is shown at a time;
// Turkish color names: beyaz, sarı, turuncu, kırmızı, mor, mavi, yeşil, kahverengi, gri, siyah, pembe, bej, turkuaz, lacivert, bordo, altın, gümüş, bronz, mercan, zeytin yeşili, füme, lila, eflatun, krem, ten rengi, haki, camgöbeği, magenta, çivit mavisi, vişne çürüğü, kobalt mavisi, nane yeşili, lavanta ===================================================================
--- original.js
+++ change.js
@@ -3833,10 +3833,14 @@
}
// CRUSTACEAN EXAMPLES
if (animalIdx >= 77 && animalIdx <= 86) {
// Claw tips
- overlay(animalParts[1].dx - 18, animalParts[1].dy, 10, 18, white, 0.13, "ellipse");
- overlay(animalParts[2].dx + 18, animalParts[2].dy, 10, 18, white, 0.13, "ellipse");
+ if (animalParts[1]) {
+ overlay(animalParts[1].dx - 18, animalParts[1].dy, 10, 18, white, 0.13, "ellipse");
+ }
+ if (animalParts[2]) {
+ overlay(animalParts[2].dx + 18, animalParts[2].dy, 10, 18, white, 0.13, "ellipse");
+ }
}
// MOLLUSK EXAMPLES
if (animalIdx >= 87 && animalIdx <= 96) {
// Shell shine
Used plugins
@upit/tween
