JSFiddle - React, Tailwind, and code Playground

by Gwyn Milcote

HTML

notes to self.

- description function, separate to image generation.
need descs even when not all loci are there; maybe just 1-3.

- handle sex-linked genes automatically during crossing and when writing out genos.  add a property to some loci: W, X, Y, Z for the way to handle it. 
during loop, add these loci names to arrays, and then loop and distribute.

https://www.youtube.com/watch?v=fI6Vq67n5hs&feature=emb_title





http://zebrafinch.com/SocietyFinch/Selfs.html
http://www.nbfa.co.uk/page11.html
http://www.efinch.com/species/society.htm

--- society / bengalese finch

domesticated form of the white-rump mannikin/munia. 'society' is usa term, called bengalese finch elsewhere. 
similar to zebra finches, but sexes are identical, and seem to have some mutations zebras don't, such as chocolate.
tbh i'd never heard of them until working on zebra finches and finding the page while browsing eFinch site!



chocolate > chestnut > fawn.  same locus.

chestnut was once thought to be dilute choc, but actually is a mutation in own right.

fawn is/was called 'fox red' in germany. still called Rood Bruin (red brown) in europe.


--- grey (G?)

simple recessive.  versions are called black grey, chestnut grey or red grey.  basically 3 levels of darkness.

--- pastel / dilute

recessive. the amount of dilution can vary; breeders selectively breed for certain level of lightness.

"Clearwings are distinguishable from regular Dilutes by having the middle portion of the body very pale, nearly white in comparison to the head and tail region. Apparently it is a selection that arose from the dilutes, and therefore not regarded as a separate mutation, but rather a unique selection from within Dilutes. Good Clearwings are very attractive and very rare. In the US, these birds are often mistakenly called dilutes and sometimes they are called Creams."

because clearwing has such a distinctive look, and is desired by breeders as its own trait, i'm going to be naughty and invent a...

JavaScript

let loci = {
    e: {alleles: ["E","e"]},
    a: {alleles: ["A","a"]},
    cr: {alleles: ["Cr","cr"]}
};

let m = {e1:"E", e2:"e", a1:"A", a2:"A", cr1:"Cr", cr2:"cr"};
let f = {e1:"e", e2:"e", a1:"a", a2:"a", cr1:"Cr", cr2:"cr"};

/* 
* Need to handle 1 to 4 loci. Feels clunky. How to improve? 
* 1 locus = 4 possibilities. 2 = 16. 3 = 64. 4 = 256.
*/
function loopPairs(combos){
    let genos = [];
    for(let i = 0; i < 4; i++){
        
        if(combos.length < 2){
        
            let total = [
                combos[0][i][0] +"/"+ combos[0][i][1]
            ];
            genos.push(total); //console.log(total);
            
        }else{
        for(let j = 0; j < 4; j++){
            
            if(combos.length < 3){
                
                let total = [
                    combos[0][i][0] +"/"+ combos[0][i][1],
                    combos[1][j][0] +"/"+ combos[1][j][1]
                ];
                genos.push(total); //console.log(total);
                
            }else{
            for(let k = 0; k < 4; k++){
                
                if(combos.length < 4){
                    let total = [
                        combos[0][i][0] +"/"+ combos[0][i][1],
                        combos[1][j][0] +"/"+ combos[1][j][1],
                        combos[2][k][0] +"/"+ combos[2][k][1]
                    ];
                    genos.push(total); //console.log(total);
                    
                }else{
                for(let l = 0; l < 4; l++){
                    
                    let total = [
                        combos[0][i][0] +"/"+ combos[0][i][1],
                        combos[1][j][0] +"/"+ combos[1][j][1],
                        combos[2][k][0] +"/"+ combos[2][k][1],
                        combos[3][l][0] +"/"+ combos[3][1][1]
                    ];
                    genos.push(total); //console.log(total);
                    
                }
                }
            }
            }
        }
    ...