diff --git a/dist/extension.zip b/dist/extension.zip index 8e97313..36f7010 100644 Binary files a/dist/extension.zip and b/dist/extension.zip differ diff --git a/dist/extension/birb.js b/dist/extension/birb.js index bf95dbd..d1df198 100644 --- a/dist/extension/birb.js +++ b/dist/extension/birb.js @@ -226,8 +226,11 @@ return document.documentElement.clientHeight; } - /** Indicators for parts of the base bird sprite sheet */ - const Sprite = { + /** + * Palette color names + * @type {Record} + */ + const PALETTE = { THEME_HIGHLIGHT: "theme-highlight", TRANSPARENT: "transparent", OUTLINE: "outline", @@ -248,25 +251,28 @@ FEATHER_SPINE: "feather-spine", }; - /** @type {Record} */ + /** + * Mapping of sprite sheet colors to palette colors + * @type {Record} + */ const SPRITE_SHEET_COLOR_MAP = { - "transparent": Sprite.TRANSPARENT, - "#ffffff": Sprite.BORDER, - "#000000": Sprite.OUTLINE, - "#010a19": Sprite.BEAK, - "#190301": Sprite.EYE, - "#af8e75": Sprite.FOOT, - "#639bff": Sprite.FACE, - "#99e550": Sprite.HOOD, - "#d95763": Sprite.NOSE, - "#f8b143": Sprite.BELLY, - "#ec8637": Sprite.UNDERBELLY, - "#578ae6": Sprite.WING, - "#326ed9": Sprite.WING_EDGE, - "#c82e2e": Sprite.HEART, - "#501a1a": Sprite.HEART_BORDER, - "#ff6b6b": Sprite.HEART_SHINE, - "#373737": Sprite.FEATHER_SPINE, + "transparent": PALETTE.TRANSPARENT, + "#ffffff": PALETTE.BORDER, + "#000000": PALETTE.OUTLINE, + "#010a19": PALETTE.BEAK, + "#190301": PALETTE.EYE, + "#af8e75": PALETTE.FOOT, + "#639bff": PALETTE.FACE, + "#99e550": PALETTE.HOOD, + "#d95763": PALETTE.NOSE, + "#f8b143": PALETTE.BELLY, + "#ec8637": PALETTE.UNDERBELLY, + "#578ae6": PALETTE.WING, + "#326ed9": PALETTE.WING_EDGE, + "#c82e2e": PALETTE.HEART, + "#501a1a": PALETTE.HEART_BORDER, + "#ff6b6b": PALETTE.HEART_SHINE, + "#373737": PALETTE.FEATHER_SPINE, }; class BirdType { @@ -280,20 +286,20 @@ this.name = name; this.description = description; const defaultColors = { - [Sprite.TRANSPARENT]: "transparent", - [Sprite.OUTLINE]: "#000000", - [Sprite.BORDER]: "#ffffff", - [Sprite.BEAK]: "#000000", - [Sprite.EYE]: "#000000", - [Sprite.HEART]: "#c82e2e", - [Sprite.HEART_BORDER]: "#501a1a", - [Sprite.HEART_SHINE]: "#ff6b6b", - [Sprite.FEATHER_SPINE]: "#373737", - [Sprite.HOOD]: colors.face, - [Sprite.NOSE]: colors.face, + [PALETTE.TRANSPARENT]: "transparent", + [PALETTE.OUTLINE]: "#000000", + [PALETTE.BORDER]: "#ffffff", + [PALETTE.BEAK]: "#000000", + [PALETTE.EYE]: "#000000", + [PALETTE.HEART]: "#c82e2e", + [PALETTE.HEART_BORDER]: "#501a1a", + [PALETTE.HEART_SHINE]: "#ff6b6b", + [PALETTE.FEATHER_SPINE]: "#373737", + [PALETTE.HOOD]: colors.face, + [PALETTE.NOSE]: colors.face, }; /** @type {Record} */ - this.colors = { ...defaultColors, ...colors, [Sprite.THEME_HIGHLIGHT]: colors[Sprite.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; + this.colors = { ...defaultColors, ...colors, [PALETTE.THEME_HIGHLIGHT]: colors[PALETTE.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; this.tags = tags; } } @@ -302,127 +308,127 @@ const SPECIES = { bluebird: new BirdType("Eastern Bluebird", "Native to North American and very social, though can be timid around people.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#639bff", - [Sprite.BELLY]: "#f8b143", - [Sprite.UNDERBELLY]: "#ec8637", - [Sprite.WING]: "#578ae6", - [Sprite.WING_EDGE]: "#326ed9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#639bff", + [PALETTE.BELLY]: "#f8b143", + [PALETTE.UNDERBELLY]: "#ec8637", + [PALETTE.WING]: "#578ae6", + [PALETTE.WING_EDGE]: "#326ed9", }), shimaEnaga: new BirdType("Shima Enaga", "Small, fluffy birds found in the snowy regions of Japan, these birds are highly sought after by ornithologists and nature photographers.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffffff", - [Sprite.BELLY]: "#ebe9e8", - [Sprite.UNDERBELLY]: "#ebd9d0", - [Sprite.WING]: "#f3d3c1", - [Sprite.WING_EDGE]: "#2d2d2d", - [Sprite.THEME_HIGHLIGHT]: "#d7ac93", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffffff", + [PALETTE.BELLY]: "#ebe9e8", + [PALETTE.UNDERBELLY]: "#ebd9d0", + [PALETTE.WING]: "#f3d3c1", + [PALETTE.WING_EDGE]: "#2d2d2d", + [PALETTE.THEME_HIGHLIGHT]: "#d7ac93", }), tuftedTitmouse: new BirdType("Tufted Titmouse", "Native to the eastern United States, full of personality, and notably my wife's favorite bird.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#c7cad7", - [Sprite.BELLY]: "#e4e5eb", - [Sprite.UNDERBELLY]: "#d7cfcb", - [Sprite.WING]: "#b1b5c5", - [Sprite.WING_EDGE]: "#9d9fa9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#c7cad7", + [PALETTE.BELLY]: "#e4e5eb", + [PALETTE.UNDERBELLY]: "#d7cfcb", + [PALETTE.WING]: "#b1b5c5", + [PALETTE.WING_EDGE]: "#9d9fa9", }, ["tuft"]), europeanRobin: new BirdType("European Robin", "Native to western Europe, this is the quintessential robin. Quite friendly, you'll often find them searching for worms.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffaf34", - [Sprite.HOOD]: "#aaa094", - [Sprite.BELLY]: "#ffaf34", - [Sprite.UNDERBELLY]: "#babec2", - [Sprite.WING]: "#aaa094", - [Sprite.WING_EDGE]: "#888580", - [Sprite.THEME_HIGHLIGHT]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffaf34", + [PALETTE.HOOD]: "#aaa094", + [PALETTE.BELLY]: "#ffaf34", + [PALETTE.UNDERBELLY]: "#babec2", + [PALETTE.WING]: "#aaa094", + [PALETTE.WING_EDGE]: "#888580", + [PALETTE.THEME_HIGHLIGHT]: "#ffaf34", }), redCardinal: new BirdType("Red Cardinal", "Native to the eastern United States, this strikingly red bird is hard to miss.", { - [Sprite.BEAK]: "#d93619", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#31353d", - [Sprite.HOOD]: "#e83a1b", - [Sprite.BELLY]: "#e83a1b", - [Sprite.UNDERBELLY]: "#dc3719", - [Sprite.WING]: "#d23215", - [Sprite.WING_EDGE]: "#b1321c", + [PALETTE.BEAK]: "#d93619", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#31353d", + [PALETTE.HOOD]: "#e83a1b", + [PALETTE.BELLY]: "#e83a1b", + [PALETTE.UNDERBELLY]: "#dc3719", + [PALETTE.WING]: "#d23215", + [PALETTE.WING_EDGE]: "#b1321c", }, ["tuft"]), americanGoldfinch: new BirdType("American Goldfinch", "Coloured a brilliant yellow, this bird feeds almost entirely on the seeds of plants such as thistle, sunflowers, and coneflowers.", { - [Sprite.BEAK]: "#ffaf34", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#fff255", - [Sprite.NOSE]: "#383838", - [Sprite.HOOD]: "#383838", - [Sprite.BELLY]: "#fff255", - [Sprite.UNDERBELLY]: "#f5ea63", - [Sprite.WING]: "#e8e079", - [Sprite.WING_EDGE]: "#191919", - [Sprite.THEME_HIGHLIGHT]: "#ffcc00" + [PALETTE.BEAK]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#fff255", + [PALETTE.NOSE]: "#383838", + [PALETTE.HOOD]: "#383838", + [PALETTE.BELLY]: "#fff255", + [PALETTE.UNDERBELLY]: "#f5ea63", + [PALETTE.WING]: "#e8e079", + [PALETTE.WING_EDGE]: "#191919", + [PALETTE.THEME_HIGHLIGHT]: "#ffcc00" }), barnSwallow: new BirdType("Barn Swallow", "Agile birds that often roost in man-made structures, these birds are known to build nests near Ospreys for protection.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#db7c4d", - [Sprite.BELLY]: "#f7e1c9", - [Sprite.UNDERBELLY]: "#ebc9a3", - [Sprite.WING]: "#2252a9", - [Sprite.WING_EDGE]: "#1c448b", - [Sprite.HOOD]: "#2252a9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#db7c4d", + [PALETTE.BELLY]: "#f7e1c9", + [PALETTE.UNDERBELLY]: "#ebc9a3", + [PALETTE.WING]: "#2252a9", + [PALETTE.WING_EDGE]: "#1c448b", + [PALETTE.HOOD]: "#2252a9", }), mistletoebird: new BirdType("Mistletoebird", "Native to Australia, these birds eat mainly mistletoe and in turn spread the seeds far and wide.", { - [Sprite.FOOT]: "#6c6a7c", - [Sprite.FACE]: "#352e6d", - [Sprite.BELLY]: "#fd6833", - [Sprite.UNDERBELLY]: "#e6e1d8", - [Sprite.WING]: "#342b7c", - [Sprite.WING_EDGE]: "#282065", + [PALETTE.FOOT]: "#6c6a7c", + [PALETTE.FACE]: "#352e6d", + [PALETTE.BELLY]: "#fd6833", + [PALETTE.UNDERBELLY]: "#e6e1d8", + [PALETTE.WING]: "#342b7c", + [PALETTE.WING_EDGE]: "#282065", }), redAvadavat: new BirdType("Red Avadavat", "Native to India and southeast Asia, these birds are also known as Strawberry Finches due to their speckled plumage.", { - [Sprite.BEAK]: "#f71919", - [Sprite.FOOT]: "#af7575", - [Sprite.FACE]: "#cb092b", - [Sprite.BELLY]: "#ae1724", - [Sprite.UNDERBELLY]: "#831b24", - [Sprite.WING]: "#7e3030", - [Sprite.WING_EDGE]: "#490f0f", + [PALETTE.BEAK]: "#f71919", + [PALETTE.FOOT]: "#af7575", + [PALETTE.FACE]: "#cb092b", + [PALETTE.BELLY]: "#ae1724", + [PALETTE.UNDERBELLY]: "#831b24", + [PALETTE.WING]: "#7e3030", + [PALETTE.WING_EDGE]: "#490f0f", }), scarletRobin: new BirdType("Scarlet Robin", "Native to Australia, this striking robin can be found in Eucalyptus forests.", { - [Sprite.FOOT]: "#494949", - [Sprite.FACE]: "#3d3d3d", - [Sprite.BELLY]: "#fc5633", - [Sprite.UNDERBELLY]: "#dcdcdc", - [Sprite.WING]: "#2b2b2b", - [Sprite.WING_EDGE]: "#ebebeb", - [Sprite.THEME_HIGHLIGHT]: "#fc5633", + [PALETTE.FOOT]: "#494949", + [PALETTE.FACE]: "#3d3d3d", + [PALETTE.BELLY]: "#fc5633", + [PALETTE.UNDERBELLY]: "#dcdcdc", + [PALETTE.WING]: "#2b2b2b", + [PALETTE.WING_EDGE]: "#ebebeb", + [PALETTE.THEME_HIGHLIGHT]: "#fc5633", }), americanRobin: new BirdType("American Robin", "While not a true robin, this social North American bird is so named due to its orange coloring. It seems unbothered by nearby humans.", { - [Sprite.BEAK]: "#e89f30", - [Sprite.FOOT]: "#9f8075", - [Sprite.FACE]: "#2d2d2d", - [Sprite.BELLY]: "#eb7a3a", - [Sprite.UNDERBELLY]: "#eb7a3a", - [Sprite.WING]: "#444444", - [Sprite.WING_EDGE]: "#232323", - [Sprite.THEME_HIGHLIGHT]: "#eb7a3a", + [PALETTE.BEAK]: "#e89f30", + [PALETTE.FOOT]: "#9f8075", + [PALETTE.FACE]: "#2d2d2d", + [PALETTE.BELLY]: "#eb7a3a", + [PALETTE.UNDERBELLY]: "#eb7a3a", + [PALETTE.WING]: "#444444", + [PALETTE.WING_EDGE]: "#232323", + [PALETTE.THEME_HIGHLIGHT]: "#eb7a3a", }), carolinaWren: new BirdType("Carolina Wren", "Native to the eastern United States, these little birds are known for their curious and energetic nature.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#edc7a9", - [Sprite.NOSE]: "#f7eee5", - [Sprite.HOOD]: "#c58a5b", - [Sprite.BELLY]: "#e1b796", - [Sprite.UNDERBELLY]: "#c79e7c", - [Sprite.WING]: "#c58a5b", - [Sprite.WING_EDGE]: "#866348", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#edc7a9", + [PALETTE.NOSE]: "#f7eee5", + [PALETTE.HOOD]: "#c58a5b", + [PALETTE.BELLY]: "#e1b796", + [PALETTE.UNDERBELLY]: "#c79e7c", + [PALETTE.WING]: "#c58a5b", + [PALETTE.WING_EDGE]: "#866348", }), }; @@ -460,7 +466,7 @@ this.pixels = layers[0].pixels.map(row => row.slice()); // Pad from top with transparent pixels while (this.pixels.length < maxHeight) { - this.pixels.unshift(new Array(this.pixels[0].length).fill(Sprite.TRANSPARENT)); + this.pixels.unshift(new Array(this.pixels[0].length).fill(PALETTE.TRANSPARENT)); } // Combine layers for (let i = 1; i < layers.length; i++) { @@ -469,7 +475,7 @@ let topMargin = maxHeight - layerPixels.length; for (let y = 0; y < layerPixels.length; y++) { for (let x = 0; x < layerPixels[y].length; x++) { - this.pixels[y + topMargin][x] = layerPixels[y][x] !== Sprite.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; + this.pixels[y + topMargin][x] = layerPixels[y][x] !== PALETTE.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; } } } @@ -2400,7 +2406,7 @@ function switchSpecies(type) { currentSpecies = type; // Update CSS variable --birb-highlight to be wing color - document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[Sprite.THEME_HIGHLIGHT]); + document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[PALETTE.THEME_HIGHLIGHT]); save(); } @@ -2668,7 +2674,7 @@ const b = pixels[index + 2]; const a = pixels[index + 3]; if (a === 0) { - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); continue; } const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`; @@ -2678,7 +2684,7 @@ } if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) { error(`Unknown color: ${hex}`); - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); } row.push(SPRITE_SHEET_COLOR_MAP[hex]); } diff --git a/dist/obsidian/main.js b/dist/obsidian/main.js index e3154b5..255ba72 100644 --- a/dist/obsidian/main.js +++ b/dist/obsidian/main.js @@ -231,8 +231,11 @@ module.exports = class PocketBird extends Plugin { return document.documentElement.clientHeight; } - /** Indicators for parts of the base bird sprite sheet */ - const Sprite = { + /** + * Palette color names + * @type {Record} + */ + const PALETTE = { THEME_HIGHLIGHT: "theme-highlight", TRANSPARENT: "transparent", OUTLINE: "outline", @@ -253,25 +256,28 @@ module.exports = class PocketBird extends Plugin { FEATHER_SPINE: "feather-spine", }; - /** @type {Record} */ + /** + * Mapping of sprite sheet colors to palette colors + * @type {Record} + */ const SPRITE_SHEET_COLOR_MAP = { - "transparent": Sprite.TRANSPARENT, - "#ffffff": Sprite.BORDER, - "#000000": Sprite.OUTLINE, - "#010a19": Sprite.BEAK, - "#190301": Sprite.EYE, - "#af8e75": Sprite.FOOT, - "#639bff": Sprite.FACE, - "#99e550": Sprite.HOOD, - "#d95763": Sprite.NOSE, - "#f8b143": Sprite.BELLY, - "#ec8637": Sprite.UNDERBELLY, - "#578ae6": Sprite.WING, - "#326ed9": Sprite.WING_EDGE, - "#c82e2e": Sprite.HEART, - "#501a1a": Sprite.HEART_BORDER, - "#ff6b6b": Sprite.HEART_SHINE, - "#373737": Sprite.FEATHER_SPINE, + "transparent": PALETTE.TRANSPARENT, + "#ffffff": PALETTE.BORDER, + "#000000": PALETTE.OUTLINE, + "#010a19": PALETTE.BEAK, + "#190301": PALETTE.EYE, + "#af8e75": PALETTE.FOOT, + "#639bff": PALETTE.FACE, + "#99e550": PALETTE.HOOD, + "#d95763": PALETTE.NOSE, + "#f8b143": PALETTE.BELLY, + "#ec8637": PALETTE.UNDERBELLY, + "#578ae6": PALETTE.WING, + "#326ed9": PALETTE.WING_EDGE, + "#c82e2e": PALETTE.HEART, + "#501a1a": PALETTE.HEART_BORDER, + "#ff6b6b": PALETTE.HEART_SHINE, + "#373737": PALETTE.FEATHER_SPINE, }; class BirdType { @@ -285,20 +291,20 @@ module.exports = class PocketBird extends Plugin { this.name = name; this.description = description; const defaultColors = { - [Sprite.TRANSPARENT]: "transparent", - [Sprite.OUTLINE]: "#000000", - [Sprite.BORDER]: "#ffffff", - [Sprite.BEAK]: "#000000", - [Sprite.EYE]: "#000000", - [Sprite.HEART]: "#c82e2e", - [Sprite.HEART_BORDER]: "#501a1a", - [Sprite.HEART_SHINE]: "#ff6b6b", - [Sprite.FEATHER_SPINE]: "#373737", - [Sprite.HOOD]: colors.face, - [Sprite.NOSE]: colors.face, + [PALETTE.TRANSPARENT]: "transparent", + [PALETTE.OUTLINE]: "#000000", + [PALETTE.BORDER]: "#ffffff", + [PALETTE.BEAK]: "#000000", + [PALETTE.EYE]: "#000000", + [PALETTE.HEART]: "#c82e2e", + [PALETTE.HEART_BORDER]: "#501a1a", + [PALETTE.HEART_SHINE]: "#ff6b6b", + [PALETTE.FEATHER_SPINE]: "#373737", + [PALETTE.HOOD]: colors.face, + [PALETTE.NOSE]: colors.face, }; /** @type {Record} */ - this.colors = { ...defaultColors, ...colors, [Sprite.THEME_HIGHLIGHT]: colors[Sprite.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; + this.colors = { ...defaultColors, ...colors, [PALETTE.THEME_HIGHLIGHT]: colors[PALETTE.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; this.tags = tags; } } @@ -307,127 +313,127 @@ module.exports = class PocketBird extends Plugin { const SPECIES = { bluebird: new BirdType("Eastern Bluebird", "Native to North American and very social, though can be timid around people.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#639bff", - [Sprite.BELLY]: "#f8b143", - [Sprite.UNDERBELLY]: "#ec8637", - [Sprite.WING]: "#578ae6", - [Sprite.WING_EDGE]: "#326ed9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#639bff", + [PALETTE.BELLY]: "#f8b143", + [PALETTE.UNDERBELLY]: "#ec8637", + [PALETTE.WING]: "#578ae6", + [PALETTE.WING_EDGE]: "#326ed9", }), shimaEnaga: new BirdType("Shima Enaga", "Small, fluffy birds found in the snowy regions of Japan, these birds are highly sought after by ornithologists and nature photographers.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffffff", - [Sprite.BELLY]: "#ebe9e8", - [Sprite.UNDERBELLY]: "#ebd9d0", - [Sprite.WING]: "#f3d3c1", - [Sprite.WING_EDGE]: "#2d2d2d", - [Sprite.THEME_HIGHLIGHT]: "#d7ac93", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffffff", + [PALETTE.BELLY]: "#ebe9e8", + [PALETTE.UNDERBELLY]: "#ebd9d0", + [PALETTE.WING]: "#f3d3c1", + [PALETTE.WING_EDGE]: "#2d2d2d", + [PALETTE.THEME_HIGHLIGHT]: "#d7ac93", }), tuftedTitmouse: new BirdType("Tufted Titmouse", "Native to the eastern United States, full of personality, and notably my wife's favorite bird.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#c7cad7", - [Sprite.BELLY]: "#e4e5eb", - [Sprite.UNDERBELLY]: "#d7cfcb", - [Sprite.WING]: "#b1b5c5", - [Sprite.WING_EDGE]: "#9d9fa9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#c7cad7", + [PALETTE.BELLY]: "#e4e5eb", + [PALETTE.UNDERBELLY]: "#d7cfcb", + [PALETTE.WING]: "#b1b5c5", + [PALETTE.WING_EDGE]: "#9d9fa9", }, ["tuft"]), europeanRobin: new BirdType("European Robin", "Native to western Europe, this is the quintessential robin. Quite friendly, you'll often find them searching for worms.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffaf34", - [Sprite.HOOD]: "#aaa094", - [Sprite.BELLY]: "#ffaf34", - [Sprite.UNDERBELLY]: "#babec2", - [Sprite.WING]: "#aaa094", - [Sprite.WING_EDGE]: "#888580", - [Sprite.THEME_HIGHLIGHT]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffaf34", + [PALETTE.HOOD]: "#aaa094", + [PALETTE.BELLY]: "#ffaf34", + [PALETTE.UNDERBELLY]: "#babec2", + [PALETTE.WING]: "#aaa094", + [PALETTE.WING_EDGE]: "#888580", + [PALETTE.THEME_HIGHLIGHT]: "#ffaf34", }), redCardinal: new BirdType("Red Cardinal", "Native to the eastern United States, this strikingly red bird is hard to miss.", { - [Sprite.BEAK]: "#d93619", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#31353d", - [Sprite.HOOD]: "#e83a1b", - [Sprite.BELLY]: "#e83a1b", - [Sprite.UNDERBELLY]: "#dc3719", - [Sprite.WING]: "#d23215", - [Sprite.WING_EDGE]: "#b1321c", + [PALETTE.BEAK]: "#d93619", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#31353d", + [PALETTE.HOOD]: "#e83a1b", + [PALETTE.BELLY]: "#e83a1b", + [PALETTE.UNDERBELLY]: "#dc3719", + [PALETTE.WING]: "#d23215", + [PALETTE.WING_EDGE]: "#b1321c", }, ["tuft"]), americanGoldfinch: new BirdType("American Goldfinch", "Coloured a brilliant yellow, this bird feeds almost entirely on the seeds of plants such as thistle, sunflowers, and coneflowers.", { - [Sprite.BEAK]: "#ffaf34", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#fff255", - [Sprite.NOSE]: "#383838", - [Sprite.HOOD]: "#383838", - [Sprite.BELLY]: "#fff255", - [Sprite.UNDERBELLY]: "#f5ea63", - [Sprite.WING]: "#e8e079", - [Sprite.WING_EDGE]: "#191919", - [Sprite.THEME_HIGHLIGHT]: "#ffcc00" + [PALETTE.BEAK]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#fff255", + [PALETTE.NOSE]: "#383838", + [PALETTE.HOOD]: "#383838", + [PALETTE.BELLY]: "#fff255", + [PALETTE.UNDERBELLY]: "#f5ea63", + [PALETTE.WING]: "#e8e079", + [PALETTE.WING_EDGE]: "#191919", + [PALETTE.THEME_HIGHLIGHT]: "#ffcc00" }), barnSwallow: new BirdType("Barn Swallow", "Agile birds that often roost in man-made structures, these birds are known to build nests near Ospreys for protection.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#db7c4d", - [Sprite.BELLY]: "#f7e1c9", - [Sprite.UNDERBELLY]: "#ebc9a3", - [Sprite.WING]: "#2252a9", - [Sprite.WING_EDGE]: "#1c448b", - [Sprite.HOOD]: "#2252a9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#db7c4d", + [PALETTE.BELLY]: "#f7e1c9", + [PALETTE.UNDERBELLY]: "#ebc9a3", + [PALETTE.WING]: "#2252a9", + [PALETTE.WING_EDGE]: "#1c448b", + [PALETTE.HOOD]: "#2252a9", }), mistletoebird: new BirdType("Mistletoebird", "Native to Australia, these birds eat mainly mistletoe and in turn spread the seeds far and wide.", { - [Sprite.FOOT]: "#6c6a7c", - [Sprite.FACE]: "#352e6d", - [Sprite.BELLY]: "#fd6833", - [Sprite.UNDERBELLY]: "#e6e1d8", - [Sprite.WING]: "#342b7c", - [Sprite.WING_EDGE]: "#282065", + [PALETTE.FOOT]: "#6c6a7c", + [PALETTE.FACE]: "#352e6d", + [PALETTE.BELLY]: "#fd6833", + [PALETTE.UNDERBELLY]: "#e6e1d8", + [PALETTE.WING]: "#342b7c", + [PALETTE.WING_EDGE]: "#282065", }), redAvadavat: new BirdType("Red Avadavat", "Native to India and southeast Asia, these birds are also known as Strawberry Finches due to their speckled plumage.", { - [Sprite.BEAK]: "#f71919", - [Sprite.FOOT]: "#af7575", - [Sprite.FACE]: "#cb092b", - [Sprite.BELLY]: "#ae1724", - [Sprite.UNDERBELLY]: "#831b24", - [Sprite.WING]: "#7e3030", - [Sprite.WING_EDGE]: "#490f0f", + [PALETTE.BEAK]: "#f71919", + [PALETTE.FOOT]: "#af7575", + [PALETTE.FACE]: "#cb092b", + [PALETTE.BELLY]: "#ae1724", + [PALETTE.UNDERBELLY]: "#831b24", + [PALETTE.WING]: "#7e3030", + [PALETTE.WING_EDGE]: "#490f0f", }), scarletRobin: new BirdType("Scarlet Robin", "Native to Australia, this striking robin can be found in Eucalyptus forests.", { - [Sprite.FOOT]: "#494949", - [Sprite.FACE]: "#3d3d3d", - [Sprite.BELLY]: "#fc5633", - [Sprite.UNDERBELLY]: "#dcdcdc", - [Sprite.WING]: "#2b2b2b", - [Sprite.WING_EDGE]: "#ebebeb", - [Sprite.THEME_HIGHLIGHT]: "#fc5633", + [PALETTE.FOOT]: "#494949", + [PALETTE.FACE]: "#3d3d3d", + [PALETTE.BELLY]: "#fc5633", + [PALETTE.UNDERBELLY]: "#dcdcdc", + [PALETTE.WING]: "#2b2b2b", + [PALETTE.WING_EDGE]: "#ebebeb", + [PALETTE.THEME_HIGHLIGHT]: "#fc5633", }), americanRobin: new BirdType("American Robin", "While not a true robin, this social North American bird is so named due to its orange coloring. It seems unbothered by nearby humans.", { - [Sprite.BEAK]: "#e89f30", - [Sprite.FOOT]: "#9f8075", - [Sprite.FACE]: "#2d2d2d", - [Sprite.BELLY]: "#eb7a3a", - [Sprite.UNDERBELLY]: "#eb7a3a", - [Sprite.WING]: "#444444", - [Sprite.WING_EDGE]: "#232323", - [Sprite.THEME_HIGHLIGHT]: "#eb7a3a", + [PALETTE.BEAK]: "#e89f30", + [PALETTE.FOOT]: "#9f8075", + [PALETTE.FACE]: "#2d2d2d", + [PALETTE.BELLY]: "#eb7a3a", + [PALETTE.UNDERBELLY]: "#eb7a3a", + [PALETTE.WING]: "#444444", + [PALETTE.WING_EDGE]: "#232323", + [PALETTE.THEME_HIGHLIGHT]: "#eb7a3a", }), carolinaWren: new BirdType("Carolina Wren", "Native to the eastern United States, these little birds are known for their curious and energetic nature.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#edc7a9", - [Sprite.NOSE]: "#f7eee5", - [Sprite.HOOD]: "#c58a5b", - [Sprite.BELLY]: "#e1b796", - [Sprite.UNDERBELLY]: "#c79e7c", - [Sprite.WING]: "#c58a5b", - [Sprite.WING_EDGE]: "#866348", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#edc7a9", + [PALETTE.NOSE]: "#f7eee5", + [PALETTE.HOOD]: "#c58a5b", + [PALETTE.BELLY]: "#e1b796", + [PALETTE.UNDERBELLY]: "#c79e7c", + [PALETTE.WING]: "#c58a5b", + [PALETTE.WING_EDGE]: "#866348", }), }; @@ -465,7 +471,7 @@ module.exports = class PocketBird extends Plugin { this.pixels = layers[0].pixels.map(row => row.slice()); // Pad from top with transparent pixels while (this.pixels.length < maxHeight) { - this.pixels.unshift(new Array(this.pixels[0].length).fill(Sprite.TRANSPARENT)); + this.pixels.unshift(new Array(this.pixels[0].length).fill(PALETTE.TRANSPARENT)); } // Combine layers for (let i = 1; i < layers.length; i++) { @@ -474,7 +480,7 @@ module.exports = class PocketBird extends Plugin { let topMargin = maxHeight - layerPixels.length; for (let y = 0; y < layerPixels.length; y++) { for (let x = 0; x < layerPixels[y].length; x++) { - this.pixels[y + topMargin][x] = layerPixels[y][x] !== Sprite.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; + this.pixels[y + topMargin][x] = layerPixels[y][x] !== PALETTE.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; } } } @@ -2443,7 +2449,7 @@ module.exports = class PocketBird extends Plugin { function switchSpecies(type) { currentSpecies = type; // Update CSS variable --birb-highlight to be wing color - document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[Sprite.THEME_HIGHLIGHT]); + document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[PALETTE.THEME_HIGHLIGHT]); save(); } @@ -2711,7 +2717,7 @@ module.exports = class PocketBird extends Plugin { const b = pixels[index + 2]; const a = pixels[index + 3]; if (a === 0) { - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); continue; } const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`; @@ -2721,7 +2727,7 @@ module.exports = class PocketBird extends Plugin { } if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) { error(`Unknown color: ${hex}`); - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); } row.push(SPRITE_SHEET_COLOR_MAP[hex]); } diff --git a/dist/userscript/birb.user.js b/dist/userscript/birb.user.js index df89919..01018f5 100644 --- a/dist/userscript/birb.user.js +++ b/dist/userscript/birb.user.js @@ -240,8 +240,11 @@ return document.documentElement.clientHeight; } - /** Indicators for parts of the base bird sprite sheet */ - const Sprite = { + /** + * Palette color names + * @type {Record} + */ + const PALETTE = { THEME_HIGHLIGHT: "theme-highlight", TRANSPARENT: "transparent", OUTLINE: "outline", @@ -262,25 +265,28 @@ FEATHER_SPINE: "feather-spine", }; - /** @type {Record} */ + /** + * Mapping of sprite sheet colors to palette colors + * @type {Record} + */ const SPRITE_SHEET_COLOR_MAP = { - "transparent": Sprite.TRANSPARENT, - "#ffffff": Sprite.BORDER, - "#000000": Sprite.OUTLINE, - "#010a19": Sprite.BEAK, - "#190301": Sprite.EYE, - "#af8e75": Sprite.FOOT, - "#639bff": Sprite.FACE, - "#99e550": Sprite.HOOD, - "#d95763": Sprite.NOSE, - "#f8b143": Sprite.BELLY, - "#ec8637": Sprite.UNDERBELLY, - "#578ae6": Sprite.WING, - "#326ed9": Sprite.WING_EDGE, - "#c82e2e": Sprite.HEART, - "#501a1a": Sprite.HEART_BORDER, - "#ff6b6b": Sprite.HEART_SHINE, - "#373737": Sprite.FEATHER_SPINE, + "transparent": PALETTE.TRANSPARENT, + "#ffffff": PALETTE.BORDER, + "#000000": PALETTE.OUTLINE, + "#010a19": PALETTE.BEAK, + "#190301": PALETTE.EYE, + "#af8e75": PALETTE.FOOT, + "#639bff": PALETTE.FACE, + "#99e550": PALETTE.HOOD, + "#d95763": PALETTE.NOSE, + "#f8b143": PALETTE.BELLY, + "#ec8637": PALETTE.UNDERBELLY, + "#578ae6": PALETTE.WING, + "#326ed9": PALETTE.WING_EDGE, + "#c82e2e": PALETTE.HEART, + "#501a1a": PALETTE.HEART_BORDER, + "#ff6b6b": PALETTE.HEART_SHINE, + "#373737": PALETTE.FEATHER_SPINE, }; class BirdType { @@ -294,20 +300,20 @@ this.name = name; this.description = description; const defaultColors = { - [Sprite.TRANSPARENT]: "transparent", - [Sprite.OUTLINE]: "#000000", - [Sprite.BORDER]: "#ffffff", - [Sprite.BEAK]: "#000000", - [Sprite.EYE]: "#000000", - [Sprite.HEART]: "#c82e2e", - [Sprite.HEART_BORDER]: "#501a1a", - [Sprite.HEART_SHINE]: "#ff6b6b", - [Sprite.FEATHER_SPINE]: "#373737", - [Sprite.HOOD]: colors.face, - [Sprite.NOSE]: colors.face, + [PALETTE.TRANSPARENT]: "transparent", + [PALETTE.OUTLINE]: "#000000", + [PALETTE.BORDER]: "#ffffff", + [PALETTE.BEAK]: "#000000", + [PALETTE.EYE]: "#000000", + [PALETTE.HEART]: "#c82e2e", + [PALETTE.HEART_BORDER]: "#501a1a", + [PALETTE.HEART_SHINE]: "#ff6b6b", + [PALETTE.FEATHER_SPINE]: "#373737", + [PALETTE.HOOD]: colors.face, + [PALETTE.NOSE]: colors.face, }; /** @type {Record} */ - this.colors = { ...defaultColors, ...colors, [Sprite.THEME_HIGHLIGHT]: colors[Sprite.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; + this.colors = { ...defaultColors, ...colors, [PALETTE.THEME_HIGHLIGHT]: colors[PALETTE.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; this.tags = tags; } } @@ -316,127 +322,127 @@ const SPECIES = { bluebird: new BirdType("Eastern Bluebird", "Native to North American and very social, though can be timid around people.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#639bff", - [Sprite.BELLY]: "#f8b143", - [Sprite.UNDERBELLY]: "#ec8637", - [Sprite.WING]: "#578ae6", - [Sprite.WING_EDGE]: "#326ed9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#639bff", + [PALETTE.BELLY]: "#f8b143", + [PALETTE.UNDERBELLY]: "#ec8637", + [PALETTE.WING]: "#578ae6", + [PALETTE.WING_EDGE]: "#326ed9", }), shimaEnaga: new BirdType("Shima Enaga", "Small, fluffy birds found in the snowy regions of Japan, these birds are highly sought after by ornithologists and nature photographers.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffffff", - [Sprite.BELLY]: "#ebe9e8", - [Sprite.UNDERBELLY]: "#ebd9d0", - [Sprite.WING]: "#f3d3c1", - [Sprite.WING_EDGE]: "#2d2d2d", - [Sprite.THEME_HIGHLIGHT]: "#d7ac93", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffffff", + [PALETTE.BELLY]: "#ebe9e8", + [PALETTE.UNDERBELLY]: "#ebd9d0", + [PALETTE.WING]: "#f3d3c1", + [PALETTE.WING_EDGE]: "#2d2d2d", + [PALETTE.THEME_HIGHLIGHT]: "#d7ac93", }), tuftedTitmouse: new BirdType("Tufted Titmouse", "Native to the eastern United States, full of personality, and notably my wife's favorite bird.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#c7cad7", - [Sprite.BELLY]: "#e4e5eb", - [Sprite.UNDERBELLY]: "#d7cfcb", - [Sprite.WING]: "#b1b5c5", - [Sprite.WING_EDGE]: "#9d9fa9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#c7cad7", + [PALETTE.BELLY]: "#e4e5eb", + [PALETTE.UNDERBELLY]: "#d7cfcb", + [PALETTE.WING]: "#b1b5c5", + [PALETTE.WING_EDGE]: "#9d9fa9", }, ["tuft"]), europeanRobin: new BirdType("European Robin", "Native to western Europe, this is the quintessential robin. Quite friendly, you'll often find them searching for worms.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffaf34", - [Sprite.HOOD]: "#aaa094", - [Sprite.BELLY]: "#ffaf34", - [Sprite.UNDERBELLY]: "#babec2", - [Sprite.WING]: "#aaa094", - [Sprite.WING_EDGE]: "#888580", - [Sprite.THEME_HIGHLIGHT]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffaf34", + [PALETTE.HOOD]: "#aaa094", + [PALETTE.BELLY]: "#ffaf34", + [PALETTE.UNDERBELLY]: "#babec2", + [PALETTE.WING]: "#aaa094", + [PALETTE.WING_EDGE]: "#888580", + [PALETTE.THEME_HIGHLIGHT]: "#ffaf34", }), redCardinal: new BirdType("Red Cardinal", "Native to the eastern United States, this strikingly red bird is hard to miss.", { - [Sprite.BEAK]: "#d93619", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#31353d", - [Sprite.HOOD]: "#e83a1b", - [Sprite.BELLY]: "#e83a1b", - [Sprite.UNDERBELLY]: "#dc3719", - [Sprite.WING]: "#d23215", - [Sprite.WING_EDGE]: "#b1321c", + [PALETTE.BEAK]: "#d93619", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#31353d", + [PALETTE.HOOD]: "#e83a1b", + [PALETTE.BELLY]: "#e83a1b", + [PALETTE.UNDERBELLY]: "#dc3719", + [PALETTE.WING]: "#d23215", + [PALETTE.WING_EDGE]: "#b1321c", }, ["tuft"]), americanGoldfinch: new BirdType("American Goldfinch", "Coloured a brilliant yellow, this bird feeds almost entirely on the seeds of plants such as thistle, sunflowers, and coneflowers.", { - [Sprite.BEAK]: "#ffaf34", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#fff255", - [Sprite.NOSE]: "#383838", - [Sprite.HOOD]: "#383838", - [Sprite.BELLY]: "#fff255", - [Sprite.UNDERBELLY]: "#f5ea63", - [Sprite.WING]: "#e8e079", - [Sprite.WING_EDGE]: "#191919", - [Sprite.THEME_HIGHLIGHT]: "#ffcc00" + [PALETTE.BEAK]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#fff255", + [PALETTE.NOSE]: "#383838", + [PALETTE.HOOD]: "#383838", + [PALETTE.BELLY]: "#fff255", + [PALETTE.UNDERBELLY]: "#f5ea63", + [PALETTE.WING]: "#e8e079", + [PALETTE.WING_EDGE]: "#191919", + [PALETTE.THEME_HIGHLIGHT]: "#ffcc00" }), barnSwallow: new BirdType("Barn Swallow", "Agile birds that often roost in man-made structures, these birds are known to build nests near Ospreys for protection.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#db7c4d", - [Sprite.BELLY]: "#f7e1c9", - [Sprite.UNDERBELLY]: "#ebc9a3", - [Sprite.WING]: "#2252a9", - [Sprite.WING_EDGE]: "#1c448b", - [Sprite.HOOD]: "#2252a9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#db7c4d", + [PALETTE.BELLY]: "#f7e1c9", + [PALETTE.UNDERBELLY]: "#ebc9a3", + [PALETTE.WING]: "#2252a9", + [PALETTE.WING_EDGE]: "#1c448b", + [PALETTE.HOOD]: "#2252a9", }), mistletoebird: new BirdType("Mistletoebird", "Native to Australia, these birds eat mainly mistletoe and in turn spread the seeds far and wide.", { - [Sprite.FOOT]: "#6c6a7c", - [Sprite.FACE]: "#352e6d", - [Sprite.BELLY]: "#fd6833", - [Sprite.UNDERBELLY]: "#e6e1d8", - [Sprite.WING]: "#342b7c", - [Sprite.WING_EDGE]: "#282065", + [PALETTE.FOOT]: "#6c6a7c", + [PALETTE.FACE]: "#352e6d", + [PALETTE.BELLY]: "#fd6833", + [PALETTE.UNDERBELLY]: "#e6e1d8", + [PALETTE.WING]: "#342b7c", + [PALETTE.WING_EDGE]: "#282065", }), redAvadavat: new BirdType("Red Avadavat", "Native to India and southeast Asia, these birds are also known as Strawberry Finches due to their speckled plumage.", { - [Sprite.BEAK]: "#f71919", - [Sprite.FOOT]: "#af7575", - [Sprite.FACE]: "#cb092b", - [Sprite.BELLY]: "#ae1724", - [Sprite.UNDERBELLY]: "#831b24", - [Sprite.WING]: "#7e3030", - [Sprite.WING_EDGE]: "#490f0f", + [PALETTE.BEAK]: "#f71919", + [PALETTE.FOOT]: "#af7575", + [PALETTE.FACE]: "#cb092b", + [PALETTE.BELLY]: "#ae1724", + [PALETTE.UNDERBELLY]: "#831b24", + [PALETTE.WING]: "#7e3030", + [PALETTE.WING_EDGE]: "#490f0f", }), scarletRobin: new BirdType("Scarlet Robin", "Native to Australia, this striking robin can be found in Eucalyptus forests.", { - [Sprite.FOOT]: "#494949", - [Sprite.FACE]: "#3d3d3d", - [Sprite.BELLY]: "#fc5633", - [Sprite.UNDERBELLY]: "#dcdcdc", - [Sprite.WING]: "#2b2b2b", - [Sprite.WING_EDGE]: "#ebebeb", - [Sprite.THEME_HIGHLIGHT]: "#fc5633", + [PALETTE.FOOT]: "#494949", + [PALETTE.FACE]: "#3d3d3d", + [PALETTE.BELLY]: "#fc5633", + [PALETTE.UNDERBELLY]: "#dcdcdc", + [PALETTE.WING]: "#2b2b2b", + [PALETTE.WING_EDGE]: "#ebebeb", + [PALETTE.THEME_HIGHLIGHT]: "#fc5633", }), americanRobin: new BirdType("American Robin", "While not a true robin, this social North American bird is so named due to its orange coloring. It seems unbothered by nearby humans.", { - [Sprite.BEAK]: "#e89f30", - [Sprite.FOOT]: "#9f8075", - [Sprite.FACE]: "#2d2d2d", - [Sprite.BELLY]: "#eb7a3a", - [Sprite.UNDERBELLY]: "#eb7a3a", - [Sprite.WING]: "#444444", - [Sprite.WING_EDGE]: "#232323", - [Sprite.THEME_HIGHLIGHT]: "#eb7a3a", + [PALETTE.BEAK]: "#e89f30", + [PALETTE.FOOT]: "#9f8075", + [PALETTE.FACE]: "#2d2d2d", + [PALETTE.BELLY]: "#eb7a3a", + [PALETTE.UNDERBELLY]: "#eb7a3a", + [PALETTE.WING]: "#444444", + [PALETTE.WING_EDGE]: "#232323", + [PALETTE.THEME_HIGHLIGHT]: "#eb7a3a", }), carolinaWren: new BirdType("Carolina Wren", "Native to the eastern United States, these little birds are known for their curious and energetic nature.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#edc7a9", - [Sprite.NOSE]: "#f7eee5", - [Sprite.HOOD]: "#c58a5b", - [Sprite.BELLY]: "#e1b796", - [Sprite.UNDERBELLY]: "#c79e7c", - [Sprite.WING]: "#c58a5b", - [Sprite.WING_EDGE]: "#866348", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#edc7a9", + [PALETTE.NOSE]: "#f7eee5", + [PALETTE.HOOD]: "#c58a5b", + [PALETTE.BELLY]: "#e1b796", + [PALETTE.UNDERBELLY]: "#c79e7c", + [PALETTE.WING]: "#c58a5b", + [PALETTE.WING_EDGE]: "#866348", }), }; @@ -474,7 +480,7 @@ this.pixels = layers[0].pixels.map(row => row.slice()); // Pad from top with transparent pixels while (this.pixels.length < maxHeight) { - this.pixels.unshift(new Array(this.pixels[0].length).fill(Sprite.TRANSPARENT)); + this.pixels.unshift(new Array(this.pixels[0].length).fill(PALETTE.TRANSPARENT)); } // Combine layers for (let i = 1; i < layers.length; i++) { @@ -483,7 +489,7 @@ let topMargin = maxHeight - layerPixels.length; for (let y = 0; y < layerPixels.length; y++) { for (let x = 0; x < layerPixels[y].length; x++) { - this.pixels[y + topMargin][x] = layerPixels[y][x] !== Sprite.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; + this.pixels[y + topMargin][x] = layerPixels[y][x] !== PALETTE.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; } } } @@ -2405,7 +2411,7 @@ function switchSpecies(type) { currentSpecies = type; // Update CSS variable --birb-highlight to be wing color - document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[Sprite.THEME_HIGHLIGHT]); + document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[PALETTE.THEME_HIGHLIGHT]); save(); } @@ -2673,7 +2679,7 @@ const b = pixels[index + 2]; const a = pixels[index + 3]; if (a === 0) { - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); continue; } const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`; @@ -2683,7 +2689,7 @@ } if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) { error(`Unknown color: ${hex}`); - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); } row.push(SPRITE_SHEET_COLOR_MAP[hex]); } diff --git a/dist/web/birb.embed.js b/dist/web/birb.embed.js index 077d90d..722645a 100644 --- a/dist/web/birb.embed.js +++ b/dist/web/birb.embed.js @@ -226,8 +226,11 @@ return document.documentElement.clientHeight; } - /** Indicators for parts of the base bird sprite sheet */ - const Sprite = { + /** + * Palette color names + * @type {Record} + */ + const PALETTE = { THEME_HIGHLIGHT: "theme-highlight", TRANSPARENT: "transparent", OUTLINE: "outline", @@ -248,25 +251,28 @@ FEATHER_SPINE: "feather-spine", }; - /** @type {Record} */ + /** + * Mapping of sprite sheet colors to palette colors + * @type {Record} + */ const SPRITE_SHEET_COLOR_MAP = { - "transparent": Sprite.TRANSPARENT, - "#ffffff": Sprite.BORDER, - "#000000": Sprite.OUTLINE, - "#010a19": Sprite.BEAK, - "#190301": Sprite.EYE, - "#af8e75": Sprite.FOOT, - "#639bff": Sprite.FACE, - "#99e550": Sprite.HOOD, - "#d95763": Sprite.NOSE, - "#f8b143": Sprite.BELLY, - "#ec8637": Sprite.UNDERBELLY, - "#578ae6": Sprite.WING, - "#326ed9": Sprite.WING_EDGE, - "#c82e2e": Sprite.HEART, - "#501a1a": Sprite.HEART_BORDER, - "#ff6b6b": Sprite.HEART_SHINE, - "#373737": Sprite.FEATHER_SPINE, + "transparent": PALETTE.TRANSPARENT, + "#ffffff": PALETTE.BORDER, + "#000000": PALETTE.OUTLINE, + "#010a19": PALETTE.BEAK, + "#190301": PALETTE.EYE, + "#af8e75": PALETTE.FOOT, + "#639bff": PALETTE.FACE, + "#99e550": PALETTE.HOOD, + "#d95763": PALETTE.NOSE, + "#f8b143": PALETTE.BELLY, + "#ec8637": PALETTE.UNDERBELLY, + "#578ae6": PALETTE.WING, + "#326ed9": PALETTE.WING_EDGE, + "#c82e2e": PALETTE.HEART, + "#501a1a": PALETTE.HEART_BORDER, + "#ff6b6b": PALETTE.HEART_SHINE, + "#373737": PALETTE.FEATHER_SPINE, }; class BirdType { @@ -280,20 +286,20 @@ this.name = name; this.description = description; const defaultColors = { - [Sprite.TRANSPARENT]: "transparent", - [Sprite.OUTLINE]: "#000000", - [Sprite.BORDER]: "#ffffff", - [Sprite.BEAK]: "#000000", - [Sprite.EYE]: "#000000", - [Sprite.HEART]: "#c82e2e", - [Sprite.HEART_BORDER]: "#501a1a", - [Sprite.HEART_SHINE]: "#ff6b6b", - [Sprite.FEATHER_SPINE]: "#373737", - [Sprite.HOOD]: colors.face, - [Sprite.NOSE]: colors.face, + [PALETTE.TRANSPARENT]: "transparent", + [PALETTE.OUTLINE]: "#000000", + [PALETTE.BORDER]: "#ffffff", + [PALETTE.BEAK]: "#000000", + [PALETTE.EYE]: "#000000", + [PALETTE.HEART]: "#c82e2e", + [PALETTE.HEART_BORDER]: "#501a1a", + [PALETTE.HEART_SHINE]: "#ff6b6b", + [PALETTE.FEATHER_SPINE]: "#373737", + [PALETTE.HOOD]: colors.face, + [PALETTE.NOSE]: colors.face, }; /** @type {Record} */ - this.colors = { ...defaultColors, ...colors, [Sprite.THEME_HIGHLIGHT]: colors[Sprite.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; + this.colors = { ...defaultColors, ...colors, [PALETTE.THEME_HIGHLIGHT]: colors[PALETTE.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; this.tags = tags; } } @@ -302,127 +308,127 @@ const SPECIES = { bluebird: new BirdType("Eastern Bluebird", "Native to North American and very social, though can be timid around people.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#639bff", - [Sprite.BELLY]: "#f8b143", - [Sprite.UNDERBELLY]: "#ec8637", - [Sprite.WING]: "#578ae6", - [Sprite.WING_EDGE]: "#326ed9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#639bff", + [PALETTE.BELLY]: "#f8b143", + [PALETTE.UNDERBELLY]: "#ec8637", + [PALETTE.WING]: "#578ae6", + [PALETTE.WING_EDGE]: "#326ed9", }), shimaEnaga: new BirdType("Shima Enaga", "Small, fluffy birds found in the snowy regions of Japan, these birds are highly sought after by ornithologists and nature photographers.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffffff", - [Sprite.BELLY]: "#ebe9e8", - [Sprite.UNDERBELLY]: "#ebd9d0", - [Sprite.WING]: "#f3d3c1", - [Sprite.WING_EDGE]: "#2d2d2d", - [Sprite.THEME_HIGHLIGHT]: "#d7ac93", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffffff", + [PALETTE.BELLY]: "#ebe9e8", + [PALETTE.UNDERBELLY]: "#ebd9d0", + [PALETTE.WING]: "#f3d3c1", + [PALETTE.WING_EDGE]: "#2d2d2d", + [PALETTE.THEME_HIGHLIGHT]: "#d7ac93", }), tuftedTitmouse: new BirdType("Tufted Titmouse", "Native to the eastern United States, full of personality, and notably my wife's favorite bird.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#c7cad7", - [Sprite.BELLY]: "#e4e5eb", - [Sprite.UNDERBELLY]: "#d7cfcb", - [Sprite.WING]: "#b1b5c5", - [Sprite.WING_EDGE]: "#9d9fa9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#c7cad7", + [PALETTE.BELLY]: "#e4e5eb", + [PALETTE.UNDERBELLY]: "#d7cfcb", + [PALETTE.WING]: "#b1b5c5", + [PALETTE.WING_EDGE]: "#9d9fa9", }, ["tuft"]), europeanRobin: new BirdType("European Robin", "Native to western Europe, this is the quintessential robin. Quite friendly, you'll often find them searching for worms.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffaf34", - [Sprite.HOOD]: "#aaa094", - [Sprite.BELLY]: "#ffaf34", - [Sprite.UNDERBELLY]: "#babec2", - [Sprite.WING]: "#aaa094", - [Sprite.WING_EDGE]: "#888580", - [Sprite.THEME_HIGHLIGHT]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffaf34", + [PALETTE.HOOD]: "#aaa094", + [PALETTE.BELLY]: "#ffaf34", + [PALETTE.UNDERBELLY]: "#babec2", + [PALETTE.WING]: "#aaa094", + [PALETTE.WING_EDGE]: "#888580", + [PALETTE.THEME_HIGHLIGHT]: "#ffaf34", }), redCardinal: new BirdType("Red Cardinal", "Native to the eastern United States, this strikingly red bird is hard to miss.", { - [Sprite.BEAK]: "#d93619", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#31353d", - [Sprite.HOOD]: "#e83a1b", - [Sprite.BELLY]: "#e83a1b", - [Sprite.UNDERBELLY]: "#dc3719", - [Sprite.WING]: "#d23215", - [Sprite.WING_EDGE]: "#b1321c", + [PALETTE.BEAK]: "#d93619", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#31353d", + [PALETTE.HOOD]: "#e83a1b", + [PALETTE.BELLY]: "#e83a1b", + [PALETTE.UNDERBELLY]: "#dc3719", + [PALETTE.WING]: "#d23215", + [PALETTE.WING_EDGE]: "#b1321c", }, ["tuft"]), americanGoldfinch: new BirdType("American Goldfinch", "Coloured a brilliant yellow, this bird feeds almost entirely on the seeds of plants such as thistle, sunflowers, and coneflowers.", { - [Sprite.BEAK]: "#ffaf34", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#fff255", - [Sprite.NOSE]: "#383838", - [Sprite.HOOD]: "#383838", - [Sprite.BELLY]: "#fff255", - [Sprite.UNDERBELLY]: "#f5ea63", - [Sprite.WING]: "#e8e079", - [Sprite.WING_EDGE]: "#191919", - [Sprite.THEME_HIGHLIGHT]: "#ffcc00" + [PALETTE.BEAK]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#fff255", + [PALETTE.NOSE]: "#383838", + [PALETTE.HOOD]: "#383838", + [PALETTE.BELLY]: "#fff255", + [PALETTE.UNDERBELLY]: "#f5ea63", + [PALETTE.WING]: "#e8e079", + [PALETTE.WING_EDGE]: "#191919", + [PALETTE.THEME_HIGHLIGHT]: "#ffcc00" }), barnSwallow: new BirdType("Barn Swallow", "Agile birds that often roost in man-made structures, these birds are known to build nests near Ospreys for protection.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#db7c4d", - [Sprite.BELLY]: "#f7e1c9", - [Sprite.UNDERBELLY]: "#ebc9a3", - [Sprite.WING]: "#2252a9", - [Sprite.WING_EDGE]: "#1c448b", - [Sprite.HOOD]: "#2252a9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#db7c4d", + [PALETTE.BELLY]: "#f7e1c9", + [PALETTE.UNDERBELLY]: "#ebc9a3", + [PALETTE.WING]: "#2252a9", + [PALETTE.WING_EDGE]: "#1c448b", + [PALETTE.HOOD]: "#2252a9", }), mistletoebird: new BirdType("Mistletoebird", "Native to Australia, these birds eat mainly mistletoe and in turn spread the seeds far and wide.", { - [Sprite.FOOT]: "#6c6a7c", - [Sprite.FACE]: "#352e6d", - [Sprite.BELLY]: "#fd6833", - [Sprite.UNDERBELLY]: "#e6e1d8", - [Sprite.WING]: "#342b7c", - [Sprite.WING_EDGE]: "#282065", + [PALETTE.FOOT]: "#6c6a7c", + [PALETTE.FACE]: "#352e6d", + [PALETTE.BELLY]: "#fd6833", + [PALETTE.UNDERBELLY]: "#e6e1d8", + [PALETTE.WING]: "#342b7c", + [PALETTE.WING_EDGE]: "#282065", }), redAvadavat: new BirdType("Red Avadavat", "Native to India and southeast Asia, these birds are also known as Strawberry Finches due to their speckled plumage.", { - [Sprite.BEAK]: "#f71919", - [Sprite.FOOT]: "#af7575", - [Sprite.FACE]: "#cb092b", - [Sprite.BELLY]: "#ae1724", - [Sprite.UNDERBELLY]: "#831b24", - [Sprite.WING]: "#7e3030", - [Sprite.WING_EDGE]: "#490f0f", + [PALETTE.BEAK]: "#f71919", + [PALETTE.FOOT]: "#af7575", + [PALETTE.FACE]: "#cb092b", + [PALETTE.BELLY]: "#ae1724", + [PALETTE.UNDERBELLY]: "#831b24", + [PALETTE.WING]: "#7e3030", + [PALETTE.WING_EDGE]: "#490f0f", }), scarletRobin: new BirdType("Scarlet Robin", "Native to Australia, this striking robin can be found in Eucalyptus forests.", { - [Sprite.FOOT]: "#494949", - [Sprite.FACE]: "#3d3d3d", - [Sprite.BELLY]: "#fc5633", - [Sprite.UNDERBELLY]: "#dcdcdc", - [Sprite.WING]: "#2b2b2b", - [Sprite.WING_EDGE]: "#ebebeb", - [Sprite.THEME_HIGHLIGHT]: "#fc5633", + [PALETTE.FOOT]: "#494949", + [PALETTE.FACE]: "#3d3d3d", + [PALETTE.BELLY]: "#fc5633", + [PALETTE.UNDERBELLY]: "#dcdcdc", + [PALETTE.WING]: "#2b2b2b", + [PALETTE.WING_EDGE]: "#ebebeb", + [PALETTE.THEME_HIGHLIGHT]: "#fc5633", }), americanRobin: new BirdType("American Robin", "While not a true robin, this social North American bird is so named due to its orange coloring. It seems unbothered by nearby humans.", { - [Sprite.BEAK]: "#e89f30", - [Sprite.FOOT]: "#9f8075", - [Sprite.FACE]: "#2d2d2d", - [Sprite.BELLY]: "#eb7a3a", - [Sprite.UNDERBELLY]: "#eb7a3a", - [Sprite.WING]: "#444444", - [Sprite.WING_EDGE]: "#232323", - [Sprite.THEME_HIGHLIGHT]: "#eb7a3a", + [PALETTE.BEAK]: "#e89f30", + [PALETTE.FOOT]: "#9f8075", + [PALETTE.FACE]: "#2d2d2d", + [PALETTE.BELLY]: "#eb7a3a", + [PALETTE.UNDERBELLY]: "#eb7a3a", + [PALETTE.WING]: "#444444", + [PALETTE.WING_EDGE]: "#232323", + [PALETTE.THEME_HIGHLIGHT]: "#eb7a3a", }), carolinaWren: new BirdType("Carolina Wren", "Native to the eastern United States, these little birds are known for their curious and energetic nature.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#edc7a9", - [Sprite.NOSE]: "#f7eee5", - [Sprite.HOOD]: "#c58a5b", - [Sprite.BELLY]: "#e1b796", - [Sprite.UNDERBELLY]: "#c79e7c", - [Sprite.WING]: "#c58a5b", - [Sprite.WING_EDGE]: "#866348", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#edc7a9", + [PALETTE.NOSE]: "#f7eee5", + [PALETTE.HOOD]: "#c58a5b", + [PALETTE.BELLY]: "#e1b796", + [PALETTE.UNDERBELLY]: "#c79e7c", + [PALETTE.WING]: "#c58a5b", + [PALETTE.WING_EDGE]: "#866348", }), }; @@ -460,7 +466,7 @@ this.pixels = layers[0].pixels.map(row => row.slice()); // Pad from top with transparent pixels while (this.pixels.length < maxHeight) { - this.pixels.unshift(new Array(this.pixels[0].length).fill(Sprite.TRANSPARENT)); + this.pixels.unshift(new Array(this.pixels[0].length).fill(PALETTE.TRANSPARENT)); } // Combine layers for (let i = 1; i < layers.length; i++) { @@ -469,7 +475,7 @@ let topMargin = maxHeight - layerPixels.length; for (let y = 0; y < layerPixels.length; y++) { for (let x = 0; x < layerPixels[y].length; x++) { - this.pixels[y + topMargin][x] = layerPixels[y][x] !== Sprite.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; + this.pixels[y + topMargin][x] = layerPixels[y][x] !== PALETTE.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; } } } @@ -2385,7 +2391,7 @@ function switchSpecies(type) { currentSpecies = type; // Update CSS variable --birb-highlight to be wing color - document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[Sprite.THEME_HIGHLIGHT]); + document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[PALETTE.THEME_HIGHLIGHT]); save(); } @@ -2653,7 +2659,7 @@ const b = pixels[index + 2]; const a = pixels[index + 3]; if (a === 0) { - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); continue; } const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`; @@ -2663,7 +2669,7 @@ } if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) { error(`Unknown color: ${hex}`); - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); } row.push(SPRITE_SHEET_COLOR_MAP[hex]); } diff --git a/dist/web/birb.js b/dist/web/birb.js index 077d90d..722645a 100644 --- a/dist/web/birb.js +++ b/dist/web/birb.js @@ -226,8 +226,11 @@ return document.documentElement.clientHeight; } - /** Indicators for parts of the base bird sprite sheet */ - const Sprite = { + /** + * Palette color names + * @type {Record} + */ + const PALETTE = { THEME_HIGHLIGHT: "theme-highlight", TRANSPARENT: "transparent", OUTLINE: "outline", @@ -248,25 +251,28 @@ FEATHER_SPINE: "feather-spine", }; - /** @type {Record} */ + /** + * Mapping of sprite sheet colors to palette colors + * @type {Record} + */ const SPRITE_SHEET_COLOR_MAP = { - "transparent": Sprite.TRANSPARENT, - "#ffffff": Sprite.BORDER, - "#000000": Sprite.OUTLINE, - "#010a19": Sprite.BEAK, - "#190301": Sprite.EYE, - "#af8e75": Sprite.FOOT, - "#639bff": Sprite.FACE, - "#99e550": Sprite.HOOD, - "#d95763": Sprite.NOSE, - "#f8b143": Sprite.BELLY, - "#ec8637": Sprite.UNDERBELLY, - "#578ae6": Sprite.WING, - "#326ed9": Sprite.WING_EDGE, - "#c82e2e": Sprite.HEART, - "#501a1a": Sprite.HEART_BORDER, - "#ff6b6b": Sprite.HEART_SHINE, - "#373737": Sprite.FEATHER_SPINE, + "transparent": PALETTE.TRANSPARENT, + "#ffffff": PALETTE.BORDER, + "#000000": PALETTE.OUTLINE, + "#010a19": PALETTE.BEAK, + "#190301": PALETTE.EYE, + "#af8e75": PALETTE.FOOT, + "#639bff": PALETTE.FACE, + "#99e550": PALETTE.HOOD, + "#d95763": PALETTE.NOSE, + "#f8b143": PALETTE.BELLY, + "#ec8637": PALETTE.UNDERBELLY, + "#578ae6": PALETTE.WING, + "#326ed9": PALETTE.WING_EDGE, + "#c82e2e": PALETTE.HEART, + "#501a1a": PALETTE.HEART_BORDER, + "#ff6b6b": PALETTE.HEART_SHINE, + "#373737": PALETTE.FEATHER_SPINE, }; class BirdType { @@ -280,20 +286,20 @@ this.name = name; this.description = description; const defaultColors = { - [Sprite.TRANSPARENT]: "transparent", - [Sprite.OUTLINE]: "#000000", - [Sprite.BORDER]: "#ffffff", - [Sprite.BEAK]: "#000000", - [Sprite.EYE]: "#000000", - [Sprite.HEART]: "#c82e2e", - [Sprite.HEART_BORDER]: "#501a1a", - [Sprite.HEART_SHINE]: "#ff6b6b", - [Sprite.FEATHER_SPINE]: "#373737", - [Sprite.HOOD]: colors.face, - [Sprite.NOSE]: colors.face, + [PALETTE.TRANSPARENT]: "transparent", + [PALETTE.OUTLINE]: "#000000", + [PALETTE.BORDER]: "#ffffff", + [PALETTE.BEAK]: "#000000", + [PALETTE.EYE]: "#000000", + [PALETTE.HEART]: "#c82e2e", + [PALETTE.HEART_BORDER]: "#501a1a", + [PALETTE.HEART_SHINE]: "#ff6b6b", + [PALETTE.FEATHER_SPINE]: "#373737", + [PALETTE.HOOD]: colors.face, + [PALETTE.NOSE]: colors.face, }; /** @type {Record} */ - this.colors = { ...defaultColors, ...colors, [Sprite.THEME_HIGHLIGHT]: colors[Sprite.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; + this.colors = { ...defaultColors, ...colors, [PALETTE.THEME_HIGHLIGHT]: colors[PALETTE.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; this.tags = tags; } } @@ -302,127 +308,127 @@ const SPECIES = { bluebird: new BirdType("Eastern Bluebird", "Native to North American and very social, though can be timid around people.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#639bff", - [Sprite.BELLY]: "#f8b143", - [Sprite.UNDERBELLY]: "#ec8637", - [Sprite.WING]: "#578ae6", - [Sprite.WING_EDGE]: "#326ed9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#639bff", + [PALETTE.BELLY]: "#f8b143", + [PALETTE.UNDERBELLY]: "#ec8637", + [PALETTE.WING]: "#578ae6", + [PALETTE.WING_EDGE]: "#326ed9", }), shimaEnaga: new BirdType("Shima Enaga", "Small, fluffy birds found in the snowy regions of Japan, these birds are highly sought after by ornithologists and nature photographers.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffffff", - [Sprite.BELLY]: "#ebe9e8", - [Sprite.UNDERBELLY]: "#ebd9d0", - [Sprite.WING]: "#f3d3c1", - [Sprite.WING_EDGE]: "#2d2d2d", - [Sprite.THEME_HIGHLIGHT]: "#d7ac93", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffffff", + [PALETTE.BELLY]: "#ebe9e8", + [PALETTE.UNDERBELLY]: "#ebd9d0", + [PALETTE.WING]: "#f3d3c1", + [PALETTE.WING_EDGE]: "#2d2d2d", + [PALETTE.THEME_HIGHLIGHT]: "#d7ac93", }), tuftedTitmouse: new BirdType("Tufted Titmouse", "Native to the eastern United States, full of personality, and notably my wife's favorite bird.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#c7cad7", - [Sprite.BELLY]: "#e4e5eb", - [Sprite.UNDERBELLY]: "#d7cfcb", - [Sprite.WING]: "#b1b5c5", - [Sprite.WING_EDGE]: "#9d9fa9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#c7cad7", + [PALETTE.BELLY]: "#e4e5eb", + [PALETTE.UNDERBELLY]: "#d7cfcb", + [PALETTE.WING]: "#b1b5c5", + [PALETTE.WING_EDGE]: "#9d9fa9", }, ["tuft"]), europeanRobin: new BirdType("European Robin", "Native to western Europe, this is the quintessential robin. Quite friendly, you'll often find them searching for worms.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffaf34", - [Sprite.HOOD]: "#aaa094", - [Sprite.BELLY]: "#ffaf34", - [Sprite.UNDERBELLY]: "#babec2", - [Sprite.WING]: "#aaa094", - [Sprite.WING_EDGE]: "#888580", - [Sprite.THEME_HIGHLIGHT]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffaf34", + [PALETTE.HOOD]: "#aaa094", + [PALETTE.BELLY]: "#ffaf34", + [PALETTE.UNDERBELLY]: "#babec2", + [PALETTE.WING]: "#aaa094", + [PALETTE.WING_EDGE]: "#888580", + [PALETTE.THEME_HIGHLIGHT]: "#ffaf34", }), redCardinal: new BirdType("Red Cardinal", "Native to the eastern United States, this strikingly red bird is hard to miss.", { - [Sprite.BEAK]: "#d93619", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#31353d", - [Sprite.HOOD]: "#e83a1b", - [Sprite.BELLY]: "#e83a1b", - [Sprite.UNDERBELLY]: "#dc3719", - [Sprite.WING]: "#d23215", - [Sprite.WING_EDGE]: "#b1321c", + [PALETTE.BEAK]: "#d93619", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#31353d", + [PALETTE.HOOD]: "#e83a1b", + [PALETTE.BELLY]: "#e83a1b", + [PALETTE.UNDERBELLY]: "#dc3719", + [PALETTE.WING]: "#d23215", + [PALETTE.WING_EDGE]: "#b1321c", }, ["tuft"]), americanGoldfinch: new BirdType("American Goldfinch", "Coloured a brilliant yellow, this bird feeds almost entirely on the seeds of plants such as thistle, sunflowers, and coneflowers.", { - [Sprite.BEAK]: "#ffaf34", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#fff255", - [Sprite.NOSE]: "#383838", - [Sprite.HOOD]: "#383838", - [Sprite.BELLY]: "#fff255", - [Sprite.UNDERBELLY]: "#f5ea63", - [Sprite.WING]: "#e8e079", - [Sprite.WING_EDGE]: "#191919", - [Sprite.THEME_HIGHLIGHT]: "#ffcc00" + [PALETTE.BEAK]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#fff255", + [PALETTE.NOSE]: "#383838", + [PALETTE.HOOD]: "#383838", + [PALETTE.BELLY]: "#fff255", + [PALETTE.UNDERBELLY]: "#f5ea63", + [PALETTE.WING]: "#e8e079", + [PALETTE.WING_EDGE]: "#191919", + [PALETTE.THEME_HIGHLIGHT]: "#ffcc00" }), barnSwallow: new BirdType("Barn Swallow", "Agile birds that often roost in man-made structures, these birds are known to build nests near Ospreys for protection.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#db7c4d", - [Sprite.BELLY]: "#f7e1c9", - [Sprite.UNDERBELLY]: "#ebc9a3", - [Sprite.WING]: "#2252a9", - [Sprite.WING_EDGE]: "#1c448b", - [Sprite.HOOD]: "#2252a9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#db7c4d", + [PALETTE.BELLY]: "#f7e1c9", + [PALETTE.UNDERBELLY]: "#ebc9a3", + [PALETTE.WING]: "#2252a9", + [PALETTE.WING_EDGE]: "#1c448b", + [PALETTE.HOOD]: "#2252a9", }), mistletoebird: new BirdType("Mistletoebird", "Native to Australia, these birds eat mainly mistletoe and in turn spread the seeds far and wide.", { - [Sprite.FOOT]: "#6c6a7c", - [Sprite.FACE]: "#352e6d", - [Sprite.BELLY]: "#fd6833", - [Sprite.UNDERBELLY]: "#e6e1d8", - [Sprite.WING]: "#342b7c", - [Sprite.WING_EDGE]: "#282065", + [PALETTE.FOOT]: "#6c6a7c", + [PALETTE.FACE]: "#352e6d", + [PALETTE.BELLY]: "#fd6833", + [PALETTE.UNDERBELLY]: "#e6e1d8", + [PALETTE.WING]: "#342b7c", + [PALETTE.WING_EDGE]: "#282065", }), redAvadavat: new BirdType("Red Avadavat", "Native to India and southeast Asia, these birds are also known as Strawberry Finches due to their speckled plumage.", { - [Sprite.BEAK]: "#f71919", - [Sprite.FOOT]: "#af7575", - [Sprite.FACE]: "#cb092b", - [Sprite.BELLY]: "#ae1724", - [Sprite.UNDERBELLY]: "#831b24", - [Sprite.WING]: "#7e3030", - [Sprite.WING_EDGE]: "#490f0f", + [PALETTE.BEAK]: "#f71919", + [PALETTE.FOOT]: "#af7575", + [PALETTE.FACE]: "#cb092b", + [PALETTE.BELLY]: "#ae1724", + [PALETTE.UNDERBELLY]: "#831b24", + [PALETTE.WING]: "#7e3030", + [PALETTE.WING_EDGE]: "#490f0f", }), scarletRobin: new BirdType("Scarlet Robin", "Native to Australia, this striking robin can be found in Eucalyptus forests.", { - [Sprite.FOOT]: "#494949", - [Sprite.FACE]: "#3d3d3d", - [Sprite.BELLY]: "#fc5633", - [Sprite.UNDERBELLY]: "#dcdcdc", - [Sprite.WING]: "#2b2b2b", - [Sprite.WING_EDGE]: "#ebebeb", - [Sprite.THEME_HIGHLIGHT]: "#fc5633", + [PALETTE.FOOT]: "#494949", + [PALETTE.FACE]: "#3d3d3d", + [PALETTE.BELLY]: "#fc5633", + [PALETTE.UNDERBELLY]: "#dcdcdc", + [PALETTE.WING]: "#2b2b2b", + [PALETTE.WING_EDGE]: "#ebebeb", + [PALETTE.THEME_HIGHLIGHT]: "#fc5633", }), americanRobin: new BirdType("American Robin", "While not a true robin, this social North American bird is so named due to its orange coloring. It seems unbothered by nearby humans.", { - [Sprite.BEAK]: "#e89f30", - [Sprite.FOOT]: "#9f8075", - [Sprite.FACE]: "#2d2d2d", - [Sprite.BELLY]: "#eb7a3a", - [Sprite.UNDERBELLY]: "#eb7a3a", - [Sprite.WING]: "#444444", - [Sprite.WING_EDGE]: "#232323", - [Sprite.THEME_HIGHLIGHT]: "#eb7a3a", + [PALETTE.BEAK]: "#e89f30", + [PALETTE.FOOT]: "#9f8075", + [PALETTE.FACE]: "#2d2d2d", + [PALETTE.BELLY]: "#eb7a3a", + [PALETTE.UNDERBELLY]: "#eb7a3a", + [PALETTE.WING]: "#444444", + [PALETTE.WING_EDGE]: "#232323", + [PALETTE.THEME_HIGHLIGHT]: "#eb7a3a", }), carolinaWren: new BirdType("Carolina Wren", "Native to the eastern United States, these little birds are known for their curious and energetic nature.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#edc7a9", - [Sprite.NOSE]: "#f7eee5", - [Sprite.HOOD]: "#c58a5b", - [Sprite.BELLY]: "#e1b796", - [Sprite.UNDERBELLY]: "#c79e7c", - [Sprite.WING]: "#c58a5b", - [Sprite.WING_EDGE]: "#866348", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#edc7a9", + [PALETTE.NOSE]: "#f7eee5", + [PALETTE.HOOD]: "#c58a5b", + [PALETTE.BELLY]: "#e1b796", + [PALETTE.UNDERBELLY]: "#c79e7c", + [PALETTE.WING]: "#c58a5b", + [PALETTE.WING_EDGE]: "#866348", }), }; @@ -460,7 +466,7 @@ this.pixels = layers[0].pixels.map(row => row.slice()); // Pad from top with transparent pixels while (this.pixels.length < maxHeight) { - this.pixels.unshift(new Array(this.pixels[0].length).fill(Sprite.TRANSPARENT)); + this.pixels.unshift(new Array(this.pixels[0].length).fill(PALETTE.TRANSPARENT)); } // Combine layers for (let i = 1; i < layers.length; i++) { @@ -469,7 +475,7 @@ let topMargin = maxHeight - layerPixels.length; for (let y = 0; y < layerPixels.length; y++) { for (let x = 0; x < layerPixels[y].length; x++) { - this.pixels[y + topMargin][x] = layerPixels[y][x] !== Sprite.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; + this.pixels[y + topMargin][x] = layerPixels[y][x] !== PALETTE.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; } } } @@ -2385,7 +2391,7 @@ function switchSpecies(type) { currentSpecies = type; // Update CSS variable --birb-highlight to be wing color - document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[Sprite.THEME_HIGHLIGHT]); + document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[PALETTE.THEME_HIGHLIGHT]); save(); } @@ -2653,7 +2659,7 @@ const b = pixels[index + 2]; const a = pixels[index + 3]; if (a === 0) { - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); continue; } const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`; @@ -2663,7 +2669,7 @@ } if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) { error(`Unknown color: ${hex}`); - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); } row.push(SPRITE_SHEET_COLOR_MAP[hex]); } diff --git a/src/animation/frame.js b/src/animation/frame.js index 757619b..d51515d 100644 --- a/src/animation/frame.js +++ b/src/animation/frame.js @@ -1,5 +1,5 @@ import { Directions } from '../shared.js'; -import { Sprite, BirdType } from './sprites.js'; +import { PALETTE, BirdType } from './sprites.js'; import Layer from './layer.js'; class Frame { @@ -25,7 +25,7 @@ class Frame { this.pixels = layers[0].pixels.map(row => row.slice()); // Pad from top with transparent pixels while (this.pixels.length < maxHeight) { - this.pixels.unshift(new Array(this.pixels[0].length).fill(Sprite.TRANSPARENT)); + this.pixels.unshift(new Array(this.pixels[0].length).fill(PALETTE.TRANSPARENT)); } // Combine layers for (let i = 1; i < layers.length; i++) { @@ -34,7 +34,7 @@ class Frame { let topMargin = maxHeight - layerPixels.length; for (let y = 0; y < layerPixels.length; y++) { for (let x = 0; x < layerPixels[y].length; x++) { - this.pixels[y + topMargin][x] = layerPixels[y][x] !== Sprite.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; + this.pixels[y + topMargin][x] = layerPixels[y][x] !== PALETTE.TRANSPARENT ? layerPixels[y][x] : this.pixels[y + topMargin][x]; } } } diff --git a/src/animation/sprites.js b/src/animation/sprites.js index ff9b372..9ff5e80 100644 --- a/src/animation/sprites.js +++ b/src/animation/sprites.js @@ -1,5 +1,8 @@ -/** Indicators for parts of the base bird sprite sheet */ -export const Sprite = { +/** + * Palette color names + * @type {Record} + */ +export const PALETTE = { THEME_HIGHLIGHT: "theme-highlight", TRANSPARENT: "transparent", OUTLINE: "outline", @@ -20,25 +23,28 @@ export const Sprite = { FEATHER_SPINE: "feather-spine", }; -/** @type {Record} */ +/** + * Mapping of sprite sheet colors to palette colors + * @type {Record} + */ export const SPRITE_SHEET_COLOR_MAP = { - "transparent": Sprite.TRANSPARENT, - "#ffffff": Sprite.BORDER, - "#000000": Sprite.OUTLINE, - "#010a19": Sprite.BEAK, - "#190301": Sprite.EYE, - "#af8e75": Sprite.FOOT, - "#639bff": Sprite.FACE, - "#99e550": Sprite.HOOD, - "#d95763": Sprite.NOSE, - "#f8b143": Sprite.BELLY, - "#ec8637": Sprite.UNDERBELLY, - "#578ae6": Sprite.WING, - "#326ed9": Sprite.WING_EDGE, - "#c82e2e": Sprite.HEART, - "#501a1a": Sprite.HEART_BORDER, - "#ff6b6b": Sprite.HEART_SHINE, - "#373737": Sprite.FEATHER_SPINE, + "transparent": PALETTE.TRANSPARENT, + "#ffffff": PALETTE.BORDER, + "#000000": PALETTE.OUTLINE, + "#010a19": PALETTE.BEAK, + "#190301": PALETTE.EYE, + "#af8e75": PALETTE.FOOT, + "#639bff": PALETTE.FACE, + "#99e550": PALETTE.HOOD, + "#d95763": PALETTE.NOSE, + "#f8b143": PALETTE.BELLY, + "#ec8637": PALETTE.UNDERBELLY, + "#578ae6": PALETTE.WING, + "#326ed9": PALETTE.WING_EDGE, + "#c82e2e": PALETTE.HEART, + "#501a1a": PALETTE.HEART_BORDER, + "#ff6b6b": PALETTE.HEART_SHINE, + "#373737": PALETTE.FEATHER_SPINE, }; export class BirdType { @@ -52,20 +58,20 @@ export class BirdType { this.name = name; this.description = description; const defaultColors = { - [Sprite.TRANSPARENT]: "transparent", - [Sprite.OUTLINE]: "#000000", - [Sprite.BORDER]: "#ffffff", - [Sprite.BEAK]: "#000000", - [Sprite.EYE]: "#000000", - [Sprite.HEART]: "#c82e2e", - [Sprite.HEART_BORDER]: "#501a1a", - [Sprite.HEART_SHINE]: "#ff6b6b", - [Sprite.FEATHER_SPINE]: "#373737", - [Sprite.HOOD]: colors.face, - [Sprite.NOSE]: colors.face, + [PALETTE.TRANSPARENT]: "transparent", + [PALETTE.OUTLINE]: "#000000", + [PALETTE.BORDER]: "#ffffff", + [PALETTE.BEAK]: "#000000", + [PALETTE.EYE]: "#000000", + [PALETTE.HEART]: "#c82e2e", + [PALETTE.HEART_BORDER]: "#501a1a", + [PALETTE.HEART_SHINE]: "#ff6b6b", + [PALETTE.FEATHER_SPINE]: "#373737", + [PALETTE.HOOD]: colors.face, + [PALETTE.NOSE]: colors.face, }; /** @type {Record} */ - this.colors = { ...defaultColors, ...colors, [Sprite.THEME_HIGHLIGHT]: colors[Sprite.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; + this.colors = { ...defaultColors, ...colors, [PALETTE.THEME_HIGHLIGHT]: colors[PALETTE.THEME_HIGHLIGHT] ?? colors.hood ?? colors.face }; this.tags = tags; } } @@ -74,126 +80,126 @@ export class BirdType { export const SPECIES = { bluebird: new BirdType("Eastern Bluebird", "Native to North American and very social, though can be timid around people.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#639bff", - [Sprite.BELLY]: "#f8b143", - [Sprite.UNDERBELLY]: "#ec8637", - [Sprite.WING]: "#578ae6", - [Sprite.WING_EDGE]: "#326ed9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#639bff", + [PALETTE.BELLY]: "#f8b143", + [PALETTE.UNDERBELLY]: "#ec8637", + [PALETTE.WING]: "#578ae6", + [PALETTE.WING_EDGE]: "#326ed9", }), shimaEnaga: new BirdType("Shima Enaga", "Small, fluffy birds found in the snowy regions of Japan, these birds are highly sought after by ornithologists and nature photographers.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffffff", - [Sprite.BELLY]: "#ebe9e8", - [Sprite.UNDERBELLY]: "#ebd9d0", - [Sprite.WING]: "#f3d3c1", - [Sprite.WING_EDGE]: "#2d2d2d", - [Sprite.THEME_HIGHLIGHT]: "#d7ac93", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffffff", + [PALETTE.BELLY]: "#ebe9e8", + [PALETTE.UNDERBELLY]: "#ebd9d0", + [PALETTE.WING]: "#f3d3c1", + [PALETTE.WING_EDGE]: "#2d2d2d", + [PALETTE.THEME_HIGHLIGHT]: "#d7ac93", }), tuftedTitmouse: new BirdType("Tufted Titmouse", "Native to the eastern United States, full of personality, and notably my wife's favorite bird.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#c7cad7", - [Sprite.BELLY]: "#e4e5eb", - [Sprite.UNDERBELLY]: "#d7cfcb", - [Sprite.WING]: "#b1b5c5", - [Sprite.WING_EDGE]: "#9d9fa9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#c7cad7", + [PALETTE.BELLY]: "#e4e5eb", + [PALETTE.UNDERBELLY]: "#d7cfcb", + [PALETTE.WING]: "#b1b5c5", + [PALETTE.WING_EDGE]: "#9d9fa9", }, ["tuft"]), europeanRobin: new BirdType("European Robin", "Native to western Europe, this is the quintessential robin. Quite friendly, you'll often find them searching for worms.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#ffaf34", - [Sprite.HOOD]: "#aaa094", - [Sprite.BELLY]: "#ffaf34", - [Sprite.UNDERBELLY]: "#babec2", - [Sprite.WING]: "#aaa094", - [Sprite.WING_EDGE]: "#888580", - [Sprite.THEME_HIGHLIGHT]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#ffaf34", + [PALETTE.HOOD]: "#aaa094", + [PALETTE.BELLY]: "#ffaf34", + [PALETTE.UNDERBELLY]: "#babec2", + [PALETTE.WING]: "#aaa094", + [PALETTE.WING_EDGE]: "#888580", + [PALETTE.THEME_HIGHLIGHT]: "#ffaf34", }), redCardinal: new BirdType("Red Cardinal", "Native to the eastern United States, this strikingly red bird is hard to miss.", { - [Sprite.BEAK]: "#d93619", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#31353d", - [Sprite.HOOD]: "#e83a1b", - [Sprite.BELLY]: "#e83a1b", - [Sprite.UNDERBELLY]: "#dc3719", - [Sprite.WING]: "#d23215", - [Sprite.WING_EDGE]: "#b1321c", + [PALETTE.BEAK]: "#d93619", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#31353d", + [PALETTE.HOOD]: "#e83a1b", + [PALETTE.BELLY]: "#e83a1b", + [PALETTE.UNDERBELLY]: "#dc3719", + [PALETTE.WING]: "#d23215", + [PALETTE.WING_EDGE]: "#b1321c", }, ["tuft"]), americanGoldfinch: new BirdType("American Goldfinch", "Coloured a brilliant yellow, this bird feeds almost entirely on the seeds of plants such as thistle, sunflowers, and coneflowers.", { - [Sprite.BEAK]: "#ffaf34", - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#fff255", - [Sprite.NOSE]: "#383838", - [Sprite.HOOD]: "#383838", - [Sprite.BELLY]: "#fff255", - [Sprite.UNDERBELLY]: "#f5ea63", - [Sprite.WING]: "#e8e079", - [Sprite.WING_EDGE]: "#191919", - [Sprite.THEME_HIGHLIGHT]: "#ffcc00" + [PALETTE.BEAK]: "#ffaf34", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#fff255", + [PALETTE.NOSE]: "#383838", + [PALETTE.HOOD]: "#383838", + [PALETTE.BELLY]: "#fff255", + [PALETTE.UNDERBELLY]: "#f5ea63", + [PALETTE.WING]: "#e8e079", + [PALETTE.WING_EDGE]: "#191919", + [PALETTE.THEME_HIGHLIGHT]: "#ffcc00" }), barnSwallow: new BirdType("Barn Swallow", "Agile birds that often roost in man-made structures, these birds are known to build nests near Ospreys for protection.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#db7c4d", - [Sprite.BELLY]: "#f7e1c9", - [Sprite.UNDERBELLY]: "#ebc9a3", - [Sprite.WING]: "#2252a9", - [Sprite.WING_EDGE]: "#1c448b", - [Sprite.HOOD]: "#2252a9", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#db7c4d", + [PALETTE.BELLY]: "#f7e1c9", + [PALETTE.UNDERBELLY]: "#ebc9a3", + [PALETTE.WING]: "#2252a9", + [PALETTE.WING_EDGE]: "#1c448b", + [PALETTE.HOOD]: "#2252a9", }), mistletoebird: new BirdType("Mistletoebird", "Native to Australia, these birds eat mainly mistletoe and in turn spread the seeds far and wide.", { - [Sprite.FOOT]: "#6c6a7c", - [Sprite.FACE]: "#352e6d", - [Sprite.BELLY]: "#fd6833", - [Sprite.UNDERBELLY]: "#e6e1d8", - [Sprite.WING]: "#342b7c", - [Sprite.WING_EDGE]: "#282065", + [PALETTE.FOOT]: "#6c6a7c", + [PALETTE.FACE]: "#352e6d", + [PALETTE.BELLY]: "#fd6833", + [PALETTE.UNDERBELLY]: "#e6e1d8", + [PALETTE.WING]: "#342b7c", + [PALETTE.WING_EDGE]: "#282065", }), redAvadavat: new BirdType("Red Avadavat", "Native to India and southeast Asia, these birds are also known as Strawberry Finches due to their speckled plumage.", { - [Sprite.BEAK]: "#f71919", - [Sprite.FOOT]: "#af7575", - [Sprite.FACE]: "#cb092b", - [Sprite.BELLY]: "#ae1724", - [Sprite.UNDERBELLY]: "#831b24", - [Sprite.WING]: "#7e3030", - [Sprite.WING_EDGE]: "#490f0f", + [PALETTE.BEAK]: "#f71919", + [PALETTE.FOOT]: "#af7575", + [PALETTE.FACE]: "#cb092b", + [PALETTE.BELLY]: "#ae1724", + [PALETTE.UNDERBELLY]: "#831b24", + [PALETTE.WING]: "#7e3030", + [PALETTE.WING_EDGE]: "#490f0f", }), scarletRobin: new BirdType("Scarlet Robin", "Native to Australia, this striking robin can be found in Eucalyptus forests.", { - [Sprite.FOOT]: "#494949", - [Sprite.FACE]: "#3d3d3d", - [Sprite.BELLY]: "#fc5633", - [Sprite.UNDERBELLY]: "#dcdcdc", - [Sprite.WING]: "#2b2b2b", - [Sprite.WING_EDGE]: "#ebebeb", - [Sprite.THEME_HIGHLIGHT]: "#fc5633", + [PALETTE.FOOT]: "#494949", + [PALETTE.FACE]: "#3d3d3d", + [PALETTE.BELLY]: "#fc5633", + [PALETTE.UNDERBELLY]: "#dcdcdc", + [PALETTE.WING]: "#2b2b2b", + [PALETTE.WING_EDGE]: "#ebebeb", + [PALETTE.THEME_HIGHLIGHT]: "#fc5633", }), americanRobin: new BirdType("American Robin", "While not a true robin, this social North American bird is so named due to its orange coloring. It seems unbothered by nearby humans.", { - [Sprite.BEAK]: "#e89f30", - [Sprite.FOOT]: "#9f8075", - [Sprite.FACE]: "#2d2d2d", - [Sprite.BELLY]: "#eb7a3a", - [Sprite.UNDERBELLY]: "#eb7a3a", - [Sprite.WING]: "#444444", - [Sprite.WING_EDGE]: "#232323", - [Sprite.THEME_HIGHLIGHT]: "#eb7a3a", + [PALETTE.BEAK]: "#e89f30", + [PALETTE.FOOT]: "#9f8075", + [PALETTE.FACE]: "#2d2d2d", + [PALETTE.BELLY]: "#eb7a3a", + [PALETTE.UNDERBELLY]: "#eb7a3a", + [PALETTE.WING]: "#444444", + [PALETTE.WING_EDGE]: "#232323", + [PALETTE.THEME_HIGHLIGHT]: "#eb7a3a", }), carolinaWren: new BirdType("Carolina Wren", "Native to the eastern United States, these little birds are known for their curious and energetic nature.", { - [Sprite.FOOT]: "#af8e75", - [Sprite.FACE]: "#edc7a9", - [Sprite.NOSE]: "#f7eee5", - [Sprite.HOOD]: "#c58a5b", - [Sprite.BELLY]: "#e1b796", - [Sprite.UNDERBELLY]: "#c79e7c", - [Sprite.WING]: "#c58a5b", - [Sprite.WING_EDGE]: "#866348", + [PALETTE.FOOT]: "#af8e75", + [PALETTE.FACE]: "#edc7a9", + [PALETTE.NOSE]: "#f7eee5", + [PALETTE.HOOD]: "#c58a5b", + [PALETTE.BELLY]: "#e1b796", + [PALETTE.UNDERBELLY]: "#c79e7c", + [PALETTE.WING]: "#c58a5b", + [PALETTE.WING_EDGE]: "#866348", }), }; \ No newline at end of file diff --git a/src/application.js b/src/application.js index da7dfe6..42806a0 100644 --- a/src/application.js +++ b/src/application.js @@ -23,7 +23,7 @@ import { getWindowHeight } from './shared.js'; import { - Sprite, + PALETTE, SPRITE_SHEET_COLOR_MAP, SPECIES } from './animation/sprites.js'; @@ -730,7 +730,7 @@ function startApplication(birbPixels, featherPixels) { function switchSpecies(type) { currentSpecies = type; // Update CSS variable --birb-highlight to be wing color - document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[Sprite.THEME_HIGHLIGHT]); + document.documentElement.style.setProperty("--birb-highlight", SPECIES[type].colors[PALETTE.THEME_HIGHLIGHT]); save(); } @@ -1012,7 +1012,7 @@ function loadSpriteSheetPixels(dataUri, templateColors = true) { const b = pixels[index + 2]; const a = pixels[index + 3]; if (a === 0) { - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); continue; } const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`; @@ -1022,7 +1022,7 @@ function loadSpriteSheetPixels(dataUri, templateColors = true) { } if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) { error(`Unknown color: ${hex}`); - row.push(Sprite.TRANSPARENT); + row.push(PALETTE.TRANSPARENT); } row.push(SPRITE_SHEET_COLOR_MAP[hex]); }